HTML ontwerp probleem

[Verwijderd]

goede avond mensen,

Ik heb een KLEIN probleempje, ik ben voor een vriend zijn vader een website aan het maken. Nou ben ik begonnen met het ontwerpen van de pagina, na meedere malen ben ik vast gelopen.

Tot nu toe heb ik dit gemaakt: http://kjappert.kj.funpic.org/droelloe/index.htm

Nou zou ik binnen dit hoofdkader onderin nog ded balk willen hebben die nu buiten de tabel staat ik krijg dit niet voor elkaar, wat ik ook doe hij doet niet wat ik wil. als die binnen de tabel komt te staan wil die weer niet onderaan anan staan maar blijft die boven in staan.
is er iemand die me kan helpen

[Verwijderd]

eeh de breedte van de balk moet dan natuurlijk wel even aangepast worden naar 80%

[Verwijderd]

Probeer is om als je m onderin hebt staat de tabel uit te lijnen op bottom.
Maak anders gewoon in die tabel die je nu hebt een nieuwe tabel, dan heb je het toch ook?

[Tinus]

idd, table breedte aanpassen naar 80 procent en dan die table weer centreren.

edit: hier de source van de onderste table; (als je er problemen mee hebt, dan haal ik het weer weg.)

<table border="0" valign="top" bgcolor="#CC0001" align="center" cellpadding="0" cellspacing="0" style="border-collapse: collapse" bordercolor="#111111" height="25" width="80%">
<tr><td>

<Div align=center>
<font color="#bccbdc" face=verdana size=1>
Copyright 2005 (www.demuntrand.nl). Site Designed by <strong>
....</a></strong>. All Rights Reserved.
</div>

</td></tr>
</table>

[ Voor 76% gewijzigd door Tinus op 10-05-2005 19:35 ]

[André]

Zet die cell dan gewoon bij de bovenste tabel in met Frontpage. En als dat niet in de WYISWYG mode lukt probeer het dan in de code.

En OMG, dit is toch echt zwaar verouderde code:

code:

<font color="#bccbdc" face=verdana size=1>

[Verwijderd]

nee dat probeerde ik hierboven al uit te leggen dan krijg ik dithttp://kjappert.kj.funpic.org/droelloe/index2.htm

[André]

Het lijkt mij verstandig om eens te leren hoe je fatsoenlijk een tabel maakt. En daarbij: je layout helemaal met tables maken is natuurlijk complete onzin

Tinus schreef op dinsdag 10 mei 2005 @ 19:31:

edit: hier de source van de onderste table; (als je er problemen mee hebt, dan haal ik het weer weg.)

Waarom zou hij daar problemen mee hebben, broncode is openbaar

[ Voor 48% gewijzigd door André op 10-05-2005 19:39 ]

[Tinus]

uhm, niet helemaal goed gelezen geloof ik, ...binnen het kader.... naja, is nu iig de goede breedte

[Mr_gadget]

André schreef op dinsdag 10 mei 2005 @ 19:36:
Het lijkt mij verstandig om eens te leren hoe je fatsoenlijk een tabel maakt. En daarbij: je layout helemaal met tables maken is natuurlijk complete onzin

Hoezo onzin? Er zijn zat sites die ook tables gebruiken....moet het per se met frames?

dit klopt geloof ik ook niet echt content="en-us"

[_Sunnyboy_]

Layout maken met tables is geen onzin hoor. Het is misschien wat ouderwets, en met DIV's layout maken is natuurlijk veel gaver, maar een layout met tables ziet er in iedere moderne browser hetzelfde uit, en er zijn nogal wat layoutzaken welke maar in een aantal browsers goed werken.

Maar ik begrijp dat Tinus eruit is, en daar ging het om, dus we zijn klaar met dit onderwerp denk ik.

[André]

Mr_gadget schreef op dinsdag 10 mei 2005 @ 19:41:

Hoezo onzin? Er zijn zat sites die ook tables gebruiken....moet het per se met frames?

Deze discussie is hier al heel vaak gevoerd: geen frames, geen tabellen maar gewoon de juiste semantisch verantwoorde elementen icm met CSS is het enige wat je nodig hebt om een keurige site te maken. En dat andere websites tables gebruiken voor hun layout is gewoon een amateuristische fout van hun kant.

_Sunnyboy_ schreef op dinsdag 10 mei 2005 @ 19:42:
Layout maken met tables is geen onzin hoor. Het is misschien wat ouderwets, en met DIV's layout maken is natuurlijk veel gaver, maar een layout met tables ziet er in iedere moderne browser hetzelfde uit, en er zijn nogal wat layoutzaken welke maar in een aantal browsers goed werken.

Met div's een layout maken is ook verkeerd, en al helemaal niet gaver. En als je een goede layout maakt met CSS werkt hij in alle browsers. Welke layoutzaken zouden dan maar in een aantal browsers goed werken?

[ Voor 38% gewijzigd door André op 10-05-2005 19:46 ]

[MBV]

Met CSS layout weet ik direct hoe dat moet, maar met tables is mij dat niet duidelijk. Table in table in table, ik ben de weg kwijt. Waarom begin je (volgens firefox iig) voor elke menuknop een nieuwe tabel?

Wat ik zou doen als oplossing voor dit probleem met een table layout is de volgende structuur:

HTML:

<html>
<body>
  <table>
    <tr>
      <td colspan=2>banner</td>
    </tr>
    <tr>
      <td width="200px">
        <table>hier heel veel knoppen</table>
      </td>
      <td>
        hier de content
      </td>
    </tr>
    <tr>
      <td colspan=2>copyright bladibla</td>
    </tr>
  </table>
</body>
</html>

En de layout kan je vervolgens met CSS in een apart bestand regelen. Echt, alle dingen in die te lange regels <table width=... height=...> kan je in CSS zetten. Scheelt de helft van je bestandsgrootte...

En ach, anders kan dit ook prima met frames, net zo outdated...
Vergeet je niet je site door validator.w3.org te halen? je hebt nu al 38 problemen...
http://validator.w3.org/c...c.org/droelloe/index2.htm

site Designed by ..... All Rights ...

Ik snap best dat je je naam niet onder die site wil zetten

[edit]
om toch nog opbouwend te blijven, nog even de HTML zoals ik hem ongeveer zou maken in dit geval:

HTML:

<body>
  <div id="banner"> bannercode </div>
  <ul id="menu">
    <li> knop 1 </li>
    <li> knop 2 </li>
  </ul>
  <div id="content">
    lange lappen tekst...
  </div>
  <div id="footer">
    <p id="thanks">Site gemaakt door ... </p>
    <p id="valid_XHTML">
      <a href="http://validator.w3.org/check?uri=referer">
        [img]"http://www.w3.org/Icons/valid-xhtml10"[/img]
      </a>
    </p>
  </div>
</body>

André, nou moet je even niet zo schijnheilig doen. Hoeveel hacks zijn er nodig om een site zonder table layout te laten werken in alle browsers? Veel te veel. Ik begin altijd in Firefox, en maak hem dan nog eens geschikt voor IE6. Voor privé is dat genoeg, maar zakelijk moet je iig IE5 ook laten werken. Daarvoor moet je 20 div's toevoegen om dezelfde layout te krijgen als kjappert wil hebben en met bovenstaande tables code in 5 min werkt.
Mijn eigen site wil ik natuurlijk goed maken _{Look mom, no tables!} maar daar zitten al de nodige uurtjes in. En dan doet hij het nog steeds niet: linkje
Zelfs als je het mislukte experiment van de borders weglaat zitten er fouten in op IE.

[ Voor 56% gewijzigd door MBV op 10-05-2005 20:11 ]

[OzBoz]

MBV schreef op dinsdag 10 mei 2005 @ 19:57:
... maar zakelijk moet je iig IE5 ook laten werken.

Is dat zo? Ik zou niet weten waarom je 6.x jaar oude troep zou moeten ondersteunen. Tis leuk als het een beetje werkt, maar daar heb je het wat mij betreft ook mee gehad.

[Willem]

Je moet niks inderdaad Hangt er ook maar net vanaf wat de afspraken zijn.

[André]

MBV schreef op dinsdag 10 mei 2005 @ 19:57:

André, nou moet je even niet zo schijnheilig doen. Hoeveel hacks zijn er nodig om een site zonder table layout te laten werken in alle browsers? Veel te veel

Ik doe niet schijnheilig, ik weet donders goed wat het inhoudt om een site te maken. Ik kan sneller een CSS layout maken dan een table-layout en dan werkt het zonder hacks in alle browsers.

[Sappie]

MBV schreef op dinsdag 10 mei 2005 @ 19:57:
Mijn eigen site wil ik natuurlijk goed maken _{Look mom, no tables!} maar daar zitten al de nodige uurtjes in. En dan doet hij het nog steeds niet: linkje
Zelfs als je het mislukte experiment van de borders weglaat zitten er fouten in op IE.

offtopic:
de (niet verplichte) xml-prolog laat IE in quirks mode renderen..

André schreef op dinsdag 10 mei 2005 @ 21:03:
[...]
Ik doe niet schijnheilig, ik weet donders goed wat het inhoudt om een site te maken. Ik kan sneller een CSS layout maken dan een table-layout en dan werkt het zonder hacks in alle browsers.

Bepaalde layouts (en daarmee doel ik niet specifiek op de layouts die in dit topic aan de orde komen) zijn gewoon amper / niet cross-browser compatible zonder gebruik van tables. Op zo'n moment mag je imo best naar tables teruggrijpen, ook al doe je dit liever niet. Nofi maar je maakt mij niet wijs dat je alle layouts zonder gebruik van tables én css-hacks cross-browser kan bewerkstelligen

[ Voor 6% gewijzigd door Sappie op 10-05-2005 21:47 ]

[André]

Sowieso kan het zonder tables, en in de exotische layouts zul je idd wat css-hacks moeten gebruiken.

[Verwijderd]

Hoezo onzin? Er zijn zat sites die ook tables gebruiken....moet het per se met frames?

Catchphrase van Mark Pilgrim: "You must be new here".

[bat266]

André schreef op dinsdag 10 mei 2005 @ 19:44:
[knip]

Met div's een layout maken is ook verkeerd, en al helemaal niet gaver. En als je een goede layout maakt met CSS werkt hij in alle browsers. [...]

Hoe bedoel je dit precies. Mijn layout is gemaakt mbv divs. Deze worden in principe alleen gebruikt om verschillende kolommen te maken. Ik dacht dat dat het beste was. De text in deze kolommen wordt wel nog voorzien van de juiste tags <h1><p> etc. Doe ik nu iets fout of bedoelde je dat je niet alleen een site moet maken met div?

[BtM909]

bat266 schreef op woensdag 11 mei 2005 @ 08:50:
[...]

Hoe bedoel je dit precies. Mijn layout is gemaakt mbv divs. Deze worden in principe alleen gebruikt om verschillende kolommen te maken. Ik dacht dat dat het beste was. De text in deze kolommen wordt wel nog voorzien van de juiste tags <h1><p> etc. Doe ik nu iets fout of bedoelde je dat je niet alleen een site moet maken met div?

Er zijn wel meer mensen die er iets over roepen, maar de eerste de beste link die ik tegenkom is van chem: http://home.parse.nl/~michiel/semantiek.html

[ Voor 7% gewijzigd door BtM909 op 11-05-2005 09:05 ]

[André]

bat266 schreef op woensdag 11 mei 2005 @ 08:50:
[...]

Hoe bedoel je dit precies. Mijn layout is gemaakt mbv divs. Deze worden in principe alleen gebruikt om verschillende kolommen te maken. Ik dacht dat dat het beste was. De text in deze kolommen wordt wel nog voorzien van de juiste tags <h1><p> etc. Doe ik nu iets fout of bedoelde je dat je niet alleen een site moet maken met div?

Jij snapt het, je mag best divs gebruiken maar alleen wanneer ze nodig zijn

[Verwijderd]

Ehh jaah wat kan ik hier nu mee , er zijn vele meningen en iedereen denkt er anders over. Er moet na al dit commentaar tod wel een oplossing zijn. Hoe zou ik dan moeten beginnen, ik kan niet egt tuturial vinden die mij helpen bij het maken van een ccs site of een site met <div> tags.

[djluc]

Verwijderd schreef op woensdag 11 mei 2005 @ 16:18:
Ehh jaah wat kan ik hier nu mee , er zijn vele meningen en iedereen denkt er anders over. Er moet na al dit commentaar tod wel een oplossing zijn. Hoe zou ik dan moeten beginnen, ik kan niet egt tuturial vinden die mij helpen bij het maken van een ccs site of een site met <div> tags.

En nu op z'n Nederlands?

Informatie over hoe semantisch HTML te schrijven is inderdaad wel lastig te vinden. Vooral het weten welk element geschikt is voor bepaalde zaken is lastig. En ul/ol tag, unordered/ordered list, is nog redelijk duidelijk. Maar een dl, defenition list, dat wordt toch al wat minder duidelijk. Het artikel van Chem laat duidelijk zien waarom het nodig is maar concrete duidelijkheid is moeilijk te vinden.

[Verwijderd]

de html 4.01 spec is in het algemeen toch redelijk duidelijk. Als je dat door hebt gelezen en er nog dingen zijn die niet helemaal duidelijk zijn, dan is het heel erg interessant om daar over te discussieren (bijvoorbeeld over het verschil tussen <strong> en <em>)

[TheBorg]

De titel klopt niet, het moet zijn: "voor al uw goud en zilver" i.p.v. "voor al u goud en zilver".

[Verwijderd]

Ok laat ik het dan zoww vragen, hoe raden jullie mij aan om te beginnen met de lay-out van de site. Het lijkt me dat ik daar het eerst mee moet beginnen? Zo niet dan hoor ik dat ook graag, ik zou het graag op de goede manier willen leren!. Ik heb de lay out wel in me hoofd zitten, alleen moet ik hem nog in html maken.

[Verwijderd]

ik maak altijd eerst de html, dus eerst alle informatie die je wilt vertellen (of representatieve dummy info) in html files zetten. Als het goed is moet de hele bende dan zonder css goed leesbaar zijn. Misschien niet met de kleuren, de plaatjes en op de plekken waar jij wilt, maar daar gaat het niet zo om. Voor de blinde gebruiker en google ben je dan klaar

maar het oog wil ook wat, dus dan ga je je css bakken. Daar gooi je alle kleuren etc in en ook alle niet informatieve (achtergrond) plaatjes. Misschien moet je hier en daar een id toevoegen of een extra container in de html om het zo te krijgen als je wilt, maar als het goed is zul je die weinig nodig hebben.

en daarna nog een print css eventueel

[Verwijderd]

Oke maar met de html bedoel jij dus de inhoud van de site, dus bijvoorbeeld informatie en fotos enz enz. Mijn vraag is nu dus bedoel je daar niet de tabellen enz mee, waar de informatie en het menu enz in zit, of zet je die tabllen enz ook in ccs file, en zo jah hoe doe je dat dan en hoe ladd je dat op je pagina zodat het er fatsoenlijk uitziet

[Verwijderd]

Lees eerst is het meerendeel van de HTML en CSS onderwerpen door hier:

http://htmldog.com/
http://alistapart.com/

En vraag dan verder. (Neem gerust een paar weken de tijd om het allemaal door te nemen, uit te testen, et cetera.)

[Vecodo]

ff code voor de banner
Oude code

code:

<div id="buitenborder">
<div id="bannergedeelte" align="center">
[img]"banner.jpg"[/img]</a></div>

Nieuwe Code

code:

<div id="buitenborder">
<div id="bannergedeelte" align="center">
[img]"banner.jpg"[/img]</a></div>

( ikke ben ook n00b hoor ;-) )

[Verwijderd]

ok, puntsgewijze zoektermen lijst (goed bedoeld overigens)

- wat doet die </a> daar?
- regel align, border, width en height met css
- vraag van Anne om over na te denken: valideert je document ook als je de div's eruit kiepert?
- is die buitenborder noodzakelijk?

[Haan]

Beetje offtopic maar.. even iets anders, als de site eenmaal goed werkt, laat dan asjeblieft iemand naar de tekst kijken op die site, want dit komt niet heel professioneel over zo..
Ik zou in ieder niet zo snel iets laten graveren bij een bedrijf dat graveringen al fout op z'n website heeft staan..