:: HTML - Kodspråket #1 ::

:: Första hemsidan! ::

Filformatet

När du skriver din kod i Anteckningar sparas filen vanligtvis som
en .txt fil.
För att kunna öppna sidan i en webbläsare måste den vara sparad
i antingen .html eller .htm format!
När du ska spara sidan, välj "Spara som..." och sen alla filtyper,
och spara sidan som "namn.html".

Taggarnas attributer

För att i HTML skapa ett nytt stycke, används följande syntax:

<p>
Texten i stycket.
</p>

När p används behövs inget annat än just ett p
inom taggarna. Då berättar dokumentet för webbläsaren att
ett nytt stycke ska initieras.

I många andra taggar behövs mer än ett ord eller en bokstav
för att de ska fylla någon funktion. Exempel:

<font color="#000000" size="2" face="verdana">
Det här är text med färgkod 000000, storlek två skrivet med verdana!
</font>

De vanligaste, och viktigaste, listas nedan.

Syntax för länkar

<a href="mapp/filnamn.html" target="_blank" title="Titel!" name="link1">
Det här blir själva länken. Alla attributer behöver givetvis inte användas!
</a>

Den första blåa delen i koden definierar ett ankare.
HTML-dokumentet säger alltså till browsern att det här börjar en
länk. Den andra blåa delen säger till browser att länken slutar där.

Den gula delen beskriver för browsern var målet som länken siktar på
finns, alltså var någonstans HTML-filen vi länkar till ligger.
I det här fallet låtsas vi att det finns en fil som heter "filnamn.html" i
en mapp som heter "mapp". Ifall filen finns en mapp uppåt i trädstrukturen
av mappar, skriver man "../filnamn.html".
Om filen ligger i samma mapp som dokumentet där länken finns, räcker det med
att skriva filnamnet (filnamn.html).

För att länka till en extern hemsida skriver man helt enkelt
href="http://www.hemsida.com".

I området av rött anges hur det länkade dokumentet ska öppnas - i en frame,
i samma fönster eller i ett eget fönster. _blank, som exemplet är, öppnar
dokumentet i ett nytt fönster. _self öppnar länken i samma fönster, men det
behöver man inte egentligen ange då det är standard. Man kan, med andra ord,
skippa att använda "target" alls om man önskar att dokumentet ska öppnas i
samma fönster.

Den gröna "title" anger vad det ska stå i en liten ruta som dyker upp när man
håller muspekaren över länken.

"name", färgad i lila, ger länken ett namn som gör länken till ett så kallat
"bokmärke". Det används för att i t.ex. långa texter kunna göra avskiljare, så
att man med ett länkklick kan hoppa nedåt i texten till respektive bokmärke.
Man länkar alltså till en annan del av samma HTML-dokument.

Notera att vi i vår guide använder oss av just bokmärken, när man i listan väljer
vilken del av guiden man vill besöka.



Första sidan

Det är dags att skapa din första hemsida!
Sidan skall ha bakgrundsfärg, länkar som öppnas i nytt fönster, en bild och text.

Vi har tidigare talat om attribut till taggarna.

I rutan nedan står ett kodexempel på en enkel html-sida.
Studera gärna koden och undersök attributen och uppbyggnaden!

Se även denna kod i webbläsaren,
här!



OBS!!
Det är viktigt att du övar på att faktiskt skriva egna hemsidor
under den här kursens gång. Om du inte försöker, kommer du inte
heller att lära dig. Om du vill ha feedback, eller bara hjälp, går det
bra att kontakta oss när du vill. :)

Nästa sida >>