Reg. datum: 02 juni 2005
Reg. datum: 02 juni 2005
Hoe krijg je dat voor elkaar danquote:mophor schreef op woensdag 20 juli 2005 @ 14:42:
Waarschijnlijk staat er verder in je header en footer dusdanig weinig "content" dat dit ook niet kwaad kan bij indexeren. (Al zou ik een class waarmee je aangeeft dat een stuk niet geindexeerd hoeft te worden wel op prijs stellen)
var _ = {_: 'unreadable code detected!'};
alert(_._);
Zou wel heel vervelend zijn als de crawler dan niet de links uit het menu mee zou pakken voor de indexeringquote:mophor schreef op woensdag 20 juli 2005 @ 15:15:
dat krijg je niet voor elkaar, daarom zou ik het wel op prijs stellen als er zo'n mechanisme was (iets dergelijks als rel="noFollow", maar dan class="noIndex" ofzo)ik bedoel hetzelfde als jij
Reg. datum: 20 januari 2004
De opmaakcode:
HTML:
1 | <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
Ik heb de structuur de klasse 'structuur' meegegeven omdat de structuur tot de structuur van het document behoort, en daarnaast een ID omdat het wel een apart gedeelte is namelijk het navigatiegedeelte. Daarnaast twijfelde ik of ik de afbeelding een ID mee zou geven. Ik heb de afbeelding toch een ID meegegeven, omdat ik alleen een afbeelding op zich zelf te vaag vind. Ook voor een spraakbrowser is alleen een afbeelding zonder ID te vaag lijkt me.
Het voorbeeld (dat ik om moet zetten in html/css):

PS - Ik heb onder een nieuwe naam geregistreerd omdat ik mijn oude wachtwoord vergeten ben.
deprogrammeur wijzigde dit bericht 21-07-2005 15:26 (15%)
verder denk ik dat dat plaatje ook beter naar de css kan
var _ = {_: 'unreadable code detected!'};
alert(_._);
Reg. datum: 20 januari 2004
quote:mophor schreef op donderdag 21 juli 2005 @ 16:52:
ik zie 2 id's navigation en een span waar een div meer apropriate is
verder denk ik dat dat plaatje ook beter naar de css kan
1. Nee, ik heb een ID 'navigation' en een ID 'navigationBottomIllustration'.
2. Het plaatje naar CSS lijkt me indeed een goed idee.
Maar verder vind je het dus wel okee qua opmaak?
je hebt wel 2x hetzelfde id, in de map en de span
verder een ol in een p, wat niet correct is
je link en meta zijn geen xhtml, maar sowieso zou ik geen xhtml gebruiken, je meta zegt sowieso html
en verder zou ik die h1 binnen de map doen, hij zegt vermoedelijk daar wat over? gezien je layout
om maar even een voorzet te geven:
code:
1
2
3
4
5
6
7
8
9
10
11
| <body>
<div>
<map>
<h1>woningaanbod</h1>
<ol>
</map>
<div>
<h1>bestaande bouw</h1>
<!-- etc -->
</div>
</div>
</body> |
verder kan je je code natuurlijk ook zelf valideren
mophor wijzigde dit bericht 21-07-2005 17:14 (60%)
var _ = {_: 'unreadable code detected!'};
alert(_._);
quote:deprogrammeur schreef op donderdag 21 juli 2005 @ 15:17:
PS - Ik heb onder een nieuwe naam geregistreerd omdat ik mijn oude wachtwoord vergeten ben.
Daar hebben we de passmailer voor, klonen is in principe niet toegestaan dus heb ik je oude account op slot gezet
crisp wijzigde dit bericht 21-07-2005 17:27 (9%)
Reg. datum: 20 januari 2004
quote:mophor schreef op donderdag 21 juli 2005 @ 17:04:
nee,
je hebt wel 2x hetzelfde id, in de map en de span
verder een ol in een p, wat niet correct is
je link en meta zijn geen xhtml, maar sowieso zou ik geen xhtml gebruiken, je meta zegt sowieso html
en verder zou ik die h1 binnen de map doen, hij zegt vermoedelijk daar wat over? gezien je layout
om maar even een voorzet te geven:
code:
1 2 3 4 5 6 7 8 9 10 11<body> <div> <map> <h1>woningaanbod</h1> <ol> </map> <div> <h1>bestaande bouw</h1> <!-- etc --> </div> </div> </body>
verder kan je je code natuurlijk ook zelf valideren
1. Je hebt gelijk, dat had ik over het hoofd gezien.
2. Op je website gaf je een voorbeeld waarbij je de links die dienen voor de navigatie, in een lijst binnen het map-element plaatst:
So, instead of wrapping a div around your navigation elements (lists probably), put it in a map element, which is much more meaningful.
<map name="navigation" id="navigation">
<ol>
<li>item 1</li>
<li>item 2</li>
<!-- etc -->
</ol>
</map>
Note that the name attribute on this element is mandatory in HTML, in XHTML, the id attribute is mandatory.
Dat lijkt mij ook het meest logische aangezien de links bedoeld zijn voor de navigatie. De titel (h1) heeft mijns inziens niets met de navigatie van doen. Verder denk ik dat ik het ID 'navigation' bij het map-element weg kan laten aangezien het map-element al impliceert dat het om navigatie gaat? Of vind je dat te vaag?
3. Is het niet beter om als doctype 'XHTML' door te geven aangezien je zo expliciet aangeeft de volledige opmaak met CSS te regelen?
4. Heb je tips m.b.t. goede boeken aangaande het schrijven van semantisch correcte (X)HTML?
Edit:
Ik zit nu ook te twijfelen of ik de afbeelding nu wel of niet een ID zal meegeven, want in principe zou alleen een titel ook moeten volstaan? Dan zou je dus het volgende krijgen:
HTML:
1 | [img]"../images/navigation_bottom_illustration.png"[/img] |
Moet je trouwens het alt-element ook nog gebruiken bij de afbeelding? Ik zie daar namelijk niets over staan op je webstie:
[img]"foo.gif"[/img]
Edit 2:
Ik zie in de broncode van je website het volgende staan:
quote:
<map name="mainmenu" id="mainmenu">
<ul>
<li class="non_visual"><a href="#content">skip to main content</a></li>
<li><a href="/news" rel="chapters" title="news">news</a></li>
<li><a href="/artwork" rel="chapters" title="artwork">artwork</a></li>
<li><a href="/thoughts" rel="chapters" title="thoughts">thoughts</a></li>
<li><a href="/artist" rel="chapters" title="artist">artist</a></li>
<li><a href="/links" rel="chapters" title="links">links</a></li>
</ul>
</map>
Voor de navigatie van je eigen website gebruik je zo te zien een ongeordende lijst, terwijl je in het voorbeeld op je website uitgaat van een geordende lijst. Zelf zou ik een geordende lijst logischer vinden (i.p.v. een ongeordende lijst) aangezien je de links voor de navigatie vaak in een geordende volgorde zet.
Kun je die lijst trouwens niet gewoon helemaal weglaten?
deprogrammeur wijzigde dit bericht 22-07-2005 14:08 (70%)
2) je moet zelf even uitzoeken of de titel bij de navigatie hoort of niet, afhankelijk van het antwoord plaats je 'm binnen of buiten de map (mij lijkt ie er binnen te horen als ik naar je ontwerp kijk)
3) ook in html kan j eprima opmaak en content scheiden, zou je ook gewoon moeten doen. XHTML is niet meer semantisch, niet meer modulair, niet korter en niet sneller dan html. Het is gewoon compleet iets anders.
4) boeken weet ik niet, er is veel op internet over te vinden iig, anne (van kesteren) heeft er wel wat artikelen over, chem heeft ook wat geschreven en ik dus ook. nog een erg illustratieve link
5) id is niet altijd nodig, title in dit geval ook niet, alt altijd
6) ol of ul gebruik je als de volgorde van belang is of juist niet (heeft niets met al of niet verschijnen van nummertjes te maken, daar heb je css voor). In mijn geval ben ik van mening dat m'n menu een arbitraire volgorde heeft.
7) een menu is in essentie een lijstje van links, vandaar de lijst, voor de opmaak heb je 'm misschien niet strict nodig, maar semantisch is het logischer
mophor wijzigde dit bericht 22-07-2005 16:26 (14%)
var _ = {_: 'unreadable code detected!'};
alert(_._);
Reg. datum: 20 januari 2004
quote:mophor schreef op vrijdag 22 juli 2005 @ 16:04:
reagerende:
2) je moet zelf even uitzoeken of de titel bij de navigatie hoort of niet, afhankelijk van het antwoord plaats je 'm binnen of buiten de map (mij lijkt ie er binnen te horen als ik naar je ontwerp kijk)
3) ook in html kan j eprima opmaak en content scheiden, zou je ook gewoon moeten doen. XHTML is niet meer semantisch, niet meer modulair, niet korter en niet sneller dan html. Het is gewoon compleet iets anders.
4) boeken weet ik niet, er is veel op internet over te vinden iig, anne (van kesteren) heeft er wel wat artikelen over, chem heeft ook wat geschreven en ik dus ook.
5) id is niet altijd nodig, title in dit geval ook niet, alt altijd
6) ol of ul gebruik je als de volgorde van belang is of juist niet (heeft niets met al of niet verschijnen van nummertjes te maken, daar heb je css voor). In mijn geval ben ik van mening dat m'n menu een arbitraire volgorde heeft.
7) een menu is in essentie een lijstje van links, vandaar de lijst, voor de opmaak heb je 'm misschien niet strict nodig, maar semantisch is het logischer
2) Ik heb de titel bij de navigatie gezet.
3) Ik zal me dan eens wat meer verdiepen in XHTML. Op w3schools las ik dat het voordeel van het meegeven van een XHTML-doctype is, dat je de HTML puur als omschrijving laat interpreteren en dat de HTML dus geen rol meer vervuld in de opmaak van de webpagina.
6) Links zet je toch niet in een willekeurige volgorde? Ik bedoel: je zet een link als 'links' toch vaak bewust niet vooraan?
6) een bewuste volgorde is wat anders dan of die volgorde van belang is. Je moet je afvragen of de betekenis van de lijst veranderd als je de boel husselt. In mijn geval vind ik dat niet. Bij een lijstje met prijswinnaars ofzo is dat wel het geval.
mophor wijzigde dit bericht 22-07-2005 16:43 (10%)
var _ = {_: 'unreadable code detected!'};
alert(_._);
Reg. datum: 20 januari 2004
quote:mophor schreef op vrijdag 22 juli 2005 @ 16:35:
3) ik zal je nog sterker vertellen: xhtml werkt niet eens in internet explorer, maar daar is zat over te vinden. HTML (en XHTML) horen uberhaupt geen rol te spelen in de opmaak van je pagina.
6) een bewuste volgorde is wat anders dan of die volgorde van belang is. Je moet je afvragen of de betekenis van de lijst veranderd als je de boel husselt. In mijn geval vind ik dat niet. Bij een lijstje met prijswinnaars ofzo is dat wel het geval.
3) Okee duidelijk.
4) Ik snap je punt.
Reg. datum: 20 januari 2004
Voor de realisatie heb ik onderstaande code geschreven:
HTML:
1 | <h3><h1>29</h1> object(en) gevonden in de categorie: <h2>bestaande bouw</h2>.</h3> |
Nu vraag ik mij af of mijn code semantisch correct is aangezien MSIE renderproblemen (foute lettergroottes) geeft bij het gebruik van head-tags (h1, h2 etc.) binnen head-tags?
Daarnaast geeft de specificatie aan dat een header alleen inline elementen mag bevatten (en dus geen header, wat een block-element is: http://www.w3.org/TR/html4/struct/global.html#h-7.5.5).
Dat kan je ook achterhalen via de validator van w3. De validator is niet heilig, maar geeft wel genoeg informatie waarom bepaalde HTML schrijfwijze niet correct is.
Ik vind het wel grappig dat je HTML probeert aan te leren, maar verdiep je wel eerst in de manier waarop je het moet toepassen, voordat je lukraak elementen gaat gebruiken
BtM909 wijzigde dit bericht 25-07-2005 12:13 (17%)
Girls with an ass like this, don't talk to guys with a face like that.
You've moved up on my notch-list. You now have 1 notch...
I have a black belt in Kung Flu!
Reg. datum: 20 januari 2004
Okee die head-tags zijn dus fout. Echter lijkt het gebruik van p-tags mij ook niet echt logisch aangezien ik die '29' bijvoorbeeld niet snel als alinea kwalificeer. Het beste lijkt het me dan om een div te gebruiken?quote:BtM909 schreef op maandag 25 juli 2005 @ 12:12:
Wellicht handiger om eens goed de specificaties door te lezen (10 minute HTML guide. Ook waar elementen voor bedoeld zijn. Als je naar jouw voorbeeld kijkt, dan ga je mij toch niet vertellen dat die drie koppen de drie belangrijkste items op je pagina zijn?
Daarnaast geeft de specificatie aan dat een header alleen inline elementen mag bevatten (en dus geen header, wat een block-element is: http://www.w3.org/TR/html4/struct/global.html#h-7.5.5).
Dat kan je ook achterhalen via de validator van w3. De validator is niet heilig, maar geeft wel genoeg informatie waarom bepaalde HTML schrijfwijze niet correct is.
Ik vind het wel grappig dat je HTML probeert aan te leren, maar verdiep je wel eerst in de manier waarop je het moet toepassen, voordat je lukraak elementen gaat gebruiken
deprogrammeur wijzigde dit bericht 25-07-2005 13:19 (6%)
Je kan hiervoor best wel <span>'s voor gebruiken, dus zoiets:
HTML:
1 | <span class="regeltje"><b>29</b> object(en) gevonden in de categorie: <span class="cat">bestaande bouw</span>.</span> |
LastFM - 40D + 17-55/2.8 + 70-200/4L
Ik zou jouw zinnetje zo opmaken:
HTML:
1 | <p><span class="aantal">29</span> object(en) gevonden in de categorie: <span class="categorie">bestaande bouw</span>.</p> |
God Bless America | Change We Can Believe In
<p><span>29</span> object(en) gevonden in de categorie: <i>bestaande bouw</i>.</p>
met die <i> in de lijn van de gedachte van http://www.whatwg.org/specs/web-apps/current-work/#the-i
b zou ik niet gebruiken, die stelt semantisch niets voor (i in de oude definitie ook niet)
edit: in essentie wat harm dus zegt. Alleen zou ik zijn class="aantal" liever class="number" maken, om het wat algemener te houden
mophor wijzigde dit bericht 25-07-2005 13:22 (27%)
var _ = {_: 'unreadable code detected!'};
alert(_._);
Reg. datum: 20 januari 2004
Edit:
Ik realiseer nu onderstaand voorbeeld:

Voor de 'Plaats', 'Status' etc. gebruik ik de head-tag. Volgens de W3-specs mag dat, aangezien head-elementen inline-elementen zijn. Echter vraag ik me af of het ook een juiste toepassing van de head-tag is? Ik vind het gebruik van span-tag met als class 'head' o.i.d. namelijk niet echt netjes. Kortom vinden jullie het gebruik van de head-tag binnen deze context gerechtvaardigd, of moet ik toch een span-tag gebruiken?
HTML:
1 | <div class="structure" id="recent">
|
deprogrammeur wijzigde dit bericht 25-07-2005 17:26 (92%)
verder is h1 echt een block element hoor, die mag ook never niet in een p
verder mogen genestte p's ook niet. Misschien moet je de specs toch iets beter doorlezen, zelfs in die 10 min HTML guide die al genoemd is staat een dl genoemd overigens. Er zijn een hoop nuttige links langsgekomen, lees je die ook door?
id=recent lijkt me niet handig, ga je al die blokken aan de rechterkant recent noemen? Naast het blok links en midden is rechts volgens mij een apart "hoofdstuk" je zou daarvoor zelfs een h1 recent kunnen doen, de blokken erin zijn paragrafen erbinnen
HTML:
1 | <div id="recent">
|
edit: dit is dus voor het complete rechter deel. Als algemene tip: probeer je css zo min mogelijk van id's en classes af te laten hangen, het hele rechter deel kan je selecteren op het id=recent
die h1 heb ik erbij gezet voor de duidelijkheid, da's wellicht handig voor text- en speechbrowsers. met css laat je die gewoon niet zien als je dat niet wilt: #recent h1 {display: none}
mophor wijzigde dit bericht 25-07-2005 18:48 (27%)
var _ = {_: 'unreadable code detected!'};
alert(_._);
alt="Image of the object" is natuurlijk gewoon fout, omdat de alt-tekst niet in de taal van je document is.
We unlock the mysteries of knowledge and technology.
Reg. datum: 20 januari 2004
Ik heb je tips toegepast. Ik vraag me alleen af hoe ik de automatische pagebreak na het dt-element uit kan zetten? page-break-after: none; werkt in ieder geval niet in MSIE.quote:mophor schreef op maandag 25 juli 2005 @ 18:41:
kijk eens naar een dl
verder is h1 echt een block element hoor, die mag ook never niet in een p
verder mogen genestte p's ook niet. Misschien moet je de specs toch iets beter doorlezen, zelfs in die 10 min HTML guide die al genoemd is staat een dl genoemd overigens. Er zijn een hoop nuttige links langsgekomen, lees je die ook door?
id=recent lijkt me niet handig, ga je al die blokken aan de rechterkant recent noemen? Naast het blok links en midden is rechts volgens mij een apart "hoofdstuk" je zou daarvoor zelfs een h1 recent kunnen doen, de blokken erin zijn paragrafen erbinnen
HTML:
1
2
3
4
5
6
7
8
9
10
11
12
13
14<div id="recent">
<h1>recent</h1> <!-- deze geef je niet weer dmv css -->
<div>
<h2>Van der Helstraat 50</h2>
<p>[img]"../images/image_small.png"[/img]</p>
<dl>
<dt>Plaats: </dt>
<dd>Leeuwarden</dd>
</dl>
</div>
<div>
<!-- volgende huis -->
</div>
</div>
edit: dit is dus voor het complete rechter deel. Als algemene tip: probeer je css zo min mogelijk van id's en classes af te laten hangen, het hele rechter deel kan je selecteren op het id=recent
die h1 heb ik erbij gezet voor de duidelijkheid, da's wellicht handig voor text- en speechbrowsers. met css laat je die gewoon niet zien als je dat niet wilt: #recent h1 {display: none}
Edit:
Bovenstaand probleem is inmiddels opgelost d.m.v. een float: left.
deprogrammeur wijzigde dit bericht 26-07-2005 12:55 (11%)
Reg. datum: 20 januari 2004
HTML:
1 | <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
|
Ik heb het document getest tegen de W3-validator en ik kreeg nog wel een paar fouten, maar die zijn waarschijnlijk aan de inspringen te wijten?
quote:
Below are the results of attempting to parse this document with an SGML parser.
1.
Line 6, column 68: document type does not allow element "LINK" here
...yles/style.css" rel="stylesheet" type="text/css" />
The element named above was found in a context where it is not allowed. This could mean that you have incorrectly nested elements -- such as a "style" element in the "body" section instead of inside "head" -- or two elements that overlap (which is not allowed).
One common cause for this error is the use of XHTML syntax in HTML documents. Due to HTML's rules of implicitly closed elements, this error can create cascading effects. For instance, using XHTML's "self-closing" tags for "meta" and "link" in the "head" section of a HTML document may cause the parser to infer the end of the "head" section and the beginning of the "body" section (where "link" and "meta" are not allowed; hence the reported error).
✉
2.
Line 7, column 7: end tag for element "HEAD" which is not open
</head>
The Validator found an end tag for the above element, but that element is not currently open. This is often caused by a leftover end tag from an element that was removed during editing, or by an implicitly closed element (if you have an error related to an element being used where it is not allowed, this is almost certainly the case). In the latter case this error will disappear as soon as you fix the original problem.
If this error occured in a script section of your document, you should probably read this FAQ entry.
✉
3.
Line 8, column 6: document type does not allow element "BODY" here
<body>
✉
4.
Line 52, column 6: end tag for element "P" which is not open
</p>
deprogrammeur wijzigde dit bericht 26-07-2005 13:35 (23%)
