HTML-guiden
Innehållsförteckning
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=”http://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!