Développeurs faites vous apprendre le html


Nuage de mots de l'article : développeurs, faites vous apprendre le html

Une constante, quand on fait un tant soit peu d’intégration html est de vouer aux gémonies les graphistes et leurs designs farfelus.

Ne dites pas non, je lis vos blogs ou vous suis sur twitter.

Mais sincèrement, si IE6 ne foutait pas autant le bordel, l’intégration html des maquettes de graphistes seraient en général gérées à grands coups de png transparent et tout se passerait pour le mieux dans le meilleur des mondes.

On parle moins souvent des résultats plus ou moins hasardeux des travaux des développeurs, parce que le développeur c’est sacré, et c’est teigneux.

Seulement, voilà, il ne faut pas se voiler la face, il est plus simple d’intégrer une maquette de graphiste en créant la structure html qui va bien que de styler et habiller des pages générées par un développeur pour qui l’html c’est juste un vague truc qui balise du contenu.

Un exemple simple et pas plus vieux qu’hier ou j’ai du intervenir sur un projet pour un truc relativement simple, un menu déroulant en CSS.

Le menu de base n’est en fait qu’une suite de liens <a> séparés par un | le tout bien rangé dans un <div>, ça c’est le plus simple à gérer, le plus compliqué arrive quand on se rend compte que les pages n’ont pas… de doctype. Et là, avec IE 6 ou 7, ça devient amusant de gérer un menu déroulant en CSS quand on peut se coller les commentaires conditionnels ou je pense.

L’html en mode Quirks, c’est amusant, 2 minutes… ou pas en fait.

Un autre grand classique; les plugins WordPress, ou tout autre CMS d’ailleurs.

On trouve un plugin puissant, qui répond parfaitement au besoin du moment, c’est cool, ça réduit les coûts.

On l’intègre, et au moment de vouloir l’habiller pour l’intégrer au design, l’horreur. De la soupe de balise incompréhensible, ni identifiants ni classes que l’on peut aisément styler à la volée. Il faut tout recoder proprement, ce qui, bien sur, pose de gros problèmes en terme de maintenance pour suivre les mises à jour de l’outil.

Je crois bien que le pire que j’ai pu voir dans le genre, c’était un plugin (je ne sais plus lequel) qui générait un formulaire brut de chez brut, avec des textes présentant les champs sans balise label, ni id ni class sur aucun élément, tout était placé en brut…

J’ai du placer une surcouche javascript pour pouvoir styler correctement le plugin, l’enfer.

Et je ne parle même pas des développeurs anglophones pour qui UTF8 se limite à un charset.

Ce n’est d’ailleurs pas pour rien que l’on parle de plus en plus de développeur back et développeur front.

Mais quand même, s’il vous plait messieurs les développeurs, apprenez le html, ce n’est pas difficile de faire un petit effort, et ça rendra service à tout le monde, vous en premier.


21 réponses à “Développeurs faites vous apprendre le html”

  1. Bonjour Aymeric,

    sympa ce petit article, car le sujet fait partie de mon actualité professionnelle.
    Je ne sais pas pour toi, mais j’ai remarqué que dans pas mal de boîtes, ce sont de plus en plus aux graphistes à qui l’on demande de prendre en charge l’intégration html et css. Je trouve ça logique en fin de compte.

    A ce propos, je pense donc que le terme Webdesigner prend tout son sens.
    Le Webdesigner conçoit/crée la charte graphique d’un site internet, puis la découpe, et enfin l’intégre.
    C’est une très bonne idée et ce, pour au moins 2 raisons :

    économiquement parlant, c’est beaucoup plus rentable et viable ;
    techniquement, le graphiste réfléchira à deux fois avant de penser une charte graphique trop exotique, quasi impossible et ubuesque à intégrer.

    Cela n’engage que moi, mais il n’y a rien de pire que de travailler avec un graphiste print « sur le retour » qui n’a aucune notion des contraintes du web.
    Nombre de ces graphistes issue du print d’un âge certain (ou d’un certain âge) se sont tournés vers le design de sites web, pour des raisons purement économiques, la demande ayant explosé pour le web, chutée pour le print, devenu trop cher comme unique moyen de communication.

    Le web étant devenu Le vecteur de communication le plus efficace mais aussi le « moins coûteux », les graphistes print ont dû s’adapter pour continuer à travailler.
    Certains l’ont fait intelligemment en se formant aux techniques et contraintes d’internet, d’autres l’on fait à « l’arrachée ».

    Tu citais à juste titre les png, mais il ya aussi la question de l’intégration des médias (images, vidéos, flash), le manque de cohérence des pages les unes par rapport aux autres, la taille des polices et leurs styles (italic en pagaille par exemple), etc.
    Combien de fois avons-nous eu à faire à des clients ou des agences de com qui désiraient acheter un site mais en imposant une charte graphique réalisée par un tiers, totalement étranger à ces contraintes ? Un nombre incalculable de fois…

    Pour rejoindre le topic de ton article, j’ai envie de dire : chacun son métier.
    Pour moi, le développeur est là pour concevoir l’architecture et l’environnement technique d’un site, penser aux fonctionnalités et aux traitements de l’informations et des données.
    Il manipule le contenu.

    Le graphiste lui pense, réalise et intégre la charte.

    Et l’intégrateur, dans tout ça ? He bien je me suis tiré une balle dans le pied…
    Je pense qu’il reste tout de même indispensable.
    L’intégrateur affinera l’intégration, implémentera le javascript s’il y a lieu de le faire, fera en sorte que le site soit conforme aux recommandations du W3C, voire aux normes AccessiWeb en fonction de la cible visée, préparera le site pour un référencement naturel, en vue d’un référencement plus poussé peut-être.
    Il est un peu le pont, le lien entre tous les professionnels cités en amont, mais aussi ceux que je n’ai volontairement pas cités (car il y aurait tant à dire) : rédacteurs de contenu web, référenceurs, affiliateurs (ça se dit ou c’est encore un néologisme de mon cru ?), etc…

    Encore une fois, ces propos ne sont que le reflets de mon point de vue et de mon quotidien, en aucune manière je n’asséne de vérités profondes, hein ;-)

  2. Moi j ‘ai résolu le problème : j’ai demandé à un webdesigner intrégrateur spécialiste de l’ergonomie de me pondre le layout. J’avais néanmoins tout identifié auparavant. Ben j’avais pas trop mal fait mon boulot à la base car il m’a demandé que quelques corrections mineures.

  3. Et encore Aymeric, là t’es sur du HTML de site web dans t’as encore quelques possibilités pour trouver une solution.
    Là même chose à convertir en plus pour l’emailing… c’est à s’arracher les cheveux avec les racines, tu en sais qqch ;-)

  4. En effet, comme dans tous les métiers, il y en a qui le font mieux que d’autres. Certains développeurs font n’importe quoi avec le HTML (idem pour le PHP/Flash); certains graphistes bidouillent des graphismes sans tenir compte de leur intégration future… C’est un fait!

    Mais en lisant ton billet, j’ai eu l’impression que tu parlais « des développeurs » en général, et là par contre je ne suis plus d’accord. De la même manière qu’il serait injuste de dire « les graphistes ils font des designs inintégrables, faudrait qu’ils apprennent leur métier ». Il y en a, mais dieu merci tout le monde n’est pas à loger à la même enseigne!

  5. Je plussoie, mais de toutes façon il y a toujours un problème de communication entre le developpeur et l’intégrateur. Un exemple typique que j’ai véçu récement  étant de parler performances, limitation des en-tête HTTP, pour que le graphiste balance une maquette HTML avec 5 feuilles de styles CSS et je ne sais pas combien de Javascript (plugins mootools)…

    Raaalala, dure la vie !

  6. si IE6 ne foutait pas autant le bordel

    Quid des fix ?
    Ce n’est pas la panacée, mais au moins ça règle le problème :)

  7. Le journaliste (ou webmaster) peut également se demander pourquoi le webdesigner a réalisé une mise en page qui ne laisse pas de place pour l’expression.

    La création d’un site web, c’est un peu comme la construction d’un bâtiment, si il n’y a pas de cahier des charges, chaque intervenant se préoccupe peu de l’équipe suivante.

  8. @Pays : +1 !
    Je suis entièrement d’accord avec toi sur ce point.
    IL est vrai que souvent le client n’a pas de cachier des charges.
    Et lorsqu’on lui annonce qu’il faut en faire un, et en plus qu’il faut payer le temps passer à l’écrire,  arrive enfin le premier point de désaccord.

  9. J’ai été graphiste traditionnel, puis infographiste, puis webdesigner, puis webmaster.

    On ajoute de plus en plus de contraintes et au final on fait des sites qui se ressemblent tous.

    C’était bien le temps du Flash…

  10. Je n’étais pas le seul à le penser,  j’ai connu ça aussi lors de mon dernier emploi. C’est vrai que c’est pénible. Ils n’ont pas l’excuse de la difficulté d’apprendre le CSS ou le HTML car comparé aux langages de scripts ce n’est rien.

  11. Faudrait parfois que je pense à mettre des smileys dans mes articles…

    Duplex (rahhhhhh les pseudos SEO nandediou!!) : Ce n’est pas pour rien si on parle de plus en plus de dev back et dev front.
    L’intégrateur se transforme de plus en plus en dev front et c’est loins d’être une mauvaise nouvelle pour les évolutions de poste en entreprise.

    Da Scritch : oui mai toit tu triches, tu es déjà un adepte des standards convaincu.

    Charles Boone : tu veux parler de trucs comme la merde infâme que tu m’as demandé d’optimiser hier ? là c’est en fait plus un problème de graphistes en général.

    Lionel : depuis le temps que tu commentes ici, tu devrais savoir que j’ai l’habitude de grossir le trait. J’avais juste décidé de gueuler un coup sur les développeurs histoire de changer vu qu’en général, ce sont les graphistes qui sont la cible des intégrateurs.

    Palleas : j’adore ce genre de trucs, comme les mecs qui passent des plombes à optimiser leurs images pour ensuite coller 1 meg de JS dans leurs pages.

    Clément :
    les fix sont souvent casse gueule et encore plus souvent un enfer à maintenir, surtout au niveau des gestion de transparence des PNGs ou il n’y a pas, hélas, de recette miracle.

    Pays (pseudo SEO n°2) : je suis également fan d’analogies avec le travail du bâtiment, c’est en général assez parlant et votre exemple est très bon dans son genre.

    Riz au Yaourt (pseudo SEO N° 3, faut vraiment que je replace mon disclaimer) :  trop gros le troll, passera pas.

    Consultant (là ça finit par faire beaucoup) : encore faudrait il que les jeunes dev soient bien formés.

  12. @Aymeric : promis je n’utiliserai plus de pseudo SEO, tu verras cependant fleurir des pseudos comme « Hélène », « Emmanuelle », « Thérèse », voire pire encore comme « Kenza », « Samantha », ou encore « Tabata » … qui ont un taux de clics tout aussi efficace qu’un pseudo SEO =)

  13. les fix sont souvent casse gueule et encore plus souvent un enfer à maintenir, surtout au niveau des gestion de transparence des PNGs ou il n’y a pas, hélas, de recette miracle.

    J’ai déjà utilisé pourtant de très bon fix (dont PNG) qui on parfaitement marché ^^

    Je vais essayer de les retrouver (ça date).

  14. Clément : j’en ai quelques uns également, qui globalement fonctionnent plutôt pas mal, sauf quand on utilise des backgrounds image sur des éléments avec des positionnements farfelus, ce qui hélas arrive souvent avec des maquettes de graphistes.

    Mais au cas ou, je suis toujours preneur, en multipliant les outils, on finit toujours par trouver son bonheur.

  15. @Aymeric : Oui oui je sais, mais comprends que je peux pas non plus laisser passer ce genre de propos, c’est dévalorisant pour notre boulot ^^ Et puis d’abord, les dev c’est les meilleurs, NA! :D

  16. @ceux_qui_parlent_du_fix_png_transparent, la solution que j’utilise depuis quelque temps, c’est de faire des png8 ou gif256 via fireworks, qui offre un rendu bien meilleur que photoshop pour ces deux formats, et ça marche sans soucis sous ie6 (bien sur pour les autres browsers on garde le png24). Et pas de pb de background positionning comme avec le fix en question ;-)
     
    Plus d’infos la http://www.sitepoint.com/blogs/2007/09/18/png8-the-clear-winner/

  17. Au premier janvier dernier, c’était le premier anniversaire de ma décision d’abandonner le support d’IE6 ; parce que c’est tout ce qu’il mérite.

  18. Je n’étais pas le seul à le penser,  j’ai connu ça aussi lors de mon dernier emploi. C’est vrai que c’est pénible. Ils n’ont pas l’excuse de la difficulté d’apprendre le CSS ou le HTML car comparé aux langages de scripts ce n’est rien. De plus le HTML ou xHTML puis bientot HTML5, bref ce sont des standard à connaitre !