Verschil tussen heading en een css-regel

[Pinin]

Waarom zou je kiezen voor een heading bijv. <h1> ipv een css-style?

[ Voor 31% gewijzigd door Pinin op 22-05-2006 18:47 ]

[BtM909]

Wat bedoel je met een css regel

En je gebruikt elementen waarvoor ze bedacht zijn. Als je kijkt in de specs van W3.org, dan zal je lezen dat je een <h1> gebruikt indien je de belangrijkste titel van je pagina wilt weergeven

[samo]

Misschien is het goed http://home.parse.nl/~michiel/semantiek.html te lezen?

[Pinin]

BtM909 schreef op maandag 22 mei 2006 @ 18:46:
Wat bedoel je met een css regel

En je gebruikt elementen waarvoor ze bedacht zijn. Als je kijkt in de specs van W3.org, dan zal je lezen dat je een <h1> gebruikt indien je de belangrijkste titel van je pagina wilt weergeven

css-style is dat beter? Ik las idd wel dat <h1> het belangrijkste is t/m <h6> maar je wilt toch geen koeieletters midden in een stukje tekst Of zit ik nu heel blond te denken, en gebruik je het niet IN een stuk tekst.

samo-arne schreef op maandag 22 mei 2006 @ 18:47:
Misschien is het goed http://home.parse.nl/~michiel/semantiek.html te lezen?

ga ik doen

[ Voor 17% gewijzigd door Pinin op 22-05-2006 18:52 ]

[Verwijderd]

Je gebruikt de heading styles niet direct in de tekst, maar voor kopjes en titels van bijvoorbeeld paragrafen. Voor opmaak van blokken tekst gebruik je dan weer css-styles.

[BtM909]

Lees inderdaad maar even de link van samo-arne. Het belangrijkste is dat je het dus combineert. Je maakt eerst je content en gebruikt daarvoor de benodigde elementen en vervolgens ga je met CSS je opmaak bepalen. Wil je geen koeieletters, dan gebruik je CSS om de default fontsize (en font-family bijv.) aan te passen

Best of both worlds...

Als je Firefox als browser hebt en je installeert de WebDevelopers extension, dan kan je (bijvoorbeeld hier op GoT) het verschil zien tussen standaard opmaak en wat CSS ervan maakt.

[Technicality]

BtM909 schreef op maandag 22 mei 2006 @ 18:54:
Lees inderdaad maar even de link van samo-arne. Het belangrijkste is dat je het dus combineert. Je maakt eerst je content en gebruikt daarvoor de benodigde elementen en vervolgens ga je met CSS je opmaak bepalen. Wil je geen koeieletters, dan gebruik je CSS om de default fontsize (en font-family bijv.) aan te passen

Best of both worlds...

Als je Firefox als browser hebt en je installeert de WebDevelopers extension, dan kan je (bijvoorbeeld hier op GoT) het verschil zien tussen standaard opmaak en wat CSS ervan maakt.

Of view > style > no style

[chem]

samo-arne schreef op maandag 22 mei 2006 @ 18:47:
Misschien is het goed http://home.parse.nl/~michiel/semantiek.html te lezen?

offtopic:
erg leuk om te zien dat men hier toch heen linkt!

[Boelie-Boelie]

tomleeuw schreef op maandag 22 mei 2006 @ 18:50:
css-style is dat beter? Ik las idd wel dat <h1> het belangrijkste is t/m <h6> maar je wilt toch geen koeieletters midden in een stukje tekst Of zit ik nu heel blond te denken, en gebruik je het niet IN een stuk tekst.

Het gebruik van headings heeft niks te maken met de opmaak van een pagina, ook al lijkt dat op hte eerste gezicht wel. De verwarring ontstaat doordat browsers default styling meegeven aan ongestylde headings. Daardoor denk je waarschijnlijk dat alle h1's koeienletters zijn, h2's wat kleiner, h3 nog wat kleiner, etc. Het is echter aan de sitebouwer hoe een heading wordt weergegeven. Als je een h1 op fonts-size 9px zonder bold wilt weergeven, dan kun je dat volledig met CSS bepalen. Een heading hoeft dus niet groot of bold te zijn.
Je moet echter geen headings gebruiken als je gewoon wat grote tekst wilt hebben. Een heading heeft namelijk, zoals in het stuk over semantiek duidelijk wordt, een betekenis, namelijk dat het een kop is.

Dus als je vraag is 'moet ik een heading gebruiken of CSS', dan is het antwoord: dat ligt eraan wat je wilt bereiken. Heb je het over een kopje van een pagina of paragraaf, dan gebruik je een headingelement. Als die heading te groot/te klein/te bold etc. is, dan style je die m.b.v. CSS. Gebruik dus niet een lager headingelement alleen omdat het font te groot is, de keuze voor h1, h2 of lager hangt af van hoe veelomvattend de kop is (m.a.w. slaat de kop op de hele pagina, dan h1; slaat de kop op een stuk van de pagina, dan h2, etc.)
Heb je het echter niet over een kopje, maar gewoon over een stuk tekst op je pagina dat bold en/of groter moet omdat dat mooi is, dan gebruik je géén heading, maar bijv. een spanelement.

chem schreef op maandag 22 mei 2006 @ 19:53:

offtopic:
erg leuk om te zien dat men hier toch heen linkt!

offtopic:
Je moest eens weten hoe vaak die link langskomt!

[Pinin]

<h1>Thx allen voor de antwoorden het is weer wat duidelijker</h1>

dus

[ Voor 19% gewijzigd door Pinin op 22-05-2006 23:43 ]

[BtM909]

Technicality schreef op maandag 22 mei 2006 @ 19:28:
[...]

Of view > style > no style

WTF, ik heb nooit geweten dat die er standaard inzat . Weer wat geleerd

[Verwijderd]

BtM909 schreef op maandag 22 mei 2006 @ 18:54:
Als je Firefox als browser hebt en je installeert de WebDevelopers extension, dan kan je (bijvoorbeeld hier op GoT) het verschil zien tussen standaard opmaak en wat CSS ervan maakt.

Snelle manier om te schakelen tussen weergave met en zonder styles met de Webdeveloper Extension: ctrl+shift+S.

[Boelie-Boelie]

tomleeuw schreef op maandag 22 mei 2006 @ 23:42:
<h1>Thx allen voor de antwoorden het is weer wat duidelijker</h1>

Dat behoort juist geen <h1> te zijn, maar <strong> of <em>, een kop geeft aan dat er een tekst volgt die betrekking heeft op de betreffende kop. Een heading is niet om nadruk te geven of om aan te geven dat iets belangrijk is!

[Osiris]

En een bron voor 't bovenstaande stukje:

quote: http://www.w3.org/TR/html401/struct/global.html#h-7.5.5

A heading element briefly describes the topic of the section it introduces. Heading information may be used by user agents, for example, to construct a table of contents for a document automatically.

Dat laatste (en vooral ook de sectie waar de headings in staan in de W3C TR, "The global structure of an HTML document") geeft al aan dat een header-tag belangrijk is voor de structuur van je pagina.

Ook is het volgende van diezelfde pagina wel handig:

Some people consider skipping heading levels to be bad practice. They accept H1 H2 H1 while they do not accept H1 H3 H1 since the heading level H2 is skipped.

Je "moet" dus niet "ff" een <h3> gebruiken als je een <h1> of <h2> te groot vindt, want dan 'mist' er opeens iets in je structuur.

[Sebazztiaan]

Zoals al gezegt is gebruik je de h1 als belangrijkste header in je tekst, de daaropvolgende <h?> tags gebruik je verder in je tekst

code:

<div id="content">
  <h1>MainTitle 1 </h1>
  <p>...</p>
  <p>...</p>
  <p>...</p>
  <h2>SubTitle 1.1 </h2>
  <p>...</p>
  <p>...</p>
  <h3>Subtitle 1.1.1</h3>
  <blockquote>Quote</blockquote>
  <h3>Subtitle 1.1.2</h3>
  <p>...</p>
  <p>...</p>
</div>

Je ziet dat het volgende onstaat, als de inhoudsopgave van een boek

1 Maintitle
1.1 Subtitle
1.1.1 Subtitle
1.1.2 Subtitle

etc....