Site internet et identité digitale : la refonte de mon portfolio

Dans une campagne de communication, la création d’un site internet est une pierre angulaire de la stratégie digitale car un site vous permet de vous présenter en tant qu’entreprise, de vous positionner par rapport à la concurrence et de mettre en avant ce que vous proposez, que ce soit vos idées, votre savoir-faire, votre personnalité ou vos produits. En somme, un site établit votre présence et renseigne vos prospects sur vos produits. Alors, faites le bien !

En tant que graphiste-illustrateur autodidacte en 2D-3D, j’ai voulu présenter mon savoir-faire et montrer les travaux dont j’étais le plus fier. Et, par cette simple envie, j’ai décidé de créer un portfolio en ligne. C’était en 2012 et mes connaissances en développement de site internet se résumaient à... aucune... Encore moins en langage informatique ! Comme beaucoup de personnes, je me suis lancé et ai utilisé Wordpress pour réaliser la première version du site. Il n’y avait rien de plus simple : un thème (Oh ! - désolé, il n’existe plus), un design. Trois ans plus tard, changement de design, car je trouvais Oh ! trop limité. J’ai donc utilisé le thème gratuit PURE ; il était à la fois élégant et collait avec l’image que je souhaitais véhiculer. Mais aujourd’hui, après quelques années d’expérience et l’acquisition de connaissances en HTML et CSS, la question se pose à nouveau : dois-je changer l’aspect de mon portfolio ? Et la réponse est oui !

Les raisons de la refonte

J’ai souhaité effectuer la refonte de mon site parce que son aspect ne me plaisait plus et ne me correspondait plus (encore une fois, je me sentais limité en terme de design et de possibilités car certaines de mes idées étaient infaisables). Les éléments qui me posaient problème étaient les suivants :

• Le site était trop basique à mon goût
• Les travaux affichés n’étaient plus d’actualité
• Les zones de texte ainsi que les icônes étaient trop simples
• Le côté responsive n’était pas optimisé
• L’aspect marketing (oui, oui, il faut y penser en créant un site internet) était peu présent
• Et enfin, aucun aspect du site ne reflétait ma personnalité

Développement du site internet : quel design ?

Sur cette nouvelle version, la couleur de fond blanche n’est plus la couleur principale. J’ai opté pour un fond sombre, presque noir. Pourquoi ? Parce que le noir renvoie au sobre, à l’élégance, parce qu’il donne au site un aspect calme et serein. Autre raison qui m’a amené à choisir une couleur sombre : cela permet de faire ressortir les couleurs de mes travaux alors qu’une couleur claire proche du blanc peut parfois distraire l’œil. D’après vous, pourquoi les carrousels d’images sont plongés dans le noir ? Pour éviter toute distraction visuelle et vous plonger au cœur de l’image, plus ou moins comme dans une salle de cinéma. Souhaitant focaliser l’attention sur mes travaux, cette décision est venue tout naturellement.

La couleur principale étant choisie, il fallait une deuxième couleur qui accompagne et aide à définir le site. Il fallait trouver une deuxième couleur positive, qui fasse penser à l’accueil et apporte un aspect bienveillant. C’est pour cela que mon choix s’est porté vers une couleur chaude. Après quelques essais, j’ai opté pour une couleur énergique, liée au domaine de la créativité : un jaune-orangé. Il accompagne l’utilisateur sur les pages du site en mettant en évidence différents éléments du design. Cette combinaison simple et élégante habille le site.

Dans les prochaines semaines, je développerai une partie blog et, afin de lui donner une identité propre mais aussi afin de la différencier du reste du site, j’opterai pour un habillage plus classique avec une couleur de fond proche du blanc. Cela privilégiera le confort visuel des utilisateurs et évitera une fatigue visuelle lors de la lecture.

En dehors des aspects design, j’ai développé le portfolio autour d’aspects plus techniques comme le temps de chargement des pages, la sécurité des données (du site et celles des utilisateurs) et l’accessibilité.

Optimisation pour diminuer les temps de chargement

La vitesse de chargement d’un site devenant un incontournable dans le développement, je ne pouvais pas le laisser de côté (cela a un impact sur votre référencement mais aussi, potentiellement, sur les visiteurs de votre site). J’ai donc optimisé la vitesse de chargement avec les actions suivantes :

• Thème Wordpress Hello : j’utilise le thème Hello, créé par Elementor, pour sa simplicité d’utilisation, sa taille « poids plume » et parce qu’il fonctionne merveilleusement bien avec le plugin Elementor Pro ;
• Installation des plugins de cache Autoptimize et Asset CleanUp : ils réduisent la taille des pages HTML, des fichiers CSS et ils fonctionnent très bien en duo ;
• Fichier .htaccess : écriture de règles de mise en cache ;
• Optimisation de la taille des images : aspect simple mais très important, surtout lorsque le portfolio met en avant des dizaines de visuels. Elementor s’est avéré très utile pour cette tâche car il permet de spécifier la taille des images voulues selon le support (ordinateur de maison, tablette et téléphone portable).

 Grâce à ces actions, le site est rapide comme vous pouvez le constater ci-dessous (test réalisé le 10 mars 2021 via Lighthouse) :

Un site sécurisé contre les attaques extérieures

Même si votre site n’a pas pour vocation de vendre des produits, ni de collecter des données client, il est très important de penser sécurité. Pour me prémunir des possibles attaques de bots et de hackers, j’ai inséré quelques lignes de code dans le fichier .htaccess qui verrouillent l’accès à certains fichiers et ai déplacé l’accès de connexion au site. Voilà deux actions basiques qui permettent de renforcer la sécurité de votre site internet. Et enfin, j’utilise le plugin de sécurité Wordfence (version gratuite). Très simple d’utilisation, il me permet, entre autres, d’exécuter les actions suivantes :

• Voir le nombre d’attaques sur le site (au quotidien, sur 7 jours, sur 1 mois)
• Blacklister certaines adresses IP trop insistantes,
• Voir les mots de passes utilisés par les hackers pour se connecter,
• Créer une liste de mots de passe qui ne doivent pas être utilisés (blacklistant ainsi ceux qui les utilisent).

Il existe bien sûr d’autres plugins de sécurité très performants mais j’ai choisi celui-ci il y a quelques années et ne regrette pas mon choix.

Je sais que certaines personnes doivent se dire : et le référencement ? Quelle stratégie as-été mise en place ? As-tu optimisé les liens, les images, les textes ? Il est évident que cet aspect primordial de la conception d’un site a été pris en compte dans la stratégie de communication et de marketing. Cependant, comme j’envisage de faire évoluer le site dans les prochains mois, je n’aborde pas encore le sujet. Cela fera peut-être partie d’un autre article qui vous fera état des retombées en lien avec cette stratégie.

Site internet : www.kenji-graph.com

Facebook : Facebook