Varje vecka tittar vi på en ny webbplats och analyserar designen. Vi pekar på båda områdena som görs bra förutom de som kan använda lite arbete. Slutligen avslutar vi genom att be dig att ge din egen feedback.
Dagens webbplats är Capital Teas. Låt oss hoppa in och se vad vi tycker!
Om du vill skicka din webbplats till en framtida designkritik tar det bara några minuter. Vi tar ut $ 49 för att kritisera din design - betydligt mindre än du skulle betala för en konsult för att kolla på din webbplats! Du kan läsa mer här.
Om Capital Teas
Capital Teas är en femte generationen, familjeägt specialteaterhandlare. De erbjuder mer än 175 sorter av högsta kvalitet lössblad och örtinfusioner från världens finaste växande länder och regioner, inklusive Sri Lanka, Indien, Kina, Japan, Malawi och Kenya. Deras te-ware produkter inkluderar traditionella och moderna tekannor, bryggerier och infusörer, och många andra specialiteter. De erbjuder också hantverk, sylt, teinfunderad choklad och andra gourmetförpackade livsmedel som åtföljer deras te.
Här är en skärmdump av hemsidan:
Första intrycket
Mitt första intryck av en webbplats bygger starkt på idén om huruvida jag kan berätta exakt vad det handlar om inom de första tre sekunderna av att se hemsidan. Det är rätt, tre sekunder. Du måste ta tag i min uppmärksamhet, berätta för mig vem du är och vad du handlar om på kortare tid än vad den genomsnittliga personen behöver för att knyta en sko.
När det gäller Capital Teas passerar de detta test med flygande färger. Denna sida skriker online te butik (på ett bra sätt). Jag ser bilder av te överallt, ordet? Te? visas flera gånger, färgerna föreslår te; Jag är omedelbart väl orienterad och vet att om jag vill köpa lite te är jag på rätt ställe.
När det gäller den visuella estetiska och layouten på webbplatsen skulle jag säga att den har bra ben. Det finns en solid struktur och attraktiv visuell estetik påbörjas. Det behöver lite arbete, men inget för stort. Låt oss hoppa in och titta på några av de specifika områdena för att se om vi kan hitta några förslag till förbättringar.
Rubrik
Ett av de områden där jag ser de flesta problem är rubriken. Det verkar som om det var designat för att vara enkelt, men marknadsavdelningen fick tag på det och slängde det. Det finns så mycket grejer in i det att det känns rotigt och står som en stark motsättning till den ganska rena estetiken som etableras av resten av sidan.
I synnerhet de sociala ikonerna kan använda en del större rengöring. Designen för varje är inkonsekvent, flera Facebook-föremål verkar överflödiga, det finns överlappsproblem, och allt på detta ställe är hopfällt tillsammans med mycket lite andningsrum.
Dagens Deal? och anmälan på nyhetsbrevet på andra sidan främjar det röriga utseendet också. Dessa element anpassas inte särskilt bra med något annat på sidan och verkar slänga in som en eftertanke.
Hur man fixar det
Några tuffa beslut kommer att behöva göras här för att något måste gå. Faktum är att flera saker måste gå. Det känns som om någon försökte klämma in en massa sidfotar i en rubrik för att få dem till en bättre plats på sidan, men kom ihåg att om allt är speciellt, är inget speciellt. Du måste välja vad som är mest viktigt och ge dina objekt en tydlig visuell hierarki.
Jag rekommenderar att du flyttar det mesta av innehållet i rubriken till någon annanstans. Försök att identifiera de absolut kritiska elementen. Börja med logotypen. Det är en snygg snygg bit som sätter en bra gammal världs känsla för webbplatsen, ge det större uppmärksamhet genom att ta bort de omgivande elementen. Den andra nödvändiga produkten är kundvagnen. Om du kan minska rubriken till dessa två objekt, gör du bra. Om inte, tillåter jag införandet av dagens avtal. Allt rör sig antingen till sidfoten eller bättre integrerade i resten av sidan.
Medan du är på det, hitta en enkel social ikonuppsättning som har matchande ikoner för varje socialt nätverk som du behöver.
Navigering
Flytta ner sidan, nästa kommer vi till navigeringen. Att dra av en effektiv och okladdad dubbelnavigering är knepigt, men jag gillar verkligen hur det har hanterats här. En ren textmeny har kopplats ihop med en sökruta och staplad på en färgstark ikonbaserad meny och resultatet är ett bra sätt att hitta vad jag letar efter.
En sak som jag tycker är lite besvärlig är utformningen av rullgardinsmenyerna i den primära navigeringen. De har en kopplad, flytande känsla som gör det nästan som om något inte fungerar rätt.
Jag rekommenderar att ompröva detta och experimentera med olika visuella idéer som gör dropdownsna mer integrerade och kopplade till huvudmenyn.
Huvudinnehåll
Huvudinnehållsområdet består av tre lådor. Det här är en bra blandning av format och består av en stor reglage, en statisk bild och en liten film (som tack och lov inte spelar automatiskt). Detta område är bra. Jag älskar att det har varit parat i tre lådor, layouten ser fin och ren och det ger verkligen fokus på de produkter och information som visas.
Fotografi
Som fotograf är jag en suger för bra bilder och den här sidan levereras framgångsrikt på detta område. Det verkar som att ägarna verkligen har investerat i kvalitetsfotografering och det lönar sig genom att deras produkter verkar vara mycket avancerade och attraktiva.
Typografi
Efter huvudet är det andra stora området som behöver omedelbar uppmärksamhet typografi. De flesta designers rekommenderar att du väljer en eller två solida typsnitt för ett helt projekt, kanske tre om du känner dig äventyrlig och har tillräckligt med färdigheter att dra av det.Jag har tappat räkna med hur många typsnitt jag såg på hemsidan ensam på denna sida.
Din typ är en av de starkaste indikatorerna på stilen på din webbplats. Det sätter ett humör, en tidsperiod, en professionell ton och mycket mer. Om det är inkonsekvent och spridet, så är de meddelanden som det överför.
Jag rekommenderar definitivt att skrapa alla de olika typsnitten och sedan välja en eller två med hög läsbarhet och en ton som matchar designens avsikter. Resultatet blir en mycket mer konsekvent, professionell känsla för hela webbplatsen.
Sekundärt innehåll
Det finns en remsa av lådor längst ner på sidan som jag kallar "sekundärt innehåll"? för våra syften. Denna layout kombinerad med de tre rutorna ovan är enkel och solid. Det påminner mig om några av layouterna i vår artikel 10 Rock Solid Website Layout-exempel.
Mitt enda verkliga problem med detta område är typografi, som jag redan har gått över. Specifikt är problemet här dock att typsnittet på? Se den här produkten? är så tunn att det är nästan oläsligt.
Slutsats
Sammanfattningsvis har Capital Teas en bra start på en super attraktiv webbplats. Den grundläggande layoutstrukturen är solid, bilderna är vackra och den dubbla navigeringen fungerar bra trots att jag vanligtvis avskyr den vägen. Vissa områden att fokusera på att förbättra inkluderar huvudet, som måste vara avkopplat och typografi, som måste kopplas samman till några valda teckensnitt.
Din tur!
Nu när du har läst mina kommentarer lägger du in och hjälper till med att ge designern ytterligare råd. Låt oss veta vad du tycker är bra om designen och vad du tycker kan vara starkare. Som alltid ber vi att du också respekterar webbplatsens designer och erbjuder tydliga konstruktiva råd, utan att det blir några svåra förolämpningar.