Bekeken met een high resolutie scherm:
Slechte layout
Twee voorbeelden van een goede layout
|
|---|
Problemen met de vaste afmetingen
De meeste amateur site-ontwerpers werken met een vaste layout, meestal 800 pixels (bij het eerste voorbeeld hebben ze zeer safe gespeeld en een standaard-VGA-resolutie (640 pixels) gebruikt). Het probleem is dat de website getoont moet worden op talrijke schermresoluties, gaande van 800 * 600 tot 1600 * 1200. Zonder de nieuwe breedbeeldformaten te vergeten (16:9), dus een schermresolutie van bijvoorbeeld 1200 * 675. Wat het resultaat is, merk je op de eerste schermafruk rechts boven: slechts een deel van je display wordt gebruikt. OK, dodelijk is het niet, maar het zou beter kunnen. Soms wordt de tekstblok zelfs niet gecentreerd, waardoor je alle informatie links moet lezen, terwijl de andere helft van je scherm leeg blijft.
Het probleem van de losse layout
Het alternatief, werken met losse afmetingen (ik heb geen sites meer met losse layout) is geen mogelijke alternatief voor bedrijven, die een "corporate look" moeten hebben, en een dergelijke look houdt in dat er met vaste colommen gewerkt wordt. Een losse layout (loose formatting) geeft aan dat de site-bouwer een amateur is, de loose formatting is gelijk aan lousy formatting. En toch kan het beter, zoals de twee volgende voorbeelden tonen. Deze sites heb ik zelf ontworpen. Dezelfde basis-struktuur is in beide voorbeelden aanwezig.
Alternatieven
Een mogelijkheid is je website in PDF te publiceren. Dit heeft als voordeel dat de mensen elementen uit je site niet kunnen gebruiken (PDF is namelijk een outputformaat). Er zijn ook een paar nadelen: moeilijke navigatie door de site (geen automatisch door PHP-gegenereerde link balk), geen interface met de server (formulier-afhandeling), geen dynamische content (onMouse Over er dergelijke), grotere bestanden, tragere display. Een site in PDF is aanvaardbaar voor volkomen statische documenten (wetteksten en dergelijke)
Bij de twee sites die aangehaald werden wordt er gewerkt met een vaste breedte voor de navigatiebalk links (zodat die "vastgezet" kan worden alsof de site ontworpen werd met frames). De rest van de pagina wordt ofwel vloeiend ingevuld (overgebleven breedte) ofwel met een vaste breedte ingevuld (tekst van 850pixels). Het valt minder op dat de volledige schermbreedte niet gebruikt wordt omdat de hoofding doorloopt over de volledige beschikbare breedte.
Het is natuurlijk ook mogelijk verschillende layouts toe te passen naargelang het aantal pixels. Dit is bijna niet meer te doen vanwege het aantal afwijkende formaten. Voor een site dat niet over dynamisch gegenereerde pagina's kan beschikken (bijvoorbeeld PHP) is het een extra werklast, terwijl CSS juist bedoelt werd om de inhoud (HTML) van de formatering (CSS) te scheiden, zodat eenzelfde formatering over de volledige site toegepast kon worden.
Gekozen layout
Het eerste wat de bezoeker van je site opmerkt is de algemene layout (nog voor de tekst gelezen wordt). Een degelijke layout straalt professionaliteit uit en je hebt minder kans dat de bezoeker de site zal verlaten nog voor hij iets gelezen heeft. Bezoekers naar je site lokken doe je met content (inhoud, zodat de zoekmachines iets te eten hebben), ze op je site houden doe je in de eerste plaats door de layout (en ook door ervoor te zorgen dat de site zichtbaar is in minder dan 10 seconden).
Ik hou het gedrag van mijn bezoekers goed in de gaten. Eén van mijn sites heeft zowel geformateerde als ongeformateerde pagina's (de site bevat honderden pagina's en ik kan slechts een paar pagina's per dag omzetten). Als de landingspage (de pagina waarop ze als eerst terechtkomen via zoekrobotten) een ongeformateerde pagina is dan heb ik drie keer meer kans dat ze de site verlaten zonder de rest bekeken te hebben.
Ik zou je voorstellen: bekijk de twee laatste sites en gebruik ze als voorbeeld.
|