Web Design Critique # 18: Two Chaps
Elke week bekijken we een nieuwe website en analyseren we het ontwerp. We zullen wijzen op zowel de gebieden die goed zijn gedaan als de gebieden die wat werk kunnen gebruiken. Ten slotte sluiten we je af met je eigen feedback.
De site van vandaag is Two Chaps Branding, een in Baltimore gevestigd webdesign- en marketingbedrijf.
Ontdek ontwerpbronnen
Als u wilt dat uw website wordt opgenomen in een toekomstige ontwerpkritiek, duurt het maar een paar minuten. We rekenen $ 24 voor het bekritiseren van uw ontwerp - aanzienlijk minder dan u zou betalen voor een consultant om uw site te bekijken! Meer informatie vind je hier.
Ongeveer Two Chaps
“Bij TwoC geloven we misschien dat een merk meer is dan een mooi logo en een mission statement vol met de nieuwste modewoorden. Wij zijn van mening dat een merk het verhaal is van een bedrijf, een verhaal dat zijn verleden, heden en toekomstige relaties met zijn klanten en klanten definieert. Wij zijn van mening dat een merk meer is dan hoe u wilt worden waargenomen, het is hoe u daadwerkelijk wordt waargenomen. Of je nu genegeerd of verzorgd wordt - jouw merk definieert jou. ”
Hier is de startpagina van Two Chaps:
Het algehele ontwerp is erg aantrekkelijk. Het verouderde thema wordt goed uitgevoerd in kleuren, typen en texturen en de lay-out is eenvoudig maar krachtig. De uitlijning is zeer strak en het grootste deel van de inhoud bestaat uit een duidelijk gedefinieerde kolom.
Laten we enkele aspecten van het ontwerp opsplitsen en er dieper op ingaan.
Het logo
Ik hou echt van het werk dat ze in het logo hebben gedaan. De bowler en snor zijn een perfecte visuele boodschap voor de naam "Two Chaps". Evenzo is het sterke serif-lettertype perfect voor de periode waar de ontwerpers naar op zoek zijn.
Hoewel ik het logo prima vind hoe het is, vraag ik me af of het sterker zou zijn zonder de snor. Op dit moment zijn er twee concurrerende grafische elementen in het logo en het terugbrengen tot een enkele zou het stuk kunnen verbeteren. Ik realiseer me dat de snor, letters en hoed samen een gezicht suggereren, maar het leest nog steeds meer als letters met een snor en een hoed.
Als hoofdgrafiek kan de bowler dan elders worden gebruikt als een zelfstandig element, onafhankelijk van de rest van het logo.
De kop
De kop is mijn favoriete ding over de site. Hoewel het aan de rechterkant wordt weergegeven, is het een van de eerste waar u naar kijkt wanneer de pagina wordt geladen vanwege de grootte en vetheid.
De lettermaten zijn perfect gestructureerd om een samenhangende eenheid te creëren die uw aandacht trekt en snel leest. Merk op hoe de minder belangrijke woorden (de, van) in omvang zijn verkleind om ruimte te maken voor de belangrijkere woorden (ware kunst).
Aangezien dit een grafisch en niet live type is, zou ik zeker aanraden om de tijd te nemen om hier aan de kerning van de tekst te werken. Sommige letters, zoals de "T" en "r" in "True", liggen vreemd ver uit elkaar, terwijl andere een beetje samengedrukt zijn.
Het is gemakkelijk om deze stap te vergeten wanneer u ontwerpt, maar als typografie een belangrijk kenmerk van het ontwerp wordt, wilt u er altijd zeker van zijn dat uw letterspatiëring zo goed als perfect is.
Afbeelding miniaturen
De afbeeldingen op de homepage hebben een uitstekende grensbehandeling gekregen. De schaduwwerking geeft de afbeeldingen echt veel diepte omdat het drie afzonderlijke niveaus creëert.
Standaard zijn de afbeeldingen in grijstinten, maar als je erover beweegt, laten ze een pixel of twee vallen (opzettelijk?) En worden ze in kleur. Dit is een leuk effect dat leuk is om mee te spelen als je de site voor het eerst bekijkt.
De zijbalk
Zoals je kunt zien, is de zijbalk een verticaal lint met het logo, de navigatie, een paar sociale knoppen en wat juridische informatie. Als je de live site bekijkt, zul je zien dat de voettekst handig stil blijft staan terwijl de site scrolt. Dit biedt gemakkelijke toegang voor het wijzigen van pagina's, ongeacht waar u zich op de site bevindt.
Ik hou van de brutaliteit van het rood en hoeveel het opvalt van de rest van het ontwerp. Ik hou ook van de behandeling en kleuren die worden gebruikt voor de Facebook- en Behance-knoppen. Het is een beetje vreemd dat de letters in "Facebook" zo'n harde schaduw hebben terwijl die in "Behance" dat niet hebben.
De navigatiegedeelten van de zijbalk breiden uit en trekken samen met een vloeiende animatie terwijl u op de kopteksten klikt. De sleutel hier is dat alle items nog steeds perfect toegankelijk zijn met JavaScript uitgeschakeld, de menu's worden gewoon allemaal weergegeven in de open positie en je zou niet eens weten dat je iets miste.
Het is altijd goed om een stap verder te gaan en ervoor te zorgen dat uw site werkt voor de browsers die uw kleine visuele traktaties ondersteunen, maar ook die dat niet doen.
Voettekst
De voettekst bevat de oproep tot actie voor het inhuren van het bedrijf en is weer een mooi ontworpen draai aan het verouderde thema.
De lijnen aan de boven- en onderkant zijn een leuke touch, evenals het kleine "Klik hier" -teken met een paginakrul. Deze sectie lijkt een beetje alsof sommige SEO "experts" het in handen kregen, aangezien het woord "merk" ontzettend vaak voorkomt voor zo'n klein stukje tekst.
Leesbaarheid
Zoals ik hierboven al zei, vind ik het ontwerp van de site over het algemeen erg leuk. Het is uniek, krachtig, aantrekkelijk en behoorlijk functioneel. Ik denk echter dat de bruikbaarheid van de site te lijden heeft onder de tekst. Bekijk de afbeelding hieronder op de pagina "Ons verhaal".
Zoals u kunt zien, zijn noch de grote gekleurde kop naast de witte hoofdtekst zeer goed leesbaar op de gestructureerde achtergrond. Dit wordt nog verergerd door het feit dat de achtergrond op zijn plaats blijft terwijl de tekst scrolt, waardoor een echt complex en druk visueel effect ontstaat terwijl u door de site bladert.
Uiteindelijk doet de mooie gestructureerde achtergrond het misschien meer dan goed. Het is een goed idee om te experimenteren met het laten vallen van de dekking of het geheel te schrappen ten gunste van iets eenvoudiger. Dat is misschien onaangenaam om te horen, maar als het de leesbaarheid van de tekst over de hele site vergroot, is het de moeite waard.
Jouw beurt!
Nu je mijn opmerkingen hebt gelezen, kun je meedoen en helpen door de ontwerper wat verder advies te geven. Laat ons weten wat je geweldig vindt aan het ontwerp en wat je denkt dat sterker zou kunnen zijn. Zoals altijd vragen we u ook respect te hebben voor de ontwerper van de site en duidelijk constructief advies te geven, zonder harde beledigingen.
Geïnteresseerd om uw eigen site te laten bekritiseren? Meer informatie vind je hier.
