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 hemsida är hemsidan för Ray Cheung, självbeskriven helt enkelt som en online-entreprenör.
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 Ray Cheung
I stället för att skapa webbplatser för kunder, älskar jag att arbeta med egna projekt. Med utgångspunkt från en idé som designar från början med viss inspiration längs vägen, kodar och sprider den runt om i världen, ger jag en stor känsla av prestation. För närvarande hanterar jag självstartade webbplatser med cirka två miljoner besökare per månad - alla med sikte på att dela användbara resurser till människor.?
Här är en skärmdump av hemsidan:
Initiala visningar
Ray Cheung är en man som behöver mycket liten designinstruktion. Han har inte en men flera mycket framgångsrika webbföretag, som alla ser bra ut och hans hemsida är inget undantag.
Det övergripande temat är ganska intressant: en träbakgrund med en stapel papper för att hålla innehållet. Men i stället för att använda en pappersstruktur, gick Ray med en stjärnfältbakgrund. Det låter galet men den övergripande effekten är ganska fin! Jag älskar det när designers gör något oväntat snarare än att bara springa med en trend.
Den staplade sidoeffekten påminner om ett populärt Tumblr-tema, men likheterna stannar verkligen där, eftersom övergripande layout och design är ganska annorlunda.
I ett ögonblick tycker jag verkligen om vad Ray har gjort här. Låt oss dyka in och titta närmare på några av avsnitten.
Textur och Färg
Som jag nämnde ovan är rymden och trästrukturerna en osannolik kombination, men båda är mycket väl utformade och verkar fungera perfekt tillsammans. Jag gillar den mörka färgpalett som härrör från de två:
typsnitt
När du har ett ganska djärvt visuellt tema kan det vara överväldigande att kombinera det med någon galen typografi. Den allmänna tanken är att du inte vill ha för många föremål som tävlar om uppmärksamhet.
Mot bakgrund av detta gjorde Ray ett solidt val för att vara konservativ med sina teckensnitt. All typografi består av lättlästa sans-serif typsnitt. Huvudsidan är fet, följt av en extremt lätt variant (kanske för ljus). Dessa och de djärva kondenserade sektionsrubrikerna är bilder med den levande kroppskopian i Arial. Det skulle vara jättebra att se lite @ font-face integration för att få några av den här typen live, men bilderna är ganska små så jag tycker inte riktigt att det är en stor sak (om man piska upp en sprite eller två skulle inte skada sig) .
Navigering
Mellan dessa kritiker och vårt designgalleri har jag tittat på a ton av webbdesigner genom åren. Det är inte ofta att jag ser ett knep som jag aldrig har stött på tidigare. Rays navigering men verkligen överraskade mig. Jag tror inte att jag någonsin har sett denna speciella effekt.
Utformningen av detta avsnitt är enkel och fungerar vackert med den övergripande sidan. Jag älskar kontrast av de lite extruderade knapparna och insatsdelen under dem.
När du klickar på en sista två knappar rullar sidan automatiskt för att ta dig till den här sektionen, en ganska typisk idé. De andra två knapparna kopplar dock till två sektioner som redan finns högst upp på sidan, så när du klickar på dem, skakar de respektive sektionerna fram och tillbaka i en slät animering. Det är en ganska enkel effekt som gör att webbplatsen verkar mer dynamisk och nästan levande och vänlig.
sektioner
Sidan är uppdelad i två vertikala kolumner. På de olika projekten som Ray har arbetat på och till vänster finns olika små delar av innehållet: Om mig, mina färdigheter, läsning och erkännanden.
Varje sektion är toppad med en rubrik och en liten ikon, en annan liten egenskap som omedelbart får mig att tänka på Tumblr.
Dessa sektioner är tydligt separata och lätta att integrera på individuellt. Var och en har en unik design men de knyter ihop bra. En liten sak som jag skulle tänka på på mina färdigheter? avsnittet färgar de horisontella staplarna för att matcha deras respektive delar av cirkelgrafen. Detta skulle hjälpa konsistensen av de två grafikmen och omedelbart kommunicera hur de är anslutna.
Intelligent rullning
En annan sak som jag verkligen gillar om den här sidan är hur Ray tänkte igenom rullningsfunktionen. Vänster kolumn slutar på kontaktformuläret och den högra kolumnen är betydligt längre. När du bläddrar ner på sidan rullar hela sidan likformigt som du kan förvänta dig fram tills du träffar kontaktformuläret. Vid den här tiden slutar den vänstra kolumnen att rulla och den högra kolumnen fortsätter.
Touches som dessa visar bara hur mycket tid som spenderades och tänkte på hur man gör webbplatsen mer användarvänlig.
Lyser av!
En av de få saker jag inte var helt säker på på platsen var omkopplaren nära toppen för att stänga av lamporna. Jag förväntade mig att när jag slår på den här omkopplaren skulle temat ändras på något sätt. Kanske skulle träbakgrunden blekna in i svarta avslöja fler stjärnor eller något annat lika intressant.
Men när du slår på strömbrytaren är det här vad du får:
Jag förstår meddelandet här: spara energi genom att stänga av lamporna. Implementeringen är dock lite besvärlig. Den här sidan ger dig ingen möjlighet att gå tillbaka till webbplatsen om du bara tryckte på knappen för att se vad den gjorde, eller leder dig inte någon annanstans, som en av Rays andra projekt eller några resurser för att spara energi.Ett annat förvirrande element är? Batteriet är lågt? meddelande i sidfoten. Det här kan vara kopplat till meddelandet i rubriken, men det är ganska oklart.
Jag tror att intentionerna är bra här men resultatet är att mina upplevda kvalitet på webbplatsen och jag tror att om dessa kommer att hållas måste de omprövas.
Slutsats
Till sist tror jag att Ray har skapat en bra webbsida här för att presentera dig själv. Sidan anger tydligt vem han är och vad han gör och ser bra ut att göra det. Layouten är logisk och lätt att följa, designen är unik och intressant och innehållet är för det mesta relevant.
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.