Stedelijk Website-ontwerpen

Modern urbaan webdesign geïnspireerd door straten en skylines

Plaats een foto van nat asfalt onder straatlantaarns naast een zware, strak gezette koptekst, en de pagina voelt direct urbaan aan nog voordat er wordt gescrold. Urbaan webdesign werkt op die manier voor een architectenbureau én voor een streetwearlabel dat wil overkomen alsof het midden in het stadscentrum is ontstaan. Foto's van skylines alleen zijn echter niet genoeg, want bezoekers moeten nog steeds weten wat de locatie te bieden heeft en waar ze vervolgens naartoe moeten.

Signalen die grootstedelijk aandoen

Een sterk gevoel voor een plek ontstaat door een paar keuzes die op elke pagina terugkeren:

• Fotografie van echte omgevingen, zoals gevels, zebrapaden of een drukke marktstraat, vastgelegd in natuurlijk licht.
• Opvallende koppen boven eenvoudige bodytekst, zoals een uithangbord boven de mededelingen op een winkelruit.
• Een strak raster waarin foto's en tekstpanelen dezelfde lijnen delen, net zoals rijen ramen op een gebouw.
• Een kleurenpalet ontleend aan de straat, doorgaans betongrijs en asfaltzwart, aangevuld met één signaalkleur voor knoppen.

Die signaalkleur sluipt vaak door naar tussenkoppen en iconen totdat het palet onrustig oogt. Wanneer kleuren eenmaal centraal voor de site zijn vastgelegd, kan een streetwearlabel de accentkleur voor elke nieuwe collectie op één plek wijzigen. De officiële documentatie over Site Colors legt uit hoe Nicepage één kleurenschema toepast op alle pagina's.

Foto's die feiten verdringen

Een brede foto van een gebouw oogt geweldig, totdat deze het eerste scherm moet delen met een adres, openingstijden en een knop. Binnen urbaan webdesign lost typografie dit conflict meestal op. Een krachtig display-lettertype draagt de projectnaam, terwijl een rustiger lettertype datums en adressen ook onderweg goed leesbaar houdt. Nicepage slaat deze op als sitewijde typografiestijlen, zodat het eenmalig aanpassen van een kopgrootte direct op elke pagina wordt doorgevoerd.

Een architectenbureau kan fotografie de hoofdrol geven en bijschriften kort houden. Een muziekfestival doet het omgekeerde: data en ticketlinks krijgen voorrang, terwijl foto's de sfeer bepalen.

Schittering buiten op kleine schermen

Op een telefoon wordt een skyline-panorama bijgesneden tot één enkele toren; hero-afbeeldingen bovenaan de pagina werken daarom beter wanneer het hoofdonderwerp zich dicht bij het midden bevindt. Met de responsieve modi van Nicepage past u tekstgrootte, tussenruimtes en lay-out eenvoudig aan voor smallere schermen. Houd de foto van een locatie en het bijbehorende adres op hetzelfde scherm, zodat bezoekers niet heen en weer hoeven te scrollen.

In fel daglicht kunnen betongrijs en asfaltzwart op een telefoonscherm samenvloeien tot één donkere massa; knoppen hebben daarom meer contrast nodig dan het moodboard deed vermoeden. Laat de homepage vóór de livegang vijf seconden aan iemand zien en vraag wat de locatie inhoudt en waar men moet klikken. Blijven alleen de foto's hangen, dan heeft de lay-out nog een verbeterslag nodig.