5 exempel på dålig webbdesign och hur man gör det bättre
utformningen av en webbplats påverkar användarupplevelsen direkt., En dåligt utformad webbplats är mindre benägna att få besökare att slutföra en åtgärd, till exempel att köpa en produkt eller gå med i en e-postlista.
om sidan laddas långsamt eller är svår att navigera, lämnar 95% av besökarna inom några sekunder.
om du inte får de resultat du vill ha från en webbsida, till exempel ökade konverteringar och minskade avvisningsfrekvenser, utvärdera designen.
Här är några misstag vi har fångat på andra webbplatser. Försök att undvika att upprepa något av dessa fem exempel på dålig webbdesign.
Hur ser dålig webbdesign ut?,
den genomsnittliga företagsägaren kanske inte förstår skillnaderna mellan bra och dålig webbdesign, varför många webbplatser slutar med fruktansvärda och ineffektiva mönster.
medan designtrender ständigt förändras finns det grundläggande komponenter på en webbplats som förblir universell, inklusive:
- lätt att följa navigering
- Ren layout
- Kompatibilitet
- branschanpassad design
användarna behöver inte gissa hur man hittar en sida på din webbplats. Allt ska vara tydligt organiserat, med enkla menyer och navigeringsfunktioner.,
en ren layout rekommenderas också. Om sidan är trångt med information, grafik och video tar det längre tid att ladda och blir svårare att läsa.
kompatibilitet är mindre oroande, eftersom de flesta webbplatser nu använder responsiva mönster som överensstämmer med storleken på användarens skärm. Det krävs dock ofta noggranna tester för att se till att elementen laddas ordentligt på olika enheter.
webbplatsens visuella utseende är en subjektiv detalj, eftersom alla har sin egen smak. Oavsett behöver du en design som är lämplig från branschen., Till exempel, medan flashiga grafik kanske inte fungerar på en webbplats för en begravningsbyrå, de kan arbeta på en webbplats för en part hyra butik.
Kom ihåg detta när vi granskar de värsta webbplatsdesignfel.
webbplatser utan ett tydligt meddelande
ett av de värsta designfel som du kan göra ger inte ett tydligt meddelande relaterat till syftet med din webbplats. Användare bör omedelbart veta namnet på verksamheten och vad de säljer.
till exempel, när du först besöker 3D-brevlåda, tar det några sekunder att förstå vad du tittar på., Det verkar vara en webbsida för någon typ av e-postprogram. Det är svårt att avgöra om programvaran är ett spel, skärmsläckare eller e-postklient.
webbplatsen CyberDsignClan är ett annat exempel på en webbplats utan ett tydligt meddelande. Du ser helt enkelt en stor grafik som läser, ” hoppa intro.”Efter att ha klickat på sidan laddas den riktiga hemsidan, vilket är lika förvirrande som 3D-brevlåda.
båda sidorna saknar ett tydligt meddelande. Om du vill veta mer om produkten måste besökarna bläddra igenom sidan eller klicka på andra länkar.,
allt som visas på sidan innan användarna behöver rulla längre beaktas ovanför luckan. Vi kallar detta ”hjälteavsnittet.”Detta är det område där namnet på verksamheten och en viss indikation på vad de säljer bör ingå. Överst på sidan bör också erbjuda någon typ av navigering.
webbplatsbesökare bildar åsikter om verksamheten inom en delad sekund. Om användarna behöver bläddra igenom sidan för att ta reda på vad företaget gör, kommer de sannolikt att lämna sidan.,
för många element som belamrar sidan
förutom ett tydligt meddelande bör webbplatsen ha en tydlig layout. Om sidan är rörig blir det svårt att navigera, vilket gör att besökare lämnar.
Arngren.net är ett bra exempel på dålig design. Denna sekretessbelagda webbplats innehåller listor kastas tillsammans med ingen struktur. Listorna är inte indelade i kategorier och de passar ihop som ett pussel.
för ett annat exempel, besök Lings Cars., Webbplatsen är för begagnade bilar, men har så många olika element, du kan förbise syftet med webbplatsen. Designern inkluderade minst ett halvt dussin animerade element ovanför veckan, vilket gör det otroligt svårt att navigera på sidan.
det är möjligt att visa mycket innehåll utan att belamra sidan. För ett bra webbdesignexempel som har flera produkter, titta på Amazon eller AliExpress. Medan båda platserna innehåller en oändlig rullning av produkter, organiseras de i galler istället för att kastas ihop som en mosaik.,
annat än att belamra sidan med ett sammelsurium av länkar, vissa webbplatser är belamrade med popup-fönster, flytande annonser, Auto-laddar videor och andra element som distraherar besökare.
sidor utan mobiloptimering
de flesta internettrafik i USA kommer nu från mobila enheter, men många webbplatser är fortfarande byggda för Stationära datorer först. Om webbplatsen inte är optimerad för Mobila enheter, kommer de flesta besökare inte få en bra användarupplevelse.,
många webbplatser inkluderar nu responsiv design, vilket gör att webbsidan kan justera element baserat på skärmbredden på användarens enhet. Webbplatsen kan också dölja element, ändra teckensnitt eller ta bort bakgrunder när en mindre skärm upptäcks.
dessa detaljer gör det möjligt för Webbplatsen att fungera på vilken enhet som helst. Medan responsiva mönster är vanliga finns det fortfarande många webbplatser som är oläsliga på mobila enheter.
nästan alla exempel som redan diskuterats har ingen responsiv design. Deque University har ett exempel på icke-lyhörd webbdesign.,
om du läser detta i din webbläsare, försök att besöka webbplatsen och justera bredden på webbläsaren. Eftersom webbläsarfönstret blir mindre ändrar inte sidan sin layout. Texten blir omöjlig att läsa utan att rulla till höger.
om du vill se ett exempel på responsiv webbdesign, besök nästan vilken webbplats som helst som ägs av ett större företag, till exempel Nike eller Microsoft.
brist på Enkel navigering och länkar
När användare når en webbplats borde de inte ha några problem med att bläddra i menyn och hitta den information de behöver., På den officiella hemsidan för University of Advancing Technology är toppen av sidan täckt med en stor animerad skärm som innehåller flytande grafik.
den flytande grafiken är klickbara länkar som är svåra att klicka och sakta ner sidladdningshastigheten. Även om detta är extremt innovativt, det finns andra kreativa sätt att utforma en webbplats utan att göra det svårt att navigera. Istället för att använda dessa flytande element som länkar, University of Advancing Technology bör ha fokuserat på att skapa en meny som är lätt att öppna och bläddra.,
slutligen finns det många webbplatser som inkluderar parallax rullning och inbäddade videoelement som inte övermanna sidan och begränsa dess navigerbarhet.
oläsbar Text eller ej klickbara knappar
på grund av kraven i webbläsaren är menyn på föregående webbplats nästan inte klickbar. Detta är också ett problem när webbplatser inte är optimerade för Mobila enheter. När elementen inte justeras för den mindre skärmen kan de överlappa eller bli för små för att läsa.,
det är enkelt att undvika detta problem om du slutför detaljerad testning innan du startar din webbplats. Använd emulatorer eller programvara för att efterlikna hur din webbplats visas på olika mobila enheter, inklusive de senaste smartphones och surfplattor.
hur man undviker dålig Design för din webbplats
de exempel som diskuteras är relativt lätta att undvika, nu när du vet vad du ska leta efter. Genomförandet av nödvändiga ändringar kan dock kräva teknisk expertis., På WANDR får du hjälp av erfarna UX-designers som förstår vad som krävs för att skapa en bättre användarupplevelse.
om du vill se till att din webbplats inte innehåller något av de dåliga designexempel som diskuteras, överväg att arbeta med proffs.