HTML begynderguide (Azero webhotel)

HTML begynderguide

Du kan lave hjemmesider (html/xhtml) i en enhver editor, som f.eks. Notepad der følger med Windows. Du finder Notepad under Tilbehør/Accesories. Måden du laver hjemmesiden på, er ganske simpelt ved at skrive såkaldte "tags" rundt om de elementer du ønsker at markere. Webserveren oversætter dem så til f.eks. fed skrift.

Grundregler

Et tag skal altid startes og afsluttes (uden undtagelser).
Skriver du i din fil Hallo verden, vil det blive vist som Hallo verden, altså med fremhævet skrift.
Du kan også bruge flere tags indkapslet i hinanden: Skriver du i din fil Hallo verden, vil det blive vist som Hallo verden.
Husk at det er meget vigtigt at du indkapsler tagsene i korrekt rækkefølge, Hallo verden er altså forkert og vil i mange tilfælde generere mystiske resultater for folk der browser dine sider.

Hvordan laver jeg så min første hjemmeside?

I en standard tekst (ASCII) editor laver du en simpel skabelon der giver browseren de tags som er et krav og retter teksten til som ønsket (test nedenstående):

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html>

  <head>
    <title>...dokumentets titel...</title>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"/>
  </head>

  <body>
    <h1>...en stor overskrift...</h1>
    <h3>...en mindre overskrift...</h3>
    <p>...noget tekst i et afsnit...</p>
    <p>...noget tekst i et nyt afsnit...</p>
  </body>

</html>

Gem filen med endelsen .htm (check at din editor ikke automatisk sætter .txt bagved) og send den til din webserver via f.eks. Ftp
Test din hjemmeside ved at taste adressen ind i browseren, f.eks. www.dit-domaene.dk

Prøv at teste ovenstående og når du browser siden, så højreklik på siden og tryk "vis kode / view source", så får du at se hvordan siden er lavet. Dette kan også gøres på alle andre hjemmesider og du kan på denne måde få et overblik over hvordan andre mennesker laver deres sider.

Herunder finder du en liste over de mest brugte HTML tags. Det er kun html og body tagsene (start og slut) der er påkrævet i et HTML dokument. Om du skriver tags med store eller små bogstaver er ligegyldigt.

HTML tag	Beskrivelse
<p> </p>	Starter og slutter en paragraf (afsnit).
<hn> </hn>	Starter og slutter en overskrift. Værdien n specificerer størrelsen af fonten og skal være et tal mellem 1 og 6, hvor 1 er størst og 6 er mindst.
<ul> </ul>	Starter og afslutter en liste med bullets. Hvert punkt (List Item) skal begynde med en <li> tag.
<ol> </ol>	Starter og afslutter en liste med tal. Hvert punkt (List Item) skal begynde med en <li> tag.
<li>	Angiver et punkt. Skal afsluttes med et </li> tag.
<strong> </strong>	Starter og afslutter fremhævet skrift.
<em> </em>	Starter og afslutter tekst der skal tydeliggøres.
<img src="image file" alt="Beskrivelse">	Indsætter et billede på en hjemmeside.
<a href="URL"> </a>	Laver et hyperlink (link,genvej) til en anden lokation eller dokument. Dette er et eksempel der "linker" til vores forside: <a href="/forside.asp">Gå til forsiden</a>.
<a href="mailto:email-adresse"> </a>	Et hyperlink der starter en email. Her er et eksempel der emailer info@azero.dk <a href=mailto:info@azero.dk>Send os en email</a>. Man kan også bede email programmet om at lave et emne selv ved at bruge "?subject=En overskrift". Her er det en god ide at bruge gåseøjne omkring teksten, da mellemrum ellers ikke vil virke. Her er et eksempel: <a href="mailto:info@azero.dk?subject=En overskrift">Send email overskrift</a>
<html> </html>	Indikerer at indholdet af siden er i HTML sprog. Typisk er dette det første og sidste tag i filen.
<head> </head>	Indeholder specielle HTML instruktioner, som søgeord, beskrivelse af siden etc.
<title> </title>	Angiver titlen af dokumentet. Titlen vises i browserens titel bar (øverste blå linie).
<body> </body>	Indeholder de data som du ønsker der skal vises i browseren.
<meta/>	Kan angive specielle indstillinger, http-equiv skal være med, da den specificerer sidens tegnsæt.
<!DOCTYPE>	Angiver hvilket HTML-sprog siden er lavet i.

Bemærk at der i ovenstående ikke står noget om hvordan du ændrer udseende af din hjemmeside, det foregår meget lettere og mere hensigtsmæssigt et et stylesheet.

Du finder en manual over alle tags hos w3c.org.