skriv ut »HTML
Hypertext Markup Language
Även om du använder ett visuellt program som hjälp när du jobbar med dina websidor är det viktigt att du förstår den HTML-kod som programmet skapar. Här är en genomgång av grunderna i HTML.
OBS! HTML finns i flera versioner och nu finns även XML och framförallt CSS som i flera fall bör användas istället för vissa av de märken som visas i denna guide. Det viktiga är att du får bra grundkunskaper om hur HTML-sidor är uppbyggda så att du sedan kan gå vidare till de andra guiderna här på Webdesignskolan. Du bör använda CSS för formatering av sidornas layout. Gå vidare till guiden CSS - grunder » när du är klar med HTML-grunderna!
Websidor bygger i grunden på sidbeskrivningsspråket HTML (HyperText Markup Language). Det innebär att utseende och innehåll styrs av att HTML-koden kan beskriva sidan på rätt sätt för din webläsare . Olika webläsare tolkar HTML-koden på olika sätt och dina websidor kan därför se olika ut på olika datorer - läs mer i guiden "Webläsare och säkerhet" ». Organisationen W3C » (World Wide Web Consortium) fastställer standarder för hur HTML-kod ska skrivas och användas. HTML är urprungligen avsett att endast visa text helt utan formatering och inte för att visa bilder eller annan layout. Idag används stilmallar - CSS » för att effektivare formatera websidornas innehåll och utseende.
Det bästa är naturligtvis om man försöker anpassa sina websidor för att fungera på olika datorer och operativsystem. Det innebär i sin tur att man kanske får avstå från vissa effekter som bara syns i vissa webläsare. Du bör också fundera över vilken målgrupp du vänder dig till när du planerar din webplats. En ovan användare kan missa information och länkar mm om det inte är tydligt presenterat.
Grunderna i HTML
Det finns många HTML-editorer och de ger dig hjälp med koden och det finns även WYSIWYG-editorer där du ser hur sidan kommer att se ut i webläsaren (What You See Is What You Get) . Ett av de populäraste programmen är Dreamweaver som du kan läsa mer om på Dreamweaverskolan »
När du följer denna guide är det bäst att använda en vanlig texteditor så att du får skriva koden helt själv. Du bör ha grundkunskaper i hur HTML-språket är uppbyggt även när du använder HTML-editorer. Ofta måste du kontrollera och korrigera i HTML-koden "manuellt" och då är det viktigt att veta vad du gör.
Använd gärna Windows enkla texteditor Anteckningar (Notepad) som du bör hitta under menyn "Start/Alla Program/Tillbehör".
Du kan också använda menyn "Start/Kör..." och skriva namnet notepad:
Programmet Anteckningar (Notepad) skriver ASCII-text vilket innebär att koden du skriver förblir helt oformaterad.
Startläge - kodningen kan börja!
Innehållet som ska som ska synas på själva sidan skrivs inom "märken" (taggar - tags) som talar om vad som ska visas för webläsaren (kallas också för "element"). Märken skrivs inom <hakar> (brackets). De flesta taggar har en start-tagg och en slut-tagg som i exemplet nedan:
<TITLE> Min första websida </TITLE>
Taggarna är inte känsliga för stora och små bokstäver (Case sensitive) det går lika bra att skriva <TITLE> som <title> eller <Title>. (OBS! i XHTML används enbart gemener - läs mer om XML » )
Följande märken är själva stommen till websidan och ska finnas i varje dokument:
<HEAD> "Osynlig" information som används för att ge information till webläsaren, sökmotorer mm. Inget som skrivs här syns för demn som ska läsa dina sidor.
<TITLE> Sidans titel.
<BODY> Allt som skrivs i BODY syns i webläsaren, det är alltså sidans kropp.
ÖVNING 1: GRUNDERNA
Grundkoden
Skriv in följande kod i programmet Anteckningar. Var noga med att skriva exakt alla tecken i märkena (om du missar ett tecken eller mellanslag kan webläsaren tolka koden felaktigt):
Spara dokumentet med namnet min_forsta.htm
Starta sedan en webläsare och öppna där ditt HTML-dokument:
min_forsta_sida.html
sida-1.htm
sida_1.html
Bakgrundsfärg
De flesta webläsare visar dock bakgrunden
Bakgrundsfärg anges med BGCOLOR som ett tillägg inom märket <BODY> och kallas för ett attribut till märket <BODY>
<head>
<title>Min Internetplats</title>
</head>
<body bgcolor=#FFFFFF>Det här är min första websida! </body>
</html>
Spara ditt dokument på nytt. Gå till webläsaren. Nu kan du använda webläsarens "Uppdaterings-knapp" (Reload/Refresh) eller tangenten F5:
Mer om färger i kommande avsnitt!
Gå vidare: Färgkoder, Hexadecimala färger »
