Web Design Critique # 26: iPhone Toolbox
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 iPhone Toolbox.
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.
Over iPhoneToolbox
“We verzamelen de beste iPhone-bronnen, waaronder achtergronden, pictogrammen, iphone-applicaties en nieuws voor iPhone-fans. iPhone Toolbox wordt ook dagelijks bijgewerkt. "
Hier is een gedeelte van de homepage:
Eerste indruk
Mijn eerste reactie op dit ontwerp is gemengd. Hier is een sterke start. De inhoud is georganiseerd in modulaire eenheden, wat betekent dat de startpagina een heleboel ongelijksoortige inhoud kan bevatten. Dit is een vrij sterke basis om op te bouwen en is een goed begin.
De site voelt echter een beetje koekjessnijder. Daarmee bedoel ik dat het lijkt alsof de inhoud in een sjabloon is gedwongen in plaats van dat de site rondom de inhoud is ontworpen. Sjablonen zijn geweldig en kunnen u veel geld besparen, maar u offert veel merkmogelijkheden op door er een te kiezen met zo'n gemeenschappelijk ontwerp.
Laten we een paar delen van de site van dichtbij bekijken die enige verbetering kunnen gebruiken.
Het logo
Ik ben weliswaar nogal kieskeurig als het gaat om resolutie en merk dat ik dezelfde suggestie doe bij verschillende kritieken. Uw logo is de eerste en belangrijkste weergave van uw site die bezoekers zullen tegenkomen. U wilt daarom dat het zo scherp en scherp mogelijk is. Het logo is hier een beetje aan de fuzzy kant.
De afbeelding is al een PNG, maar ziet eruit als een JPG met lage resolutie. PNG's zijn in staat om een indrukwekkende hoeveelheid detail en helderheid te behouden, dus ik kan me voorstellen dat het probleem in je PSD ligt. Zorg ervoor dat u het bestand op de juiste grootte bouwt en begin niet met kleine bronnen die u vervolgens moet uitrekken om groter te zijn.
Waar is de nadruk?
Een van de belangrijkste problemen bij het gebruik van zo'n modulaire lay-out is dat het gemakkelijk is om een gevoel van hiërarchie te verliezen. In plaats van een duidelijk afgebakende communicatiestructuur, heb je verschillende elementen met dezelfde nadruk die strijden om aandacht. Bekijk de onderstaande afbeelding en bedenk waar de nadruk ligt. Welk deel van de site trekt de meeste aandacht?
Als je het aan honderd mensen zou vragen, zou je waarschijnlijk verschillende antwoorden krijgen. Er is simpelweg geen sterk beginpunt. Als er iets is, is de advertentie bovenaan het sterkste visuele element en verwart het kijkers of het bericht reclame maakt voor uw diensten of die van iemand anders.
Onthoud dat een goed ontwerp een duidelijk pad creëert dat kijkers kunnen volgen. Ze kunnen van het pad afbreken als ze dat willen, maar er moet een sterke suggestie zijn. Leid ze van de ene plaats naar de andere en ze blijven geïnteresseerd, gooien ze in een pool van inhoud en sluiten de pagina en gaan verder.
Ik raad aan om een duidelijkere koptekst voor de site te maken, of het nu gaat om pure branding of een groter 'featured' gedeelte, maak gewoon iets dat zich uitstrekt over de breedte van de site en dat kan dienen als een sterk visueel startpunt.
Uitlijning
De vakken met de primaire inhoud zorgen voor een duidelijke uitlijning voor de site, zowel aan de linker- als rechterkant. Deze regel wordt helemaal onderaan de pagina gevolgd, maar wordt bovenaan geschonden. In de onderstaande afbeelding heb ik dit getoond door twee lijnen te tekenen die omhoog gaan vanuit de hoofdinhoud.
Zoals u kunt zien, komen zowel de advertentie als de navigatie gewoon niet goed overeen met de inhoud van de site. Dit heeft als effect dat de site er een beetje slordig uitziet en het idee duwt dat de advertentie een bijzaak was die in het ontwerp werd gedwongen. Ik stel voor om de advertentie af te stemmen op de rest van de inhoud en de navigatie zodanig te verplaatsen dat 'Home' in lijn komt met de rest van de inhoud eronder.
Laatste gedachten
Anders dan dat, doet de site het redelijk goed. De uitlijningen zijn de rest sterk, er zijn enkele coole zweefeffecten die laten zien hoe een wallpaper eruitziet op een iPhone, het wallpaper-gedeelte heeft een nette hoekbehandeling op de afbeeldingen en de voettekst van de site ziet er geweldig uit.
Enkele andere dingen die optioneel kunnen worden aangepakt, zijn de tekstgrootte (voelt een beetje klein aan), de afgeronde hoeken (licht gekarteld) en de navigatie (herhaalde kleuren). Overweeg ten slotte enkele belangrijke contrastpunten aan de pagina toe te voegen. De suggestie voor de koptekst die ik eerder deed, zou echt in het oog springen als het echt donkergrijs of zwart was, helemaal over de pagina gespannen. Contrast is een geweldige manier om variatie en visuele interesse aan een ontwerp toe te voegen.
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.