Guide: Så funkar hemsidor – domän, webbhotell och FTP Exakt hur gör man en hemsida och hur hamnar den på själva internet? Det går vi igenom i denna guide.

Att skapa en hemsida är egentligen rätt enkelt – samtidigt kan det vara svårt att förstå exakt hur det här med hemsidor egentligen funkar. Hur får man upp en hemsida på sin domän? Vad är ett webbhotell? Hur och varför använder man FTP?

Detta tänkte jag gå igenom i den är guiden där du får lära dig från grunden hur en hemsida skapas, vilka delar som behövs för att lägga ut den på internet och några tips på hur du kan gå tillväga för att skapa en egen.

Grunden för en webbsida: en HTML-fil

Hela internet bygger ju egentligen på att olika datorer och servrar kopplar upp sig mot varandra och frågar efter och skickar information till varandra. En hemsida är i grund och botten en fil med text i där kod, oftast HTML, definierar vad som ska finnas på sidan.

Det kan i en väldigt enkel form se ut så här:


<!doctype html> 
<html>
<head> 
<meta charset="UTF-8"> 
<title>Elins hemsida</title> </head>
<body> 
<h1>Välkommen till Elins hemsida</h1> 
<p>Här kan du läsa mer om mig.</p>
</body>
</html>

Om du vill kan du testa att kopiera den här koden och klistra in den i ett tomt dokument i Textredigeraren (välj “Format” > “Gör om till ren textfil” på Mac). Spara den på skrivbordet och döp den till “index.html”.

Högerklicka nu på filen och välj “Öppna med” och din webbläsare.

Det som du nu ser i din webbläsare bör se ut ungefär så här:

Detta är själva grunden för vad en hemsida är. En text-fil med kod i som läses av en webbläsare som tolkar koden och visar innehållet.

Få ut webbsidan på internet: domän och webbhotell

Just nu ligger vår textfil på skrivbordet på vår dator och kan inte nås via internet på något enkelt sätt. Det vanligaste man brukar göra för att få upp sin sida på internet är att köpa utrymme på ett webbhotell och en domän.

Detta görs ofta ihop t.ex. via One, Binero, Loopia eller FSdata (som jag använder). Det finns jättemånga olika företag som säljer domäner och webbhotell så det är bara att googla runt efter det pris och paket som passar dig och dina behov bäst.

Domän

En domän är ju själva adressen till din webbsida som kommer göra det enkelt för andra att hitta fram till dig. Så när du ska köpa ett paket med webbhotell och domän brukar du oftast börja med att söka efter din önskade domän för att se om den är ledig. Du kan då få upp vilka olika alternativ som finns t.ex. .se, .nu eller .com.

I samband med att du betalar för din domän kan du oftast välja ett webbpaket. Det är hos vissa företag möjligt att köpa enbart en domän för att använda för t.ex. ompekning till en annan webbadress eller för mailadresser. Men om du vill lägga upp en webbsida på domänen så behöver du ett webbutrymme.

Webbhotell

Beroende på vad du ska ha på din hemsida kan du behöva olika stora webbutrymmen. För en enkel sida räcker några få GB långt. Ska du ha en tung sida med mycket innehåll t.ex. bild och video kanske du behöver något större.

Ska du bygga en webbshop eller ha login-möjligheter och andra funktioner kan du behöva köpa ett som har bra säkerhet (som SSL-certifikat) och hög hastighet för att göra sidan snabb för dina kunder.

Att köpa ett webbhotellspaket innebär att företaget du köper av hyr ut plats på sin server, en typ av värddator, som är uppkopplad mot internet. Du får på så vis en egen mapp på företagets värddator och mappen kopplas mot domänen du har köpt. Så när man knappar in din URL-adress så kommer webbläsaren att leta efter filer i mappen att visa upp.

Det är fullt möjligt att ha en helt egen server men det kräver ganska mycket kunskap om både hårdvara och mjukvara för att kunna skapa och sköta den. Fördelen med att skaffa webbhotell istället är att ett företag med dedikerade tekniker sköter hela den biten åt dig.

🖥 🌎

Men hur får man då upp sin HTML-fil på webbhotellet?

Ladda upp filer till servern med FTP

För att hemsidan vi skapade i HTML-filen ska hamna i mappen på servern så kan vi använda oss av webbhotellets egen fil-överförare, en tjänst de flesta webbföretag tillhandahåller. Den kommer man åt genom att logga in på webbhotellets sajt.

Men det vanligaste sättet att komma åt sin mapp på webbhotellet är att använda sig av en FTP-klient. FTP står för “File Transfer Protocol” och är ett sätt att föra över filer till en webbserver.

För att komma åt ditt webbutrymme, alltså din mapp, på webbhotellet behöver du tillgång till dina FTP-uppgifter. Dessa brukar du antingen få i ett mail när du slutfört ditt köp eller så hittar du dem under “FTP” i adminpanelen på webbhotellets sida när du loggar in.

De FTP-uppgifter du behöver är: värd, användarnamn och lösenord. 

Jag brukar använda FTP-klienten FileZilla – det är ett gratisprogram du kan ladda ned via FileZillas hemsida.

När du öppnar upp programmet så ser du dina lokala filer, alltså filerna på din dator, i den vänstra rutan. Den högra rutan är än så länge tom eftersom vi inte anslutit till någon server.

I den övre raden skriver du in värd, användarnamn och lösenord. Port brukar du inte behöva fylla i (men det är oftast 21).

Om du lyckas ansluta till servern ska du få upp din mapp på servern nu. För vissa servrar så finns det en mapp som heter “www” eller “public” eller liknande där du ska lägga filerna du vill ha på din webbsida. På andra så är det bara att lägga dem direkt här.

Mappen där du lägger dina filer kallas för din “root”-mapp.

I det vänstra fönstret om du navigerar till Skrivbordet (desktop) hittar du vår lokala fil “index.html”. Det är filnamnet som webbläsaren kommer leta efter i mappen på servern som är kopplad till ditt webbhotell, så själva förstasidan ska alltid heta index.

Dra och släpp för att kopiera över filer till servern

Nu är det bara att dra och släppa index.html filen från det vänstra fönstret till det högra för att det ska laddas upp på servern.

När detta är klart ska du kunna navigera till din domän för att hitta din webbsida.

Om du vill ladda upp din sida på en subdomän t.ex. dindomän.se/elins-hemsida så skapar du en ny katalog (mapp) i din root-mapp som heter “elins-hemsida”. De filer du lägger i denna mapp kommer man då nå via dindomän.se/elins-hemsida.

En bra standard är att undvika mellanslag och åäö i namn på filer och mappar som laddas upp på servern.

Ladda upp vilka filer du vill

Du kan såklart ladda upp annat än HTML-filer också. T.ex. bilder, ljudfiler och PDF-dokument. Dessa får då en egen sökväg i still med: dindomän.se/filnamn.jpg. 

En snygg och modern hemsida

Ett av de absolut vanligaste sätten att bygga en snygg och modern hemsida idag är att använda en CMS, content management system. Den vanligaste varianten är WordPress.

Om du har webbhotell och domän kan du installera WordPress helt gratis. Antingen manuellt via FTP eller via en 1click-install som brukar finnas på de flesta webbhotell som en tjänst.

WordPress använder kodspråket PHP för att skapa en dynamisk webbplats. Här kan du läsa ett inlägg jag skrivit om tekniken bakom WordPress.

Det finns en uppsjö av teman att använda för sin WordPress-sida. Både gratis och som kostar. Fördelen är att du enkelt kan ändra både innehåll och design utan att kunna koda.

Andra webbtjänster

Det finns många webbtjänster t.ex. hemsida24, Wix och Squarespace där man kan bygga en hemsida via ett grafiskt interface som de sedan publicerar. Det är också möjligt att köpa en domän att koppla till sidan.

Dessa tjänster kräver alltså inget webbutrymme, så du behöver inget webbhotell för att använda dem. Utan det är en tjänst där du betalar en månadskostnad till företaget för att sidan ska finnas uppe på webben. Fördelen med detta är att det är ganska enkelt att få upp en hemsida snabbt. Nackdelen är att du inte har något eget webbutrymme, så du kan inte ladda upp andra filer, skapa subdomäner och så vidare. Du är också väldigt låst till plattformen och vad den erbjuder.

Sammanfattningsvis

  • En hemsida är i grunden filer med kod (ofta HTML).
  • En webbläsare kan tolka koden för att visa sidan.
  • För att sidan ska vara tillgänglig via Internet måste den ligga i en mapp på en server.
  • Ett webbhotell hyr ut utrymme på sin server.
  • Din mapp är ditt webbutrymme, grundmappen kallas “Root”.
  • En domän kopplas till mappen för att göra innehållet lättare att hitta.
  • Du för över filer till servern med hjälp av en FTP-klient.
  • Du kan lägga vilka filer du vill i din mapp på servern.
  • För att skapa subdomäner skapar du nya mappar i root-mappen.
  • Du kan installera en CMS som WordPress på ditt webbutrymme för att göra en hemsida utan att koda.
  • Om du använder en tjänst som Squarespace, Wix eller Hemsida24 har du inget eget webbutrymme utan köper en tjänst.

Om det är något mer du undrar om de grundläggande delarna i hur det funkar att lägga upp en egen webbsida på nätet – tveka inte att ställa dom här nedanför i kommentarerna 👇

Detta inlägg är skapat efter önskemål från er läsare. Har du något du vill lära dig mer om? Hör av dig i så fall!

Psst... join the club!

Vill du ha mer? Få steg-för-steg-guider, gratis resurser, tech-tips, förhandsvisningar, tutorials, bakom kulisserna-snack och mycket mer – helt gratis.

Gå med i min mailklubb genom att skriva upp din mailadress nedan.

Inte ett nyhetsbrev, inget spam. Lovar <3

Powered by ConvertKit

Om du gillade det här inlägget så får du gärna visa det genom att klicka på hjärtat, så jag vet vad jag ska göra mer av!

2
(Visited 117 times, 4 visits today)

12 Kommentarer

  1. Sofia 20 september, 2017 at 19:15

    Hej!!

    Hittade din blogg nu via Slow Fashion Johanna Nilsson och älskar båda era bloggar!! GRYMMA INITIATIV BÅDA TVÅ!!! 😀 😀

    Svara
  2. Agnes {Cashew Kitchen} 21 september, 2017 at 12:30

    Så bra och grundläggande guide! Har ju gått igenom den här processen nyligen men kan ändå ibland känna att jag inte har nån aning om hur allt hänger ihop. Och när det kommer till ens egna hemsida och business så vill en ju ha stenkoll liksom! Därför supergrymt med repetition 😀

    Svara
    1. Elin Häggberg // Teknifik 21 september, 2017 at 12:34

      Tack snälla! Jag kommer ihåg när jag själv höll på och lärde mig detta för typ 6-7 år sedan. Var sååå förvirrad. Men det är kul när man känner att man börjar få lite kläm på läget. Sen är det ju såklart massa väldigt tekniska saker i detta som jag själv inte riktigt förstår till 100% heller men man behöver inte kunna allt här livet.. tänker jag. 😰☺️

      Svara
  3. Wilda 21 september, 2017 at 15:27

    Verkligen bra och pedagogiskt skrivet och förklarat! Känner att du direkt fyllde i mina luckor. 😀

    Svara
  4. jessica 23 september, 2017 at 07:10

    Jag undrar om det finns några nackdelar med att byta webbhotell? (har förstått att det jag har inte är vidare bra). Men förlorar man länkar, plats på google eller annat tråkigt som kan hända vid byte? Något jag behöver tänka på? Man är ju lite rädd för att flytta när man inte riktigt förstår processen 🙂

    Svara
    1. Elin Häggberg // Teknifik 23 september, 2017 at 08:08

      Om du flyttar från ditt webbhotell och tar med dig din domän så ska det inte påverka din Google-trafik så länge så sätter upp allt exakt lika dant på den nya servern (samma URL-struktur). Ibland kan det snarare ha en positiv effekt eftersom det nya hotellet kanske är bättre och snabbare!

      Svara
      1. jessica 26 september, 2017 at 19:23

        Tack för ditt svar <3

        Svara
  5. Pingback: STJÄRNÖGONBLICK #38 | kattunge, guldljus och klotter. | REAKTIONISTA

Skriv en kommentar

E-postadressen publiceras inte. Obligatoriska fält är märkta *