HTML © Eva von Pepel
* [ HTML-referensbok ] * [ Referensböcker ] *
Inledning, Element, Attribut, Värden, Struktur, Dokumenttyp
HTML-dokument består av tre delar:
Då HTML bygger på en hierarkisk struktur måste sektionerna följa sitt familjeträd och får endast förekomma enligt den angivna ordningen. Tomma rader, mellanslag, tabbar eller kommentarer får förekomma före och efter varje sektion.
Ett HTML-dokument består av en Dokumenttyp-deklaration och ett element-HTML. Enbart HTML-elementets barn, HEAD och BODY, får finnas i det. (Om du skapar ramar ersätter du BODY med FRAMESET.)
Varje dokument börjar man med en s.k. dokumenttyp-deklaration där man deklarerar vilken version av språket används vid dokumentstruktureringen. Alla HTML 3.2/4.0-dokument måste börjas med en sådan deklaration.
Varje dokumenttyp och version har sin egen deklaration.
HTML 4.0
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN">
eller
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN"
"http://www.w3.org/TR/REC-html40/strict.dtd">
HTML 4.0 Transitional
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
eller
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" "http://www.w3.org/TR/REC-html40/loose.dtd">
HTML 4.0 Frameset
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Frameset//EN">
eller
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Frameset//EN" "http://www.w3.org/TR/REC-html40/frameset.dtd">
Mer om dokumenttyper och dess deklarationer hittar du här.
Dokumenttyp-deklaration följs av huvudsektionen. Denna sektion är innehåll i elementet HEAD. Elementet HEAD kan innehålla mellan 6 och 7 (beroende på vilken HTML-version som används) varav ett är obligatoriskt, nämligen TITLE. Utan elementet TITLE är dokumentet ogiltigt.
Elementen som elementet HEAD kan innehålla kallas HEAD-elementet och innehåller information om själva dokumentet och dess författare. Denna information kan användas vid sökning eller indexering av dokument och är osynlig på skärmen. Om vi jämför www-dokument med vanliga böcker motsvarar information om bokens författare, förlaget, ISBN-numret, upplagan osv som finns i början av varje bok HTML-dokumentets huvudsektion.
Huvudsektion följs direkt av kroppssektionen. Denna sektion är innehåll i elementet BODY och är synlig på skärmen. Elementet BODY kan innehålla en mängd olika element som kallas BODY-elementen, t ex P eller TABLE och som skapar dokumentets egentliga innehåll. I HTML 4.0 Frameset kan elementet BODY ersättas med elementet FRAMESET.
Dessa två rader är ett minimum krav för att ett dokument ska klacificeras som ett HTML 3.2-dokument.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2//EN">
<TITLE>Sidans titel</TITLE>
Den första raden är Dokumenttyp Deklaration som talar om vilken nivå av språket som användes för att strukturera ett befintligt dokument.
Sedan kommer sidans titel som dels visas på statusraden dels hjälper sökmotorerna att indexera sidan. Titeln är det enda elementet som är obligatoriskt. Utan titeln är ett HTML-dokument ogiltigt.
|
|
Dokumentets huvuddel upptas i sin helhet av elementet HEAD. Det är en behållare som markeras med <HEAD></HEAD> och innehåller andra element. Dessa element kallas för HEAD-elementen, t ex TITLE som är obligatoriskt eller META som är valfritt. HEAD elementen innehåller information om själva dokumentet och dess författare, dvs dess identitet och får inte förekomma någon annanstans i dokumentet än i huvuddelen.
De hjälper även sökmotorerna att dels hitta dokumentet dels klassificera det enligt de sökbegrepp som kan specificeras i META, därför är det viktigt att informationen är korrekt.
Då elementet HEAD är ingenting annat än just behållare för sina element kan det uteslutas. I ett sådan fall kommer det första av HEAD-elementen markera dokumentets huvuddel. HEAD elementen kan förekomma i en valfri ordning.
Alla HEAD elementen är osynliga på skärmen och valfria att använda förutom TITLE som är obligatoriskt. Varje HTML-dokument måste innehålla ett TITLE-element och det får finnas bara ett TITLE-element per dokument. Ett HTML-dokument utan elementet TITLE är ett ogiltigt dokument.
Dokumentets kroppsdel upptas i sin helhet av elementet BODY (eller FRAMESET). Det är en behållare som markeras med <BODY></BODY> och kan innehålla andra element. Elementen som elementet BODY kan innehålla kallas för BODY elementen, t ex P eller TABLE. Dessa element får inte förekomma någon annanstans i dokumentet än i kroppsdelen.
Som elementet HEAD är även elementet BODY enbart en behållare för sina element och kan därför uteslutas då det första av BODY elementen kommer att markera dokumentets kroppsdel.
BODY elementen är dokuments innehåll och är synliga på skärmen. Alla är valfria.
Här, efter </TITEL> kan du ange olika HEAD elementen dvs dokumentets identifikation eller en annan information som inte "ryms" på andra ställen, som t ex sökord, för att hjälpa sökmotorerna att katalogisera informationen, när och av vem dokumentet skrevs, vad det innehåller, om det är av lokalt eller globalt värde. T ex
* * *
Först nu börjar du skriva in de olika BODY elementen, som skapar dokumentets kropp och kommer att vara dokumentets innehåll. Allt som skrivs fr.o.m. nu kommer att visas på skärmen.
Om det är en välkomstsida (även kallad indexsidan), dvs den första sida som en besökare kommer att få se (om han/hon kommer in genom "huvuddörren"), brukar den vara av en kortare karaktär och innehålla några välkomstfraser, ev logo samt innehållsförteckning. Då sidan för det mesta bara innehåller länkar till andra dokument som specificeras i innehållsförteckningen stannar inte besökaren här under någon längre tid. Därför är det viktigt att sidan är lätt åtkomlig, dvs utan några stora bilder i kB räknad.
Vanligtvis börjar du med en "heading" - rubrik t ex sidans titel. En rubrik kan innehålla både text och bilder (t ex logo).
Vidare brukar innehållsförteckningen som länkar välkomstsidan till andra sidor komma. Du kan även skriva en kortare presentation av dig själv eller företaget. Skulle presentationen vara längre kan det då vara lämpligare att ha innehållsförteckningen på en annan sida.
Texten strukturerar du i stycken, rubriker, tabeller, listor. Markerar du texten med ett antal markord, måste det markordet som öppnar strängen även stänga den, den andra i raden stängs som näst sist osv:
<kod1><kod2><kod3>text</kod3></kod2></kod1>
Dokumentet avslutas med:
* * *
När dokumentet är klart sparar du det (om det är en välkomstsida) som t.ex. index.html och laddar upp det till servern. (OBS! Ibland sparas dokument som home.html, welcome.html eller något annat beroende på hur servern är konfigurerad - fråga din leverantör.) Om du använder Windows 3.11 spara dokumentet som t ex index.htm. De flesta servrar accepterar båda tilläggen.
När dokumentet är skrivet bör det html-testas. Ett sådant test eller validation som det också heter kontrollerar att koderna är syntaxfelfria. Html-test kan jämföras med en vanlig stavningkontroll. Du skulle ju aldrig publicera ett "vanligt" dokument utan att först kontrollera stavningen därför bör du aldrig publicera ett html-dokument utan att först kontrollera syntaxen. Syntaxfel kan orsaka många problem; från oläsliga eller förstörda dokument till kraschade bläddrare. Tänk även på att "slarvfel" som tillåts av en bläddrare inte accepteras av en annan samt att varje ny version av en befintlig bläddrare är striktare än den föregående. Det finns ett antal ställen på nätet där du kan testa dina dokument, se viktiga adresser.
Innan du börjar skriva ditt dokument tänk på att:
HTML-dokument är portabla dokument, dvs de anpassar sig till användarens plattform, må det vara skärmstorlek eller upplösning. 600 pixlar är ett fast mått. Element med fasta mått behåller sin storlek på alla plattformar. Det betyder i praktiken att en användare måste skrolla efter det ifall elementet inte ryms på skärmen eller så upptar elementet bara halva skärmen. För att behålla portabiliteten använd alltid relativa mått (% eller plus/minus ett värde). Ett element som är "80%" bred kommer att vara "80%" bred oberoende av plattform.
Det spelar ingen roll om namn på element och deras attribut skrivs med versaler eller gemena eller t o m en blandning av båda. Även värden som är namntecken kan skrivas på ett valfritt sätt. Adresser som hänvisar till någon fil måste däremot skrivas exakt. DOKUMENT.html och dokument.html är två olika dokument.
HTML-kommentarer är osynliga på skärmen och används ... just för egna kommentarer. De kan förekomma var som helst i dokumentet och kan vara praktiska att använda för egna noteringar (så att man bättre hittar i dokumentet) eller kan innehålla olika meddelanden i fall då fler än en person arbetar med dokumentet.
Då kommentarer är osynliga på skärmen används de även för infogning av skripter eller stilinformation som inte får stöd i äldre www-klienter. I sådana klienter är skript- eller stilinformation synlig på skärmen och för att gömma den skrivs den som kommentar.
Kommentarer används även för infogning av Server Side Includes. För att markera att kommentaren innehåller ett SSI-kommando som ska exekveras och inte ignoreras börjar man den med en stege #.
HTML-kommentarer skrivs in som SGML-deklarationer, dvs mellan <! och >. Det första tecknet (<!), som skapas av två tecken, och som öppnar deklarationen kallas för Markup Declaration Open - MDO och tecknet som stänger deklarationen (>) kallas för Markup Declaration Close - MDC. Själva kommentaren markeras med två par bindestreck. Det första paret öppnar kommentareren och kallas för Comment Declaration Open - CDO, det andra paret stänger kommentaren och kallas för Comment Declaration Close - CDC.
<!-- Detta är en kommentar -->
Du får inte ha några mellanslag mellan tecknen som öppnar deklarationen (MDO), dvs <! och de två bindestreck som öppnar kommentaren (CDO) utan skriva allt i en enda följd: <!--. Mellanslag är tillåtna mellan bindestreck som stänger kommentaren (CDC) och tecknet som stänger deklarationen (MDC) -- >.
Mellan dessa två par bindestreck som representerar en kommentar får du skriva precis det du vill på ett obegränsat antal rader.Inga tecken är otillåtna. Skriv inte dock två eller fler bindestreck i en följd inuti kommantaren då de kommer att avsluta den. Glöm inte att två bindestreck i en följd avslutar kommentaren.