De nadruk in een webpaginaontwerp creëert een gebied of object dat het brandpunt is van de pagina. Het is een manier om één element te laten opvallen in het ontwerp. Het brandpunt kan groter zijn dan andere elementen van het ontwerp of felgekleurd zijn - beide hebben de neiging om het oog te trekken. Wanneer u een webpagina ontwerpt, kunt u de nadruk leggen door een woord of woordgroep te kiezen en een kleur, lettertype of grootte toe te wijzen waardoor het opvalt, maar er zijn veel andere manieren om de nadruk in uw ontwerp te leggen.
Gebruik van de nadruk in het ontwerp
Een van de grootste fouten die webontwerpers kunnen maken, is proberen alles in het ontwerp te laten opvallen. Wanneer alles dezelfde nadruk heeft, lijkt het ontwerp druk en verwarrend of slechter - saai en onaantrekkelijk. Als u een knooppunt in een webontwerp wilt maken, mag u het gebruik van niet over het hoofd zien:
- lijnen: Creëer de nadruk door contrast. Als meerdere elementen horizontaal zijn, wordt één verticaal element het focuspunt.
- Kleur: Als de meeste elementen in het ontwerp donker of gedempt zijn, trekt elk object met kleur het oog.
- vormen: Wanneer de meeste vormen onregelmatig zijn, valt een geometrische vorm op.
- Nabijheid: Wanneer verschillende items zijn gegroepeerd en één is gescheiden van de groep, gaat het oog naar het afzonderlijke item.
- Plaatsing: Hoewel er uitzonderingen zijn, trekt een element in het midden van een ontwerp meestal de aandacht.
- Gewicht: Een zwaar element trekt de aandacht van de kijker.
- Herhaling: Wanneer een eenvoudig grafisch naar type element wordt herhaald, volgt het oog het herhaalde element naar het brandpunt.
- Contrast: Naast contrasten die worden gecreëerd door kleur en lijnen, kan het contrast worden gegenereerd door de grootte, textuur of lettertypewijzigingen. De wijziging zorgt ervoor dat het focuselement of de nadruk opvalt.
- Witte ruimte: Een element omgeven door witte (of lege) ruimte wordt het brandpunt.
Hiërarchie in webontwerpen
Hiërarchie is de visuele rangschikking van ontwerpelementen die het belang van de grootte aangeven. Het grootste element is het belangrijkste; de minder belangrijke elementen zijn kleiner. Richt u op het creëren van een visuele hiërarchie in uw webontwerpen. Als u hebt gewerkt aan het maken van een semantische stroom naar uw HTML-markup, is dit eenvoudig omdat uw webpagina al een hiërarchie heeft. Het enige dat u hoeft te doen, is het benadrukken van het juiste element - zoals een H1-kop - voor de meeste nadruk.
Samen met de hiërarchie in markeringen, moet u herkennen dat het oog van een bezoeker een webpagina in een Z-patroon bekijkt die begint in de linkerbovenhoek van het scherm. Dat maakt de linkerbovenhoek van de pagina een goede plek voor een belangrijk item, zoals een bedrijfslogo. De rechterbovenhoek is de op een na beste positie voor belangrijke informatie.
Hoe de nadruk te leggen op webontwerpen
De nadruk in webontwerp kan op vele manieren worden geïmplementeerd:
- Gebruik semantische markeringen om de nadruk te leggen, zelfs zonder stijlen.
- Wijzig de grootte van lettertypen of afbeeldingen om deze in het ontwerp te benadrukken of te benadrukken.
- Gebruik contrasterende kleuren om de nadruk te leggen.
- Aantal telt. Een groot woord op de pagina of het scherm krijgt onmiddellijk aandacht.
- Omring het brandpunt met witte ruimte.
- Herhaal een woord of afbeelding om de aandacht te vestigen.
Waar past de achterstelling?
Ondergeschiktheid treedt op wanneer u andere elementen in een ontwerp verzacht om het brandpunt te laten knallen. Een voorbeeld is een felgekleurde afbeelding geplaatst tegen een zwart-witte achtergrondfoto. Hetzelfde effect treedt op wanneer u gedempte kleuren of kleuren gebruikt die opgaan in de achtergrond achter het focuspunt, waardoor deze opvalt.
