Verzadiging in webontwerp
In de loop der jaren zijn webontwerpen en -lay-outs in complexiteit toegenomen. Maar terwijl ons werk steeds gepolijst en interactiever wordt, en zich verwijdert van de statische boxy-indelingen die de jaren 90 domineerden, is het centrale doel niet veranderd.
Zichtbaarheid is net zo belangrijk voor ontwerpers als altijd. Het gaat om ons vermogen om de aandacht van de gebruiker te richten op de betekenisvolle inhoud die helpt om goederen te verkopen en abonnees aan te moedigen, en het helpt websites om regelmatige lezers te krijgen.
Met mensen die steeds meer voordeel halen uit kant-en-klare oplossingen, is het belangrijk om websites net voldoende onderscheid en persoonlijkheid te geven om de interesse van gebruikers te vergroten.
Het doel van een website is immers om uniek te zijn, niet om anderen te volgen of om een bruikbare maar toch generieke en levenloze lay-out aan te bieden. Laten we met dit in gedachten eens kijken hoe de dwang om bepaalde ontwerpconventies en -patronen te veel te gebruiken, gebruikers op een positieve of negatieve manier zou kunnen beïnvloeden.
Verzadiging en sensibilisatie
Laten we om te beginnen eens kijken naar de twee kernvariabelen op het werk. Verzadiging, niet te verwarren met de kleurgerelateerde term, verwijst naar de alomtegenwoordigheid van bepaalde hulpmiddelen, technieken of ontwerpimplementaties op internet. Bekijk bijvoorbeeld hoe wijdverspreide Google-advertenties tegenwoordig zijn en hoe sommige ontwerpers deze op hun webpagina's verpakken.
Sensitisatie verwijst daarentegen naar de mate waarin een gebruiker wordt beïnvloed door blootstelling aan gereedschap, techniek of implementatie. We zouden kunnen zeggen dat we zo gewend zijn aan het online zien van advertenties die we hebben aangepast om ze te filteren als irrelevante achtergrondruis, en ze soms fysiek te filteren.
We zien steeds meer intrusieve advertenties die animatie, geluid en levendige kleuren gebruiken.
Hoewel sommige implementaties, zoals advertenties, de waarde van inhoud zouden kunnen aantasten, kunnen andere van groot nut zijn bij herhaaldelijk en consistent gebruik, zoals beeldminiaturen in portefeuilles. Omdat zowel verzadiging als desensibilisatie zowel goed als slecht kunnen zijn, is het essentiële probleem waarmee ontwerpers worden geconfronteerd, uitzoeken hoe en wanneer conventies moeten worden gevolgd.
Onze industrie vertrouwt zwaar op conventies. Als we geen CMS of sjabloon gebruiken, gebruiken we frameworks en inspiratiesites. Vertrouwen op ontwerpconventies zou kunnen voortkomen uit de angst dat als men culturele verschuivingen en trends niet volgt, deze als verouderd worden beschouwd of dat hun begrip van bruikbaarheid in twijfel wordt getrokken. Maar dit is verre van de waarheid.
Hoewel het dupliceren van ontwerpen of het gebruik van generieke conventies eenvoudiger kan zijn, beperkt het iemands potentieel om contact te maken met gebruikers op een emotioneel niveau, wat niet lichtvaardig moet worden opgevat.
Met zoveel frameworks en CMS-engines is het een wonder dat we alles moeten bouwen.
Laten we eens kijken naar de voordelen die conventies kunnen bieden voor een webpagina en enkele belangrijke valkuilen analyseren die ertoe kunnen leiden dat u een bepaalde lay-out kiest of een functie opnieuw bekijkt.
We zullen ook enkele praktische oplossingen verkennen om te voorkomen dat uw website eruitziet en aanvoelt als de miljoenen lay-outs die geen echt uniek verkoopvoorstel (USP) of relevantie hebben.
De goede kant van verzadiging
Eén primaire rechtvaardiging voor het gebruik van verzadigde elementen in een ontwerp is de herkenning die het gebruikers biedt. Trends en patronen bieden niet alleen eenvoudige oplossingen voor functies die we willen implementeren (zoals navigatiemenu's), maar ze bieden duidelijke voordelen voor gebruik omdat ze gebruikers geruststellen met vertrouwde referentiepunten op de pagina.
Navigatiesystemen worden steeds complexer, maar ze kunnen ook behoorlijk elegant zijn.
Verzadiging kan educatieve waarde toevoegen aan een ervaring. Door conventies voor gebruikers te bieden, vermindert verzadiging de leercurve voor een website in de loop van de tijd.
Overweeg hoe we zijn gewend geraakt aan het vervolgkeuzemenu; als je deze tool nog nooit had gezien, had je je misschien niet gerealiseerd dat het zweven erover een secundaire lijst met items zou uitrollen. Dergelijke algemene componenten hebben mogelijk minder empathische waarde of uniekheid, maar ze helpen gebruikers om hun taken snel te volbrengen.
Mysterie-vlees navigatie levert problemen op voor gebruikers. Bekendheid moet aan de esthetiek voorafgaan.
We hebben de neiging om vanzelfsprekende dingen te doen die we elke dag zien. Hoe vaak, bijvoorbeeld, beschouw je de technologie achter verkeerslichten? Dit fenomeen kan ook worden toegepast op webontwerp.
Naarmate het verzadigingsniveau van een trend toeneemt, raken we meer vertrouwd met zijn functie en hoe deze ons beïnvloedt. Bijgevolg kunnen we het mentaal negeren totdat we het moeten gebruiken. Het gevaar hiervan is 'zombie browsing', wat we later zullen bespreken.
Gebruikers hebben de neiging zich uitsluitend op inhoud te richten en missen de boodschap van het ontwerp.
Stabiliteit is een ander veelgebruikt effect van ontwerpconventies. Wanneer iets keer op keer is geïmplementeerd, heeft het waarschijnlijk verschillende iteraties van testen, analyse en verbetering doorgemaakt en neemt het dus in waarde toe.
Omdat de effectiviteit van conventies zoals het vervolgkeuzemenu uitgebreid is onderzocht, kunnen we ook gebruiksscenario's maken om te bepalen of en hoe deze geschikt zijn voor een bepaalde lay-out.
We weten dat gebruikers verwachten teruggestuurd te worden naar een startpagina wanneer ze op een logo klikken.
De slechte kant van verzadiging
Hoewel al deze punten laten zien dat saturatie voordelig kan zijn, zoals bij elk aspect van het ontwerp, is er een keerzijde die je twee keer moet nadenken voordat je op de muziekkar springt. De eerste van deze problemen is misbruik.
Voor degenen onder u die zich het Web 2.0-ontwerptijdperk herinneren, toen alles glanzend en afgeschuind was, was het web overspoeld met zinloze ontwerpen, zowel professioneel als persoonlijk. Iedereen kopieerde wat ze dachten dat populair was, en dus werd de trend zo gewoon dat de waarde ervan verloren ging in een zee van klonen.
Het designtijdperk van Web 2.0 liep uit de hand en hierdoor kreeg lay-outinnovatie te lijden.
Naast het misbruik van saturatie, is een andere hindernis de onnadenkendheid die soms verzadiging omringt. Wanneer we een functie zoals een navigatiemenu implementeren, moeten bezoekers de vele elementen ervan op de pagina herkennen.
Maar wat gebeurt er als de tool niet werkt zoals verwacht? In het begin lijkt het misschien triviaal, maar trends beperken ons vermogen om te innoveren en veronderstellingen van gebruikers kunnen de voortgang van het web belemmeren.
Gebruikers verwachten een actie bij het klikken op een knop, dus de functie moet reactief zijn.
Naast deze factoren is een van de grootste argumenten tegen sjablonen en verzadigde functies dat ze niet gericht zijn op de behoeften van een specifiek publiek.
Een van de belangrijkste kenmerken van een handgemaakte website is dat deze (hopelijk) is gebouwd met de behoeften van de bezoeker als kern. Hoewel websites weg kunnen komen met een generiek ogende lay-out, zullen ontwerpen die prachtig zijn gemaakt de waarde van de website vergroten en de inhoud verrijken of aanvullen.
Je kunt duidelijk zien dat deze website is gebouwd voor zijn doelgroep: kinderen.
Het laatste probleem is de invloed die verzadiging heeft op bezoekers. Wanneer lay-outs routinematig worden, kunnen gebruikers eenvoudig nieuwe componenten missen waarvan zij veronderstellen dat ze bestonden tijdens hun vorige bezoek.
Deze psychologische toestand, bekend als 'zombie browsing', manifesteert zich wanneer gebruikers objecten niet zien die ze onbewust of bewust irrelevant achten. Dit is vooral problematisch in advertenties; veel gebruikers blokkeren advertenties met browserextensies of kijken ernaar, zelfs als de advertenties nuttig kunnen zijn.
Hoewel filteropties nuttig kunnen zijn voor gebruikers, kunnen ze het ook moeilijker maken om te herkennen.
Oplossingen voor ontwerpers
De eerste oplossing, die nogal voor de hand lijkt te liggen, is om te innoveren, in plaats van te kopiëren wat er bestaat.
In sommige gevallen is de beste manier om eenvoudigweg het wiel niet opnieuw uit te vinden; de beschikbaarheid van inspiratiegalerijen, knip-en-plak-scripts, CMS-engines en lay-out-sjablonen stimuleren vaak de voorkeur voor een snelle doorloop, in plaats van handgemaakte, originele afwerking.
Zelfs als u een vooraf gebouwde oplossing gebruikt, kunt u deze nog steeds verbeteren of personaliseren voor uw publiek.
WordPress kan (en moet) sterk worden aangepast aan de identiteit van de persoon of het bedrijf.
De tweede oplossing is om te bepalen of een generieke functie daadwerkelijk een bepaald doel dient. Het idee om te ontwerpen met doel bestaat al vele jaren, en hoewel gebruikers blijven vragen om hogere niveaus van interactiviteit en controle op een website (een grote afwijking van het statische ontwerptijdperk), zouden we een element op een website alleen moeten opnemen als het bruikbaarheid weegt zwaarder dan de kosten van het feit dat het er is; het mag bijvoorbeeld niet de aandacht van andere inhoud stelen. Elk object moet een nuttig doel dienen, zelfs kleine elementen zoals "Skip" -links, die helpen bij schermlezers.
Het verwijderen van overbodige functies blijft populair omdat we allemaal houden van een schone interface.
Eenvoud en het doel om de aandacht van de bezoeker te richten op nuttige inhoud is de kern van goed ontwerp. Om oververzadiging te voorkomen, moeten we voorzichtig zijn bij het toevoegen van objecten aan de pagina (en vooral niet herhaaldelijk doen) en niet te enthousiast worden met het laden van de functie.
We weten dat gebruikers overbelasten ze zullen dwingen harder te werken om de pagina te doorlopen; en hoe meer afleidingen er zijn, hoe groter het risico dat belangrijke inhoud wordt gemist. Ontwerpers moeten gevoelig zijn voor gebruikersbehoeften, de leercurve verminderen en de zichtbaarheid van inhoud maximaliseren.
Goede en slechte voorbeelden
In het eerste voorbeeld hieronder is veel energie duidelijk gegaan in het balanceren van conventies en originaliteit. Merk op hoe de lay-out met vaste breedte, het gecentreerde en goed zichtbare logo en de vertrouwde elementen samenkomen op de pagina zonder de gebruiker te overbelasten. Terwijl scrollen vereist is, biedt de interface een unieke draai, met zijn subtiele zweefteken, typografische keuzes en zorgvuldig georganiseerde profielfoto's.
Het enige echte nadeel is dat niet-slimme gebruikers de visuele pictogrammen mogelijk niet gemakkelijk kunnen identificeren. Mysterie-vlees navigatie is altijd een groot risico.
De lay-out voor dit tweede voorbeeld is misschien minder uniek dan de eerste. En toch zorgt het nog steeds voor een goede ervaring als resultaat van de korte leercurve voor gebruikersinteractie: het logo en het navigatiemenu zijn waar u verwacht dat ze zijn; de website volgt de conventionele voorwaarden voor portfolio-elementen (hoewel in dit geval de schermruimte nogal verspild is); en de opvallende infographics duwen gebruikers om over de pagina te scrollen.
De alternatieve schuifbalk is nogal interessant. Veel ontwerpers lijken er een te adopteren in een poging meer controle te krijgen over de esthetiek van de website. Maar vanwege de kleinere klikbare regio hier, kan deze lay-out erg ontoegankelijk zijn voor gebruikers met een motorisch tekort en dit druist in tegen de algemene trend van het gebruik van de standaardinstelling van de browser. Het komt neer op een antipatroon en het is een goed voorbeeld van een ongeschikte ontwerpkeuze.
Deze laatste website is een echt 'wat niet te doen'-voorbeeld. Zoals u kunt zien, terwijl het probeert gebruikers gerust te stellen, is de startpagina van het MSN niet origineel en wordt de inhoud niet duidelijk weergegeven.
Het logo, het zoekvak en pictogramkoppelingen worden acceptabel weergegeven, maar naarmate de gebruiker omlaag schuift, wordt de pagina steeds rommeliger als gevolg van de strak ingepakte ontwerpconventies.
Er zijn veel te veel navigatiemenukeuzes, wat tot verwarring leidt; misschien was een vervolgkeuzemenu voldoende. Bovendien neemt de advertentie een zesde deel van de pagina in beslag, waardoor de aandacht van de gebruiker wordt gekaapt. Verder, terwijl we naar beneden gaan, is de pagina bezaaid met diavoorstellingen, blokken inhoud en honderden overvolle links. Dit is op zijn best oververzadiging: teveel wordt voorzien van te weinig originaliteit of doel.
Verzadiging en een balans tussen conventie en originaliteit zullen altijd grotendeels terug te vinden zijn in het ontwerp.
Terwijl het web blijft evolueren, zullen nieuwe standaarden en conventies zichzelf presenteren. Hoewel we willen vermijden om ontwerpen te maken die zo verschillend zijn dat ze gebruikers verwarren, moeten we een element van uniekheid in ons werk houden om te voorkomen dat onze bezoekers worden gehekeld.
Elke website heeft zijn eigen uitdagingen en behoeften, en de verantwoordelijkheid van de ontwerper zal zijn om terug te duwen tegen de generieke "anti-ervaring" van sjablonen en wat innovatie terug te brengen in hun werk.
Exclusief geschreven voor WDD door Alexander Dawson. Hij is een freelance webdesigner, auteur en recreatieve softwareontwikkelaar die is gespecialiseerd in webstandaarden, toegankelijkheid en UX-ontwerp. Evenals het runnen van een bedrijf genaamd HiTechy en schrijven, hij besteedt tijd aan tjilpen , SitePoint-forums en andere plaatsen, die mensen in nood helpen. "]
Wat denk je van verzadiging in webdesign en hoe ga je om met deze uitdagingen op je eigen websites? Deel alsjeblieft je gedachten hieronder ...