hier mag iemand een introductie schrijven, zie het howto boek of de topicstart op GoT hoe de boel werkt, lijkt me wel logisch ook eigenlijk.
Deze text kan uiteraard gedelete worden op het moment dat iemand echt content gaat schrijven
In dit verhaaltje misschien ook een stukje opnemen over Good Practice. Dus geen spaties in bestandsnamen, kleine letters voor tags en attributes, utf-8 gebruiken, enz. Dingen die gewoon goed zijn om aan te leren en dingen die NOT DONE zijn.
Het WWW is in 1989 begonnen als een wetenschappelijk project binnen CERN. Het door Tim Berners Lee bedachte netwerk van (WWW)servers met HTML documenten had als doel wetenschappelijke informatie binnen CERN voor iedereen makkelijk toegankelijk te maken.
Het WWW werd populairder door het werk van Marc Andreessen aan de Universiteit van Illinois: de ontwikkeling van de eerste browser Mosaic. Na een tijdje hebben enkele medewerkers van het Mosaic team hun eigen bedrijf opgericht: Netscape. Dit resulteerde in de eerste wijde verspreiding van het WWW. Netscape's Navigator werd de browser waarop over het WWW gesurfd werd.
Met de ontwikkeling van de browser ging ook de ontwikkeling van HTML voort, de taal die oorspronkelijk bestond uit text en anchors, werd voorzien van allerlei extra mogelijkheden. De ontwikkeling van Internet Explorer door Microsoft zette deze ontwikkeling kracht bij. Allerlei nieuwe elementen werden toegevoegd als marketing tool.
In 1994 werd door Tim Berners Lee in samenwerking met MIT en CERN het World Wide Web Consortium (W3C) opgericht dat zichzelf het coordineren van de ontwikkeling van het web ten doel stelde. HTML was een warboel van elementen geworden die door verschillende browserfabrikanten geintroduceerd werden.
In dit kader werden een aantal specificaties uitgebracht, waarvan de meest belangrijke en recente de volgende zijn:
In HTML (4) mochten lege elementen zoals <br>, <hr> en <img> niet afgesloten worden. In XHTML (in XML in het algemeen) moet dat wel. Dat kan op twee manieren, maar om backwards compatible te blijven, doen we het eigenlijk alleen op de eerste manier:
<br /> <br></br>
In tegenstelling tot HTML is XHTML (XML in het algemeen) hoofdlettergevoelig. In de DTD van XHTML is vastgelegd dat alle elementen in kleine letters geschreven moeten worden. Het is een goede gewoonte dit ook in HTML te doen, scheelt je werk als je overstapt.
In HTML hoefde je alleen quotes te zetten om de waarden attributen als deze spaties bevatten. In XHTML zijn ze verplicht. Het is een goede gewoonte om ze er gewoon altijd bij te zetten. Quotes kunnen zowel enkele (') als dubbele (") zijn.
In XHTML moeten alle waarden een attribuut hebben (dat las je correct). Bijvoorbeeld:
<input type="checkbox" checked>wordt nu:
<input type="checkbox" checked="checked" />
Het probleem van XHTML is dat het een XML mime type is wat ervoor zorgt dat XHTML zich ook aan de well-formed regels van XML moet houden. Redelijk logisch voor een taal die gebouwd is op de regels van XML. Het mime type is application/xhtml+xml en laat dat nou net iets zijn wat Internet Explorer 6.0 en lager niet ondersteund.
Hoewel je XHTML wel als HTML kunt versturen door middel van het text/html mime type haal je dan gelijk alle voordelen weg van het op XML gebaseerde taaltje en kun je net zo goed HTML gebruiken in plaats van "niet geldige HTML", wat het zou zijn als je XHTML als text/html verstuurd over het web.
Een veel gehoord misverstand is dat XHTML beter is dan HTML, dat het sneller is en op de toekomst gericht, niets is minder waar
In XHTML is er nog steeds een niet-semantisch zooitje van te maken. Ook in XHTML kunnen tabellen worden misbruikt voor opmaak. XHTML files zijn zelfs niet kleiner dan hun HTML broertjes omdat overal per se alle tags moeten worden afgesloten. CSS is ook toe te passen op HTML.
...inleiding...
En dan nu in toepassingspecifieke voorbeelden. Je DTD is er eentje van HTML4.01, dan heb je enkel de beschikking over text/html als MIME-type. Je schrijft je code volgens de HTML4.01 standaard, en over veel meer hoef je je ook niet zorgen te maken, je webserver zorgt automagisch voor het juiste MIME-type, namelijk text/html, dat als sinds de mensenheugenis gebruikt wordt om HTML-bestanden te versturen. Vanaf het moment dat je naar XHTML overstapt wordt het geheel complexer.
XHTML1.0 is backwards compatibel met HTML4.01, dus ook qua MIME-type. Maar, text/html mag enkel gebruikt worden in gevallen dat de User Agent enkel text/html ondersteunt. In alle andere gevallen gaat de voorkeur uit naar application/xhtml+xml. Dit principe, van een ander MIME-type naar een client sturen noemt [Content Negotiation]. Ook nog wat over application/xml, text/xml.
Maar in het bovenstaande verhaaltje komt nergens de uitbreidbaarheid van XHTML aan bod. Als je wil gebruik maken van andere namespaces in XHTML, zoals bijvoorbeeld MathML, is het application/xhtml+xml verplicht. Evenals in volgende versies van XHTML, dus XHTML Basic en XHTML1.1 is application/xhtml+xml verplicht.
.Let wel, met een echte application/xhtml+xml MIME-type gaat je document keihard in een strenge modus. Browsers die XML ondersteunen geven keihard een error als je document niet wellformed is. Wellformedness is voldoen aan de regels van XML, dus alle elementen moeten afgesloten worden, quotes rond alle attributen enzovoorts. 1 fout tegen deze regels en je document wordt vervangen door een error. Maar, zo hoort het ook, dit is een van de voordelen van XHTML, je weet altijd of je juist of fout zit qua wellformedness. En als wellformedness je compleet niet kan boeien, omdat je ofwel geen voorstander bent van standaarden, of omdat je geen nood hebt aan bijvoorbeeld MathML, SVG of andere markuptalen in je documenten, gebruik dan simpelweg HTML, want dat voldoet dan compleet voor jouw doeleinden :).
Erg leuk verhaaltje, maar hoe zorg ik er nu voor dat het allemaal goed gaat? Wel, met onderstaande code in je .htaccess of httpd.conf van Apache (let erop dat deze is gemaakt voor een .html extensie, dat kun je zelf veranderen).
RewriteEngine on
RewriteBase /
RewriteCond %{HTTP_ACCEPT} application/xhtml\+xml
RewriteCond %{HTTP_ACCEPT} !application/xhtml\+xml\s*;\s*q=0
RewriteCond %{REQUEST_URI} \.html$
RewriteCond %{THE_REQUEST} HTTP/1\.1
RewriteRule .* - [T=application/xhtml+xml]
Deze methode is enkel van toepassing voor statische HTML bestanden, om PHP bestanden de juiste header mee te geven, gebruiken we onderstaand stukje code:
<?php
$charset = "utf-8";
$mime = (stristr($_SERVER["HTTP_ACCEPT"],"application/xhtml+xml")) ? "application/xhtml+xml" : "text/html";
header("content-type:$mime;charset=$charset");
?>
Anne heeft een mooi lijstje voor gemaakt over je wanneer welke mime-type gebruikt..
title bij afkortingen hoeft echt alleen maar de eerste keer dat je 'm tegenkomt
HTML is in eerste instantie een tekst-formaat, gericht op indexeermogelijkheid, het ALT attribuut was bedoeld om ook HTML-documenten weer te kunnen geven, en de keuze te hebben wel of niet eventueel ingesloten afbeeldingen binnen te laden, om zo sneller te kunnen werken:
Het ALT attribuut bevatte dan een korte beschrijving van de afbeelding of waartoe hij diende, zodat mensen nadien wel per afbeelding konden besluiten alsnog een afbeelding in te laden, (het werd vaak geadviseerd om ook de bestandsgrootte erin te plaatsen)
of voor visueel gehandicapten om toch de toegevoegde waarde van een afbeelding te ervaren.
Het werd echter al snel het gebruik dat enkele browsers het ALT attribuut gingen weergeven als een tooltip, extra informatie bij een onmouseover-handeling ... dat was voor veel designers erg handig en werd al snel populair, helaas conflicteerd dat met de oorspronkelijke bedoeling van ALT, immers, de tooltip bevat vaak geen echt goede beschrijving, maar eerder extra informatie.
Juist om die behoefte van designers voor zo'n tooltip te bevredigen is vervolgens het TITLE-atribuut ook voor het IMG element beschikbaar gemaakt
Het alt attribuut is bedoeld als alternatieve tekst voor het plaatje. Als mensen op de een of andere manier het plaatje niet kunnen zien (bijvoorbeeld omdat ze blind of slechtziend zijn of een browser hebben die het plaatje niet weergeeft), wordt de alternatieve tekst weergegeven. Deze tekst is dus bedoeld als vervanging van het plaatje, niet als beschrijving.
Dit is een wezenlijk onderscheid. Als een plaatje puur ter versiering is kan de het alt attribuut worden leeggelaten (hij is verplicht, dus hij moet er wel zijn):
<img src="mooistukkiestrand.jpg" alt="" />
Bij bijvoorbeeld een garfiek, kan je in het alt attribuut de relevante data zetten, bij een formule eventueel het LaTeX equivalent.
Een heel uitgebreide beschouwing hierover is hier te vinden.
Omdat bij veel mensen niet duidelijk is voor welk doel welke elementen beschikbaar zijn kunnen die hier opgenoemd worden. Veel mensen weten bijvoorbeeld niet dat het element bestaat. En aangezien het de trend is om juist met elementen je document te definieren leek me dit wel handig.
Het cite attribuut wordt gebruikt voor de referentie naar het originele document (URL). (de zin hiervoor is een q element, Mozilla rendert hier quotes omheen)
Anne? Ja, daar is ie dan.
Semantiek klinkt uiteraard heel leuk, maar waar het feitelijk op neer komt is het juiste element voor het juiste stukje tekst gebruiken. In de meeste gevallen, en na enige ervaring, is het meestal wel duidelijk welk element je nodig hebt, maar omdat HTML enige beperkingen kent is het soms toch wel lastig om de juiste keuze te maken.
Oorspronkelijk was HTML bedoelt als een middel om documenten uit te wissen en nog niet echt gericht op het maken van webpagina's zoals we dat nu kennen. Zelfs nu hebben we nog geen elementen voor navigatie, winkelkarretjes en andere dingen die je tegenkomt op "moderne" websites. Uiteraard zijn er over deze dingen wel nagedacht en er is min of meer besloten om een lijst, UL, voor de navigatie te gebruiken. Binnen de LI elementen komen dan de diverse links naar de secties op de site. En op zich is dat ook wel logisch aangezien het gaat over een simpele lijst van links die je wilt structureren.
Er komt vast wel meer. Eerst even andere dingen doorlezen/fixen/aanvullen.
Heb je nog niet gevonden wat je wilde weten, dan kunnen de volgende links je misschien helpen: