Webdesign

Webdesign is het vormgeven van alle aspecten van een website. Op internet zijn veel meer dingen mogelijk dan in ouderwets drukwerk, duidelijke voorbeelden hiervan zijn bewegende elementen, interactiemogelijkheden, audio en video. Vanwege de technische aspecten is een designer op het web niet alleen vormgever, maar ook nog programmeur.

Structuur

Voor de navigatie op een pagina is de structuur van een website van belang. Een reclamebrochure bevat vaak losse stukken tekst met plaatjes ertussen, maar websites zijn meestal veel complexer. Wikipedia geeft hiervan een goed voorbeeld. Het kent niet alleen een logo, een titel en tekst met illustraties, maar tevens tabbladen, keuzemenu's, een loginfunctie en een zoekfunctie. Doorgaans is het de bedoeling dat de bezoeker van een website informatie snel en gemakkelijk kan vinden en zich goed kan oriënteren in de website. Daarom zal de structuur logisch in elkaar moeten zitten. Een manier om oriëntatie in een hiërarchische website te bieden is broodkruimelnavigatie, waarbij het door de gebruiker gekozen pad in de boomstructuur van de website op elke pagina is aangegeven.

Opmaak

Voor het opmaken van webpagina's kan de webdesigner in een HTML-editor de HTML-codes opgeven. Daarnaast kan gebruik gemaakt worden van een stylesheet. Daarin kunnen niet alleen lettertypes, kleuren en achtergrondafbeeldingen worden gekozen, maar de positionering van en spatiëring tussen elementen op de site kunnen er ook in worden vastgelegd. Door meerdere webpagina's aan eenzelfde stylesheet te koppelen, kan bovendien voor de hele site een uniforme opmaak verzekerd worden. Deze kan in een stylesheet in een enkele bewerking gewijzigd worden. Zonder stylesheets zou de webdesigner elk opmaakelement afzonderlijk in elke pagina moeten opgeven.

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, Macromedia 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 voor reguliere websites rekening te houden met deze pluriforme weergave.

• 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 echt 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.

Werkwijze

De bouw van een professionele website gaat in verschillende stappen. Elke stap kan worden uitgevoerd door een ander, op het betreffende gebied gespecialiseerd persoon. Vaak wordt er bij het maken van een nieuwe website eerst een grafische opzet van de gehele webpagina gemaakt in de vorm een enkel JPEG-bestand. Dit bestand gaat vergezeld met een aantal afzonderlijke plaatjes die gebruikt gaan worden als losse grafische elementen. De tekstuele inhoud krijgt wel een plaats, maar het opstellen van de teksten is een ander proces.

De grafische opzet wordt vervolgens omgezet in HTML, 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 eruitziet 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.

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.

Zie ook

• Webdesigner

Externe links

• Toegankelijkheidsrichtlijnen van het W3C
• Kwaliteitsrichtlijnen voor websites
• The Web Standards Project (Engelstalig)
• Accessibility101 (Engelstalig)
• Webdesign Basics en tutorial (nederlandstalig)

Sjabloon:Webdesign