\n Du kan skapa den mest h\u00e4ftiga designen i v\u00e4rlden och det kommer inte att lyckas om det inte tillfredsst\u00e4ller anv\u00e4ndbarheten.\n<\/p>\n
\n Allt fr\u00e5n en tandpetare till ett kommersiellt flygplan kr\u00e4ver anv\u00e4ndbarhet f\u00f6r att fungera och s\u00e4lja, annars \u00e4r dess design d\u00f6md. P\u00e5 liknande s\u00e4tt, i webbv\u00e4rlden kommer en term som kallas UX att spela n\u00e4r en webbplats anv\u00e4nds och betygs\u00e4tts.\n<\/p>\n
\n UX \u00e4r en f\u00f6rkortning f\u00f6r anv\u00e4ndarupplevelse en webbanv\u00e4ndare f\u00f6rv\u00e4rvar n\u00e4r de surfar p\u00e5 en webbplats och interagerar med dess element och funktioner. Om upplevelsen \u00e4r hackig och mals\u00f6kt, d\u00e5 \u00e4r webbplatsen ingenting genom att flyta skr\u00e4p p\u00e5 internet ingen kommer att bry sig om. UX kan p\u00e5 egen hand best\u00e4mma om en webbplats kan anv\u00e4ndas eller s\u00e4ljas, vilket g\u00f6r att den r\u00e4knas \u00e4r absolut n\u00f6dv\u00e4ndigt f\u00f6r designern. I den h\u00e4r artikeln kommer vi att dela med oss \u200b\u200bav 10 kardinalregler ang\u00e5ende anv\u00e4ndbarhet som varje webbdesigner m\u00e5ste k\u00e4nna till innan den tar webbplatsen till dess slutliga faser.\n<\/p>\n
\n Det finns en fin linje mellan UX och UI. \u00c4ven om du \u00e4r medveten om skillnaden, kanske du h\u00f6r det fr\u00e5n klienten p\u00e5 en eller annan punkt, men n\u00e4r det \u00e4r dags m\u00e5ste du kunna f\u00f6rklara skillnaden p\u00e5 b\u00e4sta m\u00f6jliga s\u00e4tt. Anv\u00e4ndargr\u00e4nssnitt definieras som det faktiska systemet medan User Experience definieras som det k\u00e4nslom\u00e4ssiga resultatet efter att ha interagerat med systemet.\n<\/p>\n
\n Microsoft Windows \u00e4r anv\u00e4ndargr\u00e4nssnittet medan den k\u00e4nslom\u00e4ssiga tillfredsst\u00e4llelsen efter att ha anv\u00e4nt det \u00e4r UX. Att blanda ihop de tv\u00e5 termerna kan inte bara skada ditt eget arbete utan ocks\u00e5 \u00f6verbelasta dig med n\u00e5got som helt inte \u00e4r ditt jobb.\n<\/p>\n
\n En bra designer kommer inte bara att k\u00e4nna till skillnaden utan ocks\u00e5 kunna f\u00f6rklara det f\u00f6r kunden n\u00e4r han f\u00f6resl\u00e5r en pitch f\u00f6r att presentera sitt arbete.\n<\/p>\n
\n Webbdesign \u00e4r mer \u00e4n vad som m\u00f6ter \u00f6gat. Allt fr\u00e5n de visuella detaljerna, produkten du anv\u00e4nder och de platser du bes\u00f6ker har UX skrivet \u00f6ver det hela. Att k\u00f6ra en trashig bil \u00e4r en d\u00e5lig upplevelse, medan det \u00e4r bra att l\u00e4tt \u00f6ppna en packad l\u00e5da. Offline UX-marknadsf\u00f6ring kan verka som en annan kl\u00e4nning men ursprungligen skuren fr\u00e5n samma tyg. \u00c4ven om det inte \u00e4r helt samma sak och inte kan motiveras med n\u00e5gra exempel, producerar UX-upplevelse i en materiell och immateriell plattform samma hormoner i din hj\u00e4rna. Till exempel uppt\u00e4ckte n\u00e5gon att m\u00e4nniskor prioriterar information fr\u00e5n v\u00e4nster till h\u00f6ger och element till v\u00e4nster tar mindre vertikalt utrymme och har lika stor visuell vikt.\n<\/p>\n
\n Under \u00e5r 2000 b\u00f6rjade trenden f\u00f6r\u00e4ndras och webbdesigners b\u00f6rjade placera navigeringsf\u00e4lt till den v\u00e4nstra panelen p\u00e5 webbsidan. Detta gjorde det m\u00f6jligt f\u00f6r anv\u00e4ndare att skanna inneh\u00e5ll snabbare och b\u00e4ttre, samtidigt som det gav st\u00f6rre exponering f\u00f6r webbplatsens inneh\u00e5ll. Som webbdesigner, med f\u00f6tterna i b\u00e5da medierna, kan du tr\u00e4na ditt sinne och ut\u00f6ka din kunskap f\u00f6r att bed\u00f6ma och producera projekt fr\u00e5n ett livligare perspektiv.\n<\/p>\n
\n Konst och vetenskap g\u00e5r hand i hand n\u00e4r det kommer till UX. Att ha en f\u00f6rfinad f\u00f6rst\u00e5else f\u00f6r deras band \u00e4r absolut n\u00f6dv\u00e4ndigt, s\u00e4rskilt under designprocessen. Vetenskapligt finns det ett probleml\u00f6sningsscenario d\u00e4r designern m\u00e5ste l\u00e4gga upp en f\u00e4rdplan och ta itu med problemen med en teoretisk l\u00f6sning. Till exempel \u00e4r en webbplats drastiskt l\u00e5g p\u00e5 sin f\u00f6rs\u00e4ljning. Designern kommer att f\u00f6resl\u00e5 att du uppdaterar webbplatsen, testar och fels\u00f6ker den som kommer att bli en l\u00f6sning. Det \u00e4r h\u00e4r konsten kliver in.\n<\/p>\n
\n Alla aspekter och element kommer att f\u00f6resl\u00e5s i l\u00f6sningen s\u00e5som f\u00e4rger, typsnitt, layout, text och visuellt inneh\u00e5ll f\u00f6r att g\u00f6ra webbplatsen tilltalande s\u00e5v\u00e4l estetiskt som funktionellt. Den kommer att uts\u00e4ttas f\u00f6r fler tester tills den lyckas framkalla det \u00f6nskade k\u00e4nslom\u00e4ssiga svaret fr\u00e5n anv\u00e4ndaren. Denna kanalisering av yttre beteende genom en vetenskaplig implementering \u00e4r det som g\u00f6r konst och vetenskap till ett udda men kraftfullt par.\n<\/p>\n
\n Det \u00e4r ingen hemlighet att designers hanterar kunder som vill att saker ska styras av deras b\u00f6cker. Detta skapar en labyrint som inte leder till n\u00e5gonstans eftersom m\u00e5nga saker kunden inte \u00e4r medveten om som bara designern vet. P\u00e5 samma s\u00e4tt \u00e4r designers ibland ben\u00e4gna att g\u00f6ra saker p\u00e5 sitt s\u00e4tt medan andra metoder ocks\u00e5 finns p\u00e5 bordet och kan fungera b\u00e4ttre.\n<\/p>\n
\n Att h\u00e5lla ett sindelat tillv\u00e4gag\u00e5ngss\u00e4tt som s\u00e5dant \u00e4r aldrig h\u00e4lsosamt n\u00e4r man designar en UX-rik webbdesign. En bra UX kan endast uppn\u00e5s fr\u00e5n ett m\u00e5lstyrt tillv\u00e4gag\u00e5ngss\u00e4tt som fokuserar p\u00e5 den b\u00e4sta tillg\u00e4ngliga l\u00f6sningen. En kund vill till exempel flytta l\u00e4nken med kundrekommendationer till den \u00f6vre sidan av sidan f\u00f6r att f\u00e5 mer exponering och bjuda in mer trafik. Problemet ligger dock inte i l\u00e4nkens placering, utan sj\u00e4lva platsl\u00e4nken d\u00e5 den inte lyckas attrahera trafik. D\u00e4rf\u00f6r kan du ocks\u00e5 fixa l\u00e4nken genom att g\u00f6ra den mer synlig d\u00e4r den \u00e4r ist\u00e4llet f\u00f6r att flytta den till en ny plats. B\u00e5da l\u00f6sningarna kan anv\u00e4ndas f\u00f6r att l\u00f6sa problemet och du m\u00e5ste h\u00e5lla alternativet \u00f6ppet. Detta kallas m\u00e5lstyrd design.\n<\/p>\n
\n Varum\u00e4rkesidentitet \u00e4r bland de prim\u00e4ra m\u00e5len bakom att bygga ett bra UX. Om UX g\u00f6r sitt avtryck f\u00f6r att tillfredsst\u00e4lla anv\u00e4ndarna, kommer det att spegla mycket mot varum\u00e4rket som gjorde denna upplevelse m\u00f6jlig. Det \u00e4r viktigt att du inte blir distraherad av att skapa en look som uppfyller kundens \u00f6nskem\u00e5l. En bra design som m\u00e5ste uppvisa den r\u00e4tta mixen av funktionalitet och funktioner som inte bara g\u00f6r anv\u00e4ndarens upplevelse till en njutning, utan ocks\u00e5 detaljerar den investering ett varum\u00e4rke har gjort f\u00f6r att g\u00f6ra den framg\u00e5ngsrik. Detta avg\u00f6r om anv\u00e4ndaren kommer att bes\u00f6ka webbplatsen igen.\n<\/p>\n
\n F\u00f6r att vara s\u00e4ker p\u00e5 att du har kundens perspektiv inb\u00e4ddat i designen, informera dem om varje drag och g\u00f6r eventuella n\u00f6dv\u00e4ndiga \u00e4ndringar som kan rymmas i designen. Det \u00e4r ocks\u00e5 viktigt att du \u00f6verv\u00e4ger den st\u00f6rre bilden samtidigt som du l\u00e4gger till klientinst\u00e4llningarna s\u00e5 att anv\u00e4ndarupplevelsen f\u00f6rblir op\u00e5verkad under processen.\n<\/p>\n
\n Bli aldrig ett offer f\u00f6r din egen fantasi. Eftersom du har lite av en kreativ frihet n\u00e4r du designar en webbplats, \u00e4r det avg\u00f6rande att du inte missbrukar den. I just det h\u00e4r fallet har du kundens riktlinjer och dina preferenser djupt f\u00f6rankrade, men gl\u00f6mde helt bort anv\u00e4ndarens perspektiv. Som designer \u00e4r det viktigt att du aldrig l\u00e5ter din fantasi f\u00e5nga dig fr\u00e5n att uppn\u00e5 vad kunden och anv\u00e4ndaren vill. En anv\u00e4ndardriven design har den b\u00e4sta chansen att producera en vinnande UX \u00e4n n\u00e5gon annan metod.\n<\/p>\n
\n F\u00f6r att se till att du \u00e4r p\u00e5 r\u00e4tt v\u00e4g, unders\u00f6k om anv\u00e4ndare av din designnisch och l\u00e4r dig om deras behov och \u00f6nskem\u00e5l i just din design. Innan du \u00e4r redo att lansera den, anv\u00e4nd A\/B-testning f\u00f6r att verifiera om din design uppfyller kraven. Kom ih\u00e5g att anv\u00e4ndarens behov \u00e4r viktigare \u00e4n din personliga input eftersom de i slut\u00e4ndan kommer att anv\u00e4nda den.\n<\/p>\n
\n Beteendeutl\u00f6sare \u00e4r baserade p\u00e5 m\u00e4nsklig psykologi som stimulerar emotionell respons fr\u00e5n anv\u00e4ndaren. Bra designers kan kvalitativt bed\u00f6ma anv\u00e4ndarens tankes\u00e4tt och h\u00e4rleda k\u00e4nslom\u00e4ssig koppling till inneh\u00e5llet. Dessa k\u00e4nslom\u00e4ssiga kopplingar \u00e4r viktiga f\u00f6r att skapa ett livligt anv\u00e4ndarupplevelse i en webbdesign. Ta aviseringar till exempel. Du kanske har upplevt den irriterande popup-aviseringsfunktionen som skickar dig fr\u00e5n webbplatsen och sl\u00e5r igen d\u00f6rren p\u00e5 v\u00e4g ut. \u00c4ven om det delvis \u00e4r f\u00f6r kundens f\u00f6rdel samtidigt som det s\u00e4krar konverteringar f\u00f6r \u00e5terf\u00f6rs\u00e4ljaren, \u00e4r det en hemsk id\u00e9 att visa det direkt efter att kunden landar p\u00e5 webbplatsen.\n<\/p>\n
\n F\u00f6rest\u00e4ll dig att du anl\u00e4nder till kontorets n\u00e5lpunkt och blir beordrad att utf\u00f6ra dina sysslor utan att ta ett andetag eller njuta av en varm kopp kaffe. Timing \u00e4r en avg\u00f6rande faktor h\u00e4r. Om du k\u00e4nner till det m\u00e4nskliga psyket kommer du aldrig att b\u00f6rja med en popup som t\u00e4cker mer \u00e4n h\u00e4lften av sk\u00e4rmen. Ist\u00e4llet kan du v\u00e4nta p\u00e5 att bes\u00f6karen ska skumma inneh\u00e5llet och sedan b\u00f6rja med din pitch. P\u00e5 s\u00e5 s\u00e4tt kommer samma meddelande att tas emot med \u00f6ppna armar, f\u00f6r nu kan anv\u00e4ndaren faktiskt avvara sin tid att engagera sig. UX f\u00f6rlitar sig mycket p\u00e5 konsumentens psyke, och det \u00e4r d\u00e4rf\u00f6r du m\u00e5ste integrera en h\u00e4lsosam dos av beteendeutl\u00f6sare, samtidigt som du \u00e4r f\u00f6rsiktig d\u00e4r den beh\u00f6ver vara.\n<\/p>\n
\n Scrollning fungerar som magi om du fr\u00e5gar mig. Det skickar anv\u00e4ndaren som s\u00f6ker information djupare in p\u00e5 webbplatsen, vilket ut\u00f6kar deras chanser att konvertera. Det \u00e4r f\u00f6rmodligen d\u00e4rf\u00f6r de flesta designers placerar sina CTA:er l\u00e4ngst ner p\u00e5 sidan, d\u00e4r rullningen m\u00f6ter slutet.\n<\/p>\n
\n \u00c4ven tillv\u00e4gag\u00e5ngss\u00e4ttet ”k\u00e4rlek vid f\u00f6rsta \u00f6gonkastet” kan fr\u00e4mja rullning, d\u00e4r designen visar CTA:er \u00f6verst p\u00e5 sidan. Du kan optimera s\u00e5dana sidor genom att introducera rullningssignaler. Rullningssignaler kan str\u00e4cka sig fr\u00e5n pilsuckar till f\u00e4ngslande grafiska element. Till exempel, Pilar kan anv\u00e4ndas f\u00f6r att peka riktningar f\u00f6r n\u00e4sta del av inneh\u00e5ll, medan grafiska element kan ta anv\u00e4ndaren direkt till n\u00e4sta bild n\u00e4r de interagerar med den.\n<\/p>\n
\n N\u00e4r du l\u00e4gger ut ditt inneh\u00e5ll live p\u00e5 internet m\u00e5ste du f\u00f6rv\u00e4nta dig att det ska m\u00f6tas av m\u00e4nniskor fr\u00e5n alla m\u00f6jliga bakgrunder. Alla delar inte dina \u00e5sikter p\u00e5 det s\u00e4tt som du t\u00e4nker f\u00f6resl\u00e5 dem. Det \u00e4r d\u00e4rf\u00f6r ditt inneh\u00e5ll ska vara absorberbart s\u00e5 att anv\u00e4ndaren inte beh\u00f6ver extra anstr\u00e4ngning f\u00f6r att f\u00f6rst\u00e5 vad du erbjuder dem. Om inneh\u00e5llet \u00e4r sm\u00e4ltbart kommer anv\u00e4ndaren att konvertera snabbare.\n<\/p>\n
\n Ge dem en tugga i taget. Att visa allt du kan erbjuda p\u00e5 en g\u00e5ng g\u00f6r inte bara anv\u00e4ndaren desorienterad, utan \u00e5terspeglar ocks\u00e5 desperation p\u00e5 din h\u00e4lft. F\u00f6r att se till att din design andas och l\u00e4tt att assimilera, anv\u00e4nd mycket vitt mellanrum runt dina element s\u00e5 att de \u00e4r l\u00e4tta att urskilja. Skapa \u00e4ven inneh\u00e5ll som \u00e4r begripligt f\u00f6r alla sorters publik med exempel och egna ber\u00e4ttelser. Visa dig sj\u00e4lv som deras v\u00e4n, inte som aff\u00e4rsman.\n<\/p>\n
\n Sidelement \u00e4r en integrerad del av en webbdesign. De utf\u00f6r viktiga funktioner f\u00f6r anv\u00e4ndarna och uppr\u00e4tth\u00e5ller en k\u00e4nslom\u00e4ssig harmoni i UX. Men att l\u00e4gga till on\u00f6diga sidelement kan vara farligt f\u00f6r din webbplats och anv\u00e4ndaren ocks\u00e5.\n<\/p>\n
\n Sidelement som en CTA med flera kommandon ist\u00e4llet f\u00f6r ett, en bild som \u00e4r tillr\u00e4ckligt distraherande f\u00f6r att dra blickarna bort fr\u00e5n motivet eller textstycke mitt p\u00e5 sidan som vilseleder kunden. Att l\u00e4gga till dessa element p\u00e5verkar meningsl\u00f6st din webbdesigns trov\u00e4rdighet samtidigt som den saktar ner laddningshastigheten. HD-bilder kan till exempel vara f\u00f6rdr\u00f6jningsfabriker f\u00f6r dina webbsidor. De kr\u00e4ver mycket bandbredd och tar bort den idealiska laddningstiden f\u00f6r en konverteringsv\u00e4nlig webbplats. En webbplats som laddas l\u00e5ngsamt \u00e4r det sista du vill ha i din webbplats UX.\n<\/p>\n
\n Som webbdesigner m\u00e5ste du ta med alla element, aspekter och f\u00f6rh\u00e5llningss\u00e4tt i ekvationen. Ditt m\u00e5l \u00e4r att m\u00e5ste producera en design som inte bara vinner kunderna, utan ocks\u00e5 levererar en tillfredsst\u00e4llande UX. Genom dessa 10 grundl\u00e4ggande regler skapar du den perfekta webbdesignen som tillgodoser anv\u00e4ndbarhet fr\u00e5n alla m\u00f6jliga vinklar.\n<\/p>\n<\/p>\n