Olika sätt att göra hemsidor

1. Inledning

Den här sidan handlar om vilken teknik man skall välja för att göra hemsidor. Jag har omarbetat den i omgångar, senast 22 oktober 2006.

Jag försöker här visa varje sätts styrkor och svagheter. En poäng som jag försöker göra är att ett sätt inte alltid är bättre bara för att det är svårare att utföra.

2. Html vs Xhtml

Det äldsta sättet att göra hemsidor på är med en kodstandard som heter Html. Den har funnits sedan i början av 90-talet men slutade utvecklas omkring 1997. Du kan läsa lite om Html och de andra kodspråkens historia på sidan Från Sgml till Xhtml. Läs mer »

Html var den förhärskande tekniken då jag började med min webresurs. Det användes från början enbart för att styra strukturen på en sida. Med koden skapade man olika utrymmen där man sedan kunde placera texter och bilder.

Framförallt kom tabeller till användning, men snart användes de även för att styra färger och annat som har med layout att göra, vilket skapade en väldigt rörig kod.

Det går fortfarande att använda Html, men jag rekommenderar dig att i stället försöka gå över till Xhtml.

Xhtml 1.0

Den teknik som kom efter Html heter alltså Xhtml. Den första versionen, Xhtml 1.0, lanserades januari 2000. Den bygger på Html men följer i högre grad en standard som heter XML. Man bör därför ha goda kunskaper om Html för att kunna koda enligt Xhtml.

Xhtml används också oftast ihop med stilmallar (CSS). Därför kan man nästan inte prata om Xhtml utan att också nämna CSS.

+ Fördelarna med Xhtml 1.0

• Mer standardiserat och precist än Html.
• Kommer att finnas kvar längre än Html.
• Lätt att lära sig.
• Med enkla medel kan man göra ganska funktionella webbsidor.

- Nackdelarna med Xhtml

• Begränsat vad gäller saker man kan göra.
• Sidorna blir därmed ganska enkla och fula.
• Mer styrd uppdelning mellan presentation och struktur än Html.
• För att skapa snygga sidor krävs att man lär sig CSS.

Xhtml 2.0

Under 2005 började W3C, organisationen som utvecklar olika sätt att göra hemsidor, prata om nästa version av detta kodspråk. Vad denna standard innebär kan du läsa om på min sida Xhtml 2.0. Gå dit »

3. Tabeller

Tanken med tabeller var från början att strukturera data ungefär som i Excel, dvs matrisliknande:

I var och en av cellerna visas således olika data. Detta ger datan en struktur.

Ganska snart började folk dock använda tabeller för att styra en sidas utseende, dvs hur datan presenteras. Man lade in färger, ramar, texter och bilder i olika celler och manipulerade tabellceller på andra sätt för att anassa layouten:

Detta sätt är fortfarande det vanligaste 2006, då detta skrivs. Men i den kommande Xhtml-standarden avråder man från att blanda strukturen med presentationen. Ett alternativt sätt är i stället att styra presentationen med <div>-boxar och stilmallar.

Du kan läsa mer om detta på mina sidor om stilmallar. Gå dit »

+ Fördelarna med tabeller

• Bra för att strukturera innehållet.
• Lätt att få en snygg layout.
• Lätt att lära sig.
• Med enkla medel kan man göra ganska snygga webbsidor.

- Nackdelarna med tabeller

• Det blir ganska mycket kod.
• Webbläsarna tolkar tabeller långsammare eftersom tabeller egentligen inte är till för att styra hela webbsidor.
• Webbläsarna tolkar tabeller något olika vilket gör att en del sidor ser olika ut på olika datorer.
• För att styra layouten med tabelelr tvingas man använda onaturliga delar, som tomma celler, transparenta bilder, osv.
• Tabellceller går oftast inte att anpassa i höjdled, vilket innebär att man är ganska beroende av att något faktiskt ligger i cellen. Detta kostar både tid och bandbredd.
• Med tabeller som styr en webbsidas layout är man väldigt låst till just den storleken. Folk med mindre skärmar får t.ex svårt att se sidan utan att scrolla mycket i sidled.
• Det är också svårt att förändra webbsidan för olika medier, t.ex handdatorer, mobiler, osv.

4. Med frames

Frames har länge varit en kontroversiell metod att skapa hemsidor och de har varit lika hatade som älskade bland webbdesigners.

Frames används enbart för att anpassa olika sidor i förhållande till varandra och styr egentligen inte enskilda sidors layout. Men frames styr däremot en hel sajts layout.

Problemen med frames är många. Webbläsarna lägger t.ex till rullningslister trots att sådana inte behövs. Dessutom är det lätt att webbläsarna trasslar in sig i frames och öppnar sidor i fel fönster. Därför förespråkar många serverprogrammering i stället (se avsnitt 12).

Men samtidigt är frames väldigt funktionella och utan att kunna programmering kan man skapa en ganska avancerad sajt. Sidor med frames fungerar även på CD, vilket gjort att jag använt mig mycket av denna teknik.

+ Fördelarna med frames

• Man kan ganska lätt skapa en snygg och funktionell sajt.
• Med frames får man en avancerad lösning som inte kräver serverprogrammering.
• Sidorna fungerar på datorn och på CD.

- Nackdelarna med frames

• Webbläsarna tolkar koden olika och sidorna ser olika ut i olika läsare.
• Mycket svårt att få precision i koden.
• Om man gör fel kan webbläsarna trassla in sig i frames.
• Bokmärken i webbläsaren leder inte till alla sidor utan blott en enstaka.
• Svårare att skriva ut alla frames - man får oftast bara med sig ett enda fönster.

Frames med Html är dessutom på väg att ersättas med XFrames, som är XML-baserade. Läs mer om detta på min sida om Xhtml 2.0 i sektionen om den nya webben. Gå dit »

5. Via ett program

Hittills har jag skrivit om olika kodstandarder. Men det går också att skapa hemsidor med olika program. I bl.a Word, Excel och Photoshop, kan man spara en sida som en enkel webbsida. Då skapar programmet all den kod som behövs.

Den här metoden används alltså enbart för den som vill presentera ett innehåll utan att kunna skapa layouten på egen hand.

Program som Publisher, PageMaker, QuarkXPress och InDesign är lite mer avancerade än vanliga ordbehandlingsprogram. Ett äldre ord för dem är "Desktop Publishing Program" eller "DTP-program". Sådana program är egentligen avsedda för produktion av trycksaker, men har också utrustats med möjligheten att spara dokumentet som en webbsida (se även nästa avsnitt).

+ Fördelarna med hemsidor via ett program

• Mycket lätt att skapa en hemsida.
• Man behöver inte kunna skriva kod alls.

- Nackdelarna med hemsidor via program

• Fungerar oftast bara för en sida i taget, vilket gör det svårt att länka mellan sidor.
• Sidorna innehåller mycket skräpkod.
• Sidorna innehåller ibland grova fel i koden som gör att de inte visas korrekt.
• Dålig kompatibilitet med olika webbläsare.
• Sidorna skapas med den kodstandard som fanns då programmet gjordes, men denna standard uppdateras inte alltid.
• Programmen kräver ibland en del kunskaper om vilken kodteknik som skall användas då sidan sparas som webbsida.

Du hittar olika sätt att spara som hemsidor från sektionen om programkunskap. Läs mer »

6. Via ett program för webbsidor

Det kanske mest kända programmet för att skapa webbsidor är Dreamweaver. Det och liknande program ger möjligheten att antingen skapa webbsidor via ett grafiskt gränssnitt eller genom att man växlar till ett kodläge. Ju mer kod man kan desto bättre jobbar man förmodligen i sådana här program.

Med den här metoden kan man alltså välja i hög grad om man vill jobba med innehållet, layouten eller rent av olika scripttekniker. Ju bättre programmet är desto mer anpassningsbart är det.

+ Fördelarna med layoutprogram

• Lätt att skapa hemsidor.
• Man behöver inte kunna särskilt mycket kod i början.
• Ger stora möjligheter till kontroll över sidans utformning.
• Har ofta inbyggda verktyg för att validera koden. Läs mer om validering här »

- Nackdelarna med layoutprogram

• Kan vara svårt att komma igång för nybörjaren.
• Kräver ganska stora kunskaper för att utnyttja programmet fullt ut.
• Ett bra layoutprogram är ganska dyrt.

Du hittar olika sätt att spara som hemsidor från sektionen om programkunskap. Läs mer »

7. PDF-sidor

PDF är ett universellt dokumentformat som gör det möjligt att skapa sidor som ser likadana ut på alla datorer. Med webbsidor i PDF frångår man helt Html, Xhtml och CSS och skapar i stället en webbsida som påminner om ett dokument i ett kontorsprogram.

PDF-formatet finns i några olika varianter. I ett layoutprogram kan man skapa PDF för att skicka till tryckerier, men man kan också skapa komprimerade PDF-filer som passar på webben.

För att göra avancerade PDF-filer, med möjligheten att lägga in länkar och mediafiler, måste man ha Acrobat eller liknande program. Läs mer om sådana på min särskilda sida med surftips. Gå dit »

I Mac OS kan man också spara direkt som PDF. Läs mer om det här »

Metoden används enbart för att presentera innehållet på ett specifikt sätt. Den berör egentligen inte alls tekniken "bakom" sidan.

+ Fördelarna med PDF

• Sidorna ser likadana ut i alla datorer.
• För enklare sidor fungerar PDF utmärkt.
• PDF-formatet ger stor kontroll över sidornas utformning.
• Fungerar bra för sidor som skall skrivas ut.
• Fungerar lika på alla datorer.

- Nackdelarna med PDF

• Kräver att rätt plugin finns installerad i webbläsaren.
• För mer avancerade PDF-sidor, som fungerar som hemsidor med länkar, krävs ganska dyra program som är svåra att lära sig.
• Sidorna har ett eget filformat som fungerar lite annorlunda än vanliga webbsidor.
• Filerna kan bli ganska stora om man inte komprimerar dem.

8. Hemsidor i Flash

Flash har kommit att bli ett alternativ för de utvecklare som vill ha fullständig kontroll över sidornas utformning. I och med att en sida i Flash kräver en plugin (ett särskilt hjälpprogram) kommer sidorna att tolkas på rätt sätt från början, förutsatt att pluginen är installerad.

Formatet ger stora möjligheter och används framförallt för multimedia på webben. Det fungerar dock sämre för rena textsidor eller vid utskrift.

Flash kan användas på två olika sätt: antingen gör man allt som en Flash-fil eller så bäddar man in Flash-objekt på en vanlig webbsida. Med ett lite finare uttryck kallas det senare för "embedded object".

Båda metoderna utgår ifrån en presentation av innehållet, där programmet sköter all programkod (som man aldrig ser). Med Flashs eget programmeringsspråk, ActionScripts, kan man sedan göra olika utökningar. Här har jag t.ex lagt till kommandot

on (release) { gotoAndPlay(3); }

för att styra vad som skall hända då man klickar på en av knapparna i en presentation. Men med mer avancerad programmering kan man skapa interaktiva webbsidor, multimediapresentationer och spel. Då rör man sig mer under ytan, mot layout- och tekniklagren jag pratade om inledningsvis.

På min sida med surftips över Flash-sidor hittar du mer inspiration. Gå dit »

+ Fördelarna med Flash

• Ger stor kontroll över sidornas utformning.
• Har stora möjligheter att skapa sidor med varierat innehåll, t.ex ljud, videor, musik, text, osv.
• Gör det svårare för besökaren att kopiera texter, bilder och annat.

- Nackdelarna med Flash

• Kräver att besökaren har rätt plugin installerad.
• Ganska svårt att lära sig.
• Programmet är relativt dyrt.
• Sidorna fungerar lite annorlunda än vanliga webbsidor, vilket kan förvirra ovana besökare.
• Fungerar sämre än vanliga hemsidor då sidorna skall skrivas ut.
• För att uppdatera en sida i Flash måste man ha tillgång till källdokumentet.

9. Publiceringsverktyg

Publiceringsverktyg kallas med ett annat ord för "Content Management Systems" eller "CMS" . Det är program som körs på en server på nätet och skapar webbsidor. I princip finns tre olika sådana här varianter:

Medlemssidor
Man skapar en medlemssida på en community, chatt, dejtingsajt eller liknande och använder sedan de inbyggda verktygen för att skapa en medlemssida. Publiceringsverktyget skapar sedan sidan och publicerar den på det konto man har skapat.

Denna metod påminner på så vis om att skapa hemsidor via ett program, som jag berättade i avsnitt 7.

Fristående verktyg
Det finns idag publiceringsverktyg som hjälper folk att skapa webbsidor. Man skapar sidan som sparas på den egna hårddisken eller på en viss sajt. Sidorna kan sedan redigeras manuellt, men själva grundarbetet är då gjort.

Med ett fristående verktyg får man ett mellanting mellan att skapa sidor via ett program (avsnitt 7) och ett layoutprogram (avsnitt 8).

Eget sajtverktyg
Lite mer avancerat är att installera ett eget publiceringsverktyg på den egna servern eller på det egna webbhotellet om man har sådana rättigheter. Sådana system går att göra hur avancerade som helst, där man inte bara skapar webbsidor för företagets hemsida utan t.ex också uppdaterar en kalender, ett intranät, skapar dynamiskt innehåll, handhar e-postservern, osv.

Den här metoden blir alltså vad man gör den till och vad man betalar för. Det finns verktyg som är gratis, som mest syr innehållet, och sådana som kostar hundratusentals kronor och kräver avancerade kunskaper i servertekniker.

+ Fördelarna med publiceringsverktyg

• Lätta att använda.
• Kräver inga eller små förkunskaper.
• Man kan enkelt uppdatera sina sidor och sin sajt.

- Nackdelarna med publiceringsverktyg

• Kräver oftast ganska stora kunskaper för att sätta upp sitt eget system.
• Alla publiceringsverktyg har begränsningar för vad man kan göra.
• De riktigt bra verktygen är ofta dyra. De billiga kräver stora kunskaper och mycket tid.

På min sida med surftips för olika webbverktyg hittar du länkar till olika publiceringsverktyg. Läs mer »

10. Servertekniker

Med servertekniker menar jag lite olika saker. Först och främst att man i hemsidans kod skriver in särskild kod avsedd för serverns olika program. Koden är skriven i något scriptspråk där ASP och PHP är de vanligaste. Man lägger in denna kod tillsammans med Html eller motsvarande kod för att skapa själva webbsidan.

Servertekniker kräver oftast stora kunskaper för att kunna användas. Men den som behärskar dem kan också göra oerhört mycket mer än med enbart Html.

De stora webbutvecklingsföretagen har t.ex med servertekniker och olika programmeringstekniker skapat de publiceringsverktyg jag berättade om i förra avsnittet.

Med servertekniker kan man också göra enklare saker, som att skicka e-post via servern, hantera lösenord, skicka filer med streaming-tekniker, osv.

På min sida om den nya webben skriver jag om andra sätt att använda serverteknik på. Läs mer »

+ Fördelarna med servertekniker

• Ger väldigt stora möjligheter att styra webbsidornas funktionalitet.
• Gör det möjligt att skapa interaktiva hemsidor som förändras utifrån besökarens önskemål.

- Nackdelarna med servertekniker

• Svårt att lära sig.
• Fungerar inte för att styra webbsidornas layout.
• Kräver rättigheter för att få använda på vissa webbhotell.
• Sidor med kod avsedd för servrar fungerar inte direkt på datorn eller på en CD.
• Stora krav på fortbildning ställs i och med att teknikerna ständigt uppdateras.
• Sidorna måste ibland uppdateras (=kodas om) då serverns programvara uppdateras.