Internet-Formation change de design web et devient responsive !

Mathieu Chartier Actualités web 0 commentaire

Logo de l'agence web et centre de formation web Internet-Formation

Internet-Formation a fêté ses 7 ans d'activité en mai 2016, avec toujours Mathieu Chartier aux manettes (donc moi ^^). Derrière le centre de formation et la micro agence web que je gère avec toujours autant de passion, il a fallu que je m'active au milieu des contrats (référencement, audit, consulting, formations, création de sites...) pour réussir à pondre une nouvelle version du site www.internet-formation.fr davantage UX design et Google friendly.

La première version n'a pas été connue par la plupart d'entre vous car elle n'a montré son visage que durant un peu plus d'un an, avant de laisser place à l'ancienne version (v2) qui a perduré entre juillet 2010 et septembre 2016. Vous vous doutez bien qu'après 6 ans d'existence, et malgré quelques retouches, le graphisme et les technologies anciennes commençaient à peser. Il a donc fallu tout revoir, tout refaire, et surtout tout améliorer. :D

Les objectifs de ce nouveau site sont multiples :

  • Obtenir un design plus accessible et plus "tendance".
  • Passer enfin en responsive web design.
  • Améliorer l'expérience utilisateur avec de l'UX design et des fonctionnalités plus intuitives.
  • Recréer le générateur de devis de formation en ligne pour les stagiaires.
  • Affirmer la version HTTPS du site web.

Le logo sera conservé en l'état dans un premier temps car il est connu des services administratifs et clients comme tel, mais sur le site, vous verrez le nom dans une police simple et épurée. Tout le design a été revu et corrigé, mêlant flat design et UX design. Le site est entièrement programmé à la main à base de PHP 7, jQuery, HTML 5 et CSS 3. Je me suis efforcé de le rendre compatible avec un maximum de navigateurs (petite pensée pour les vieux IE... ^^) mais je ne garantis pas du 100% d'affichage parfait. Comme pour les versions précédentes, je m'efforce de ne pas intégrer de base de données car je veux limiter les requêtes et accélérer les processus.

Voici un exemple avec la page des formations web :

Page des formations web d'Internet-Formation

D'après mes tests, les pages obtiennent en moyenne 89/100 sur PageSpeed Insights, malgré toutes les photos et les scripts jQuery utilisés. Je n'ai trouvé aucune erreur HTML au validateur W3C sauf 2 warnings que j'ai rapidement nettoyés (pour être honnête, c'est la première fois que je fais aucune erreur du tout du premier coup). J'ai également ajouté du schema.org via JSON-LD pour l'ami Google et l'outil de test valide tout comme il se doit. Donc pour son lancement, le site est "propre", espérons que ça dure au fur et à mesure des améliorations. :D

Parmi les changements majeurs, la page d'accueil a perdu le parseur Google+ au profit d'un parseur Twitter fait à la main. De nombreuses fonctions PHP 7 viennent générer le menu ainsi que de nombreuses données automatiquement (c'est ce qui remplace la base de données) et des fonctionnalités en jQuery et Ajax ont été ajoutées.

J'ai encore 2/3 idées en tête pour proposer quelque chose de "différent" ou rare, pour rendre le site encore plus ergonomique et intuitif. Il ne me reste qu'à les réaliser quand le temps le permettra. J'espère que ce nouveau graphisme vous plaira dans l'ensemble et que les stagiaires ou clients voudront toujours faire confiance à Internet-Formation et moi-même. Merci encore pour votre soutien !