Aujourd'hui, nous poursuivons notre nouvelle série de critiques de conception de sites Web. Nous examinons en détail un site Web en direct et en soulignons les points forts ainsi que les domaines dans lesquels des améliorations pourraient être apportées.
Top Test Prep, le site que nous allons consulter aujourd'hui, était notre tout premier client, mais les demandes affluant, n'hésitez pas à vous inscrire bientôt!
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 la critique de votre conception - beaucoup moins que le coût d'un consultant pour jeter un coup d'œil sur votre site! Vous pouvez en savoir plus ici.
Top Test Prep
Faites la connaissance de Top Test Prep, une entreprise de tutorat privée qui se vante de compter parmi les meilleurs et les plus brillants tuteurs. La conception de leur page d'accueil est assez simple. une disposition centrée clairement divisée en plusieurs sections.
Avant de nous pencher sur ce qui pourrait être amélioré en termes de conception, examinons quelques-unes des choses qui ont été bien faites.
Slider & Photographie
Je suis une ventouse pour les curseurs d'image jQuery. Ils ajoutent un niveau dynamique à un dessin et juste assez de mouvement pour donner vie à une page statique sans créer trop de distraction.
La photographie utilisée dans le curseur est vraiment sympa. Les visages souriants attirent immédiatement votre attention et les couleurs vives avec une faible profondeur de champ indiquent un photographe professionnel. La troisième image des trois diplômés est un peu comme une photo, mais elle communique fortement le message que vous voulez, alors ça marche.
En fait, j'aimerais voir une version où le curseur d’image occupe tout l’espace occupé par la boîte horizontale en haut. Le? Parler à un expert? les informations peuvent être déplacées immédiatement en dessous. Cela pourrait en éloigner un peu les utilisateurs, mais je pense que cela renforcerait un peu l’attrait esthétique.
Alignement
La mise en page pourrait nécessiter un peu de travail, mais la plupart des éléments de la page sont clairement alignés et les sections sont assez distinctes visuellement. Cela peut sembler mineur, mais vous seriez surpris de voir combien de concepteurs professionnels connaissent peu ou pas les techniques d'alignement appropriées.
Amélioration
Voyons maintenant quelques modifications qui pourraient être apportées pour renforcer l’attrait visuel du site.
Logo et cadre de page
Tout d'abord, le logo est un peu une horreur et pourrait utiliser un rafraîchissement visuel. Si vous ne souhaitez pas renommer votre image pour le moment, accordez au moins une certaine attention au logo actuel. Le crénage doit être plus étroit après les lettres majuscules et les deux lignes de texte doivent être laissées alignées. L'alignement central actuel laisse le slogan coincé dans le no man's land et est un peu gênant.
En ce qui concerne le cadre de la page, cela semble un peu incohérent. J'aime les couleurs audacieuses utilisées dans la navigation, mais il semble étrange que cela s'étende sur toute la page et que le pied de page ne le permette pas. Mon conseil est de laisser tomber les ombres créant le faux cadre complètement et d’étirer l’en-tête et le pied de page sur toute la page.
De plus, pour donner au site un point de contraste encore plus fort et un en-tête clair, je voudrais étirer le dégradé de navigation vers le haut de la page et inverser le logo / copie. Voici une maquette simplifiée de ce que je veux dire:
L'élimination du cadre de la page pourrait fournir beaucoup plus d'espace pour espacer un peu les choses et donner un peu de souffle au design en augmentant l'espace blanc.
Le? Parler à un expert? Boîte
J'ai senti que cette zone pourrait utiliser une refonte. J'aime beaucoup le style et la conception du bouton en tant que pièce autonome, mais cela ne semble tout simplement pas correspondre au reste du site. J'envisagerais de réduire le rayon des coins arrondis (ou tout simplement de les rendre à 90 degrés) et d'abaisser la couleur plus foncée de la tête.
De plus, la tête flottante est un peu étrange. Je peux comprendre conceptuellement pourquoi un visage doit être ici, mais en ce qui concerne le design, cela ne fonctionne tout simplement pas. Je pense que cela est principalement dû à la coupure de style de coin qui se passe à sa droite et en bas. Cela donne à cette zone sans soudure un cadre superficiel qui n’existe qu’à cet endroit. Soit vous allez tout faire pour créer un cadre visible ou vous nixez complètement la tête flottante.
Les trois colonnes
Je vois deux problèmes principaux avec ce domaine, mis en évidence dans l'image ci-dessous.
Tout d’abord, une liste à puces devrait jamais être centré. Il sépare la puce du contenu et constitue une violation de l'objectif d'une liste à puces: une lisibilité facile et rapide. De plus, comme tout le reste du texte de la page est aligné à gauche, il est judicieux de suivre l'évolution de la tendance.
Enfin, la petite image de livre à l'extrême droite semble flotter dans l'espace. Il n'y a aucune explication de ce que c'est, pourquoi c'est là ou pourquoi je devrais cliquer dessus. Pour le moment, il crie après réflexion et doit en réalité être correctement intégré à la mise en page ou complètement.
À ton tour!
Pour résumer, Top Test Prep est un bon début, mais le concepteur devrait envisager de créer un en-tête plus fort, de supprimer le faux cadre de page et de résoudre les problèmes de mise en page susmentionnés.
Maintenant que vous avez lu mes commentaires, apportez votre contribution en donnant quelques conseils supplémentaires au concepteur. Dites-nous ce que vous pensez être génial à propos de la conception et ce que vous pensez pourrait être plus fort. Comme toujours, nous vous demandons d'être également respectueux du concepteur du site et d'offrir des conseils clairs et constructifs, sans aucune insulte dure.
Intéressé d'avoir votre propre site critiqué? Vous pouvez en savoir plus ici.