10 Bruikbaarheidstips voor webontwerpers
Eenvoudig gezegd, maakt bruikbaarheid uw website gemakkelijk voor uw bezoekers om de informatie te vinden die ze nodig hebben wanneer ze het nodig hebben .
Een veel voorkomende misvatting over bruikbaarheid bij webbedrijven is dat bruikbaarheid duur is. Ja, er zijn multinationale bedrijven die duizenden dollars uitgeven aan bruikbaarheidstests en onderzoek, maar voor een dagelijks bedrijf is bruikbaarheid haalbaar zonder de kennis van usability-experts of zonder dure apparatuur om te testen .
Webontwerpers hebben het nog eenvoudiger om te doen, alleen door bruikbare artikelen te lezen, kunnen ze een redelijk goede kennis opbouwen over de basisprincipes van bruikbaarheid en hoe ze deze op een website kunnen implementeren.
1. Voeg een Tagline toe
Een slogan is een verklaring of een motto die de bedrijfsfilosofie en missie van een bedrijf vertegenwoordigt, of in ons geval een website. Het zou het meest voor de hand liggende element op de voorpagina van een website moeten zijn en het zou de website in één zin duidelijk moeten beschrijven.
Statistieken tonen aan dat een website slechts 8 seconden heeft om de aandacht van een bezoeker te trekken zodat ze de site verder kunnen bekijken. Zonder een duidelijke slogan zou een website moeite hebben bezoekers lang genoeg te houden om door de binnenpagina's te bladeren.
2. Implementeer Site Search
Net als bij taglines, is het zoeken naar sites een zeer belangrijk element op een website. Wanneer gebruikers iets zoeken, zoeken ze meestal naar een tekstveld waarin ze hun zoekterm kunnen invoeren.
Volgens Jacob Nielsen's tips voor bruikbaarheid van het web, maak dit zoekvak 27 tekens breed zodat de tekst duidelijk zichtbaar en gemakkelijk te gebruiken is. Plaats het zoektekstveld bovenaan uw webpagina , omdat gebruikers meestal een website zoeken op basis van het F-patroon , dat wil zeggen van linksboven naar rechtsonder.
Voeg een zoekknop toe en geef duidelijk de zoektekst op, gebruik geen tekst zoals Ga of Verzenden , omdat deze uitdrukkingen de bezoekers van uw website misleiden.
3. Gebruik geen uitgebreide grafische afbeeldingen
Onrechtmatig gebruik van ontwerpelementen en afbeeldingen zijn altijd slecht voor een website, ze misleiden de bezoekers van de site. Alleen ontwerpen om de webpagina te verbeteren, niet alleen om deze te versieren. Vanuit het oogpunt van bruikbaarheid is minder altijd meer.
4. Gebruik plattegronden
Sitekaarten zijn een relatief nieuwe website-functie die de navigatie van webpagina's en ook zoekmachine-optimalisatie (SEO) verbetert. Sitekaarten zijn in essentie een structurele weergave van de pagina's en architectuur van een website. Het kan een document in elke vorm zijn of een webpagina die de pagina's op een website weergeeft, meestal op hiërarchische wijze georganiseerd.
Onlangs zijn zoekmachines zoals Google, Yahoo en MSN gestart met het aanbieden van een Sitemap-protocol dat vergelijkbaar is met de sitemappagina van een website, maar de gegevens zijn geordend in XML-indeling. Er zijn Sitemap XML-generators die deze documenten maken voor een specifieke URL.
5. Breek de workflow niet
Onder workflow verstaan we elke bewerking die een gebruiker op een website uitvoert . Bijvoorbeeld het invullen van een formulier, registreren op een website, bladercategorieën, archieven, etc. Breek deze workflows niet, laat de gebruiker elke bewerking annuleren. Door de gebruiker niet toe te staan een bewerking te annuleren, dwingen we ze om het af te maken, zelfs als ze het niet willen.
Niet elke bewerking op een website is voor de hand liggend voor gebruikers, begeleid hen door de specifieke workflow door beschrijvende tips te gebruiken. (bijvoorbeeld bij het invullen van een formulier). Javascript-koppelingen verbreken meestal de werkstroom, dus het wordt niet aanbevolen om ze op uw website te gebruiken.
Een andere fout is het niet veranderen van de kleur van bezochte links , dit resulteert in het doorbreken van het navigatieontwerp. Laat gebruikers weten waar ze zijn geweest en waar ze zijn op een website.
6. Creëer gemakkelijk scanbare webpagina's
Makkelijk te lezen webpagina's spelen een belangrijke rol bij het behouden van de loyaliteit van bezoekers, ze op uw site te houden en uw inhoud te lezen. Bruikbaarheidstests tonen aan dat de meeste gebruikers geen webpagina's lezen, ze scannen , op zoek zijn naar titels, vetgedrukte, benadrukte tekst of lijsten.
Oogzoekende onderzoeken uitgevoerd door Jakob Nielsen tonen aan dat gebruikers inhoud lezen die lijkt op een F-vorm, wat betekent dat het lezen begint linksboven op de webpagina, daarna gaat het weer een beetje naar beneden, beginnend vanaf links.
Nielsen vermeldt ook de implicaties van dit leespatroon:
- Gebruikers lezen de inhoud van een webpagina niet woord voor woord, ze extraheren belangrijke paragrafen, vetgedrukte tekst, enz.
- De eerste twee alinea's zijn essentieel op een webpagina. Deze moeten de belangrijkste informatie bevatten waarnaar uw bezoekers op zoek zijn.
- Subkoppen en lijsten vallen op tegen de gewone alinea's. Gebruik deze elementen om gebruikers op belangrijke informatie te wijzen.
Een belangrijke methode die we kunnen leren van traditionele gedrukte kranten is dat de journalisten een pakkende kop bedachten en een pakkende eerste alinea om lezers het hele artikel te laten lezen. Ze organiseren de inhoud in een omgekeerd piramide-formaat , stel je een omgekeerde piramide voor. De brede basis vertegenwoordigt de belangrijkste informatie in het hele artikel en de smalle punt vertegenwoordigt de minst belangrijke informatie.
We kunnen dit formaat gebruiken om webinhoud te organiseren door de belangrijkste stukken bovenaan en de minst belangrijke bovenaan te plaatsen , maar hoe weten we welke informatie belangrijk is en welke niet? Met de hulp van nieuws waarden .
7. Ontwerp geen misleidende gebruikersinterfacebedieningen
Met gebruikersinterface (UI) -bedieningselementen bedoelen we webpagina-elementen, componenten en widgets waarmee een gebruiker kan communiceren (bijvoorbeeld een knop, vervolgkeuzelijst).
Ontwerp geen grafische elementen die op een knop lijken, maar dat niet is . We zien vaak tekst die onderstreept is en eruit ziet als links, maar die niet kan worden aangeklikt.
Door niet de actie uit te voeren die de gebruikers verwachtten, zouden ze denken dat de site kapot is en uiteindelijk verlaten. Een andere belangrijke bruikbaarheidstip met betrekking tot UI-besturingselementen is consistentie: zorg ervoor dat uw UI-besturingselementen consistent zijn .
Yahoo , zoals de bovenstaande afbeelding ook laat zien, is een goed voorbeeld van consistent UI-besturingsontwerp. Elk tabblad op de pagina ziet eruit en gedraagt zich hetzelfde, elke link is onderstreept met de muis over, elke knop ziet er hetzelfde uit, etc.
8. Geef zinvolle feedback
Zinvolle feedback is essentieel voor een website. Dit is het communicatiekanaal tussen de site en de gebruikers, met behulp van feedback laten we de gebruikers weten wat er op de site gebeurt. In geval van een fout op uw webpagina, niet alleen afdrukken Fout opgetreden , in plaats daarvan schrijven zinvolle foutmeldingen die de gebruiker vertellen wat er mis ging en welke acties kunnen uitvoeren vanaf daar.
Feedback werkt op beide manieren . Wanneer een gebruiker een formulier invult, geven ze in feite feedback. Zorg ervoor dat de gebruikers niet tweemaal dezelfde informatie hoeven in te vullen. Als een gebruiker zich bijvoorbeeld op een website heeft geregistreerd en op een bepaald moment een formulier moet invullen, vraag dan niet naar zijn naam of andere informatie die hij al heeft verstrekt, omdat deze gegevens al ergens in een bestand of database voorkomen. Door simpelweg deze gegevens automatisch te krijgen, vereenvoudigen we het hele proces.
9. Gebruik Javascript niet te veel
Met de komst van Javascript en de AJAX-techniek kunnen webontwerpers en ontwikkelaars responsieve, transparante websites maken, maar net als bij alle nieuwe technologieën zijn er kosten aan verbonden. In ons geval zijn de kosten niet consistent met de browser. Niet elke gebruiker heeft een up-to-date webbrowser. Ze hebben mogelijk ook standaard geen Javascript ingeschakeld.
Door Javascript op een website uitgebreid te gebruiken, blokkeren we deze gebruikers. Gebruik in plaats daarvan onopvallend Javascript en sierlijke degradatie .
10. Vermijd CAPTCHA's
CAPTCHA staat voor Compleet Geautomatiseerde Publieke Turing-test om Computers en Mensen apart te vertellen. Zelfs de naam klinkt ingewikkeld. De meest algemene vorm van CAPTCHA is tekst die is ingesloten in een afbeelding en door bezoekers te testen kunnen we menselijke gebruikers scheiden van spam-bots.
Het probleem met CAPTCHA's is dat elke vorm van menselijke verificatiemethode een complex proces in de hersenen van de gebruiker triggert (bijvoorbeeld de vervormde tekst uitzoeken, twee cijfers toevoegen, enz.).
Een ander probleem met CAPTCHA's zijn de inconsistenties met betrekking tot verschillende culturen . Chinese symbolen bijvoorbeeld, cijfers verschillen van de meeste westerse letters en Arabische cijfers. Chinezen hebben het veel moeilijker om CAPTCHA 'enabled' online formulieren te gebruiken.
Overzicht
- Vermeld altijd een slogan die het meest voor de hand liggende element op een webpagina zou moeten zijn.
- Implementeer een zoekactie van 27 tekens en plaats deze boven op uw website.
- Gebruik geen uitgebreide grafische en ontwerpelementen.
- Voeg een sitemappagina toe en registreer een sitemap-XML-document in zoekmachines.
- Breek de workflow van een gebruiker niet. Sta toe dat elke actie indien nodig wordt geannuleerd.
- Maak gemakkelijk scanbare webinhoud en plaats de belangrijkste informatie bovenaan uw webpagina.
- Ontwerp geen grafische elementen die op een knop lijken, maar dat niet is.
- Presenteer zinvolle feedback en vergeet niet dat feedback beide kanten op werkt.
- Gebruik onopvallend Javascript en sierlijke degradatie .
- Vermijd CAPTCHA's, gebruik meer bruikbaar methoden in plaats daarvan.
Volg jij deze principes? Voeg hieronder uw feedback en extra tips toe.