Web Design Critique # 16 Köra missbrukare

Varje vecka tittar vi på en ny webbplats och analyserar designen. Vi pekar på både de områden som görs bra och de som kan använda lite arbete. Slutligen avslutar vi genom att be dig att ge din egen feedback.

Dagens webbplats är RunAddicts en blogg för alla som älskar att springa.

Om du vill skicka din webbplats till en framtida designkritik tar det bara några minuter. Vi debiterar $ 24 för att kritisera din design - betydligt mindre än du skulle betala för en konsult för att ta en titt på din webbplats! Du kan läsa mer här.

Om RunAddicts

? För en tid sedan tog jag upp den underbara vanan att springa. Trots att jag var en självutnämnd soffpotatis, började jag bara märka några större uthållighetsförbättringar som motiverade mig att köra seriöst. Några månader senare bestämde jag mig för att dela min nya passion med världen. Som ett resultat föddes RunAddicts, en professionell blogg om allt relaterat till löpning. Drivad av flera världsomspännande professionella författare, kommer RunAddicts att ta dig igenom många års erfarenhet, råd och andra viktiga tips och tricks i samband med att en person borde veta om. (RunAddicts design har presenterats på större design gallerier som SiteInspire och Creattica)?

Här är RunAddicts hemsida:

Som du kan se är det här definitivt en professionellt utformad webbplats med många bra element. Låt oss ta det ifrån varandra och undersöka det bit för bit.

Rubrik

Rubriken är en av de mest attraktiva sidorna på sidan. Funktionellt läser huvudet perfekt med logotypen som det stora attraktiva elementet till vänster som fångar din uppmärksamhet följt av navigeringen till höger exakt var du skulle förvänta dig att det ska vara.

Här är ett zoomat inslag av den stora header grafiken. Jag älskar det virvlande vattnet och den stora röda randen. Dessa kombineras med valet av typsnitt verkligen förmedla en sportig känsla. Lägg märke till hur designern överför olika delar av löpupplevelsen (vatten och vägen) utan att ta temat för bokstavligt.

Det primära innehållet

Hemsidan är uppdelad i olika moduler. Detta möjliggör mycket innehåll att uppta ett relativt litet utrymme medan varje bit fortfarande är en tydligt separat enhet.

Så mycket som jag tycker om tanken på modulerna, ser detta område visserligen lite rotigt ut. Återigen är poängen att fånga mycket information här men jag känner att det nästan har tagits för långt.

Jag föreslår att experimentera här med ett minskat antal modeller som individuellt får mer uppmärksamhet än vad som ges till varje på grund av den lite mödosamma uppgiften att visuellt sortera genom innehållet.

Senaste postmodul

Individuellt tycker jag verkligen om designen som har gått i några av modulerna. Till exempel, det? Senaste inlägget? Området är ett enkelt men attraktivt arbete. Det stora fotot fångar verkligen din uppmärksamhet och jag älskar titeln och författarens överlägg som inte sträcker sig till 100% av bredden på den rutan. Jag vet att jag skulle ha instinktivt dragit dessa kanter ut men jag tycker att det här utseendet är mycket mer unikt.

Lägg märke till den starka upprepningen av färgschemat som används på kreativa sätt. Den svarta röda och vita blandas i varje modul, ofta på olika sätt.

Den rätta sidan

Med vänster sida ser så attraktivt ut, tror jag att det är rätt sida som verkligen bidrar till det röriga utseende som jag nämnde ovan.

Tyvärr kan jag se hur elementen här är ganska obligatoriska. Annonsutrymmet och Facebook-sektionen är funktionellt nödvändiga även om de saknar estetiskt.

Ett primärt mål med moduldesignen är att få alla att se ut som liknande bitar till en större helhet. Det här området är märkbart en jumla av bitar som inte går helt ihop. Även om detta kan behöva vara ett fall där funktionalitet trummar design.

Kategori Moduler

Tillbaka till vänster är kategorimodulerna nära botten perfekta. Jag älskar den visuella upprepningen och hur det tydligt gör dessa fyra moduler ett enda visuellt kluster.

Fotografiet som används här är ganska attraktivt och inte för stock art-ish. Lägg märke till hur mycket tomt utrymme har använts i det vita området. Detta gör att innehållsrummet andas och gör det här området mycket lättare att läsa.

Huver effekten på dessa artikeltitlar är riktigt bra. Bakgrunden ändrar färg och titeln flyttas åt höger allt i en fin jämn animering.

Bottom och Footer

Undersidan på sidan är stark med några bra, stora moduler som ger en bra bas till webbplatsen. Detta illustrerar vad jag sagt tidigare om hur bra det fungerar att ha färre moduler med större tonvikt på var och en.

The? Skriv för oss? avsnittet är särskilt trevligt och tar definitivt upp din uppmärksamhet genom att bryta mot de andra modulernas visuella tema samtidigt som du håller hela sidan av den övergripande webbplatsen.

Jag gillar också styling av Twitter-flödet här. Jag tycker att det är mycket mer minimalt och lämpligt än Facebook-området ovan. Närheten är dock ett viktigt koncept i design och den allmänna regeln är att placera liknande saker tillsammans. Det är lite konstigt att få Twitter-flödet på botten medan hela resten av sociala medierna är uppe på toppen. Observera att detta har tagits upp något genom att inkludera ett annat Facebook-meddelande precis under Twitter-flödet.

Jag älskar verkligen footer designen och hur det tar tillbaka tematemat från toppen av webbplatsen. Jag har sagt allt genom kritiken, designern har en riktigt stark förståelse för hur man använder repetition för att få en design att känna sig sammanhängande. Det låter som en enkel och uppenbar princip, men om du läser dessa veckovisa kritik vet du att det är ett stort svaghetsområde för många designers.

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.

Intresserad av att ha din egen webbplats kritisk? Du kan läsa mer här.