Chaque semaine, nous examinons un nouveau site Web et en analysons le design. Nous indiquerons à la fois les domaines qui sont bien réalisés et ceux qui pourraient nécessiter du travail. Enfin, nous terminerons en vous demandant de fournir vos propres commentaires.
Le site actuel est Redka3d, le portfolio personnel d'un concepteur de sites Web indonésien.
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.
A propos du propriétaire du site
? Ma famille et mes amis m'appellent Tata, je suis un concepteur de sites Web indonésien et résidant actuellement à Jakarta. ?
Voici une section de la page d'accueil de Tata:
Performance du site
Avant de commencer notre critique sur le design, je dois dire que les temps de chargement d'une page peuvent être tout aussi importants, voire plus, que ce à quoi le site ressemble. L’Internet haut débit nous gâte tous et les utilisateurs n’attendront tout simplement pas plus de quelques secondes le chargement d’une page.
Redka3d semble souffrir de très longs temps de chargement de pages. Il s’agit probablement d’un problème temporaire avec le serveur, mais au cas où cela indiquerait un problème à long terme, j’ai pensé que je vous recommanderais de le vérifier.
Entête
Dès le départ, vous pouvez voir que ce site sera unique. L'idée ici est certainement audacieusement différente; le nom du site est enfermé dans un grand triangle avec différentes tailles de lettres.
J'avouerai qu'esthétiquement, cette section n'est pas ma préférée. Mais, comme il n’est pas conventionnel, le designer gagne des points de style.
Il reste cependant quelques problèmes à régler. Premièrement, les lettres du logo sont saignantes du triangle. Comme les lettres ont la même couleur que l’arrière-plan du site, elles ont l’impression de former des trous dans le triangle. Cependant, ils ne partagent pas l'ombre de la forme, ils ne sont donc pas vraiment découpés. Sur les bords, les lettres se détachent même du triangle et recouvrent des parties de son ombre. Cela crée une certaine confusion visuelle quant à ce qui se passe réellement ici. Je recommande de masquer les lettres pour qu'elles ne saignent pas ou de les couper du triangle.
La flèche constitue un autre domaine d’attention. La copie encourage les utilisateurs à cliquer ici. avec une grosse flèche, mais il n'y a rien au bout de la flèche, donc on a l'impression que quelque chose ne s'est pas chargé correctement. En vérité, l'élément sur lequel pointe la flèche est très petit et très éloigné de la flèche (le texte "Qui suis-je?"). Je recommande de repenser le fonctionnement de cette zone en modifiant la flèche, le texte ou les deux pour qu'ils soient plus clairement connectés.
Enfin, vous voudrez peut-être jouer avec les ombres et la couleur du texte utilisées sur le site. En règle générale, j'essaie d'éviter de faire l'ombre de mes ombres trop proche de celle des objets auxquels elles sont appliquées. La raison en est que lorsque ces couleurs sont trop similaires, l'ombre ressemble presque à un flou plutôt qu'à une ombre. Une solution simple consiste simplement à alléger l'ombre pour qu'elle diffère considérablement du texte.
Il suffit de regarder la différence que cela fait dans la lisibilité de votre texte.
La navigation
La navigation sur le site se situe juste sous l'en-tête. L'état par défaut est un texte en gras qui glisse vers la gauche en survol, tandis qu'une version plus claire y glisse. C'est un effet sympa. La transition est fluide et l'animation est amusante.
Cependant, vous souhaiterez peut-être ajuster légèrement l'espacement sur les états de survol. Chaque élément de texte est bien positionné dans l'état par défaut, mais dérive trop à gauche dans l'état de survol. Par exemple, dans l'image ci-dessous, le mot? Services? devrait être centré entre? Accueil? et? Vitrine? dans les états par défaut et stationnaire.
Lorsque vous cliquez sur la navigation, de nouvelles sections apparaissent via cet effet carrousel 3D. Il est difficile de décrire ou de montrer ici, alors assurez-vous de passer sur le site et de l'essayer. En fait, le site est juste rempli de jolis petits effets jQuery. C'est peut-être trop pour certaines circonstances, mais il est bon de tirer pour un? Wow? facteur sur un portefeuille personnel.
Suivez-moi
Le dernier domaine que nous aborderons est le hub de réseau social situé tout en bas. À cause de la grande? Suivez-moi? texte, cette zone place assez haut dans la hiérarchie visuelle bien qu’elle se trouve au bas de la page.
Le fait que cette zone attire tellement l'attention peut être bon ou mauvais, selon les intentions du concepteur. Si cette zone est censée être l’un des aspects les plus importants du site, cela fonctionne. Si ce n'est pas le cas, je vous conseillerais de modifier le design afin qu'il ne gêne pas le contenu ci-dessus.
En ce qui concerne les icônes sociales, je pense qu'elles sont un peu trop complexes visuellement. Toute cette ombrage peut devenir un peu brouillon, en particulier dans l’icône Digg. Ceux-ci liraient beaucoup mieux s'ils étaient inversés et simplifiés. Voici une rapide maquette de ce que je veux dire.
Enfin, dans le contexte du reste de la page, le flux Twitter ressemble un peu à une annonce. Google a entraîné nos yeux à ignorer complètement tout ce qui ressemble à une annonce textuelle. Je parierais donc que de nombreux internautes la ignorent sans se rendre compte de quoi il s'agit. Essayez de jouer un peu plus avec le style, en supprimant les liens bleus et en ajoutant un espacement vertical supplémentaire pour que cela ressemble moins à une publicité qu'à une caractéristique du site Web.
À ton tour!
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.