Webdesign

Webdesign

Webdesign wordt over het algemeen minder lineair vormgegeven dan bijvoorbeeld de traditionele structuur van boeken, met een inhoudsopgave, verschillende indexen, een hoofdstukindeling en dergelijke. Daarbij wordt gebruikgemaakt van diverse menu's, zoekfuncties en soms ook loginfuncties om delen van de inhoud af te schermen van het grote publiek. Een manier om oriëntatiemogelijkheden in een website te bieden is de zogenaamde broodkruimelnavigatie, waarbij het door de gebruiker gekozen pad in de boomstructuur van de website op elke pagina is aangegeven.


Opmaak

De inhoudelijke samenhang van de boodschap van een website, wordt met computercommando's in de tekst aangegeven. Doorgaans worden hiervoor HTML-codes opgeven. Daarnaast kan gebruikgemaakt worden van een stylesheet. Daarin worden aanwijzingen vastgelegd over de gewenste weergaven van bepaalde html-elementen zoals lettertypes, kleuren en achtergrondafbeeldingen, evenals de positionering van en spatiëring tussen elementen op de site. Door meerdere webpagina's aan eenzelfde stylesheet te koppelen, is het eenvoudiger om de hele site in een uniforme opmaak te presenteren. De uiteindelijke weergave is echter voor de designer niet volledig in de hand te houden, omdat verschillende lezer verschillende apparaten zullen gebruiken om zijn websites te raadplegen.


Dynamische en interactieve webpagina's

Naast statische opmaakelementen kunnen er ook dynamische elementen worden toegevoegd zoals mouseovers, webvideo's en dergelijke, maar ook afzonderlijke interactieve onderdelen, bijvoorbeeld een landkaart waarvan elk onderdeel afzonderlijk aanklikbaar is. Voor het toevoegen van dynamische en interactieve elementen bestaan allerlei technieken: Javascript, Dynamic HTML, Adobe Flash. Deze sites leveren vaak echter problemen op voor mensen met tekstbrowsers als Lynx en voor bijvoorbeeld blinden die surfen met een spraakbrowser of brailleleesregel, omdat er geen alternatieve inhoud wordt aangeboden.


Weergave

Websites zien er niet op iedere computer en in iedere browser identiek uit. HTML wordt door elke computer/browser afzonderlijk geïnterpreteerd en weergegeven. Een webdesigner dient daarom rekening te houden met deze pluriforme weergave, en zal derhalve streven naar een crossbrowser opmaak om dit zoveel mogelijk in de hand te houden.
De resolutie is de grootte van het scherm, gemeten in pixels. De resolutie kan per gebruiker variëren. Een grote resolutie biedt vooral meer ruimte in de breedte, de lengte is over het algemeen minder van belang omdat dat wordt opgevangen door scrollen. Een ontwerp dat niet uitgaat van vaste beeldschermafmetingen noemt men wel liquid design, de inhoud "vloeit" hier als het ware in de beschikbare ruimte.
De kleurendiepte geeft aan hoeveel kleuren het scherm kan weergeven. In het verleden was 256 kleuren gangbaar en moest daar rekening mee worden gehouden. In die tijd zijn de webkleuren ontstaan. Tegenwoordig zijn hoge kleurendiepten echter normaal.
De kleurweergave kan verschillen per scherm. Op sommige computers is een programma geïnstalleerd dat gammacorrectie uitvoert, waardoor kleuren worden aangepast. Het maakt ook verschil of er een CRT- of TFT-beeldscherm wordt gebruikt.
De soort webbrowser is ook van belang. Browsers hebben ieder een eigen interpretatie van de code van een webpagina. Door het W3C zijn standaarden ontwikkeld over hoe de code moet worden geïnterpreteerd. De browsers houden zich daar nog niet altijd volledig aan, vooral Internet Explorer is voor ontwikkelaars vaak een zorgenkind.

Afgezien van zulke technische weergave elementen, verwachten ook (kleuren)blinde, slechtziende of dove gebruikers dat een website ook voor hen raadpleegbaar is.


Werkwijze

De creatie van een website gaat in verschillende stappen. Elke stap kan worden meestal uitgevoerd door een andere, op het betreffende gebied gespecialiseerde persoon. Vaak[bron?] wordt er bij het maken van een nieuwe website, nadat duidelijk is wat de gewenste doelstellingen zijn, eerst een schematische opzet gemaakt, een zogenaam wireframe, over hoe de ontsluiting dient te gaan functioneren en welke elementen opgenomen dienen te worden. Op basis van dit wireframe wordt vervolgens een grafische opzet van de gehele webpagina gemaakt, die kan worden gepresenteerd in de vorm van een bijvoorbeeld een enkel JPEG-bestand, vergezeld van een aantal afzonderlijke plaatjes die gebruikt gaan worden als losse grafische elementen, of als volledig klikbaar model dat een goede indruk geeft van de uiteindelijke weergave. De tekstuele inhoud krijgt wel een plaats, maar het opstellen van de teksten is een losstaand proces. Vaak wordt Lorem ipsum gebruikt om de ruimte bedoelt voor teksten, tijdelijk te vullen.

De grafische opzet wordt vervolgens omgezet in HTML, basen genaamd, waarin de bijgeleverde grafische elementen worden gebruikt. Ook op dit moment is de tekstuele inhoud nog bijzaak. Als tekst wordt vaak het Lorem ipsum gebruikt. Op dit moment kan worden getest hoe de code er uitziet in verschillende omstandigheden. Ten slotte wordt de interactiviteit toegevoegd en worden de uiteindelijke teksten in de verschillende pagina's van de website geplaatst. Het is mogelijk dat het om een dynamische website gaat, waar de inhoud met behulp van een CMS aangepast kan worden. De codering van dit server-sidegedeelte valt echter niet onder webdesign, maar wordt overgelaten aan de webontwikkelaar. De interactiviteit en uiteindelijke afwerking op de webpagina zelf kan verder verfijnd worden door een zogenaamde fronteer.


Toegankelijkheid

Met de opkomst van smartphones, PDA's en andere (persoonlijke) apparaten die toegang hebben tot het internet, veranderen ook de eisen die gesteld worden aan een website. Het lijkt niet eenvoudig om bij het ontwerp en de bouw zicht te houden op de uiteenlopende vormen van gebruik die inmiddels mogelijk zijn. Met behulp van de webstandaarden die onder meer door het W3C zijn ontwikkeld, kan er toch voor worden gezorgd dat een site onder al die gebruikersomstandigheden bruikbaar is. Zo is HTML bedoeld om de inhoud van een webpagina van structuur te voorzien, CSS om de (grafische) stijl vast te leggen en de combinatie ECMAScript/DOM om interactiviteit aan een pagina toe te voegen. Een voordeel is dat al die componenten los van elkaar kunnen worden ontwikkeld en beheerd. Sterker nog: als zaken als inhoud, stijl en/of scripting worden gemengd, zal dat onmiddellijk een negatieve invloed hebben op de bruikbaarheid van een webpagina voor andere toepassingen dan een pc-met-beeldscherm-en-Internet-Explorer. Omdat het gebruik van andere browsers, besturingssystemen en webapparaten gestaag toeneemt, wordt het voor webdesigners steeds belangrijker om rekening te houden met dergelijke vormen van gebruik.