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 den personliga portföljen av Owain Lewis, en frilans webbdesigner.
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 Owain Lewis
Jag är frilans webbdesigner och front end webbutvecklare från Cardiff. Jag bygger rena, moderna och professionella webbplatser med HTML5. Under de senaste åren har jag arbetat med ett stort antal kunder, inklusive webbdesignbyråer, stora företag, nystartade företag och privatpersoner, och skapar webbplatser som hjälper människor att uppnå bättre resultat online.
Här är en skärmdump av Owains hemsida:
Initial Impression
Mitt första intryck av denna sida är extremt positiv. Jag gillar layouten, grafiken och texten. Innehållet är också organiserat i tydliga sektioner, både genom placering och subtila bakgrundsändringar. Det är en riktigt vacker bit av arbete som påminner mig kraftigt om några av de svarta sidorna som Apple har på sin webbplats.
För det mesta kommer vår kritik att vara positiv. Vi ska bara titta på varje avsnitt och diskutera vad som gick rätt! Det finns dock några riktigt små saker som jag tror kan vara tweaked och jag pekar ut dem på vägen.
Rubrik
Rubriken handlar om typografi. Det gör en stark och vänlig introduktion som låter dig veta vad webbplatsen handlar om. Under de senaste veckorna har jag kommit på designers för att nästan dölja den grundläggande förklaringen av deras webbplatser och är en fast tro på att kasta den ut i det öppna så det finns ingen förvirring. Strax bort ser vi att den här webbplatsen är för Owain Lewis, en frilans webbdesigner.
Rubriken upprättar också en stark, motiverad anpassning som ställer in tonen för resten av sidan att följa. Denna anpassning följs strikt helt ner genom sidfoten.
Det enda problemet jag har i det här avsnittet är brist på överensstämmelse med typografi i rubriken. Här har konstruktören använt huvudkontoret för kontrast och hävstångsfärg, djärvhet och typfältval för att ställa in vissa ord från varandra. Men viktpunkterna använder tre olika behandlingar.
Den första använder den slätta teckensnittet som används i resten av rubriken, den andra använder en mycket stiliserad och ganska tjock ampersand och den sista använder en kursiv version av rubriken. Jag rekommenderar att du gör? Owain Lewis? och? webbdesign? match. Oavsett om de är vanliga eller kursiverade spelar ingen roll så mycket, bara se till att de är båda samma. Jag skulle också överväga att göra dem båda en djärv version av teckensnittet för att hjälpa till att lägga till differentieringen.
Också, som en liten anteckning, kan den första raden i rubriken använda viss uppmärksamhet.
Intro avsnitt
Nästa avsnitt är den som verkligen tar upp din uppmärksamhet när du laddar upp sidan. Allt som svart gör ögonen omedelbart går till kontrastpunkten: den stora vita miniatyrbilden, som sedan får dig att studsa lite runt i den delen och fortsätta ner till de andra miniatyrerna. Sidan läser riktigt bra och konstruktören har gjort ett bra jobb att styra användaren genom layouten.
Jag gillar även den lilla flytande? Lej mig? tagg på höger sida av sidan. När som helst du bläddrar igenom webbplatsen om du bestämmer den här killen så bra att du vill anställa honom, finns det en enkel väg till det här målet som du helt enkelt inte kan missa! Lägg märke till att det stannar långt ifrån sidan och ur vägen, men trick så här är extremt irriterande när de faktiskt överlappar innehåll (jag tittar på dig Twitter för iPhone).
Jag är inte säker på att det här avsnittet behöver ändras alls, även om jag blir lite upptagen på rubriken:? Freelance Web Designer Web Design Portfolio.? Detta är uppenbarligen ett redundant uttalande och känns som SEO-brus (sidtiteln gör detsamma men mycket värre). SEO taktik närmar sig gråa områden snabbt, så varje designer måste bestämma vad som är och är inte en bra idé, men personligen känner jag mig att det finns lite irriterande sökordsblocket som händer på den här sidan.
Utvalda avsnitt
Flödet av den här webbplatsen när du rullar är intressant, tog du det? Det första området är en bred kolumn, det andra området är två kolumner, den här delen är tre kolumner och fotfoten är fyra (alla håller den starka inriktningen). Ibland kämpar designers mycket med tanken på att ändra din layout och antingen behålla densamma hela sidan eller försöka drastiska förändringar och skruva upp flödet. Owain har gjort ett bra jobb att lätta användaren i innehållet och erbjuda tillräckligt med variation för att minska visuell redundans.
Liksom det sista, är detta avsnitt ganska attraktivt. Jag gillar den visuella behandlingen av rubrikerna och de animerade svängningseffekterna på miniatyrerna. Allt känns smidigt och högklassigt.
En liten förändring: aldrig kapitalisera? Jag? i iPhone. Det verkar obetydligt men folk är picky om dessa saker och vissa kommer inte att anställa dig för att bygga deras iPhone-webbplats om du inte vet tillräckligt om produkten för att få namnet rätt.
sidfot
För mig är det här avsnittet den enda delen av webbplatsen där layouten blir lite besvärlig. Till att börja med känns kolonnernas flöde konstigt med den stora mängden obekväm viddutrymme i mitten. Jag är inte säker på att det är den bästa idén att göra den fyra kolumnavsnittet i linje med rasterna uppe i tre kolumnavsnitt ovanför den.Det här kan vara mer meningsfullt om kolumnerna fördelas jämnt över utrymmet som de tre ovanstående är (så följ metoden i föregående avsnitt, inte exakt placering).
Till sist justerades rätten? Mina länkar? avsnittet är lite konstigt med tanke på att alla övriga kolumner är vänstra. Det här är ett klassiskt fall där design är en av de ställen där du kan följa varje regel och fortfarande har något som inte är rätt. Jag slår på och om hur det är viktigt att strikt följa den layout du har etablerat, men här föreslår jag att kanske den sista kolumnen inte behöver följa den motiverade layouten och kan bara ha en ragged right edge.
Att vara en designer innebär att lära sig alla regler och sedan räkna ut när det är acceptabelt att bryta dem. Problemet är givetvis att varje designer bestämmer annorlunda. Jag brukar splittra hår med denna kolumndiskussion, medan många designers inte ser några problem alls med footerlayouten! Jag uppmuntrar bara Owain att ta en titt på layouten här och bestämma sig själv om det inte kunde bli starkare på något sätt.
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.