Critique de conception Web # 26: Boîte à outils iPhone
Chaque semaine, nous examinons un nouveau site Web et analysons le design. Nous soulignerons à la fois les domaines qui sont bien réalisés en plus de ceux qui pourraient utiliser un peu de travail. Enfin, nous terminerons en vous demandant de fournir vos propres commentaires.
Le site d'aujourd'hui est iPhone Toolbox.
Si vous souhaitez soumettre votre site Web pour qu'il soit présenté dans une future critique de conception, cela ne prend que quelques minutes. Nous facturons 24 $ pour critiquer votre conception - considérablement moins que ce que vous paieriez pour qu'un consultant jette un œil à votre site! Vous pouvez en savoir plus ici.
À propos de l'iPhoneToolbox
«Nous collectons les meilleures ressources pour iPhone, notamment des fonds d'écran, des icônes, des applications pour iPhone et des actualités pour les fans d'iPhone. iPhone Toolbox est également mis à jour quotidiennement. »
Voici une section de la page d'accueil:
Premières impressions
Ma première réaction à ce design est mitigée. Il y a un bon début ici. Le contenu a été organisé en unités modulaires, ce qui signifie que la page d'accueil peut contenir une tonne de contenu disparate. Il s'agit d'une base assez solide pour construire et c'est un bon début.
Le site se sent cependant un peu emporte-pièce. J'entends par là qu'il semble que le contenu a été forcé dans un modèle plutôt que le site conçu autour du contenu. Les modèles sont excellents et peuvent vous faire économiser beaucoup d'argent, mais vous sacrifiez beaucoup d'opportunités de marque en en choisissant un avec un design aussi commun.
Examinons de près quelques zones du site qui pourraient être améliorées.
Le logo
Je suis certes assez pointilleux en ce qui concerne la résolution et je me retrouve à faire cette même suggestion sur plusieurs critiques. Votre logo est la première et principale représentation de votre site que les visiteurs rencontreront. Vous voulez donc qu'il soit aussi net et net que possible. Le logo ici est un peu flou.
L'image est déjà au format PNG, mais elle ressemble à un JPG basse résolution. Les fichiers PNG sont capables de conserver une quantité impressionnante de détails et de clarté, donc j'imagine que le problème réside dans votre PSD. Assurez-vous de créer le fichier à la bonne taille et ne commencez pas avec de petites ressources que vous devez ensuite étirer pour être plus grandes.
Où est l'accent?
L'un des principaux problèmes liés à l'utilisation d'une telle configuration modulaire est qu'il est facile de perdre le sens de la hiérarchie. Au lieu d'une structure de communication clairement délimitée, vous avez plusieurs éléments avec une emphase similaire qui se disputent l'attention. Jetez un œil à l'image ci-dessous et réfléchissez à l'endroit où l'accent est mis. Quelle partie du site attire le plus votre attention?
Si vous posiez la question à une centaine de personnes, vous obtiendriez probablement plusieurs réponses différentes. Il n'y a tout simplement pas de point de départ solide. Si quoi que ce soit, l'annonce en haut est l'élément visuel le plus fort et confond les téléspectateurs quant à savoir si le message fait la publicité de vos services ou de quelqu'un d'autre.
N'oubliez pas qu'un bon design crée un chemin clair à suivre pour les téléspectateurs. Ils peuvent rompre le chemin s'ils le souhaitent, mais une suggestion forte devrait être là. Menez-les d'un endroit à l'autre et ils resteront intéressés, jetez-les dans un pool de contenu et ils fermeront la page et continueront.
Je recommande de créer un en-tête plus clair pour le site, qu'il s'agisse d'une image de marque pure ou d'une plus grande section «en vedette», il suffit de créer quelque chose qui s'étend sur toute la largeur du site et qui peut servir de point de départ visuel fort.
Alignement
Les cases contenant le contenu principal établissent un alignement clair pour le site, à gauche et à droite. Cette ligne est suivie tout au long de la page, mais est violée en haut. Dans l'image ci-dessous, je l'ai montré en dessinant deux lignes qui partent du contenu principal.
Comme vous pouvez le voir, l'annonce et la navigation ne s'alignent tout simplement pas correctement avec le contenu du site. Cela a pour effet de rendre le site un peu bâclé et pousse l'idée que l'annonce était une réflexion après coup qui a été forcée dans la conception. Je suggère d'aligner l'annonce avec le reste du contenu et de déplacer la navigation afin que "Accueil" s'aligne avec le reste du contenu en dessous.
Dernières pensées
A part ça, le site s'en sort plutôt bien. Les alignements sont forts tout au long du reste, il y a des effets de survol sympas qui montrent à quoi ressemble un fond d'écran sur un iPhone, la section fond d'écran a un traitement de coin soigné sur les images et le pied de page du site est superbe.
Certaines autres choses qui peuvent éventuellement être abordées incluent la taille du texte (un peu petite), les coins arrondis (légèrement dentelés) et la navigation (couleurs répétées). Enfin, pensez à ajouter quelques points de contraste majeurs à la page. La suggestion d'en-tête que j'ai faite plus tôt pourrait être vraiment accrocheuse si elle était vraiment gris foncé ou noire étirée tout au long de la page. Le contraste est un excellent moyen d'ajouter de la variété et de l'intérêt visuel à un design.
À ton tour!
Maintenant que vous avez lu mes commentaires, lancez-vous et aidez-moi en donnant au designer quelques conseils supplémentaires. Faites-nous savoir ce que vous pensez de la conception et ce que vous pensez pourrait être plus fort. Comme toujours, nous vous demandons également d'être respectueux envers le concepteur du site et d'offrir des conseils constructifs clairs, sans insultes.
