Webaaz » Web http://www.webaaz.com Le développement web de A à Z Thu, 19 Jan 2012 11:40:08 +0000 en hourly 1 http://wordpress.org/?v=3.3.1 Métier : Directeur Artistique / Designer Webhttp://www.webaaz.com/2011/04/metier-directeur-artistique-designer-web/ http://www.webaaz.com/2011/04/metier-directeur-artistique-designer-web/#comments Wed, 27 Apr 2011 13:36:14 +0000 Martin http://www.webaaz.com/?p=1180 Nous continuons cette série de portrait des acteurs du web avec un métier qui apporte de la beauté dans ce monde technique. Mais ne nous y trompons pas, il n'y a pas de bon design web sans technique et sans expérience !. J'ai demandé à Jessy Hihn @Graphijess, avec qui j'ai travaillé il y a quelques temps de me donner sa vision du web et de son travail. Jessy Hihn Photo de Jessy Hihn avec son aimable autorisation]]> Nous continuons cette série de portrait des acteurs du web avec un métier qui apporte de la beauté dans ce monde technique. Mais ne nous y trompons pas, il n’y a pas de bon design web sans technique et sans expérience !. J’ai demandé à Jessy Hihn @Graphijess, avec qui j’ai travaillé il y a quelques temps de me donner sa vision du web et de son travail.

Jessy Hihn
Photo de Jessy Hihn avec son aimable autorisation

L’interview

Mini-bio – Peux tu nous présenter rapidement ton parcours ?

Issu d’une formation de Communication, je suis entré en tant qu’assistant de directeur artistique (sebastienbouchard.com) en 2000 directement en webagency avant même de terminer mon cursus. Il a été mon mentor, m’a tout appris, sans jamais faire de rétention d’informations, et ça nous y reviendrons, mais c’est également dans le web un véritable “état d’esprit”. C’était les débuts d’internet avec 2 heures de connection par jour en 56ko pour uploader les travaux de la journée. :) Puis je suis passé Graphiste/webdesigner sur de beaux projets dans d’autres agences. J’ai commencé également a cette époque une double activité de freelance. Au bout de quelques années j’ai rejoint Vupar en tant que Directeur Artistique Web. En parallèle, j’ai participé à de nombreux projets collaboratifs dont lelab.net (qui a été l’un des premiers e-zine sur le graphisme.) et feu naoweb.com. Une véritable passion chronophage.

Pourquoi ce métier ?

Je crois que ca tient en un mot “passion” mais aussi “curiosité”. J’ai toujours aimé les challenges et je crois qu’il y a 15 ans, se lancer dans le web était un challenge, technologique mais surtout créatif. Animer des images, commencer a travailler l’ergonomie d’un site, le rendre disponible dans un très grand rayon géographique, c’était top. Travailler dans le web c’est être en perpétuelle recherche créative également. Ca va vite, très vite, tant graphiquement que technologiquement. C’est aussi toucher à énormément de domaines, allier photographie, vidéo, typographie, ergonomie, sens de lecture. C’est vaste, c’est en perpétuel mouvement, c’est sans fin, donc passionnant et amusant. C’est également une véritable “culture” très spécifique, presque une grande famille. Les relations développeurs / designers sont toujours particulières. On peut les croire très éloignées mais nous sommes un peu comme des frères (moines). Autant dire qu’un bon webdesigner sait aussi comment amadouer un bon développeur, en promettant moult bières en cas de prouesse technologique. C’est aussi ce genre de relation de confiance, de partage de connaissance unique dans la créativité qui fait que j’ai préféré ce métier. Dans le web, on travaille en équipe, en symbiose, on doit souvent mettre son ego de coté.

Quels est le petit truc en plus qui ne te ferait pas changer ?

Pour l’instant rien, ou plutôt tout. On est encore aux prémisses de l’interface technologique, le métier évolue vite. Plein de projets vont encore voir le jour. Je pense aux interfaces tactiles par ex. On a aussi un vaste champ vidéo à explorer. Mais en tant que graphiste il est bon aussi de travailler aussi sa créativité en continuant à travailler sur des supports papiers, travailler la typographie, ca ne fait que renforcer sa vision. Mais je crois que tant qu’on ne s’ennuie pas, et que l’on est encore dans les cordes, on y reste :)

Quelle est ton approche du web ? Pourrais tu travailler en dehors du web ? Es-tu dans le web par hasard ou est-ce une passion particulière ?

Je le vois comme un monde de passionné, de chercheurs fous, de doux dingues, de créateurs. C’est un monde qui ne plaisait pas à tout le monde auparavant. Un univers créatif et technologique ? Beaucoup étaient perplexes. C’est ce qui m’a plu. Je pense qu’il faut donc être particulièrement en veille et alerte pour y travailler. Mais ce monde a bien évolué. Souvent considéré comme cinquième roue du carrosse, le web est devenu primordial dans toute communication. Ca conforte encore plus l’idée d’y travailler. On le voit avec des agences comme Marcel (anciennement publicis.net) la communication vient de plus en plus souvent du digital. Même les grandes approches marketing prennent en compte des stratégies digital. Attention donc a ne pas nous faire “bouffer” par le marketing, il faut que le web reste un outil de création sans frein.

Quel est ton rapport avec les autres métiers du web ?

Ce n’est pas un monde de conflits mais de partage d’informations, d’échange. Donc tout se passe bien si vous ne tombez pas sur des collègues qui font de la rétention d’informations. Le travail commence principalement avec le chef de projet. Souvent passionné par le web aussi, c’est le début des zoning, de la calibration de contenu, du ton donné, le tout en accord avec le budget. Il va s’agir aussi de séduire ce dernier pour une bonne défense du projet face au client. On enchaine souvent avec des réunions de pré-production avec l’intégrateur, et l’équipe de développeurs. Bien connaitre la technologie sur laquelle va évoluer le site est déterminant pour les maquettes web. Ce sont principalement des réunions productives (ou pas) où chacun va pouvoir donner ses dernières trouvailles. Dans le web, c’est un travail d’équipe et complémentaire à tout moment. Contrairement à tous les anciennes méthodes de communication (print/publicitaire) c’est un vrai travail d’équipe.

Quel est le profil requis ? Les compétences indispensables ?

Une sensibilité graphique de base déjà. Une bonne curiosité, une bonne capacité d’assimilation technologique et graphique. Il faut digérer un paquet d’informations ! Il faut aussi une bonne dose de sociabilité et d’amour du travail en équipe. Mettez votre ego de coté si vous voulez faire ce métier. Je ne suis pas forcément un ayatollah des écoles de communication visuelle. Néanmoins pour introduire une bonne agence il est souvent nécessaire d’avoir le pass “ecole”. Mais je vois ces derniers temps sur le net des jeunes de 18 ans, avec déjà un profil incroyable. Ils ont déjà un portfolio conséquent et varié ! On voit tout de suite lorsqu’on reçoit des jeunes pour des stages ceux qui marcheront ou pas. Ceux qui ont un portfolio riche et varié par uniquement composé de dessins de natures-mortes ou d’affiches politiques. Message a tous ceux qui cherchent des stages en agence, créez-vous des sites factices, travaillez des interfaces tactiles, des icônes, de l’identité graphique corporate, bref variez ! ;)

Quel conditions de travail ? Quelles perspectives ? Peux tu préciser les particularités de ce métier ?

De la pression, des délais à respecter, une veille permanente, voici les points les plus “chauds” du métier. Négligeables à coté des points positifs. Mais comme beaucoup de métiers sympa il y a peu de postes pour beaucoup de demandes. Il faut donc se spécialiser, et jouer sa différence. La grande tendance est de passer auto-entrepreneur mais là encore la concurrence fait rage, sans compter qu’on apprend moins de choses seul. Après avoir fait des années de free-lance, je pense quand même que c’est un point positif d’être considéré comme entrepreneur par les responsables d’agence.

Un conseil en plus pour ceux qui s’intéressent aux métiers du web ?

Il faut se forger une véritable culture web, se spécialiser dans un domaine précis et le connaitre sur le bout des doigts. Essayez de variez vos travaux, votre portfolio, allez voir sur des sites comme behance.net, Cargocollective, ce que font les autres et prenez votre baffe :) Développez vous aussi sur les réseaux sociaux afin de bien connaitre twitter, Dribble etc. Détachez vous aussi des écoles qui veulent tout vous apprendre en quelques mois. Devenez autodidacte perpétuel.

En savoir plus…

Cet avis n’est pas forcément celui de tous les designers web ou directeurs artistiques, mais il m’a beaucoup intéressé, peut être parce que je le connais moins, peut être parce que son approche me plaît en tant que développeur, en tout cas avec lui le web avance dans le bon sens !

N’hésitez pas à poser vos remarques ou questions à Jessy dans les commentaires, nous nous ferons un plaisir d’y répondre !

Sur le même thème

]]> http://www.webaaz.com/2011/04/metier-directeur-artistique-designer-web/feed/ 0 Métier : Chef de projet webhttp://www.webaaz.com/2011/04/metier-chef-de-projet-web/ http://www.webaaz.com/2011/04/metier-chef-de-projet-web/#comments Tue, 05 Apr 2011 09:00:03 +0000 Martin http://www.webaaz.com/?p=1132 Je commence cette série de portrait des acteurs du web avec un rôle central, le chef de projet web. Il a un rôle de facilitateur, et doit faire le lien entre les différents acteurs. J'ai demandé à Rudy Rigot, avec qui je travaille de se prêter au jeu. Voilà sa vision du web et de son travail. Rudy Rigot Photo de Rudy Rigot avec son aimable autorisation]]> Je commence cette série de portrait des acteurs du web avec un rôle central, le chef de projet web. Il a un rôle de facilitateur, et doit faire le lien entre les différents acteurs. J’ai demandé à Rudy Rigot @rudyrigot, avec qui je travaille de se prêter au jeu. Voilà sa vision du web et de son travail.

Rudy Rigot
Photo de Rudy Rigot avec son aimable autorisation

L’interview

Mini-bio – Peux tu nous présenter rapidement ton parcours ?

Après un passage rapide par une grosse, grosse SS2I qui fait semblant de ne faire que du web (à faire en réalité du C++ pour le service public, aaaaargh), on peut dire que j’ai réellement découvert les métiers du web en entrant chez Clever Age, à l’origine en tant que développeur Java/J2EE.
Le gestion de projet s’est rapidement imposée à moi, non en tant qu’évolution naturelle du développeur (comme pas mal de recruteurs fourvoyés le pensent) mais plus comme le métier du web sur lequel je me sens personnellement avoir le plus de véritable valeur ajoutée. Et à l’opposé diamétral de mon précédent employeur, je me suis rapidement aperçu que j’avais eu la chance d’avoir été recruté par l’une de ces petites agences dont on parle beaucoup parce qu’elles brillent par la réputation de ses experts, tout en se permettant de lâcher la bride des consultants pour laisser libre court aux façons de faire qui sont propres. Autant dire que quand on me laisse les clés de la maison, c’est open bar, je me fais plaisir !
Après quelques temps à évoluer sous ce rôle-là, et prendre du plaisir à faire évoluer la symbiose Clever Age (les geeks) / Clever Garden (les artistes, l’entité étant née pile à mes débuts de chef de projet), j’ai récemment pris la direction du pôle des outils internes de Clever Age.

Dans un autre registre, je fais également partie du staff Sud Web cette année, qui organise les conférences cousines de Paris Web, mais dans le sud !

Pourquoi ce métier ?

Pourquoi un métier du web : pour la propension d’un projet à toucher un grand nombre de gens dans le monde ou en France (je suis un gros fan des métiers de la comm’ web !) ; pour l’énorme éventail de savoirs-faire pointus qu’un projet web nécessite, ce qui signifie un apprentissage permanent ; pour la qualité de la communauté, une gigantesque horde de passionnés éminemment humbles, où la curiosité fait loi par dessus tout.

Pourquoi la gestion de projet web : parce que pour moi, c’est l’endroit où tous ces métiers se recoupent, et que tous les domaines du web m’intéressent. Parce qu’un projet web, humainement, ce sont des rôles extrêmement opposés, et donc des personnalités contrastées, et qu’il faut savoir jongler avec l’aspect humain, qui est de loin le plus challengeant dans mon métier. Enfin, parce que deux projets ne se ressemblent jamais dans leurs aspects méthodologiques ; il n’y a pas deux journées qui se ressemblent !

Pourquoi la gestion de projet web chez Clever Age : parce que le fait que les projets soient réalisés chez nous de A à Z, du cahier des charges/storyboarding/prototypage, à l’hébergement (en passant par toute la réalisation technique front-end et back-end, bien sûr), ça permet d’avoir un vrai recoupement de tous les métiers, du typographe à l’administrateur réseau, du développeur PHP à l’expert en UX. Cela permet de mieux saisir et manipuler le projet web dans sa globalité. Également, pour la liberté qui est laissée à chaque projet, pour le fait de pouvoir expérimenter librement d’un projet à l’autre, pour parvenir toujours à des méthodologies créatives pour toujours mieux s’adapter au besoin du projet en particulier.

Pourquoi le pôle des outils internes : concrètement, c’est un pôle historiquement ingrat, puisque (bien que ce soient des projets essentiels dans la bonne conduite de l’entreprise en général) ce sont des projets difficiles à staffer, car leur retour sur investissement est difficile à établir clairement. C’est une contrainte qui est totalement logique, et relativement globale pour toutes les agences web dans le monde ; il suffit de savoir composer avec la contrainte de manière créative ! Paradoxalement, c’est aussi un pôle particulièrement gratifiant, puisque l’objectif principal est de tenter au mieux de comprendre mes chers collègues, afin d’améliorer au mieux leurs conditions de travail au quotidien.

Quels est le petit truc en plus qui ne te ferait pas changer ?

Une des qualités principales que je demande à ma carrière, c’est de ne jamais m’ennuyer ; et je crois que j’ai trouvé l’un des domaines où il est simplement impossible de tout maîtriser (voila qui est fait pour l’aspect théorique), mais aussi d’avoir deux projets qui se déroulent de manière similaire (et voila pour l’aspect pratique !)
En réalité, je ne dis pas que je ne changerai jamais au grand jamais de domaine, parce que je sais que je ne peux pas décider à l’avance de si quelque chose va m’ennuyer un jour ou non.
Mais je pense que le jeu de séduction entre les métiers du web et moi est encore bien loin de s’étancher.

Quelle est ton approche du web ? Pourrais tu travailler en dehors du web ? Es-tu dans le web par hasard ou est-ce une passion particulière ?

Tant que je serai toujours en phase d’étonnement et de découvertes par rapport au web, je pense que ma passion pour le domaine m’empêchera de faire quoi que ce soit d’autre.
Pourtant, je ne me suis pas retrouvé là-dedans par vocation de longue date : j’ai évolué dans les milieux du théâtre et de la comédie musicale pendant quelques années (inscription ratée à une école d’art dramatique après le bac, d’ailleurs), et longtemps dans l’hôtellerie (j’ai même été chef de réception, dites donc !), avant même de savoir que je voulais faire de l’informatique mon métier. Et d’ailleurs, je m’aperçois qu’au final, mon travail aujourd’hui a relativement peu à voir avec l’informatique en général. Le web est son propre sous-domaine, qu’il m’a fallu découvrir ensuite avec force surprise !
Toutefois, derrière les grosses montagnes, se trouvaient la richesse et le renouvellement perpétuel d’un nouveau milieu inattendu, qui auront eu raison de mon petit faible… :)

Quel est ton rapport avec les autres métiers du web ?

L’un des avantages de mon rôle dans un projet, c’est que par la force des choses, vous êtes en contact direct avec tous les métiers et toutes les compétences que peut recueillir le web, que ce soit sur un plan professionnel (vous devez comprendre les contraintes et les vocabulaires de chaque métier) ou sur un plan humain (vous devez être attentif et répondre aux attentes personnelles de chacun suivant leurs besoins)
J’aime l’ambiguïté qui fait qu’en tant que « chef », vous avez beau être celui qui prend les décisions, et donne les directions, vous restez profondément au service du reste de l’équipe. Quand un problème arrive, c’est à vous d’assister les divers experts pour les décharger des responsabilités qui peuvent troubler leur valeur ajoutée sur votre projet. Tout un métier, je vous dis !

Quel est le profil requis ? Les compétences indispensables ?

Je ne suis pas de l’école de ceux qui pensent que certaines choses ont la nécessité d’être innés. « Vous ne pourrez pas être chef de projet si vous n’avez jamais été organisé / communicant / expert technique / … » Je pense que tout s’apprend ; simplement certains apprennent plus vite, donc il faut se donner les moyens d’avancer dans les domaines où l’on se sent faible.
Il faut aussi essentiellement accepter de travailler avec des gens qui sont infiniment plus compétents que vous dans leur expertise, et avoir un jugement cohérent sur le fait qu’une décision vous revient, ou qu’elle devrait être prise par quelqu’un dans votre équipe qui maîtrise mieux le sujet que vous.
Après – et c’est essentiel – je pense aussi que certains développeurs ne sont pas du tout faits pour être chefs de projet, simplement parce qu’ils n’en ont pas du tout l’envie, et que ce n’est pas toujours un prolongement naturel. Je pense à l’exemple d’un expert technique de haut vol, qui avait tenté l’expérience de la gestion de projet, avait détesté, et avait décidé de recadrer son rôle sur des missions d’expertise technique avancée. Aujourd’hui, il dirige les aspects divers de l’expertise de sa boite et c’est un rôle où il s’éclate !

Quelle études ? Les principales manières d’arriver là d’après toi ?

Pour le rôle de chef de projet : RIEN !
C’est un métier qui n’a pas d’autre moyen d’être appris que dans le contexte. Ça ne signifie pas qu’il ne s’étudie pas, il y a toute une tonne de bouquins à lire sur différentes méthodologies ; mais les lire sans compréhension du contexte d’un vrai projet ne vous mènera nulle part. Donc si vous êtes étudiant, et que vous cherchiez un « stage en tant que chef de projet junior », sachez que vous êtes à côté de la plaque, mais grâââve !!
Pour le développement web (puisque je viens de là), il existe maintenant toute une tonne de formations très adaptées sur le sujet, mais rien ne vaut de débarquer en entretien avec tout un éventail de découvertes faites sur son temps personnel.
Je ferai un billet de blog détaillé sur le sujet du recrutement web très prochainement, il me faut juste le temps de lancer mon blog ! ;)

Quel conditions de travail ? Quelles perspectives ? Peux tu préciser les particularités de ce métier ?

Pour avoir testé les deux ambiances, je ne saurais mieux conseiller que d’éviter à tout prix les volumineuses, volumineuses agences web ; après, chacun étant différent, beaucoup trouvent leur compte dans ce milieu-là quand même, mais je n’ai jamais été aussi mal-en-place que là-bas. Je vous conseille une centaine de personnes maximum, 200 au pire du pire (si vous aimez tellement le patron que vous voulez l’épouser, par exemple)
Je vous conseille de ne pas écouter les arguments des employeurs, parce qu’ils disent tous strictement la même chose, certains honnêtement et certains très malhonnêtement. Référez-vous plutôt à ce qu’en dit votre entourage, ou recherchez sur internet des commentaires de gens qui y sont passés.

Une chose est sûre, si vous arrivez avec une vraie envie de découvrir et d’apprendre, et un vraie honnêteté, il y a beaucoup de boulot en ce moment sur le marché du service web !
Les salaires de base sont différents entre Paris et la province, mais globalement, pour un développeur débutant, je crois savoir qu’ils se situeront entre 28 et 32 k€ bruts par an. Et pour la suite, ce sera à vous de mettre en exergue votre valeur, et de négocier en fonction.

Un conseil en plus pour ceux qui s’intéressent aux métiers du web ?

Ce qu’on demande en entretien, de la curiosité, et ce, bien avant l’entretien, surtout, de l’honnêteté, et c’est bien souvent la valeur qu’on oublie le plus d’emmener avec soi !

En savoir plus…

Cet avis n’est pas forcément celui de tous les chefs de projet, mais il me semble très pertinent, après tout, je ne l’ai pas choisi par hasard. N’hésitez pas à poser vos remarques ou questions à Rudy dans les commentaires, nous nous ferons un plaisir d’y répondre, et visitez son nouveau blog qui devrait aborder le web sur un ton sympathique…

Sur le même thème

]]> http://www.webaaz.com/2011/04/metier-chef-de-projet-web/feed/ 0 Les métiers du webhttp://www.webaaz.com/2011/04/les-metiers-du-web/ http://www.webaaz.com/2011/04/les-metiers-du-web/#comments Mon, 04 Apr 2011 09:18:05 +0000 Martin http://www.webaaz.com/?p=1135 Extrait d'un écrit de Saint Isidore de Séville issu de Wikipédia Je suis amené par mon travail et par ce blog à rencontrer beaucoup de personnes qui travaillent dans le web, ou pour le web, mais j'en rencontre également d'autres qui l'envisagent et qui demandent des conseils. Nos métiers sont encore peu connus, et quand j'ai débuté dans le web je n'imaginait pas qu'il en existait autant, et encore, il y en a encore bien plus aujourd'hui. En travaillant sur des projets variés mais bien structurés, on rencontre une foule de personnes très intéressantes, et passionnées, avec des histoires à raconter... Ce sont précisément ces personnes que je côtoie quotidiennement que je vais vous faire rencontrer au travers d'une série d'interview sur les métiers du web. Je n'ai choisi que des passionnés pour qu'ils vous expliquent pourquoi ils ont choisi le web, ou pourquoi le web les a choisi, pour qu'ils expliquent comment ils le vivent, ce qui les a amené là, et quels conseils ils peuvent vous donner si vous avez les mêmes envies... Je souhaite mettre en avant leur métier mais aussi leur personnalité, le web c'est eux ! Je n'ai pas encore une liste bien établi pour tous les profils que je souhaite présenter alors n'hésitez pas à me contacter si vous aussi vous souhaiter partager votre expérience ! Et puisque c'est la saint Isidore de Séville aujourd'hui, bonne fête à tous les informaticiens ! Saint Isidore de Séville, saint patron des informaticiens Extrait d'un écrit de Saint Isidore de Séville issu de Wikipédia]]> Saint Isidore de Séville, saint patron des informaticiens
Extrait d’un écrit de Saint Isidore de Séville issu de Wikipédia

Je suis amené par mon travail et par ce blog à rencontrer beaucoup de personnes qui travaillent dans le web, ou pour le web, mais j’en rencontre également d’autres qui l’envisagent et qui demandent des conseils. Nos métiers sont encore peu connus, et quand j’ai débuté dans le web je n’imaginait pas qu’il en existait autant, et encore, il y en a encore bien plus aujourd’hui. En travaillant sur des projets variés mais bien structurés, on rencontre une foule de personnes très intéressantes, et passionnées, avec des histoires à raconter…

Ce sont précisément ces personnes que je côtoie quotidiennement que je vais vous faire rencontrer au travers d’une série d’interview sur les métiers du web. Je n’ai choisi que des passionnés pour qu’ils vous expliquent pourquoi ils ont choisi le web, ou pourquoi le web les a choisi, pour qu’ils expliquent comment ils le vivent, ce qui les a amené là, et quels conseils ils peuvent vous donner si vous avez les mêmes envies… Je souhaite mettre en avant leur métier mais aussi leur personnalité, le web c’est eux !

Je n’ai pas encore une liste bien établi pour tous les profils que je souhaite présenter alors n’hésitez pas à me contacter si vous aussi vous souhaiter partager votre expérience !

Et puisque c’est la saint Isidore de Séville aujourd’hui, bonne fête à tous les informaticiens !

Saint Isidore de Séville, saint patron des informaticiens
Extrait d’un écrit de Saint Isidore de Séville issu de Wikipédia

Sur le même thème

]]> http://www.webaaz.com/2011/04/les-metiers-du-web/feed/ 3 Optimiser l’utilisation d’Eclipsehttp://www.webaaz.com/2010/09/optimiser-lutilisation-declipse/ http://www.webaaz.com/2010/09/optimiser-lutilisation-declipse/#comments Thu, 30 Sep 2010 13:30:11 +0000 Martin http://www.webaaz.com/?p=329 Utiliser un Environnement de Développement Intégré c'est bien, en profiter au maximum c'est mieux. Que vous soyez adeptes d'un éditeur de texte minimaliste ou d'usine à gaz, il est important d'en maitriser les principales fonctionnalités et de connaître les l'étendue des possibilité pour s'adapter au mieux. En tant que développeur Java, mais surtout PHP, souvent sur Linux mais parfois sous Windows, Eclipse s'est imposé à moi, par son adaptabilité et aussi son prix. Il possède d'autres facettes bien sympathiques, c'est l'objet de ce billet ! Ballooner eclipse Photo de robotson depuis Flickr]]> Utiliser un Environnement de Développement Intégré c’est bien, en profiter au maximum c’est mieux. Que vous soyez adeptes d’un éditeur de texte minimaliste ou d’usine à gaz, il est important d’en maitriser les principales fonctionnalités et de connaître les l’étendue des possibilité pour s’adapter au mieux.

En tant que développeur Java, mais surtout PHP, souvent sur Linux mais parfois sous Windows, Eclipse s’est imposé à moi, par son adaptabilité et aussi son prix. Il possède d’autres facettes bien sympathiques, c’est l’objet de ce billet !

Ballooner eclipse
Photo de robotson depuis Flickr

Présentation

Eclipse est un IDE libre, multiplateforme (Linux, Windows, Mac), développé en Java.
A l’origine développé pour Java il s’est vite imposé comme une référence dans le monde Java, mais il prends de plus en plus de place dans l’écosystème PHP.

Sa conception modulaire, constituée de dizaines de plugins branchés les uns sur les autres en fait un projet facilement extensible.

C’est ce qui à permis d’avoir aujourd’hui différentes branches officielles ou non. Voici les plus connues :

Il existe d’autres distributions, officielles ou non, payantes ou gratuites constituées de multiples plugins et optimisées pour un usage précis.

Il faut noter que le développement du cœur de l’application comme des plugins principaux est très active, avec des nouveautés régulières.

Installation

Eclipse est complètement indépendant de la plateforme sur laquelle il est installé. En fait il n’est pas vraiment installé, il s’agit ni plus ni moins que d’une copie de fichier. Il ne faut donc pas de droits particuliers pour le faire fonctionner. Eclipse à donc de fait la particularité de pouvoir être utilisé sur une machine en parallèle avec d’autres versions d’Eclipse.

Ainsi, plutôt que d’avoir une version d’Eclipse avec les plugins JDT et PDT, n’hésitez pas à installer plusieurs branches, qui pourront vivre séparément avec chacune ses workspaces, ses plugins et son paramétrage.

Gestions des workspaces

Au premier lancement, Eclipse demande de définir un espace de travail. C’est ici qu’il stockera les informations relatives à votre travail. Vous pouvez en créer autant que vous le souhaitez, c’est particulièrement utile quand on travaille sur des projets qui n’ont rien en commun, et qui pourront ainsi avoir leur espace de travail dédié, paramétré au plus près des besoins et sans superflu.

Vous pouvez facilement switcher d’un espace de travail à un autre et même lancer deux instances de votre installation d’Eclipse avec des workspaces différents ! Utile pour comparer deux projets !

Configuration

La configuration d’Eclipse est très complète et même complexe au premier abord. Elle mérite que l’on s’y attarde un peu pour la maîtriser correctement.
La configuration se fait dans un premier temps au niveau du workspace, puis au niveau du projet.

On a ainsi une configuration globale commune à tous les projets avec la possibilité de surcharger celle ci pour des cas précis.

Le gestionnaire de configuration dispose d’une fonctionnalité très pratique de recherche par mot clé, indispensable pour gagner du temps !

Ajout de plugins

Il existe une multitude de plugins, certains soutenus par Eclipse, d’autres indépendants. Certains nécessitent l’installation d’autres plugins pour fonctionner.

Vous en trouverez pour :

  • La gestion de version
  • L’édition de fichier XML
  • L’édition de fichier de traduction
  • Maquettage
  • Gestion de serveurs web
  • Revue de code

Et encore tout plein… (un bon millier !)

Développement de plugins

C’est une fonctionnalité sous utilisée car peu connue, mais pourtant bien pensée et relativement simple à mettre en place. Des plugins simples mais utiles peuvent être écrits en quelques minutes, pour par exemple vérifier qu’une règle sur le nommage des variables est bien respectée.

Je vous invite bien sûr à mettre vos plugins, à la disposition de la communauté, qui pourra les réutiliser et les enrichir !

Pour aller plus loin

Eclipse c’est toute une communauté, avec différents canaux de communication et d’entraide, vous trouverez donc toute l’info dont vous avez besoin sur la galaxie Eclipse…

Pour finir…

A vrai dire, depuis 2005 que j’utilise Eclipse, je n’ai jamais pris le temps de m’y mettre, mais la présentation du sujet au Forum PHP 2008, m’avait bien plu.

J’aimerai avoir vos retours d’expérience sur l’utilisation d’Eclipse en général et sur la création de plugins en particulier ! A vos claviers !

Sur le même thème

]]> http://www.webaaz.com/2010/09/optimiser-lutilisation-declipse/feed/ 0 Paris Web 2010, j’y serai !http://www.webaaz.com/2010/08/paris-web-2010-jy-serai/ http://www.webaaz.com/2010/08/paris-web-2010-jy-serai/#comments Mon, 23 Aug 2010 11:52:32 +0000 Martin http://www.webaaz.com/?p=964 Photo de Reinante El Pintor de Fuego depuis Flickr Paris Web c'est pour bientôt ! Il reste des places à tarif réduit jusqu'à fin août ! Mais dépêchez vous ! Je n'ai pas encore eu l'occasion de m'y rendre, juste beaucoup d'envie, et ce sera donc ma première participation. J'y vais pour me tenir au courant sur des sujets qui me tiennent à cœur, aussi personnellement que professionnellement. Des sujets qui me passionnent et qui seront au centre de l'évènement. Je peux donc le dire : Paris Web 2010, j'y serais ! Paris Web 2010, j'y serais Au passage j'ajoute qu'après avoir passé du temps en SSII ou l'on fait du web sans trop se préoccuper de ce qui me parait fondamental (qualité, standards, accessibilité, bonnes pratiques...) ou alors de façon superficielle, sans en comprendre l'essence même, je suis plutôt content de voir que Clever Age est partenaire officiel de Paris Web 2010. Que vous soyez déjà inscrit ou prêt à le faire, j'espère vous y retrouver, laissez un commentaire qu'on trouve le moyen de se croiser et de discuter un peu web ! Sous le ciel de Paris Photo de Reinante El Pintor de Fuego depuis Flickr]]> Sous le ciel de Paris
Photo de Reinante El Pintor de Fuego depuis Flickr

Paris Web c’est pour bientôt ! Il reste des places à tarif réduit jusqu’à fin août ! Mais dépêchez vous !

Je n’ai pas encore eu l’occasion de m’y rendre, juste beaucoup d’envie, et ce sera donc ma première participation. J’y vais pour me tenir au courant sur des sujets qui me tiennent à cœur, aussi personnellement que professionnellement. Des sujets qui me passionnent et qui seront au centre de l’évènement. Je peux donc le dire : Paris Web 2010, j’y serai !

Paris-Web 2010, j’y vais ! (du 14 au 16 octobre).

Au passage j’ajoute qu’après avoir passé du temps en SSII ou l’on fait du web sans trop se préoccuper de ce qui me parait fondamental (qualité, standards, accessibilité, bonnes pratiques…) ou alors de façon superficielle, sans en comprendre l’essence même, je suis plutôt content de voir que Clever Age est partenaire officiel de Paris Web 2010.

Que vous soyez déjà inscrit ou prêt à le faire, j’espère vous y retrouver, laissez un commentaire qu’on trouve le moyen de se croiser et de discuter un peu web !

Sous le ciel de Paris
Photo de Reinante El Pintor de Fuego depuis Flickr

Sur le même thème

]]> http://www.webaaz.com/2010/08/paris-web-2010-jy-serai/feed/ 3 Les générateurs de sprites CSShttp://www.webaaz.com/2010/04/les-generateurs-de-sprites-css/ http://www.webaaz.com/2010/04/les-generateurs-de-sprites-css/#comments Wed, 28 Apr 2010 13:06:20 +0000 Martin http://www.webaaz.com/?p=540 CSS est désormais éprouvée et bien documentée. Il existe de bons ressources pour les mettre en place simplement et pourtant, on en voit finalement assez peu. Ceux qui les utilisent sont convaincus, mais l'optimisation de sites web semble toujours un truc inutile, comme l'accessibilité ou l'ergonomie... C'est à mon sens une hérésie, et les performances, comme l'accessibilité ou l'ergonomie devraient faire partie des premières réflexion sur la plupart des projet web. Pour vous sensibiliser à cette technique je vais donc vous présenter quelques outils utiles à sa mise en place. Sprite Photo de Jeff Kubina depuis Flickr]]> La technique des sprites CSS est désormais éprouvée et bien documentée. Il existe de bons ressources pour les mettre en place simplement et pourtant, on en voit finalement assez peu.

Ceux qui les utilisent sont convaincus, mais l’optimisation de sites web semble toujours un truc inutile, comme l’accessibilité ou l’ergonomie…
C’est à mon sens une hérésie, et les performances, comme l’accessibilité ou l’ergonomie devraient faire partie des premières réflexion sur la plupart des projets web.

Pour vous sensibiliser à cette technique je vais donc vous présenter quelques outils utiles à sa mise en place.

Sprite
Photo de Jeff Kubina depuis Flickr

Performance ?

Avant de voir comment faire voyons déjà pourquoi le faire. En deux mots, des performances de votre site web, dépendent la qualité de votre référencement et la qualité de surf de vos visiteurs. Votre rentabilité est donc en lien direct avec la rapidité de votre site.

Avant de songer à changer de serveur, il y a deux points importants à traiter pour améliorer votre site :

  • Limiter le poids des données
  • Limiter le nombre de données

Les sprites CSS permettent de limiter le nombre de fichiers en les combinant. Cela amène aussi en règle générale à une diminution du poids total des images.

Pour en savoir plus sur l’optimisation :

Méthode

Pour ce qui et de la technique des sprites, je vous renvoie vers le bon tutoriel de Pompage :

Pour l’essentiel, sachez que seules les images qui servent au design de votre site peuvent être utilisées. Les images du contenu ne doivent pas subir ce traitement !

Webwares

Pour une utilisation simplifiée on trouve pas mal d’applications web qui fournissent un outil de génération de sprites. Il suffit de fournir vos images sous forme d’archive, de préciser vos paramètres (alignement, espace entre les image, préfixes css…). Il ne vous reste plus qu’à télécharger votre image et le code CSS associé et à les intégrer dans votre site web.

En voici quelques exemples :

Celui-ci est un peu différent puisqu’il permet de redéfinir le style CSS à partir d’un sprite. Utile si vous faites le sprite vous même ou si vous avez perdu le code CSS !

software

Pour une intégration plus poussée dans votre processus d’intégration, il existe aussi des outils en ligne de commande :

Vous pourrez ainsi automatiser cette tâche dans un script. Très utile si vous devez régénérer régulièrement des sprites dans le cadre d’un cycle d’intégration continue par exemple !

Il faut noter que la version Java est sous license Open Source BSD License et la version Python

Conclusion

Des outils indispensables aujourd’hui ! Vous n’aurez plus d’excuses pour ne pas les utiliser !
Et pour plus de résultats, n’oubliez pas de merger et de compresser vos fichiers CSS et de supprimer les méta données de vos images !

Sur le même thème

]]> http://www.webaaz.com/2010/04/les-generateurs-de-sprites-css/feed/ 1 Optimiser son site webhttp://www.webaaz.com/2009/10/optimiser-son-site-web/ http://www.webaaz.com/2009/10/optimiser-son-site-web/#comments Thu, 01 Oct 2009 16:00:03 +0000 Martin http://www.webaaz.com/?p=267 Photo de GemMoth depuis Flickr]]> La vitesse d’affichage d’un site web est très importante pour capter les visiteurs. Les internautes sont dans l’instantanéité et ne veulent pas attendre pour voir votre page. Avec quelques astuces simple à mettre en place, vous pouvez retenir vos visiteurs et améliorer leur expérience d’utilisateur, ce qui les incitera à revenir.

Il faut bien avoir en tête que ce sont les petits gains par ci par là qui feront la différence. Cela vous demandera finalement assez peu de travail pour les premiers résultats et beaucoup plus pour arriver à un résultat parfait. Mais même sans pousser la démarche jusqu’au bout, l’effet sera bénéfique en termes d’audience, et votre taux de transformation devrait augmenter lui aussi.

Voici donc quelques conseils, et quelques références afin de maîtriser le sujet

La vitesse de la lumière
Photo de GemMoth depuis Flickr

L’optimisation c’est quoi ?

On peut voir dans un premier temps l’optimisation comme la mise en œuvre des moyens disponibles pour améliorer l’existant. Un second temps permet d’accentuer encore les performances en ajoutant de nouveaux moyens. Nous traiterons uniquement du premier point ici. Changer d’hébergeur ou de serveur pour augmenter vos performances est un solution, mais avant cela tout un panel de techniques permet de faire mieux avec les mêmes ressources.

Quelques statistiques

La taille des pages a plus que triplé en 5 ans, passant de 90Ko à 310Ko. Dans le même temps on a aussi doublé le nombre de composants externes par page (de 25 à 50)Une page web c’est en moyenne 500 mots et 600 balises HTML ! Si l’on ajoute a cela que le nombre de connexion RTC est encore non négligeable aux États-Unis par exemple.

Perdre 500ms c’est perdre 20% de trafic pour Google et réduire de 25% le poids de la page c’est gagner 25% d’utilisateurs à moyen terme pour Google. Augmenter la latence de 100ms c’est perdre 1% de ventes pour Amazon. Pour Yahoo! perdre 400ms c’est avoir 5 à 9% d’abandon en plus.

A partir de 4 secondes d’attente on perd massivement les visiteurs…

Que doit on améliorer ?

Les améliorations à prévoir sont au niveau du paramétrage du serveur, de la qualité du code, de choix techniques, de la gestion des composants web…

Des outils sont là pour vous aider à identifier les points importants parmi lesquels on trouve des plugins Firefox :

Et des sites de mesure de performance :

Notez que ces derniers pourrons vous permettre de tester votre site depuis l’autre bout du monde et voir les impacts que cela a sur votre site.

Deux règles principales pour la performance des sites web sont de réduire le nombre de requêtes HTTP et de limiter la taille des données qu’on télécharge. Voyons cela plus en détail.

Optimisation de la configuration du serveur

La mise en cache

La mise en place d’un cache côté serveur est une bonne chose et permettra de fournir un contenu plus rapidement à l’internaute, mais le protocole HTTP permet lui aussi quelques prouesses. Il est efficace pour la moitié des utilisateurs qui affichent une première page de votre site. Soit parce qu’ils sont déjà venus auparavant ou parce que vous partagez des ressources avec d’autres sites via des CDN.
Dès la deuxième page de votre site il est bénéfique pour 80% des utilisateurs, les 20% restants ayant par exemple désactivé leur cache.

Configurez donc votre serveur pour qu’il envoie des indications de mise en cache au navigateur.

La compression des données

On peut gagner entre 50 et 90% du poids d’une page pour une occupation serveur de 5%. Si votre serveur le permet en terme de ressources, le bénéfice sera immédiat, et encore plus pour les connexions lentes.

ETags

Désactivez les ETags si le site est en cluster. Leur performance est alors très aléatoire. Si vous n’avez pas de cluster, vous pouvez les laisser, même si YSlow vous fait la remarque.

Impacts de la latence réseau

Avec un temps de latence avec le serveur de 20ms, pour 25 requêtes externes on perd donc une demi seconde ! Et encore le temps de latence est plus souvent entre 30 et 60 ms. On peut cependant relativiser un peu car la parallélisation des téléchargements permet de limiter cet effet.

Il est donc important de limiter le nombre de composants à charger par page.

L’utilisation de connexions persistantes sur des serveurs statiques (CDN) paraît être un bon moyen de limiter les effets de la latence, mais son paramétrage peut être délicat et dépends de votre cas particulier. L’abus de cette techniques pourrait avoir l’effet inverse en engorgeant le serveur de connexions persistantes inutiles.

Pour la concaténation de vos fichiers, un module d’Apache permet de faire le travail côté serveur, je ne l’ai pas testé, mais j’attends vos retours sur le sujet dans les commentaires :

Optimisation du code source

HTML

Un code standard limite le travail de l’interpréteur HTML, par rapport à un code illisible que le navigateur devra corriger à la volée.
Limiter la profondeur du DOM pour limiter le reflow, c’est à dire la réorganisation de la page par le navigateur en cas de changements au niveau de la structure de la page. Pour les tableaux vous pouvez utiliser le mode de rendu fixe des tableaux HTML pour limiter le reflow.

Vous devez limiter les iframes qui sont coûteuses en termes de performances, même vides.

CSS

Pour les frameworks CSS, utiliser un cache central (google, yahoo…) permet de partager un cache avec tous les autres utilisateurs du CDN. Ainsi il y a de fortes chances pour que vos librairies soient déjà en cache dans le navigateur de votre visiteur.

Mettre les scripts en début de page pour que le navigateur puisse faire la mise en page le plus tôt possible.
L’utilisation conjointe de scripts externes minimisés, permet de gagner jusqu’à 25% du poids des feuilles de style.

Ne pas utiliser @import pour les CSS, moins performant et ne pas utiliser les filtres CSS, non standard et très coûteux en ressources. Si vous avez des modifications CSS à faire, faites les d’un seul coup pour éviter le reflow et non pas dans une boucle !

Javascript

Pour les bibliothèques génériques (jQuery, Dojo…) l’utilisation d’un cache central (google, yahoo…) permet comme pour les CSS de partager un cache avec tous les autres utilisateurs du CDN.

Pour optimiser encore mettez les scripts en fin de page. Le navigateur pourra afficher la page correctement avant de les charger, et l’utilisateur pourra naviguer avant la fin du chargement. Le temps qu’il interagisse avec la page, le Javascript sera chargé.

Comme pour les CCS, des scripts externes minimisés, permettent de gagner jusqu’à un tiers du poids des fichiers.

Et dans vos scripts utilisez des sélecteurs précis basés sur l’id et pas sur les classes css, l’identifiant étant unique la navigateur retrouve plus facilement la balise demandée; que si il doit analyser toutes celles de la page.

Ajax

Ajax permet d’améliorer le ressenti utilisateur en limitant le rechargement de la page au strict minimum. C’est donc une bonne piste d’optimisation, mais attention à le faire le mieux possible. Pour cela, envoyer les requêtes AJAX avec la méthode get et utiliser le cache de requête HTTP.
Pour le format de données vous pouvez utiliser JSON ou XML, les deux solutions ont leurs avantages et inconvénients, mais sont bien plus performantes que d’envoyer du code HTML pur !

Optimisation des images

Les formats d’image

En JPEG on peut gagner jusqu’à 90% du poids d’une image avec une perte acceptable (compression autour de 55, à tester car chaque logiciel implémente sa propre échelle de compression). Idéal pour les photos.

En PNG on peut gagner entre 75 et 90% du poids de l’image sans perte. Idéal pour des images avec du texte. Attention à prendre du PNG8 et non pas 24 !

Le GIF ne devrait jamais être utilisé, sauf éventuellement pour du GIF animé.

Sprites et métadatas

L’utilisation des sprites, permet de diminuer l’impact du temps de latence et le poids des images. Le poids du sprite généré est inférieur à la somme des images qui le composent !

La suppression des metadata des images avec Smushit, Optipng, Pngcrush ou PunyPng apporte un gain de 15% environ du poids des images en supprimant les données inutiles dans un contexte web des photos.

Favicon

Même si il n’est pas spécifié, les navigateurs le cherchent et chargent une page 404 si il n’est pas présent. Cela peut donc être très coûteux, surtout si votre page d’erreur personnalisée est lourde.

Ma référence pour avoir des information et des tests sur le traitement des images :

D’autres pistes d’optimisation

Il faut à tout prix limiter les redirections sur la page d’accueil, cela augmente la latence et n’est souvent qu’un mauvais palliatif à une solution plus pérenne. Ce n’est d’ailleurs pas bon non plus pour votre référencement.

Les cookies

Un cookie est envoyé avec chaque requête http, il faut limiter strictement leur taille, un cookie de 1ko retarde la réponse de 16ms en moyenne, avec 50 composants dans la page, on gagne donc 0,8s ! Il faut donc si vous le pouvez limiter les cookies aux sous domaines afin qu’il s n’impactent pas le téléchargement des autres ressources. En utilisant un CDN ou un sous domaines pour les données statiques, vous règlerez le problème.

DNS

Le temps de résolution d’un domaine tourne autour de 30ms. Multiplier le nombre de domaine permet de paralléliser les téléchargements. Certains « vieux » navigateurs ne téléchargent que deux ressources simultanément, mais les plus récents en prennent 4 fois plus en moyenne. Limiter le nombre de domaines à 4 est un bon compromis.

Buffer

Il est important également d’envoyer votre buffer le plus rapidement possible. L’utilisateur verra sa page commencer à se charger plus rapidement. Son ressenti sera bien meilleur, surtout si les temps de génération de votre page sont longs.

Références utiles

Une des meilleures références sur le sujet est en français. Vous y trouverez beaucoup d’explications

Les autres en anglais sont aussi de très bonne facture :

Conclusion

Une fois tous ces éléments mis en place, votre site doit avoir retrouvé de sa vigueur et si tout n’est pas encore parfait, il est peut être temps de passer à l’étape deux. Votre site à probablement besoins de moyens spécifiques, mais ces conseils lui sont déjà profitables et sont suffisants pour la plupart des projets web.

un livre sur le sujet devrait paraitre bientôt, je ne manquerai pas de vous tenir informé !

Merci à Eric Daspet de m’avoir ouvert les yeux sur ce sujet aussi utile que passionnant.

Sur le même thème

]]> http://www.webaaz.com/2009/10/optimiser-son-site-web/feed/ 5 Navigateur Web standard : Firefoxhttp://www.webaaz.com/2009/06/navigateur-web-standard-firefox/ http://www.webaaz.com/2009/06/navigateur-web-standard-firefox/#comments Sat, 20 Jun 2009 17:42:31 +0000 Martin http://www.webaaz.com/?p=141 Photo de Harlequeen depuis Flickr]]> J’inaugure aujourd’hui une série d’articles courts sur les navigateurs et leurs extensions, j’y présenterai les browsers et leurs add-ons indispensables pour les développeurs qui utilisent ces outils libres. Mais bien que la plupart de mes lecteurs l’utilisent déjà, commençons par le commencement, voici l’histoire de Firefox, le Panda roux qui ressemble à un renard…

Panda roux dans un arbre
Photo de Harlequeen depuis Flickr

Présentation & Historique

Firefox est né de la mise sous licence libre du code de Netscape Navigator, et de sa reprise sous le nom de code « Mozilla ». Ainsi, depuis 2002 la fondation Mozilla nous livre régulièrement le fruit de son travail avec une nouvelle version de Firefox. Contrairement à d’autres éditeurs qui se reposent sur leurs lauriers, les développeurs de Mozilla réinventent en permanence les usages d’un navigateur web. Ils ont ainsi successivement apporté, un lecteur de flux RSS, un filtre anti-hameçonnage, un autre anti publicité, la navigation par onglet, la gestion des extensions… Certaines de ces améliorations lui ont permis de se démarquer, mais pour les développeurs, le point important c’est surtout le respect des standards, ce qui lui donne aujourd’hui une longueur d’avance, et oblige Internet Explorer par exemple à se renouveler plus souvent pour essayer de contrer l’inexorable montée de Firefox dans les sondages, aujourd’hui crédité de plus de 30% de parts de marché en europe.

Voir Présentation complète sur Wikipédia.

Avantages et inconvénients

A l’utilisation on y trouve bien sûr des avantages, grâce notamment à une ergonomie bien pensée et une rapidité d’affichage exemplaire et des options très intéressantes comme le correcteur orthographique… Mais si il est si populaire c’est surtout pour son système d’extensions qui permet d’ajouter les fonctionnalités spécifiques qui manquent à chacun pour en faire LE navigateur adapté à tous les usages. Le code source étant libre et la création d’extensions encouragée par la fondation, il en existe aujourd’hui plusieurs milliers dans toutes les langues !

Pour les développeurs ces extensions sont une mine d’or, et mon but pour prochains articles de cette catégorie sera de vous les faire découvrir, il y en quelques unes que vous trouverez rapidement indispensables et qui vous apporterons beaucoup en qualité et en productivité.

Et bien sûr le respect de nombreux standards du web, HTML, CSS, SVG… en font un navigateur agréable à utiliser. Mais son avance, ainsi que celle d’autres navigateurs un peu moins répandus, lui confère un avantage certain du point de vue théorique. Mais qui aujourd’hui utilise du SVG dans son site web ? Personne ou quasiment car tous les navigateurs ne le supportent pas, et une partie des visiteurs ne comprendrait pas que la faute revient au navigateur et pas au site en question… Disons que c’est un énorme point positif pour celui qui comprends le problème et c’est en tout cas un moteur pour faire évoluer les concurrents, ce qui n’est pas rien !

Pour résumer, ses points forts sont :

  • Libre
  • Extensible
  • Respectueux des standards

Quand aux défauts, on lui reproche parfois sont temps de chargement, rien de rébarbatif à mon goût… Si c’est là son seul point faible, les concurrents ont du soucis à se faire !

Téléchargement et Installation

Le plus simple est encore de le télécharger depuis le site de l’éditeur, la dernière version est toujours la meilleure, alors n’hésitez pas à toujours mettre à jour votre nouveau navigateur favori

Pour en savoir plus

Vous pouvez bien sûr relire mon article sur la compatibilité des navigateurs, pour les Ubunteros, la documentation française leur apportera les réponses à leurs questions sur le sujet :

Les utilisateurs nomades pourront regarder du côté du projet « Portable Firefox  » pour avoir un navigateur sur leur clé USB ou vers « Fennec » le projet de navigateur pour Smartphone.

Conclusion

Un navigateur à découvrir si vous ne le connaissez pas déjà ! Je vous présenterai bientôt quelques extensions pour gérer un serveur FTP, un proxy avancé, des outils pour les développeurs (accessibilité, rapidité…), gestion des favoris…

Et pour les plus impatients voilà deux sites pour faire remplir votre navigateur d’extensions :

Sur le même thème

]]> http://www.webaaz.com/2009/06/navigateur-web-standard-firefox/feed/ 2 Bien écrire HTML & XHTMLhttp://www.webaaz.com/2009/04/bien-ecrire-html-xhtml/ http://www.webaaz.com/2009/04/bien-ecrire-html-xhtml/#comments Thu, 16 Apr 2009 12:09:51 +0000 Martin http://www.webaaz.com/?p=9 HTML et son évolution XHTML. Il est indissociable du web, la plupart des pages sur Internet utilisent ces langages ou d'autres dérivés du SGML. Crayons de couleur
Photo de ooti depuis Flickr]]> Pour un premier article « technique », commençons par l’une des bases du web, le langage de balisage HTML et son évolution XHTML. Il est indissociable du web, la plupart des pages sur Internet utilisent ces langages ou d’autres dérivés du SGML.

Crayons de couleur
Photo de ooti depuis Flickr

Je vais donc vous présenter les différentes ressources de qualité sur le sujet que l’on trouve sur Internet. Le but de cet article est de vous donner toutes les pistes. Vous n’avez plus qu’a les suivre !

Définitions

Historique

La première version de la norme date de 1991, son auteur Tim Berners-Lee préside aujourd’hui le W3C, le consortium chargé de promouvoir la compatibilité des technologies web.

La version actuelle de HTML est la 4.01, c’est une correction de la version 4.0 qui date de 1997. Depuis peu d’évolutions, la version 5 est en préparation. Le seul point marquant de ces dernières années est l’arrivée de XHTML, qui est le portage de HTML en XML. Cette évolution permet notamment de gagner en qualité du code, l’apport de XML oblige à plus de rigueur. Certaines facilité du langage HTML ne sont plus permises, le code est donc plus homogène et les navigateurs interprètent donc plus facilement un code qu’ils lisent mieux.

Les navigateurs récents tels que IE8 ou Firefox 3.x respectent de plus en plus en plus les standard et affichent d’ailleurs de mieux en mieux les pages qui respectent les normes.

A quoi ca sert ?

Le langage HTML ne permet pas de faire le rendu visuel d’un texte. En fait il ne permet que le balisage de celui ci. Ainsi un titre aura une balise de titre. En lisant la source du code, on comprendra qu’il s’agit d’un titre, mais le rendu lui sera fait par les CSS. Vous comprenez bien que sur un Iphone ou sur un écran 20 pouces, le rendu ne sera pas le même, mais notre titre sera toujours un titre.

Vous pouvez ainsi définir les éléments de votre page tels qu’un texte, une image, une vidéo, un formulaire, des liens bien sûr, mais aussi des tableaux des listes…

HTML vous permet ainsi d’afficher votre contenu, mais aussi de questionner l’internaute au travers de champs de formulaire, par des questions ouvertes avec des champs texte, par des questions fermées à réponse simple ou multiple, et même de l’enregistrement de fichier.

Comment apprendre ?

Vous trouverez de multiples cours sur HTML, mais méfiez vous, la plupart présentent un code non standard qui risque d’être mal compris par les navigateurs, et qui risque d’être obsolète dans les navigateurs futurs. Référez vous donc le plus souvent à la norme HTML ou au mémento de Raphaël Goetter par exemple.

L’utilisation du validateur vous montrera également vos erreurs en vous donnant des pistes pour les corriger.

Les normes

Les normes ne sont pas toujours faciles à lire, mais heureusement la traduction française apporte un peu plus de clarté sur certains points techniques.

Les bonnes pratiques

  • Utiliser le doctype approprié
  • Respecter la norme associée au doctype
  • Évitez l’utilisation d’éditeurs WYSIWYG, leur interprétation laisse parfois à désirer
  • Ne pas utiliser de balises HTML « propriétaires »
  • Indenter correctement son code source pour le rendre plus lisible

Outils

Il n’est pas toujours facile d’avoir en tête toutes les propriétés de chaque élément HTML, aussi n’hésitez pas à vérifier la validité de vos pages.

Bibliographie

La gamme « mémento » chez Eyrolles présente sous forme de livret plastifié et indéchirable l’essentiel d’un point technique pour seulement 5€. Un indispensable !

Quiz

Vous avez bien compris tous les éléments présentés ? Testez vos connaissances ! Attention, le premier test n’est pas aussi facile que l’on pourrais le croire.

Vous voilà je l’espère un peu plus à l’aise avec la notion de langage de balisage. N’hésitez pas à posez vos questions en commentaires.

Un des buts de ce site étant l’échange et l’apprentissage, proposez aussi vos références bibliographiques, liens ou bonnes pratiques sur le sujet.

Sur le même thème

]]> http://www.webaaz.com/2009/04/bien-ecrire-html-xhtml/feed/ 0