Du är här: keryx/artikel/25. Hoppa till huvudinnehållet (h) Sidans menysektion:
Keryx logotype

Webbens utveckling - webbutveckling

Om denna artikel

Tro inte att en "hemsida" är detsamma idag som för tio eller ens bara för fem år sedan. Vill du lära dig göra eller vill du köpa in en "hemsida", så måste du veta hur dagens teknik ser ut.

Publicerad: 2005-02-27

Uppdaterad: 2013-03-12

 

En hemsida idag är inte längre en samling dokument man tittar på. Den är ett system där informationen skapas, flyttas och uppdateras i realtid, utifrån kopplingar till databaser och en mängd andra informationskällor. OBS! Artikeltexten är från 2005 och det har hänt en del sedan dess. Den generella utveckling som beskrivs är korrekt, men detaljerna är inte desamma idag. Dessutom har mer saker nu hunnit hända. Webben år 2005 är inte vad den var år 2000 och år 2000 var webben inte detsamma som år 1995. När man pratar om att "göra hemsidor" eller "ha en hemsida" så är det därför väldigt viktigt att man inser att begreppet hemsida inte är detsamma nu som det var för några år sedan och att den kommer att ha förändrat sig igen om några år. Jag kommer här att beskriva utvecklingen innan jag drar några slutsatser för hur man bör gå till väga när man skapar webbsajter idag. Jag riktar mig i denna artikel inte till tekniker, utan till andra som har ansvar för hemsidor eller nybörjare som funderar på att "göra en hemsida". Mitt språk kommer därför att vara relativt fritt från tekniska termer, men det innebär också att det kommer att sakna den precision som en tekniskt bevandrad läsare skulle önska.

År 1995 var det en ganska enkel sak att enas om vad det innebar att "ha en hemsida", idag är det vitt skilda saker som man kan mena med det begreppet. Den instans i samhället där insikten om webbens föränderlighet verkar ha svårast att slå rot är ironiskt nog skolan. Det sätt på vilket läroplanen är skriven i ämnet webbdesign är inte bra. Bland annat står där i betygskriterierna att "eleven fullgör sina arbetsuppgifter på ett i det närmaste professionellt sätt". Med den teknikutveckling som har skett bara de senaste tre åren är den formuleringen löjlig.

  1. Hur kan man tala om webbens historia?
  2. Webbens historia ur användningsaspekt
    1. Webben som dokumentationssystem - pionjärernas era (90-93)
    2. Webben som text och bild - entusiasternas era (93-95)
    3. Webben som marknadsföring - Netscapes era (95-98)
    4. Exkurs: Browserkriget (96-99)
    5. Den interaktiva webben, webmasterns död (99-05)
    6. Den integrerade webben, webben som programkörningsmiljö (2005-)
  3. Webbstandard: Multipla plattformar och handikappanpassning
    1. Tekniska konsekvenser
  4. "Jag vill ha en hemsida"
    1. Nils Ericsonsgymnasiets nya hemsidessystem
    2. System för politiska lokalavdelningar och distrikt
    3. System för kyrkor och föreningar
  5. Appendix: Utvecklingen av HTML, CSS och skriptspråk
    1. HTML 1.0 - taggarna uttrycker språklig logik
    2. Marknadsförings/Netscape-eran - taggarna får grafiska funktioner
    3. HTML 4 och CSS 2
    4. XML och XHTML
    5. HTML5/versionslös HTML
    6. Javaskript och DOM
    7. Serverbaserade skript
  6. Efterord, till mina elever (och kanske andras)

Hur kan man tala om webbens historia?

Webben som vi idag känner den är en kombination av två grundläggande tekniker, samt ett stort antal tilläggstekniker. De två grunderna är HTTP och HTML. Båda dessa utvecklades under det sena 80-talet och en bit in på 90-talet var webben nästan synonym med dessa två ord (plus DNS). Tekniskt sett har det skett mycket, som sagt, men innan vi beskriver den utvecklingen så låt oss titta på de användningsområden hemsidor haft för att förstå vad som drivit teknikutvecklingen åt ett visst håll.

Nu måste det dock sägas att ibland har det varit så att teknikföretagen velat skapa en marknad och därför drivit på just somliga tillämpningar. Just nu söker 3G-operatörerna få oss att tro att vi vill ha videosamtal. Man söker få avsättning för sin teknik och söker därför skapa ett behov. Det går trögt, men det visar ändå att det ofta är så att man sitter med en teknik först och skapar tillämpningen sedan.

I princip är detta hela webbens historia. Ingen av dess upphovsmän hade en aning om vad det var de höll på att åstadkomma. Internet som fenomen förutsågs inte av någon enda person, varken man var datorkunnig, framtidsforskare, science-fictionförfattare eller vad man än var. Internet tog alla på sängen, också sådana som gjort karriär på att vara framsynta, som Steve Jobs (Apple) och Bill Gates (Microsoft).

Webbens historia ur användningsaspekt

Webben som dokumentationssystem - pionjärernas era (90-93)

I Januari 1991 sätts den första webbservern utanför CERN upp. Webben har fötts!

HTML och HTTP föddes vid CERN. Där verkar stora mängder forskare. Det som skiljer forskare från andra skribenter är att man aldrig kan påstå något utan att det skall vara dokumenterat. Det klassiska är att man har fotnoter i sin text, men när texterna börjat hamna i datorer så visade det sig att systemet med hyperlänkar var överlägset. Ett klick så var man så att säga i noten.

HTTP medförde att man kunde med länkar hänvisa till dokument som ligger på andra datorer. Länkar i sig har funnits före hemsidorna, men möjligheten att med en global standard länka från dator till dator över hela världen var revolutionerande.

HTML hämtades från en annan teknik som heter SGML, som i sin tur används bl.a. av den amerikanska krigsmakten för att kunna datorisera manualer som kan skrivas ut vid behov i olika format.

Från början var webbläsarna textbaserade och sidorna innehöll bara löpande text. Man kan faktiskt surfa på detta sätt än idag, exempelvis via webbläsaren Lynx.

Webben som text och bild - entusiasternas era (93-95)

Tekniskt inträffade ingen större sak när webbläsaren Mosaic introducerades i april 1993, men det var en grafisk webbläsare och den kunde visa bilder blandat med texten. Detta ledde till att hemsidan som media blev omåttligt populär över natt på främst amerikanska universitet. I Januari 1993 finns det 50 webbservrar i hela världen. I oktober har antalet tiofaldigats. Mosaic släpptes i augusti samma år för Mac och Windows, vilket möjliggör vidare spridning.

HTML-kodning var ännu lätt och snabbt började entusiaster skapa sidor om allt möjligt. Själv surfade jag exempelvis runt på sajter om Monthy Python vid denna tid. Eftersom sidorna gjordes av entusiaster, så kom man in på dem gratis, till skillnad från den information man kunde hämta på de andra globala informationssystemen, som Compuserve, Prodigy och America Online. Gratismentaliteten är användarens välsignelse och somliga företags förbannelse. Hur skall man kunna ta betalt för det som andra erbjuder gratis?

Än så länge är alla hemsidor helt statiska, dvs. någon har manuellt skrivit in texten och manuellt kodat in HTML-taggarna. Under denna era så börjar man komplettera denna statiska teknik med ett tillägg, CGI, som gör att man kan skapa HTML-kod "on the fly", samt på ett intelligent sätt hantera exempelvis ett ifyllt formulär.

I juli 1994 bildas "the World Wide Web Consortium" (W3C) med syftet att samordna vidareutvecklingen av webbens tekniker. Det kommer dock att dröja tio år innan W3C blir en dominant faktor i utvecklingen. Först kommer två andra epoker.

Webben som marknadsföring - Netscapes era (95-98)

13 oktober 1994 lanseras "Mosaic Netscape 0.9". I december 1994 lanseras "Netscape Navigator" version 1.0. Tack vare att dess grundare Jim Clark behöver pengar till att bygga världens största segelbåt så introduceras företaget på börsen redan 9 augusti 1995. På mindre än ett dygn har företaget värderats till över en miljard dollar och det utan att man ännu haft några egentliga intäkter.

Netscapes dramatiska succé blir modellen för en mängd andra uppstickare och man talar nu om den "nya ekonomin". Netscape kommer under de närmaste åren att i princip på egen hand diktera hur webben utvecklas, och det sker genom rasande snabb utveckling. Var åttonde månad skall en större uppgradering av webbläsaren släppas, vilket kan jämföras med att relativt mogna produkter som ordbehandlare släpps vart tredje år, och från 1995 till idag har det enbart rört sig om små putsningar på ytan i deras funktionalitet.

Netscape introducerar i rasande fart tekniker som:

Utanför entusiasternas krets så får hemsidan tjäna till marknadsföring. Man presenterar sitt företag (sin förening, sin skola, sin kyrka, sig själv…) och de varor man tillhandahåller.

Marknadsföringsinriktningen får två konsekvenser. För det första så blir webben en tummelplats för reklamfolk och deras känsla för det nya mediet är inte helt lyckad. Målsättningen blir vacker grafik med exakt kontroll över utseendet. Man behandlar hemsidan som vore den en broschyr eller en affisch.

Den andra konsekvensen är naturligtvis att man snabbt tänker tanken att när en vara presenterats på nätet så borde man också kunna genomföra affären på nätet. Man behöver med andra ord kunna genomföra en överföring av pengar på ett säkert sätt. Olika saker testas, men den viktigaste nya tekniken är HTTPS, HTTP med SSL kryptering.

Ett nytt användningsområde för webbtekniken lanseras också under denna epok, ett användningsområde som på sätt och vis innebär en återgång till rötterna vid CERN: Intranätet. Rent tekniskt är ordet Intranät inte exakt definierat, men som slogan kan man säga att det lanserades av Netscape för att förmå företagen att använda sig av webbteknik (HTTP och HTML) för att hantera interna informationsbehov. Ungefär som man i CERN ville hålla koll på vetenskapliga arbeten.

Exkurs: Browserkriget (96-99)

År 1996 lanserar Microsoft Windows 95 OSR2 (en uppdatering av Windows 95). Den inkluderade webbläsaren, Internet Explorer (MSIE) version 3.0. Den är fortfarande underlägsen Netscape Navigator, men avståndet har minskat. Fram till denna version har MSIE varit ett skämt, jämförelsevis. Av bekvämlighet och för att Netscape nu börjar söka ta betalt av sina användare, så börjar några att använda MSIE i stället för Netscape.

I oktober 1997 släpps version 4.0 och man har nu kommit ikapp Netscape rent tekniskt. Teknikerna för att skapa en hemsida med känslan av dynamik är så pass välutvecklad att marknadsföringen av både MSIE 4.0 och Netscape Navigator 4.0, som kommer några månader senare, främst riktar in sig på detta. Båda företagen pratar om DHTML, men detta är egentligen ingen ny teknik, utan bara ett samlingsnamn på tre tekniker i samverkan (HTML, CSS och javaskript). I och med lanseringen av MSIE 4.0 så är i princip Netscapes era över. Under något år talar man om "browserkriget", men utgången är given. Man betalar inte Netscape för att få en likvärdig webbläsare i stället för den man redan har i sin dator gratis.

I september 1998 lanseras MSIE 5.0. Den är (totalt sett) bättre än allt Netscape kan erbjuda och browserkriget är definitivt avgjort. Netscape måste fortfarande stödjas av webbdesigners några år till, men avfasningen sker ändå relativt snabbt.

Det skulle dröja ända till år 2004 innan Microsofts hegemoni skulle komma bli utmanad igen. I och med den succéartade lanseringen av Mozilla Firefox, så tappar MSIE marknadsandelar ganska snabbt. Om den trenden kommer stå sig kan bara framtiden utvisa, men på grund av MSIE idag föråldrade teknik och dåliga stöd för webbstandarder (se nedan) så är vi många som hoppas att MSIE kommer tappa än mer av marknaden. Eller att Microsoft gör en rejäl uppdatering av sin webbläsare. De i februari 2005 nya signalerna från Microsoft om en ny version, 7.0, verkar dock inte lovande. Man kan helt enkelt inte skriva om de grundläggande delarna av sin kod för att åstadkomma den uppryckning som behövs.

Den interaktiva webben, webmasterns död (99-05)

I webbens barndom var det oftast en person som stod för allt hemsidesarbete: Webmastern var den som valde ut och skrev informationen, han designade sidans layout och han skötte den teknik som behövdes för detta. Som "webmaster" krävdes det alltså en mångkunnighet.

I takt med att den informationsmängd man velat ha på sina hemsidor ökat, stod det klart att webmasterns jobb måste börja fördelas på flera personer. Idag kan vi se tre skilda roller - och det är ytterst få förunnat att bemästra dem alla - nämligen informatören, teknikern och designern.

Rent tekniskt innebär detta att man måste skapa system som möjliggör denna uppdelning. Informatören skall i princip inte behöva behärska mer än ordbehandling. Teknikern tillåts på nytt vara "nörd" och designern behöver inte bli datorexpert. Faktum är att designern i princip kan jobba med papper och penna.

Dagens webbsajter är dynamiska, i ordets egentliga mening. Informationen skapas i samma stund du frågar efter den. Den lagras på olika ställen, främst i databaser och uppdateringen sker i realtid, dvs. i samma ögonblick som Christian Olsson hoppat i de olympiska spelen skall resultatet synas på hemsidan, i samma ögonblick antalet varor i lagret har ändrats så skall det synas på hemsidan.

Dagens webb består av fem grundläggande tekniker:

  1. Databashanteraren, dvs. det program som hanterar databasen.
  2. Serverbaserat skriptspråk, dvs. den programkod som kommunicerar med databasen och i realtid skapar hemsidan.
  3. HTTP, det protokoll som gör att webbläsaren kan kommunicera med webbservern, kanalen för informationsutbytet.
  4. (X)HTML, som i webbläsaren blir det sammanhållande kittet, där informationen integreras på ett sätt som blir användbart för användaren.
  5. CSS, Javaskript och DOM. De tekniker som styr det visuella intrycket och skapar "levande" effekter i hemsidan.

De databasdrivna webbsajterna har utvecklats gradvis. Till en början hade man statiska hemsidor som kompletterades med dynamiska inslag, såsom:

Runt år 2000 tog utvecklingen fart på allvar vad gäller s.k. "content-management systems" (CMS). Idag köper man inte in en "hemsida" utan vad man köper är en CMS! Du skall inte skaffa (eller göra) en uppsättning sidor, utan ett system för hantering av information.

Genomslaget för CMS:er innebär att idag är hemsidor helt igenom dynamiska. Om man tittar på de fem "heta" områdena under år 2004 så ser man detta tydligt.

Wikis och communities är exempel på hur uppdelningen mellan informatör och tekniker möjliggjort att den som läser hemsidan själv skapar den! Informatören är användaren. Mer interaktiv än så kan en webbsajt knappast bli.

Nätbanker, webbhandel och specialiserade söktjänster, typ Gula Sidorna, är också de exempel på att webben är interaktiv idag. Knappast någon blir upphetsad av en gästbok eller ett diskussionsforum som sådant. Interaktiviteten bör vara mer genomgripande för att räknas.

En annan viktig användaraspekt i den interaktiva webben är de tjänster som tillhandahåller skräddarsydd information. Man går in på sin sida och får det urval nyheter, åsikter, sportnyheter, väderleksrapporter, etc. som passar just mig. Informationen är så oerhört riklig på nätet att alla uppskattar teknik som låter informationen komma till användaren i stället.

På 90-talet talade man om "push", som skulle innebära att nyheter dök upp exempelvis direkt på windowsskrivbordet. För få hade ständig Internetuppkoppling, de flesta vill inte bli avbrutna med det de håller på med, etc. Men den grundläggande idén lever vidare på andra sätt. Det man för några år sedan kallade portaler har ersatts av aggregatorer. System som letar reda på den information du vill ha, sammanställer den och presenterar den just för dig.

Den integrerade webben, webben som programkörningsmiljö (2005-)

I och med genombrottet för tekniker som XML och att andra tekniker som Javaskript har nått en större mognad, så har webbsajterna nått ännu en utvecklingsnivå. Morgondagens webbsajter har en total integrering med alla andra system. Bankerna är föregångare på detta. Om du går till en kassa på bankkontoret, till en uttagsautomat eller in på hemsidan spelar ingen roll. Du kommer åt samma konton och samma tjänster.

CMS:en kommer så sakteliga att fasas över till det totalt integrerade systemet. Dagens CMS:er kommer i många fall att leva vidare och växa in i denna nya roll. Andra system kommer att skapas från grunden.

Hemsidan i framtiden kommer inte bara skapas dynamiskt i det ögonblick du väljer att titta på den, utan den kommer att uppdateras dynamiskt under tiden du tittar på den. Nu pratar vi inte om dynamiska effekter typ 90-talets DHTML, alltså att det blinkar och rör på sig. Vi pratar inte heller om sidor som laddar om sig en gång varje minut eller något liknande. Vi pratar om sidor som beter sig som vore de datorprogram.

Fyller man i ett formulär så jämförs det du skriver med referensinformation på webbservern inte bara när du klickar på "skicka", utan i realtid. Ett tidigt exempel på detta är Google suggest.

Ett annat exempel på denna kommande era är "24-timmarsmyndigheten". På dess sajtförklaras denna utveckling, fast med andra ord och specifikt för myndigheternas tillämpningar.

Kort sagt: En webbsajt idag är inte en "hemsida", utan den är en applikation, en samling sammankittade program som integreras med hela verksamheten och alla andra datorsystem. Idag gör man inte hemsidor, utan man bygger system med webbteknik.

I programmeringen talar man om "programkörningsmiljö" (RTE, Run Time Environment). Som programmerare behöver jag hålla reda på om mitt program skall köras på en Unix-maskin, med POSIX som RTE, eller om man skall köra den på Windows med "Win32" som RTE, eller på Macintosh där RTE:eerna har fantasifulla namn som "Carbon" och "Cocoa". Idag håller webben på att bli en RTE. De system som utvecklas är inte "hemsidor", utan en slags program vars byggstenar är webbtekniker.

En nybörjare kan naturligtvis inte lära sig webbteknikerna med en gång för att åstadkomma ett sådant här system, men det sätt på vilket man lär sig grunderna bör vara anpassat så att man kan växa in i detta. Lär dig inte 90-talets tillvägagångssätt!

Webbstandard: Multipla plattformar och handikappanpassning

Dagens webb måste vara tillgänglig för alla. Den innehåller så mycket speciell information, så att den som exkluderats därigenom hamnar på undantag socialt sett. Det är därför av ytterstavikt att en sajt är handikappvänlig.

Detta är naturligtvis också en fråga om människosyn. Väldigt många hemsidor som lär ut hur man gör hemsidor är föråldrade, liksom många böcker i ämnet. De skrevs för att passa gårdagens webbläsare. Man kan lätt byta ut sin webbläsare om man händelsevis är dum nog att sitta på MSIE 5.x eller (huga!) Netscape 4.x. De som tar del av webben via "text-to-speach" eller braille-terminaler har färre möjligheter. Dagens hemsidor måste passa också dessa. Allt annat är cyniskt.

Nu är denna skara inte så stor, men de som börjar surfa via sina 3G-telefoner kommer snart vara desto fler. Detta är ytterligare en faktor som gör att man när man gör sina hemsidor bör följa webbstandarder och tydligt skilja mellan layout och innehåll.

En och samma HTML-kod skall alltså kunna fungera optimalt för mediet i fråga, oavsett om detta är en vanlig datorskärm med hög upplösning, en mobiltelefons lilla skärm med fåtaliga pixlar, en skrivare, en "text-to-speach-terminal" eller något annat.

W3C, som jag berättade om tidigare är nu ledande i utvecklingen. De fungerar som standardiseringsorgan för HTML, XML, CSS och många andra tekniker. Till skillnad från 90-talets vilda västern era, då först Netscape och sedan Microsoft, ofta ganska ogenomtänkt introducerade olika tekniker på eget bevåg, så finns det idag ett organ som alla stora aktörer lovat följa, och som finansieras av alla de stora datorföretagen.

Tekniska konsekvenser

Begrepp kommer att förklaras mer i detalj i appendixet om teknikens utveckling.

"Jag vill ha en hemsida"

Som framgått är detta uttryck numera i det närmaste meningslöst. Dagens "hemsidor" är arbetsredskap och en integrerad del av en helhetslösning.

Är du bara intresserad av en enkel lösning för att sprida din åsikt eller dina funderingar. Strunta i att göra en "hemsida", utan sätt upp en blogg i stället. Be någon installera Movable Type eller något liknande åt dig och du är igång på fem minuter.

Man måste i stället fråga säg vad man vill göra via sin hemsida. Här följer målspecifikationen för de tre system jag (Lars Gunther) jobbade med år 2005:

Webbsystem för skolor

Webbplatsen skall:

System för politiska lokalavdelningar och distrikt

Systemet skall:

Eftersom politik har en tendens att locka fram oseriösa och oftast anonyma inläggsskrivare bör systemet inte ha ett forum eller en gästbok. Eventuellt skulle man kunna bygga på med en frågespalt där man besvarar seriösa frågeställare och inte publicerar en fråga innan dess att den fått ett svar.

En FAQ bör finnas som en del av den första punkten ovan, speciellt för att hjälpa skolelever snabbt hitta svar till sin arbeten.

System för kyrkor och föreningar

Externt skall systemet:

Internt skall systemet:


Appendix: Utvecklingen av HTML, CSS och skriptspråk

En hemsidas grundläggande del är HTML. HTML i sin tur är ett sätt att markera vad slags information man förmedlar genom att omge text med s.k. taggar. Det kan se ut så här:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
  "http://www.w3.org/TR/HTML4/loose.dtd">
<html>
<head>
  <title>Sidans rubrik här</title>

  <style type="text/CSS">
    @import "stylenormal.php";
  </style>
</head>
<body>
  <h1>Rubrik här</h1>
  <p>Text här. Lorem ipsum etc.</p>

</body>
</html>

Först skall det komma en doctype. Den talar om vad slags HTML man använder.

Sedan följer taggen <html>. Den inringar hela det egentliga dokumentet och kallas därför för rot-element.

Taggen <head> ringar in det information som beskriver dokumentet i stort. Taggen <body> vad som skall stå i själva dokumentets text- och bilddel.

Taggen <h1> inringar huvudrubriken på sidan. Taggen <title> i head-delen inringar det som skall stå på den (vanligtvis) blå raden längst upp i webbläsarfönstret.

Taggen <p> utläses "paragraph" och inringar ett stycke.

Taggar kan ha attribut, exempelvis så här: <img src="ego.jpg" alt="Bild på mig i bastkjol" /> Detta läser jag ut som att här skall det visas en bild (img). Bilden ifråga är "ego.jpg" som kan antas vara en bild på författaren i jpeg-format. Detta anges med attributet "src", som utläses "source" (källa). De som inte kan se bilden skall i stället få en beskrivning av den, en alternativtext, som anges med attributet "alt".

Nu vet du tillräckligt mycket för att vi skall kunna beskriva hemsidans utveckling ur kodningsperspektiv.

HTML 1.0 - taggarna uttrycker språklig logik

I webbens barndom var webbläsarna som sagt inte grafiska. En rubrik på högsta nivå (<h1>) blev inte större än underrubriker eller vanlig text. I och med att Mosaic lanserades ändrades detta. Man valde att markera rubriknivåer med att göra texten olika stor (som i detta dokument).

Marknadsförings/Netscape-eran - taggarna får grafiska funktioner (glöm alla koder i detta stycke!)

När marknadsförarna kom in i bilden började de som sagt efterlysa grafisk kontroll. Man skulle som designer kunna styra val av typsnitt (<font family="Verdana, sans-serif">), sidans bakgrundsfärg (<body bgcolor="#124321">, etc.

Man lade alltså till nya taggar som enbart hade grafisk funktion. Man gav befintliga taggar nya attribut, också med grafisk funktion. Mängden HTML man behövde kunna för att göra en hemsida svällde över alla breddar. Av det skälet började många göra sina hemsidor i program som Adobe Pagemill (idag Go-Live), Macromedia Dreamweaver eller Micrososft Frontpage. Själv föredrog jag Netobjects Fusion.

Dessa program erbjöd utöver WYSIWYG, att man kunna använda mallar som styrde alla i sajten ingående sidors utseende och att länkar i exempelvis menyer uppdaterades automatiskt på alla sidor allteftersom man skapade nya sidor eller tog bort.

Alla sajter som gjordes under denna era gjorde också något annat, och vida mycket värre än att använda grafisk HTML-kod. Man missbrukade taggar så att de skapade en viss effekt. Tabeller användes för att strukturera sidorna. Rubriker valdes utifrån önskad textstorlek, inte utifrån vilken logisk nivå man egentligen befann sig på.

Också jag "syndade" på den här tiden och också de som utvecklade WYSIWYG-programmen tänkte helt grafiskt. Dessa program skapade - och skapar än idag - som regel än värre kod än vad det blir när man kodar för hand.

Generation fyra av webbläsarna - taggarna kompletteras med CSS

HTML visade sig snabbt ha flera inbyggda begränsningar för att styra layouten. Visionärerna hade börjat fundera på ett sätt att renodla tekniken, så att man skulle använda stilmallar, Cascading Style Sheets, för att styra det visuella och låta HTML-koden återgå till att markera språklig logik.

Till en början innebar dock lanseringen av CSS att man kom ur askan i elden. Under DHTML-åren på slutet av 90-talet blandade man in CSS utan tanke i sin fortfarande grafiskt orienterade gröt av HTML-taggar. Eländet gick under namnet HTML 3.2.

Att uppdatera en sajt för hand var i det närmaste omöjligt på den här tiden. Koden var så grötig, med tabeller som låg i en annan tabell inuti en tredje tabell. Till detta kom en stor uppsjö taggar och en massa olika attribut till dem - och ovanpå detta CSS. Ville man dessutom gå Microsoft och Netscape till mötes så skulle man dessutom ha javaskript för att våga kalla sin kreation "DHTML".

Som om inte detta vore nog. MSIE och Netscape Navigator tolkade koderna olika och man var i princip tvungen att skriva dubbla uppsättningar av allt. Speciellt javaskripten blev eländiga.

Två saker måste hända för att det skulle bli en slags ljus i änden på denna mörka tunnel. För det första så måste världens hemsidesmakare få tillgång till kraftfullare verktyg än första generationens CSS. I maj -98 så lanseras specifikationen för CSS 2.0. I och med att MSIE lanseras i version 5.0 (beta hösten -98, skarp version -99), så finns det också en webbläsare som kan hantera CSS 2.0 åtminstone hjälpligt.

Sedan Microsoft avgick med segern över Netscape, så slutade man dock i princip utveckla sin webbläsare vidare, och idag är MSIE klart sämre än sina konkurrenter.

HTML 4 och CSS 2

I och med att specifikationen till HTML 4 blev klar, så finns det en tydlig rekommendation om hur man bör skriva sin kod. Ett stort antal taggar, samt ett stort antal attribut till de kvarvarande taggarna är numera nervärderade (deprecated). De finns kvar för att inte skapa en mjuk övergång från HTML 3.2, men bör undvikas.

Tack vare detta är det på nytt lätt att lära sig HTML. Det krångliga tycker de flesta i stället är att skriva CSS-kod. Och det är delvis rätt. Det tar ett litet tag innan man kommer in i systemet. Systemet är emellertid konsekvent och logiskt uppbyggt, så när man väl kommit över första inlärningströskeln rullar det på ganska enkelt.

Det kvarvarande problemet med CSS är just att framför allt MSIE inte stödjer CSS 2.0 fullt ut, samt är buggig i sin tolkning av den CSS man faktiskt stödjer. Det hindrar inte att man idag helt och hållet bör gå över till CSS-baserad layout. Ur nästan varje perspektiv är det en överlägsen lösning.

Det speciella med HTML 4 är alltså separationen mellan innehåll och design. HTML 4 i sin tur finns i tre versioner:

CSS 2.0 skiljer sig från 1.0 främst genom möjligheten att dimensionera och positionera "boxar". Tillsammans med taggen <div>, så innebär detta att vi kan säga adjö till tabellen som hjälpmedel för att skapa sidlayout.

XML och XHTML

HTML blev en makalös framgång, men ett antal viktiga saker saknades. Språket skapar sidor som webbläsaren tolkar och en människa kan se resultatet. Om däremot en maskin skall tolka sidan, så blir det svårare. För att skapa fler möjligheter så behövs det tydligare och striktare regler. XML är i likhet med HTML också en utveckling från SGML, men har en tydligare uppsättning regler för hur taggar skall ordnas och hur de skall skrivas.

XHTML är HTML som uppfyller alla krav från XML. XHTML är HML och XML samtidigt. Element och attribut heter likadant som i HTML 4, men de måste skrivas enligt XML:s striktare regler. Detta innebär bland annat följande:

XHTML finns i flera versioner. 1.0 strict, 1.0 transitional och 1.0 frameset, vars tillåtna taggar och attribut är exakt desamma som för HTML 4. Dessutom finns det XHTML 1.1, som innebär att man delat upp XHTML 1.0 i moduler och har förbättrat stöd för bl.a. asiatiska språk.

XHTML 2.0 var ett förslag på framtida standard som aldrig blev helt fastställd och som dessutom inte var att vara bakåtkompatibel med 1.x. Den slog aldrig rot. Mjuka övergångar brukar vara att föredra.

HTML5/versionslös HTML

Snabbuppdatering: XHTML är nu också ett passerat stadium, som hade sina poänger. HTML5/versionslös HTML är det enda som bör användas efter år 2011. Vad som exakt menas med HTML5 är en fråga som kräver ett eget dokument att reda ut. Det finns en teknisk innebörd, men de flesta använder termen slarvigt.

Javaskript och DOM

Införandet av webbstandarder innebär att vi slipper utveckla alternativa javaskript för olika webbläsare. Idag måste vi dock skilja mellan MSIE och de andra (Firefox, Opera, Safari, m.fl.) Enormt många javaskript-skolor på nätet och i bokform lär ut 90-talets javaskript. Här har saker hänt och för den som utvecklar en hemsida idag är dessa gamla artiklar snarast att betrakta som desinformation.

En god regel är att om den sida du läser om inte inkluderar en någorlunda moderna gecko-baserad webbläsare i det som den ämnar stödja, så är sidan föråldrad. Netscape 6 eller 7, Mozilla eller Firefox bör nämnas i texten.

90-talets javaskript innebar att man hade ett sätt att skapa dokumentinnehåll genom kommandot "document.write". Detta kommando så att säga skrev i dokumentfönstret. Idag håller vi på att gå över till ett annat sätt som bygger på "the Document Object Model" (DOM).

Somliga tror att år 2005 så kommer DOM vara den hetaste klientsidestekniken av alla.

Serverbaserade skript

Klientsidan innebär webbläsaren. Ett skript som körs på klientsidan, oftast javaskript (med DOM-kommandon), skickas alltså i sin helhet från server till webbläsare, sedan utförs kommandona. Serverbaserade skript å andra sidan utförs först på servern och resultatet skickas till klienten, webbläsaren.

Moderna sajter bygger helt på denna teknik. Det ledande språket för att att skapa dynamiska sidor är PHP, följt av ASP-språken (VB och C#) och JSP. Även om JSP har en liten total marknadsandel, så är det vanligt hos de stora företagen för tunga affärskritiska uppgifter.

Serverbaserade skript bör utformas så att tre skikt inom desamma kan urskiljas: Lagringslogik (databasabstraktion), affärslogik och presentationslogik.

Det serverbaserade skriptspråket kan idag betraktas som ett slags kitt eller lim, som håller ihop sajtens alla informationskällor. Det kan hämta information i textfiler och i XML-dokument. Dessa kan i sin tur ligga på samma server eller på en maskin någon annanstans i världen. Med hjälp av SQL kan man hämta och lämna information i relationsdatabaser. Med hjälp av LDAP kan man göra det samma i katalogtjänster, som Active Directory. Dessa skriptspråk kan naturligtvis skicka mejl, men de kan också ta emot och bearbeta mejl. Rent tekniskt är det fullt möjligt att göra en lösning där man mejlar in nya sidor (eller delar av sidor) till en webbsajt.

Efterord, till mina elever (och kanske andras)

Som företagare jobbar jag med dessa tekniker, som lärare vill jag lära ut de absoluta grunderna på ett sådant sätt att mina elever är förberedda på ett professionellt arbetssätt.

Jag har på annan plats klagat på bl.a. webbdesigsnkolan. Inte vet jag om det beror på mna klagomål eller inte, men helt plötsligt har det efter tre års inaktivitet dykt upp två nya artiklar. En om webbstandarder och en om XML och XHTML. Ironiskt nog är artikeln om webbstandarder fylld av kodfel. HTML-tidy räknar 64 stycken, varav flera är av typen "proprietära attribut". Artikeln om XHTML får 28 fel i HTML-tidy.

I artikeln om webbstandard förklarar de varför de använder Dreamweaver för att göra sina sidor. Hela förklaringen tyder på att sajtens upphovsmän fortfarande befinner sig på 90-talet i sitt tänkande. Man har helt enkelt inte hängt med. Att systemet duger för deras egna behov innebär inte att det är ett föredömligt exempel för andra att ta efter.

I denna artikel har jag talat mig varm för webbstandarder. Det finns de som har en avvikande åsikt, det vet jag. Min poäng är att så länge som man är nybörjare bör man definitivt skriva kod som validerar och följer standard. När du börjar bli duktig och vet varför du avviker från standarderna och exakt vad det får för konsekvenser, då kan du börja göra det. Och att bara kolla att det "fungerar" i din webbläsare, räknas inte som att du vet om konsekvenserna!

Artikelinfo
Publicerad:2005-02-27 10:54     Författare:itpastorn
Uppdaterad:2013-03-12 10:43     Ämne:Webbteknik
Uppdaterad: 2013-03-12 10:43    © Keryx