Catégories
Technologie

les limites des performances web

Je déteste les sites qui rament… d’ailleurs, comme beaucoup de monde, je fuis au bout de quelques secondes d’attente.

C’est une des raisons qui me pousse à optimiser les sites que je fais, en tout cas dans certaines limites !

En effet, en utilisant le service de google «PageSpeed», qui au passage est très bien fait et grâce auquel j’ai beaucoup appris, j’ai pu me retrouver bloqué dans mes optimisations par des composants hors de mon champ d’action ou de mon domaine de responsabilité.

Aucune maîtrise des composants externes

Sur un de mes sites perso (www.citation-et-proverbe.fr), j’ai installé google analytics, un bouton +1, google adsense et d’autres publicités. Les seuls éléments d’amélioration que je puisse apporter sur le site concernent ces éléments externes dont :

  • l’expiration n’est pas précisée dans de header HTTP
  • ces ressources sont servies avec des redirectionz
  • les javascript ne sont pas compactés

… et quelques autres dans le même style.

Rien que je ne puisse améliorer, sinon de retirer ces outils. Fort heureusement ce site est très rapide et pour peu que vous utilisez un plugin firefox comme ghostery, ces ressources ne seront même pas servies…

Note, ici c’est de la pub, ailleurs un widget de réseau social… les ajouts sont multiples et ont leur utilité.

Conclusion : intégrer un élément externe sur un site le ralenti.

Aucune influence hors de mon domaine de responsabilité

Sur d’autres sites, le problème est tout autre. Le contenu sur lequel le commanditaire veut communiquer et la présentation que le graphiste veut en faire rendront impossible toute volonté d’optimisation.

Typiquement, des sites comme le Hi Hôtel ou Areco sont lents pour ces deux raisons :

  • Trop de contenu à afficher
  • L’ensemble de ce contenu sur une même page

La lourdeur qui en résulte fait que le site rame et qu’il est long à charger. Certes, on peut moduler les lenteurs de chargement en ajoutant un «loader» qui vous fera patienter tranquillement, ou en chargeant certains éléments après coup… cela ne résoudra pas le problème in fine : trop de contenu en même temps.

Conclusion : ce n’est pas le fait du seul «développeur front» d’assurer la performance d’un site.

Les autres points importants du projet

Cela recoupe un peu la remarque précédente, mais dans les diverses techniques d’optimisation certaines vont avoir des effets sur la vie du site : la maintenance, le marketing et le référencement.

Ainsi, combiner et compresser les javascript et les CSS doit être refait à chaque mise à jour, l’idéal étant de l’automatiser.

Également, le chargement différé d’éléments textuels ne sera pas pris en compte dans le référencement naturel…

Et si, ajouter un widget relié à votre page facebook peut avoir une certaine utilité d’un point de vue communication et marketing, mais pas d’un point de vue de la performance web.

Au final, l’optimisation absolue, la quête de la performance n’est pas possible et vient se loger avec les différentes spécificités du projet. Les outils comme PageSpeed et YSlow permettent d’améliorer ses compétences, de trouver des points de blocage… mais pas nécessairement de faire un site rapide.

 

Catégories
Technologie

Pourquoi symfony

Si je devais vous dire en quelques mots ce qu’est symfony est pourquoi je l’utilise pour développer, voici ce que je dirais :

  • Symfony c’est un échafaudage, qui va permettre la réalisation de l’ouvrage.
  • Symfony c’est des briques, qu’il ne me reste qu’à assembler en ne pensant qu’à la problématique du client et à rien d’autre.
  • Symfony c’est des fondations : c’est testé, éprouvé, supporté… l’utiliser, c’est avoir la garantie d’appuyer son travail sur des fondations solide, c’est bâtir sur le rock.
  • Symfony c’est des méthodes de construction : quiconque connait ces méthodes peut reprendre et continuer un projet, ainsi un projet ne peut tomber sous le monopole d’une entreprise.
  • Symfony c’est une armature guide le développement pour éviter les erreurs classique.
  • Symfony c’est un plan de construction qui facilite la maintenance.

… est pourtant symfony ce n’est pas que ça !

Catégories
accessibilité Technologie

des champs accessibles avec label

Juste pour prêcher la bonne paroles aux développeurs web, voici un focus sur une balise HTML trop souvent oublié :<label>

Comme son nom l’indique, cette balise sert à étiqueté un champs de formulaire, c’est à dire à créer un lien entre le champs et le sens de ce champs : le texte qu’il le décris.

A quoi ça sert ?

  1. Souvent Toujours, la relation est évidente car le texte se trouve juste à côté, en tout cas graphiquement ce que ne voit pas une personne atteinte de handicap visuel !
  2. Pour tout ceux qui possède un handicap moteur, c’est à dire tout ceux qui n’ont pas joué à Quake et autre FPS, atteindre un bouton radio en moins d’une seconde est véritable défit ! La balise <label> permet de cliquer sur le texte accompagnant pour cocher ou non un bouton radio ou une case à coché, ce qui va leur simplifier la vie !

Comment ça fonctionne :

démo

<label for="yes" title="Oui">Oui</label>
<input type="radio" id="yes" name="test" />
<label for="no" title="Non">Non</label>
<input type="radio" id="no" name="test" />
l1040137.jpg
Trace blanche dans un ciel bleu

Cela fait longtemps que j’utilise cette balise qui permet d’améliorer considérablement l’ergonomie d’une application sans pour autant être difficile à mettre en place et sans nécessiter l’approbation de qui que ce soit.