När det gäller att utforma en verkligt intuitiv, lyhörd och sammanhängande webbplats som också är unik och intressant, känns det ofta som om det är svårt att förena de två uppsättningarna av prioriteringar. Men i själva verket är ingenting längre från sanningen: det finns bara några grundläggande idéer som behöver användas för att enkelt kunna göra de bästa valen i dina mönster.

Det viktigaste av dessa begrepp är att vackra, användbara konstruktioner inte är svåra att göra när UX har prioritet, och designen är anpassad för att passa den. Tvärtom dikterar arten av användarupplevelse att det finns vissa oflexibla regler, medan designen är nästan oändlig flexibel. När du väl har läst hur du ska anpassa dina mönster, borde du vara väl på väg för att slå en strid mot en fredsfördrag.

Förutse användarfel minska användarirritation

Tänk alltid på vad som kan hända om användaren vilstra på din webbsida. Felmeddelanden bör inte döljas i teknisk jargong, utan snarare bör ge en förklaring av vad problemet kan vara och, om tillämpligt, var de ska gå för att få hjälp. Balansera dessa överväganden med vad som kan förbättras på ditt slut. Oavsett hur vacker en webbplats kan vara, om det tar för lång tid att ladda, är det inte värt ansträngningen. Experter säger att om en webbsida tar över 3 sekunder att ladda måste den förenklas.

Håll former så korta och ointimierande som möjligt. Om informationen inte är nödvändig, fråga inte det. Om du inte redan, överväga att erbjuda en valfri inloggning via Facebook eller Twitter; webbplatser som erbjuder det här är ofta att deras omvandlingsfrekvenser stiger, eftersom användaren finner det bekvämare och det är därför mer sannolikt att ta sig tid att registrera sig. Se till att resten av din webbplats har en integrerad social media-närvaro, som inte stämmer överens med eller övermanar din design, men är också lätt identifierbar, som Arbeta på spel hemsida. Små tillägg som detta är vad som lägger till en kumulativ effektivisering av användarupplevelsen.

För detta ändamål är det viktigt att komma ihåg några standarder som borde förbli ganska konsekventa över vilken typ av webbplats som helst.

Underhålla webbstandarder

Vissa vanliga element på en webbplats, som sidfot eller en sökfält, kan aktivt drabbas av överdriven kreativitet. Medan det finns utrymme för originalitet i många av dessa delar är det viktigt att bibehålla dem i ungefär samma form som du ser på alla andra sidor, eftersom de är allestädes närvarande för att användarna kan förvänta sig att de presenteras på ett visst sätt . Följ dessa riktlinjer:

  • Se till att klickbara områden är omedelbart identifierbara (till exempel länkarna på denna sajt ) och är tillräckligt stora för att enkelt aktiveras;
  • Bryta upp textblock med bilder och annan visuell stimulans;
  • Använda sig av ströbröd när tillämpbart;
  • Försök att undvika att sprida samma artikel eller produktsökning över flera sidor.
  • Gör kontaktinformation, FAQ, en sökfält och andra standardfunktioner som är lätta att hitta och använda.

Fastän Grip Limited s Webbplatsen är iögonfallande och spännande, det är också otroligt förvirrande. Medan det finns en förklaring till hur man drar kolumnerna för att avslöja innehåll, är det förlorat i jumble av annan typografi. En traditionell meny är tillgänglig, men bara om du spionerar den lilla nedrullningen. Det är så cool design som vissa användare inte bryr sig om hur svårt det är att använda, men många andra skulle bli avstängda. Men om webbplatsen införde ovanstående förslag i sin design, kunde den fortfarande behålla sin coola faktor och ge en bra UX.

Till exempel, även om Komisk soda Webbplatsens andra designelement är ganska distraherande, användaren kan fortfarande enkelt hitta sökfältet. Det är märkning och positionen är tydlig att förvirring minimeras. Dessa små inlägg till användarförvirring är vad som gör hela skillnaden.

Var att dra linjen

Det finns andra UX-regler som kan böjas men inte brutna. Men vid vilken tidpunkt går en designer för långt? Navigationselement är ett bra exempel att arbeta med, eftersom varje webbplats har någon form av dem. Konventionellt är de ordnade på ett av två sätt:

  • Vågrätt längst upp på sidan Detta möjliggör ett rymligt utseende för korta listor;
  • Vertikalt längs vänster sida av en sida; detta arrangemang kan rymma längre listor.

Men det finns andra stilar och system för navigering som kan fungera om de används noga och eftertänksamt. Till exempel, den här portföljen har en navigeringslista som upptar huvuddelen av sidan, och varje ord är delvis dolt. Vidare förbli elementen inte stationära; De faller ner och separeras för att visa innehållet inom varje avsnitt. Alla dessa blomningar kan ha kombinerat för att bilda ett förvirrande system som snabbt skulle frustrera användaren. Emellertid undviker designen att vara problematisk på grund av att den är så enkel; orden är fortfarande läsbar; Drop-downs har så lite information att resten av navigeringslistan inte går förlorad. Sammantaget är det ett vågat annorlunda system som snävt undviker att vara problematisk.

På andra sidan av linjen är ett koncept som kallats mystery köttnavigering, i vilken designens estetiska överväganden överväger fullständigt användbarheten. I fallet med FlatPak hemsida, navigationen måste rullas över för att läsa vad det hänvisar till; en fruktansvärd användbarhet som aldrig ska emuleras.

Kännetecken mot funktionalitet

På många sätt verkar den verkliga striden i den nuvarande webbdesignen vara mellan färskt nya idéer som ger mindre intuitiv interaktion och stodgy gamla metoder som kanske inte är den bästa lösningen, men vad användarna är vana vid. Ett exempel på detta problem uppstår ofta när man ser på skeuomorf design. vilket är en stil som efterliknar föregångaren till ett objekt som gjordes i ett annat medium.

Den här typen av design sker hela tiden på nätet, från din skrivbordsräknare som ser ut och fungerar som sin verkliga motsvarighet, till knapparna på en webbplats som har en realistisk drop-shadow och bevel-effekt. Det är vettigt att en viss punkt, eftersom bekantskapen med dessa mönster gör att användarna känner sig omedelbart bekväma med att använda dem. Men de är inte nödvändigtvis den bästa lösningen eftersom de är otroligt begränsande.

Sammandrabbningen mellan dessa två prioriteringar kan illustreras av Apples realistiska "page turn" -teknologi, som används för digital läsning. Det är en tilltalande idé eftersom det gör upplevelsen lite mer som att vända fysiska, papperssidor, något som användare kan hitta bekvämt bekant. Men trots det snarare löjliga längder Företaget gick till för att skapa denna effekt, det förringar användarupplevelsen. Det tar bråkdelat längre att ladda, och det är en svårare rörelse att bläddra på sidan för att utföra det enkla trycket. En obehaglig rörelse kan skicka användaren på fel sätt.

Använd en klar konverteringstratt

Om du arbetar på en komplex webbplats med många navigeringsvägar är det väldigt viktigt att låta användaren flytta logiskt via webbplatsen och hålla dem informerade om var de finns i webbplatskartan som helhet. Det är här brödsmulor och andra navigationsenheter är till nytta. De förargade lilla standardlänkarna behöver inte vara anställda för att visa en användare som de redan har besökt. Det finns gott om andra mer attraktiva lösningar som ger samma effekt.

E-handelswebbplatser är vanligtvis de som får lambasted för sina illusionerade konverteringståg, men det finns gott om bra exempel där ute av vackert utformade, UX-optimerade webbbutiker. Ta till exempel Frukt av Loom webbplats, som har ett rent, vänligt gränssnitt som fortfarande är logiskt konstruerat. Det är inte ens resultatet av anpassad och komplicerad backendutveckling; webbplatsen skapades med hjälp av enkla Amazon e-handel programvara, att alla småföretag skulle kunna dra nytta av.

Beakta skanning och lägg till visuellt intresse

Tänk på att människor läser webbsidor på ett annat sätt än utskriftsmedia. Ögonspårningsstudier visa att webbanvändare skummer hela sidan (fokuserar först på innehåll i övre vänstra hörnet) och letar efter snygga element som rubriker, citat eller bilder. Därefter dyker de i sektioner som ser intressanta ut. Det är viktigt att designa för denna typ av tankegång och se till att du använder en visuell hierarki som styr användaren där du vill att dom ska gå.

De Triva Solo blogg har gott om innehåll, men det bibehåller ett rymligt, intressant utseende med hjälp av massor av vitt utrymme, stora bilder, ikoner och olika typsnitt. De stora, centrerade titlarna är särskilt användbara för att skanna tittare.

Poängen

Medan en webbplatsens estetik skapar ett första intryck, är funktionaliteten vad som ger användaren en bestående erfarenhet som de förhoppningsvis vill återvända till. Det finns ingen situation där överväganden om design och funktionalitet inte kan försonas. i själva verket är det samspelet mellan dessa två prioriteringar som slutar skapa alla de bästa, mest minnesvärda platserna på webben.

Kommer du någonsin att kompromissa användbarheten för estetik? Kan design vara bra utan användbarhet? Låt oss veta dina tankar i kommentarerna.

Utvalda bild / miniatyrbild, funktionell bild via Shutterstock.