HTML-guiden
OBS! Vi har skrivit en ny guide om nya HTML 5 som vi rekommenderar istället för denna. Du når den nya guiden här!
Vad är HTML?
HTML står för HyperText Markup Language och är grunden när man ska skapa en hemsida. HTML’s element skrivs inuti taggar, såhär: <h1>Rubrik</h1>. Med HTML infogar man saker som länkar, bilder och rubriker. Själva formateringen och utseendet/layouten på hemsidan sköts sedan av CSS-dokument som man länkar till sitt HTML-dokument.
De vanligaste HTML-taggarna
<p> Står för paragraf. Man skriver sin brödtext inom paragrafer. Exempel:
<p>Här är lite text i en paragraf</p>
<h1> Står för rubrik. Det finns olika nivåer på rubriker, från h1 till h6. Exempel:
<h1>Detta är översta rubriken på min hemsida</h1>
<br /> Radbrytning. Om du bara gör ett vanligt radbryt genom att trycka på enter så kommer inte webbläsaren att tolka detta som ett radbryt, utan du behöver då infoga en <br />-tagg. Exempel:
Detta står på rad ett. <br /> Detta står på rad två.
<a href=” ”> Infogar en länk. Exempel:
<a href=”https://www.webbdesignguiden.se”>Detta är en länk till Webbdesignguiden</a>
<img src=” ” /> Infogar en bild. Exempel:
<img src=”bild.jpg” />
HTML, head, title och body
Ett hemsida inleds med <html>-taggen för att tala om för webbläsaren att din fil är en hemsida. Efter <html> bör du ha en <head>-tagg. I dokumentets ”huvud” infogar du saker som inte ska synas direkt på hemsidan. Som exempel infogar du koden som länkar ditt CSS-dokument till ditt HTML-dokument här. Du har också sidans titel, <title> i huvudet. Inom <title> brukar man, inte överraskande, skriva hemsidans titel. Efter titel och huvud kommer <body>, och det är här du börjar skapa allt som ska synas på hemsidan.
Exempel på komplett hemsida:
<html>
<head>
<title>Hemsidans titel</title>
</head>
<body>
Detta syns på hemsidan!
</body>
</html>
Övriga taggar
<ul> Infogar en lista. Används tillsammans med <li> för att lägga till saker i listan.
Exempel:
<ul>
<li>Äpple</li>
<li>Banan</li>
<li>Apelsin</li>
</ul>
<table> Infogar en tabell. <tr> Används för att lägga till rader och <td> för att lägga till kolumner. Exempel:
<table>
<tr>
<td>Kolumn ett</td>
<td>Kolumn två</td>
</tr>
</table>
Nu när du känner till de vanligaste HTML-taggarna så kan det vara bra att läsa vidare om CSS för att styra utseendet och upplägget på din hemsida. Läs CSS-guiden här!