Webbdesign

Den här artikeln behöver fler eller bättre källhänvisningar för att kunna verifieras. (2022-09) Åtgärda genom att lägga till pålitliga källor (gärna som fotnoter). Uppgifter utan källhänvisning kan ifrågasättas och tas bort utan att det behöver diskuteras på diskussionssidan.

Webbdesign avser hantverket att ge en webbplats en grundläggande grafisk design som oftast styrs av märkspråk. Till det hör att bestämma storlekar på och placering av ytor, typografi, färgskalor, manér eller stil för bilder, ikoner, logotyper och andra grafiska element.

Historia

Även om webbdesign har en ganska ny historia kan det relateras till andra områden som grafisk design, användarupplevelse och multimediakonst, men det är mer exakt sett ur ett tekniskt perspektiv. Den har blivit en viktig del av människors dagliga liv. Det är svårt att föreställa sig Internet utan animerad grafik, olika typografiska stilar, bakgrunder, videor och musik. Webben lanserades den 6 augusti 1991; i november 1992 blev CERN den första webbplatsen som gick live på World Wide Web.^[1][2][3]

1989, när Tim Berners-Lee arbetade på CERN, föreslog han att ett globalt hypertextprojekt skulle skapas,^[4] som senare blev känt som World Wide Web.^[5][6] Mellan 1991 och 1993 föddes World Wide Web. HTML-textsidor kan visas med en enkel webbläsare.^[7] År 1993 skapade Marc Andreessen och Eric Bina webbläsaren Mosaic.^[8][9][10] Det fanns några webbläsare tillgängliga vid den här tiden, men de flesta var Unix-baserade och naturligt överbelastade med text. Det fanns inget integrerat tillvägagångssätt för grafiska designelement som bilder eller ljud. Mosaic-webbläsaren bröt mot denna modell. W3C skapades i oktober 1994 för att "frigöra den fulla potentialen hos World Wide Web genom att utveckla gemensamma protokoll för att underlätta dess utveckling och interoperabilitet".^[11] Detta hindrade ett enskilt företag från att monopolisera en egen webbläsare och ett eget programmeringsspråk, vilket skulle ha kunnat påverka World Wide Web som helhet. W3C fortsätter att fastställa standarder som idag kan ses i JavaScript och andra språk. År 1994 grundade Andreessen Mosaic Communications Corp. som senare blev känt som Netscape Communications, Netscape 0. webbläsare 9. Netscape skapade sina egna HTML-taggar utan hänsyn till den traditionella standardiseringsprocessen. Till exempel Netscape 1. 1 inkluderade taggar för att ändra bakgrundsfärger och formatera text med hjälp av tabeller på webbsidor.

Arbetsgång

"Webbdesign" består ofta av flera steg, alla dessa steg är en viktig del av processen att skapa en användarvänlig webbplats.

• I ett första steg sker kravfångst och behovsanalys bland projektets potentiella användare och andra intressenter, exempelvis genom att kartlägga verksamhetsprocesser och arbetsrutiner, och föreslå nya och ändrade processer
• En grafisk formgivare eller art director skapar skisser och prototyper (mock-ups och storyboards) som utgör beskrivningar av sidornas tänkta struktur, utseende (grafisk design/layout) och interaktivitet enligt ovan, ofta med hjälp av något rit- eller illustrationsprogram.
• Formgivarens skisser och idéer implementeras med HTML-kod och stilmallar, och olika färdiga skript väljs. Detta kan göras med verktyg såsom webbeditorer, eller direkt i det innehållshanteringssystem som webbplatsen använder.
• Regelbundet, efter att mockups såväl om betaversioner har levererats, utförs användbarhetstester för att säkerställa användbarhet och god user experience (Ux)
• Webbutvecklare och andra systemutvecklare designar och implementerar databaser (relationsdatabaser såväl som dokumentdatabaser av typen NoSQL för att lagra strukturerade data, exempelvis stora sökbara tabeller) samt nya klientsidesprogram (Javascript-kod) såväl som server-sides-program (ofta i programspråken PHP, Java och Node.js och olika IT-ramverk ) med hjälp av en utvecklingsmiljö. Webbutveckling kan ofta innefatta att designa en webb service, idag ofta i form av ett restful interface, det vill säga en webbplats avsedd för att ge objektorienterad och säker databasaccess till maskiner (exempelvis till mobila appar, till internet-of-things-enheter och till andra webbplatser) som i sin tur kan vara avsedda att användas av människor.

Alla steg utom det sista ingår i begreppet webbdesign; begreppet webbutveckling innefattar även och lägger särskilt fokus på det sista steget.

En webbplats har också andra egenskaper som kräver design. Att skapa webbplatsen interaktiva funktioner, och detaljer i dessas egenskaper, brukar ofta kallas interaktionsdesign. Att mäta och försöka förbättra användarupplevelsen kallas Ux-design.^[12] Hur webbplatsens innehåll är uppdelat och länkat inom sig kan betecknas informationsstruktur eller inkluderas som en del av en informationsdesign. Detta är ett viktigt steg i sökmotoroptimerings synpunkt.

Alla dessa områden tangerar eller överlappar varandra. Ett tydligt exempel är menyer och navigationssystem på en webbplats, som inkluderar alla de olika slagen av design. Beteckningen "webbdesign" syftar därför på mer än bara den grafiska eller visuella designen.

I både den kreativa fasen, och i implementeringen i html-kod, är det viktigt för webbdesignaren att ta hänsyn till kraven på tillgänglighet. Vissa designlösningar (form- eller kodmässiga) gör webbplatser mindre tillgängliga.

I projekt för att utveckla större webbplatser samarbetar ofta ett helt team, med skilda roller, för att skapa alla aspekter på webbplatsens totala "design".

Den snabbt växande marknaden för webbdesign till Open Source baserade innehållshanteringssystem (från Engelskans Content Management System, kort CMS) är oftast styrda av så kallade "templates" (mallar) eller "themes" (teman). Här avses en design vara en komplett mall eller tema som hanterar alla de ovannämnda delarna med CSS, HTML, Javascript osv. Dessa mallar utgår oftast från innehållshanteringssystemets grundstruktur och styr hur dess funktioner och grafiska element ska visas.

En av de första som använde uttrycket webbdesigner var KG Jonsson-Finne i flertal föredrag och seminarier 1995 i den grafiska branschen. I hans bok "Internet brev- text- och bildhantering" bokförlaget Spektra 1996 ISBN 91-7136-468-4 beskrivs det kommande yrket på sidan 121.

Märkspråk, skriptspråk och andra tekniker för att skapa webbsidor

• HTML
• CSS
• JavaScript
• XHTML
• Adobe Flash
• AJAX
• Responsiv webbdesign

Webbeditorer (urval)

• Adobe Dreamweaver
• Aptana
• Coda
• Emacs
• Komodo
• Microsoft Expression
• Microsoft FrontPage
• Microsoft Visual Studio
• Microsoft Web Matrix
• Notepad
• Notepad++
• NetBeans
• VIM
• Quanta Plus

Se även

• Webbredaktör
• Webbstrateg
• Webbproducent

Källor