Lektioner

Organisera din sajt

Strategier för att organisera en statisk webbplats

Centralt när du bestämmer hur du ska organisera filerna på din sajt är att du ska kunna hålla ordning på dem och veta vad som finns var. Det kan också vara bra att fundera på hur ordningen påverkar sökvägarna på sajten.

Vad menar jag med en statisk sajt?

En statisk sajt är en sajt som inte är dynamiskt genererad på begäran, utan består av färdigskrivna dokument. Det är framför allt statiska sajter vi arbetar med i kursen.

Tips som är bra att tänka på:

  • Ha begripliga namn på mapparna, det ska vara lätt att hitta bland dokumenten.
  • Det är bra med korta sökvägar, men ibland är en längre sökväg bättre än en kortare, om den är mer logisk.
  • Minimera mängden dokument – återanvänd.
  • GLÖM INTE INDEXFILEN!
  • Inga åäö eller mellanslag i fil- eller mappnamn.
  • Jag skriver allt med gemener - funkar för mig (och de flesta andra). Jag rekommenderar starkt att ha en bestämd princip för namngivning för undvika felskrivningar och onödigt merarbete.
  • En webbsajt kan bestå av många dokument. För att kunna hålla ordning på dessa behöver du en logisk struktur, detta kan göras på lite olika sätt.

Exempel på mapp- och filstrukturer

Allt i en mapp

Har man en liten sajt, med få dokument, kan det räcka med att man bara lägger allt i en mapp. Då får man fördelen att alla relativa URL:ar kan bestå av enbart filnamnet.

Alla filer i samma mapp

Olika filtyper i olika mappar

Vanligt är dock att man, för att man enklare ska kunna hålla ordning på materialet, placerar olika filtyper i olika mappar. URL:arna kommer då bli lite längre. Kom då ihåg att låta index.html ligga kvar i rotmappen (root, eller rotmappen är den mappen som innehåller alla andra mappar i en mappstruktur).

Olika filtyper i olika mappar

Vanliga mappnamn är img för bilder, css för CSS-stilmallar och js för Javascript. Du kan naturligtvis välja namn som du vill, men dessa används av många och är både korta och tydliga. Lägg till mappar som du behöver. Jag brukar till exempel ha en mapp som heter files, eller filer , där jag förvarar nedladdningsbara dokument och andra resurser som inte passar in någon annanstans.

Tänk alltid på hur relativa URL:ar förändras beroende på hur dokument är placerade i förhållande till varandra.

Egna mappar för undersajter

Utöver de filtypsmappar som nämns ovan kan själva HTML-dokumenten på stor sajt delas in i undersajter, till exempel efter ämne, för att bli mer lättöverskådlig. Var och en av dessa undersajtsmappar kan, om man vill, ha egna indexsidor och vara root i en egen struktur.

Även om sökvägarna blir något mer komplicerade är vinsterna med detta stora om du har många dokument att hålla reda på.

Egna mappar för undersajter

En mapp för varje sida

För att få snygga sökvägar i adressfältet på användarens webbläsare kan man välja att låta varje HTML-fil i dokumentet få en egen mapp.

Detta innebär ingen som helst arbetsbesparing för dig som webbutvecklare, men ändrar sökvägarna på ett sätt som kan vara snyggt. Som du vet öppnas ju en index.html automatiskt när webbläsaren kommer in i mappen den ligger i. Indexfilens namn visas normalt inte heller i webbläsarens adressfält. Många tycker att http://www.webbplats.se/mappnamn/sida/ är snyggare än http://www.webbplats.se/mappnamn/sida.html.

Det finns som du ser flera olika sätt att organisera en webbsajt. Du kan säkert komma på några till. Det viktiga är att det blir en begriplig, logisk och konsekvent struktur, som du kan hålla reda på, och som underlättar arbetet. Ju större sajten blir, desto viktigare blir det att den är väl organiserad. Det är också viktigt att hålla ordning på saker om andra människor kommer att arbeta med sajten du lägger upp.