Webpagina’s, perfecte opmaak en toegankelijkheid : een illusie ?
June 27th, 2008 by Edwin 2,184 x bekeken
Een eenvormige webpagina opmaken is door het gebrek aan échte standarisatie en de veelvuldige systemen geen sinicure. Hieronder bespreek ik enkele factoren die de visuele structuur en de toegankelijkheid van een website kunnen beinvloeden.
De grootste problemen om een perfecte universele webpagina te maken, ontstaan door het feit dat de eindgebruiker van verschillende, niet altijd compatibele, systemen en interfaces gebruik kan maken.
Schermresoluties en monitorafmetingen
Niet alleen variëren de afmetingen van monitors van 15″ tot zelfs 82″ ( inch ), de schermresoluties zijn de laatste jaren ook sterk geëvolueerd. In januari 2008 kreeg W3schools.com nog maar 8% bezoekers met een schermresolutie van 800 * 600 pixels op bezoek. Het aantal 1024*768 bezoekers daalde zelfs van 54% naar 48%. De trend gaat duidelijk in de richting van hogere resoluties, zelfs gebruikers met schermen van 1920*1200 komen regelmatiger voor.
De oude stelling van 800*600 pixels als opmaak standaard is voorbijgestreefd. 1024*768 pixels is eigenlijk de minimale resolutie geworden voor het opmaken van webpagina’s.
Het plaatsen van custom toolbars in de browsers of het browserscreen manueel verkleinen zijn ook factoren die de look van een site kunnen beinvloeden. Om voor dit reusachtig gamma aan beeldformaten een visueel aantrekkelijke website te maken kan je een Liquid design gebruiken. Dit is niet altijd toepasbaar en beperkt wel enigzins je creatieve mogelijkheden.
Het Browseraanbod
Een ander hekel punt is het gebruik van tientallen browsers die bovendien nog eens met verschillende versies op de markt zijn.
De 3 grootste, die op het moment ruim 95% marktaandeel hebben, zijn Internet Explorer 6.0, Internet Explorer 7.0 en Firefox 2.0 ( versie 3.0 is net op de markt ). Het probleem is dat sommige browsers bepaalde codes van een webpagina niet ondersteunen of anders interpreteren, waardoor de opmaak kan variëren naargelang de browser waarmee een site bekeken wordt.
Men kan dit ondervangen door een webpagina visueel te testen in de meest voorkomende browsers en de code van de webpagina’s zodanig aan te passen dat een identieke presentatie bereikt wordt.
Standaard fonts en kleuren
Je hebt als webdesigner geen invloed op de apparatuur of besturingssystemen van de eindgebruiker. Daarom werden er enkele basisnormen opgesteld om een identieke kleur- en tekstpresentatie te bekomen op alle besturingssystemen.
Web safe colors : de 256 basiskleuren
Web safe fonts : Web safe fonts list
Ondertussen zijn de meeste computers voorzien van minstens 16-bit kleuren. Rekening houden met de 256 web safe colors hoeft dus echt niet meer. Het aanbod van web safe fonts blijft beperkt. Je kan je baseren op de uitgebreidere Standaard Windows fonts lijst of een font naar keuze gebruiken, maar dan is het aan te raden om een web safe font als alternatief in de stylesheet ( CSS ) te plaatsen, dit om controle te hebben over de visuele structuur van de webpagina bij de gebruiker.
Laadtijd webpagina’s
Verschillende factoren zorgen ervoor dat webpagina’s trager of sneller geladen worden in de browser van de gebruiker. Je kan als regel stellen dat, indien er na ongeveer 10 sec. geen nuttige informatie verschijnt in de browser, deze gebruiker onherroepelijk je webpagina verlaat ( en waarschijnlijk nooit meer terugkomt ).
- Type en locatie hosting: low budget hosting of overzeese webhosting zorgen soms voor vertraagde laadtijden.
- Mobiele netwerken: over het algemeen hebben deze netwerken een tragere verbinding dan de vaste ADSL of ISDN verbindingen.
- Vaste internetverbindingen: in onze contreien zijn de trage inbelverbindingen zo goed als verdwenen.
- Zware afbeeldingen: gebruik bij voorkeur .gif afbeeldingen, vermijd zeker .bmp afbeeldingen, deze hebben geen enkele vorm van compressie en zijn daardoor zwaarder. Andere mogelijkheden zijn .png of .jpg afbeeldingen.
- Codering pagina’s : de teksten, paginacode en stylesheets nemen meestal niet zoveel Kilobytes in beslag. Gecompliceerde of meerdere javascripts, zware serverside scripts of flash toepassingen kunnen de laadtijd van de webpagina en de werking ervan beinvloeden. Zeker bij oudere PC’s.
Zorgt voor een nette codering, ook aan de kant van de server. Beperkt of comprimeer afbeeldingen en flash toepassingen. Een maximale Kb of Mb waarde bepalen voor een webpagina is redelijk moeilijk, ga er van uit dat een snelle laadtijd je op termijn meer voordelen kan geven dan een loodzwaar prachtdesign of een onnodig ingewikkelde scripting.
Mobiel internet voor GSM,Blackberry en PDA
Door de beperktere mogelijkheden van deze toestellen wat betreft het weergeven van een webpagina, gaat mijn persoonlijke voorkeur uit naar het maken van aparte pagina’s voor dit soort internettoepassingen.
Persoonlijke gebruikersinstellingen
De eindgebruiker kan zijn browserinstellingen wijzigen waardoor Javascript of Active-X objects permanent uitgeschakeld worden. Daar rekening mee houden is volgens mij niet echt nodig. Het percentage van gebruikers dat dit soort instellingen veranderd is zeer laag.
Toegankelijkheid ( Accessibility )
Bitter weinig websites voldoen aan de toegankelijksheidnormen voor andersvaliden . Als met een deel basisregels rekening gehouden wordt, kan dit zonder al te veel meerkosten aanzienlijk verbeterd worden.
De opmaak van een pagina realiseren conform de W3C regels is een eerste stap. Visuele elementen, zoals afbeeldingen, voorzien van een ALT en / of LONGDESC tag is een eenvoudige manier om de toegankelijkheid te verbeteren. Gebruik relatieve waarden voor de font-size opmaak ( bv. .em, .ex ) i.p.v. absolute waarden zoals pixels, een slechtziende kan dan de tekengrootte via de browserinstellingen naar voorkeur aanpassen.
In de realiteit wordt er bij het bouwen van webpagina’s weinig rekening gehouden met de noden van andersvaliden. Vele ontwerpers vinden de doelgroep te onbelangrijk om deze extra inspanningen te doen.
Je kan webpagina’s toetsen aan de W3C Accessibility checklist for websites
Toegankelijkheid zoekrobots
Een factor waar, gezien de huidige trend om zoekmachines zoals Google als internetportal te gebruiken, absoluut rekening mee moet worden gehouden. Het gebruik van bepaalde framestructuren en ( voor spiders onleesbare ) navigatietechnieken in een webpagina is daarom sterk af te raden. Tips en technieken daaromtrend vindt u in de rubrieken seo en zoekmachines.
: 
Het was een tijdje rustig toen alleen IE de markt bezat. Firefox werd groter en nu zijn we weer in hetzelfde straatje beland. Het belangrijkste is dat de verschillende betrokken partijen goede afspraken maken zodat verschil tussen browsers, os, en platform minimaal zijn of duidelijk afzonderlijk kunnen worden benaderd. In het begin (Netscape etc) was dit moeilijk of vroeg het veel tijd. IMO is dit nu veel beter op elkaar afgestemd, omdat ze ook weten dat de gebruiker de baas is.
Er is zoveel mogelijk met CSS dat de perfecte opmaak wel dichterbij komt. Zo de opmaak van de online NL belastingformulieren bijna 1 op 1 kopie van offline versie. Heel knap gedaan en werkt ook goed door de herkenbaarheid bij gebruikers.
Verder vind ik sIFR een aangename aanvulling op website ontwikkeling. Erg gemakkelijk voor CMS/onderhoud en erg professioneel voor bezoeker.
Kijk uit dat je usability niet te ver doorvoert. Dan krijg je een site als useit.com, de site van usability guru Jakob Nielsen. Erg makkelijk, maar afzichtelijk en archaisch in uiterlijk.