hem
html skola
färdigadesigner
forum
kontakt

Logga in!


Nyhet!

Vi har äntligen kommit igång och börjat skriva på sidan, nu är det bara att kika in och lära sig när nya guider kommer upp!

 

Senaste uppdaterad:

HTML - för nybörjare!


Tävling!

Skicka ett uppladdningsscript HÄR och vinn krediter som senare kan användas till att ladda hem färdiga designer, bakgrundsbilder m.m.

(scriptet ska innehålla ett alternativ där man kan beskriva vad man laddar upp)

 


Ads:

 

1.1 Inledning                1.2 Första steget               1.3 Tags

 

1.1 inledning

 

HTML - Hyper Text Markup Language

 

i den här guiden kommer du att lära dig av ett av de mest använda skriptspråket för att beskriva websidor. Html är lätt att lära sig och lätt att förstå sig på och även om du använder ett program för att designa är det bra att lära sig grunderna. För att sidan ska se ut som du vill, och för att du ska kunna designa den krävs även att du har kunskaper inom CSS. CSS ”utgör adjektiv” och det är det som bestämmer hur grundtexten som du skriver kommer att se ut. För att kunna lära dig CSS bör du dock ha grunläggande kunskaper i HTML-kodning. För att få HTML att fungera krävs att man är noggrann, därför är det viktigt att du följer guiden från steg till steg.

 

HTML:

 

  • HTML står för Hyper Text Markup Language

 

  • HTML är inget programeringsspråk, det är ett "markup language"

 

  • Ett markup language är ett set av markup tags

 

  • HTML använder tags för att "beskriva" hemsidor.

 

 

 

Tags:

 

  • HTML taggar är nyckelord omringade av vinkelparanteser som t.ex.<html>

 

  • HTML taggar är ofta i par som <b> och </b>

 

  • Den första taggen i ett par kallas start tag, den sista kallas end tag.

 

  • De brukar också kallas start/opening tags och closing/end tags.

 

 

Elements:

 

  • Ett element är innehållet + en start och en closing tag.
  • De felsta element kan ha vissa utseendeegenskaper.
  • Innehållet i ett element är allt mellan start och ending tagsen.
  • Några har tomt inehåll och slutar då på start tagen (t.ex. </br> - brake row)

 

HTML är altså ETT sätt att beskriva hemsidor på. Webläsare (så som IE, Firefox och chrome) är till för att läsa språket och visa det som hemsidor! (Webläsaren kommer alltså inte att visa HTML taggar men använder dem för att få en style på inehållet = CSS)


 


1.2 Första steget

 

För att lära sig HTML Genom vår hemsida behövs det inga krångliga program eller liknande. Istället för program kommer vi nu att använda oss av någon slags ”text editor” t.ex. notepad.

 

Avancerade HTML användare brukar dock använda sig av mer komplicerade program som bland annat FrontPage eller Dreamweaver, Där det går lite snabbare att redigera (dock så måste man kunna grunder innan man börjar använda dessa).

 

 

Början på din egen testsida

 

Om du vill börja göra din egna hemsida redan här, kan du hoppa över detta steg.

 

För att göra din egen testsida, kopiera dessa tre websidor genom att högerklicka och trycka ”spara som”:

 

Index.htm

 

Sida1.htm

 

Sida2.htm

 

Efter att du har sparat dessa sidor kan du testa dem genom att dubbelklicka på ”index.htm”.

 

 

 

För att få ut så mycket som möjligt av denna guide föredrar vi att du testar att ändra och experimentera med dessa sidor för att se vilket resultat det leder till. Du kan ändra dem genom att öppna dem med din ”text editor”. När du har redigerat din sida måste den sparas som dittnamn.htm eller dittnamn.html för att den ska läsas som en HTML-fil av din webläsare.

Obs: Om du ser ”tags” på hemsidan när du har redigerat den har du inte varit tillräckligt noggrann ;).


 


1.3 Tags

 

Som du förhoppningsvis lade märke till när du sparade våra sid-exempel så börjar ALLTID en hemsida enbart uppbyggt av CSS och HTML med <html> och även slutar med </html>. Dessa taggar startar HTML funktionen. Efter denna tag kommer även <body> (som även slutar med </body>), inom denna tag kommer du att skriva allt innehåll på din sida.

 

 

Som vi sade tidigare så är det ”HTML-tags” som utgör designen på din hemsida, alltså hur den kommer att se ut. Nedan finns en lista på de allra vanligaste taggarna som vi kommer att använda. Försök att lära dig så många som möjligt J (testa dem gärna i din notepad!)

 

Rubriker

Dessa olika tags resulterar i olika storlekar på rubriker, nummer från 1-6 kommer att avgöra hur stor den blir.

 

<h1>Rubrik 1</h1>

<h2>Rubrik 2</h2>                                     

<h3>Rubrik 3</h3>…

 

Paragrafer

Paragrafer anges med <p> men en paragraf är inte nödvändigt varje gång du ska skriva något men man kan lätt modifiera utseende på dessa..

 

<p>Det här är en paragraf</p>
<p>Det här är en annan paragraf</p>

 

Länkar

Länkar används för att länka till t.ex. en annan hemsida eller någon annan sida på din server.

 

<a href="http://www.länk-till-din-hemsida.com">Det här är en länk</a>

 

Bilder

För att kunna visa en bild på din hemsida måste d på något sätt ”länka” den.

 

<img src="Dinbild.jpg" width="104" height="142" />

 

Width – bredden på bilden

Height – höjd

 

 

LÄGG TILL FLER

 

Viktigt från kapitel ”tags”:

  • Texten mellan <html> och </html> beskriver hemsidan.
  • Texten mellan <body> och </body> är det synliga sid innehållet.
  • Texten mellan <h1> och </h1> visas som en överskrift.
  • Texten mellan <p> och </p> visas som en paragraf.

 

 

Kommentera!


Gör en kommentar!
Namn
E-mail *
Kommentar
* Kommer ej att visas. Du måste fylla samtliga fält för att kommentera!


Warning: mysql_fetch_array() expects parameter 1 to be resource, boolean given in /customers/spotifree.org/spotifree.org/httpd.www/html/htmlskola/html1.php on line 560

Registrering!

E-mail *
Lösenord *
Användarnamn
Ort (valfritt)
* Används vid inloggning