Photo de samgrover depuis Flickr

Découverte

Lors de la création de mes premières pages web, j’utilisais un outil WYSIWYG et je gérais les alignements comme je le pouvais à coup de marge plus ou moins épaisse, de toutes façons, je ne me préoccupai que du rendu d’IE 5, et vu ce que l’on trouvait à l’époque sur le web, ce n’était pas si mal.
Le passage à une écriture de code à la main, m’a permis de supprimer toutes les fioritures inutiles ajoutées par mon outil précédent. Je me suis vite rendu compte que le résultat était tout de même plus joli, mais basique.
L’arrivé de nouveaux navigateurs à compliqué la donne, le rendu approximatif se révélant au mieux presque correct, au pire vraiment aléatoire.
J’ai toujours souhaité travailler avec un code propre, en évitant les hacks pour corriger les défauts d’implémentation des navigateurs, j’estime que ce n’est pas à moi de le faire. Mais si je peux avoir un code qui passe partout, je ne m’en prive pas.
Et peu à peu ma veille permanente m’a fait découvrir des techniques de mise en page plus évoluées. J’ai suivi cela de plus ou moins loin, en n’en gardant que la théorie, mais sans mettre plus que cela en pratique. Il me semblait clair que c’était une voie à étudier, une solution à mette en œuvre, mais il y a tellement de chose à faire…

Révélation

La conférence sur la micro-typographie de David Rault m’a rouvert les yeux L’illumination est venue d’Anne-Sophie Fradier. Je ne reviendrai pas sur la qualité de sa prestation à Paris Web 2010, mais sur la pertinence du contenu, qui m’a définitivement donné envie de m’y mettre. En une heure elle me présentait un condensé de ma veille avec de jolis exemples, je ne pouvais plus éviter le sujet. Cela tombe bien j’avais un site dont j’étais globalement content, avec des pistes graphiques intéressantes, mais qui pêchait sur certains aspects, et je voyais bien que j’étais désormais dans la bonne direction !
Il ne me restait plus qu’à laisser mûrir tout en me remettant activement dans la technique.

Mise en situation

Vincent Valentin à eu la bonne idée d’écrire à ce moment une série de billets qui m’ont enthousiasmé, et guidé dans mon entreprise. Il y reprend la partie technique avec des exemples précis, un vrai retour d’expérience, sur les outils qu’il utilise et surtout pourquoi. Il y explique le cheminement de ses réflexions, bref comment il travaille. Bien sûr, lui est intégrateur, moi je fais juste de l’intégration. Il m’a donc fallu plusieurs lectures, et quelques autres billets pour bien me remettre au goût du jour, et j’ai commencé par tâtonnements à reprendre mon projet.
Après quelques essais, j’ai décidé de ne pas tout utiliser, et j’ai laissé de coté Les grilles toutes faîtes, et les compilateurs CSS. Les premières car l’utilisation avec les media-queries me semblaient ajouter de la complexité (même si Vincent propose une solution) le second car c’est un projet simple, inutile de trop compliquer la tâche. Cela viendra donc dans un second temps.

Mise en pratique

Le projet initial était finalement assez simple, avec quelques images, mais finalement, beaucoup de dégradés ou de coins arrondis. L’alignement sur la grille ne poserait donc pas trop de problème en découpe d’images.
Je suis donc reparti de feuilles de styles vides, et quitte à reprendre le code en y ajoutant une dose de CSS3, autant revoir le balisage et passer à HTML5. Cette partie fut vite expédiée. La lecture récente des deux premiers opus de la collectionA book apart m’ayant remis les idées en place sur le sujet.

J’ai ensuite pris le temps de tester plusieurs largeurs de grilles et de colonnes avant de trouver mon bonheur, avec une possibilité de mettre en page sur une, deux, trois ou cinq colonnes (Il existe du coup d’autres possibilités que je n’utiliserais pas, restons simples, à mon sens trop de colonnes tuent les colonnes).

L’utilisation de Hashgrid a été précieuse pour cette partie du travail, en me permettant de visualiser l’invisible.

Certaines pages de contenu ne me convenaient pas du tout, mise en page simpliste, alignements maladroits, même si au premier abords, je n’aurai su dire pourquoi et comment le corriger. Je ne suis pas non plus graphiste…
J’avais bien prévu de les refondre, mais comment ? Finalement c’est venu tout seul… Sans rien faire d’autre qu’utiliser ma grille pour remettre en place les différents blocs de contenus, tout s’est éclairci, et au fur et à mesure les textes se sont mis en page aidés par la grille horizontale et par la grille verticale. Tout en gardant un rendu « simple », le tout devenait harmonieux (à mes yeux, pas vous ? mince…)
Le travail en parallèle sur les polices et les hauteurs de ligne, a bien aidé, et à même simplifié le travail. La règle ajoute des contraintes, oblige à se plier à certaines obligations, mais au final, libère ! Plus de rendus approximatifs, plus d’hésitations, on se fie à la grille et c’est tout. Finis aussi les effets de bord quand on ajuste d’un côté et que casse de l’autre…

Il y a pour moi trois étapes :

• L’ignorance de la règle
• Son apprentissage et sa mise en application
• Son appropriation et son contournement

Et un outil, si bon soit il doit être utilisé à bon escient. Pas question d’appliquer bêtement une règle, une réflexion s’impose. Alors bien sûr il m’est arrivé de contourner certaines règles. Les raisons sont variées, mais tout ne peut pas rentrer dans une grille, parfois quelques éléments ont besoin de plus ou moins de place, à l’œil, on sent que quelque chose ne passe pas bien ,que tout est trop rigide… Il faut donc s’échapper du carcan, pour trouver la solution. Il faut trouver une exception, la règle a beau l’air parfaite, il existe des cas particuliers. Il s’agit alors de ne pas faire n’importe quoi, au risque de perdre une partie du bénéfice acquis, mais de trouver une justification raisonnable qui apporte une solution au problème. Et j’ai finalement souvent trouvé cette solution dans d’autres grilles, dans des « sous-grilles », en répétant ma grille d’origine différemment, en appliquant les mêmes marges mais autrement…

La macro-typographie ça marche !

Retour d’expérience

Au final, il m’aura fallu quelques heures/jours de montée en compétence entrecoupées de temps de réflexions, d’essais pratiques, et de remise en question pour arriver à mon résultat. Il reste encore du travail, tout n’est pas fini, l’adaptation aux navigateurs mobiles est en cours, mais il est déjà temps d’en tirer des conclusions.
Je retiens que si j’y ai passé du temps au début, je n’en ai pas perdu pour deux raisons :

• Le résultat final est meilleur
• J’ai gagné du temps sur d’autres aspects de l’intégration

Et sur mes prochains projets, ce sera encore plus vrai.

Ressources

Billets

• Macro typographie sur le Web – une grille dynamique
• Macro-typographie sur le Web – Mise en pratique
• Macro-typographie sur le Web – Quelques outils
• http://snook.ca/archives/html_and_css/font-size-with-rem

Vidéos

• conférence sur la micro-typographie
• sa prestation

Alors que dire de plus, regardez les vidéos, lisez les quelques références ci-dessous, essayez, testez, et dites moi comment vous vous en sortez, ce que cela vous apporte, si cela vous bride ou non…

Moi j’y retourne, j’ai encore un peu de travail…

Sur le même thème

• Bien utiliser les feuilles de style (CSS)
• Optimiser son site web
• Internationalisation & localisation
• Livre : HTML5 pour les webdesigners
• Développer sous Ubuntu

Comme pour le premier tome, HTML5 pour les webdesigners, ce livre rassure sur la manière de faire, explique rapidement les bases, dédramatise et simplifie la prise en main, le tout dans un style bien écrit et agréable à lire ! L’auteur ne se limite pas à aborder les points technique mais pose des questions et explique ses réponses et remarques, très utile pour bien comprendre les enjeux !

Photo de Abulic Monkey depuis Flickr

L’auteur

Dan Cederholm est le fondateur du studio de design SimpleBits, expert reconnu sur le webdesign et les standards. Il est également co créateur de dribbble, joueur de yukulele et auteur des livres suivants :

• Handcrafted CSS (New Riders)
• Bulletproof Web Design, Second Edition (New Riders)
• Web Standards Solutions

Utiliser CSS3 aujourd’hui

Dan conseille de ne surtout pas lire la spécification, elle n’est pas faite pour tout le monde, en revanche, tout le monde peut utiliser CSS3, il liste ce qui peut être utilisé dès maintenant, et aborde les préfixes de navigateur, indispensable pour une implémentation immédiate et pérenne.

Comprendre les transitions CSS

Le chapitre aborde les transitions, et les mets en valeurs avec un exemple à suivre tout au long du livre.

Broder avec CSS3

Je reprends les sous titres de chapitre très bien trouvés, qui expliquent que CSS3 est là pour apporter surprise et émerveillement. C’est la touche ne plus qui améliore l’expérience utilisateur, sans pénaliser ceux qui n’en bénéficient pas.
Dan pose la question : les sites web doivent ils offrir exactement la même expérience dans tous les navigateurs ? Et y réponds avec ce site au nom tout trouvé : dowebsitesneedtobeexperiencedexactlythesameineverybrowser.com

Transformer le message

Toujours avec le même fil directeur, les exemples s’enchaînent pour aborder les transformations et les rotations

Arrières plans multiples

Arrière plans multiples, effets de parallaxe sont au sujet de ce chapitre.

Enrichir les formulaires

Autre sujet très intéressant sur l’ajout de CSS3 dans les formulaires. Pour embellir et alléger les boutons avec des dégradés ou des ombres, mais aussi l’ajout d’animations au focus ou au survol des éléments pour un changement de style tout en douceur.

Conclusion

On termine par un chapitre qui donne les clés pour évangéliser, aborde le futur de langage et donne une précieuse liste de liens indispensables pour creuser un peu !

J’en veux un !

• CSS3 pour les webdesigners
• Broché : 122 pages
• Éditeur : Eyrolles
• Édition : 1ère (20 janvier 2011)
• Collection : A book appart
• Langue : Français
• ISBN-13: 978-2212129878

Toute ressemblance avec l’atelier de Jérémie Patonnier au dernier Paris Web est certainement fortuite, mais bon enfin, ils causent du même sujet… Pour ceux qui avaient oublié de prendre des notes, ca fera un bon résumé !

On regrettera que le livre n’aborde pas les sujet suivants :

• media queries
• multicolonnage
• webfonts

Mais on peut penser que cela fera l’objet de prochains volumes, les media queries étant déjà annoncées dans le tome 4.

Le deuxième tome de la collection est sorti rapidement et la suite de la collection devrait se faire au même rythme, c’est l’avantage avec ces petits formats, rapide à lire, mais aussi à écrire, facile à transporter. J’ai pris l’habitude les lire dans le train, et de faire le billet dans la foulée… Mention spéciale si je ne l’avais pas déjà faite au raccourcisseur d’url utilsé spécialement pour le livre, très utile pour éviter de taper des urls à rallonge, avec l’url originale en note de bas de page ! A quand le QRcode ?

La collection

Les tomes suivants sont donc annoncés :

• 3 – The elements of content strategy – 8 mars 2011
• 4 – Responsive web design – printemps 2011

Dans cette jolie collection j’ai aussi envie de voir des livres sur l’ergonomie, l’accessibilité, Javascript, la typographie (micro & macro)…

Sur le même thème

• Livre : Pro Git
• Livre : HTML5 pour les webdesigners
• Livre : Réussir son blog professionnel
  3 exemplaires à gagner !
• Livre : Réussir son site web en 60 fiches
• Bien utiliser les feuilles de style (CSS)

Depuis la première édition je me dis que je dois aller à paris web, que ce rassemblement correspond à mes attentes et mes valeurs, que les orateurs comme les « écouteurs » (Le mot n’est pas bien trouvé mais là je n’ai rien d’autre…) sont une espèce à part (des moutons à cinq pattes à ce qu’il paraît…). Mais mes priorités, probablement mal définies, ne m’ont permis de m’y rendre que cette année. Évidement c’est une erreur, mais je ne le sais que maintenant.

Je ne vais pas m’attarder sur les conférences, toutes intéressantes, certaines vraiment passionnantes, elles sont bien résumées sur le blog de Clever Age ou partout ailleurs, et disponibles en vidéo sur le site de paris web, il n’est donc pas trop tard pour voir les voir !

Je vais plutôt m’attarder sur ce qui tourne autour de Paris Web, cette ambiance particulière qui fait que depuis la fin, les tweets avec le tag #parisweb évoquent un manque, un vide laissé par cet évènement particulier, que désormais tout le monde n’en a plus que pour #sudweb, car personne ne veut attendre un an avant de recommencer !

Alors pourquoi c’est bien ?

Paris-Web c’est Un prix abordable, comparé à d’autres, surtout en pré-vente, de toutes façons vu la qualité, quel intérêt d’avoir le programme pour acheter ?

C’est aussi un lieu qui permet un accueil dans d’excellentes conditions, même avec les grèves, et un buffet excellent en quantité et en qualité et ce n’est pas un détail. Manger sur place est un plus essentiel pour favoriser les échanges, se mêler aux discussions ou faire le point sur les confs passées et à venir…

C’est encore l’accessibilité naturelle, pensée dans les moindres détails, avec des conférences anglaises intégralement et instantanément traduites en français, chapeau pour l’exercice réussi avec une maitrise parfaite, mais surtout des interprètes LSF et la vélotypie en direct.
Même si ce dernier système est perfectible, il dénote une volonté d’aller de l’avant, et ca mérite un grand bravo !

C’est également le choix des contenus, variés et tournés vers l’accessibilité, l’ergonomie, la méthodologie, les bonnes pratiques, les techniques de pointe…

Mais paris web ne serait pas paris web sans sa bonne humeur, son public, ses orateurs, toute cette énergie qui se dégage, lors de l’apéritif communautaire, ou en off… On peut discuter avec tout le monde, particulièrement les orateurs qui sont très ouverts au dialogue. Et boire une bière avec Monique Brunel, Christian Heilman, causer éthique avec Éric Daspet, performance scénique avec Anne-Sophie Fradier ou encore prendre le train et parler accessibilité avec Denis Boudreau, ca n’a pas de prix…

Finalement, j’ai pu échanger avec tous les orateurs avec qui je souhaitait prolonger un peu leur conférence avec quelques questions, ils m’ont tous apporté leurs réponses avec entrain et passion ! Un vrai bonheur !

J’en ai aussi profité pour rencontrer une petite dizaine de personnes que je connaissais indirectement, et les contacts réels, y’a pas à dire c’est quand même bien plus sympa… On se revoit quand ?

Si je devais me plaindre, je dirais que ca ne dure pas assez longtemps, ou que les badges sont écrit trop petit, en plus gros ca favoriserai encore plus le contact !

Voilà j’attends maintenant l’ouverture des réservations pour l’année prochaine, en attendant je vais voir certaines conférences que j’ai raté, et peut être en revoir certaines particulièrement bonnes.

Je suis tout seul dans ce cas ?

Et vous ? Qu’est ce qui vous plait à Paris web ? Êtes vous allé à Paris Web ? Quelle mauvaise excuse avez vous trouvé pour en pas y aller ?

Photo de Laurence Vagner depuis Flickr

Sur le même thème

• Paris Web 2010, j’y serai !
• Soirée connect, j’y serai !
• Webaaz, le développement web de A à Z !
• Twitter & autres…
• Première bougie !

Qui ne s’est jamais plaint de l’omniprésence des publicités, du manque d’ergonomie d’un site, de la laideur d’un autre, de règles floues en matière de gestion de nos données personnelles, d’abus de pouvoir dans les conditions de ventes d’un site en ligne…

Le web est une jungle, de nombreux sites ayant pignon sur rue n’ont que peu de considération pour les internautes… Il existe bien quelques règles, mais la plupart sont soit informelles soit facultatives et personne n’est là pour les faire respecter, alors nous subissons. En dehors du web c’est aussi bien souvent la même chose, les exemples sont partout, mais autant en dehors du web je n’y peut rien, autant sur le web, j’ai mon mot à dire !

En tant que développeur, je participe au web. Je peux donc au travers de mes sites, faire le web dont j’ai envie.

Photo de Castorp Republic’s depuis Flickr

J’envie toujours ceux qui luttent pour de nobles causes, ceux qui donnent de leur temps, ceux qui expriment leurs idées… A mon niveau j’ai souvent l’impression de ne pas faire grand chose, ou pas assez, ce qui suit n’est qu’un début, le sujet peut paraitre futile, c’est tout petit, ca n’empêchera pas d’autres actions plus concrètes, mais c’est déjà ca de pris…

Le web que j’aime…

Et des envies j’en ai plein…

• Un web, joli, bon c’est subjectif, mais j’essaie…
• Un web accessible, ce n’est pas toujours facile, mais avec un peu de travail on peut s’en approcher
• Un web innovant, je ne suis pas obligé de faire des sites « compatibles » avec les navigateurs, je fais des sites standards, chacun est libre d’utiliser un navigateur qui ne l’est pas…
• Un web honnête, mes conditions d’utilisation et de vente sont claires, compréhensibles, écrites dans un français lisible…
• Un web transparent, j’énonce clairement qui je suis, attention, je ne suis pas contre l’anonymat, mais quand je développe un site ou un service, le client doit savoir à qui il s’adresse.
• Un web respectueux, mes utilisateurs peuvent utiliser mon site sans donner d’informations inutiles, juste l’essentiel, et si ils suppriment leur compte, il ne reste rien. Je ne prends que les données qu’ils me donnent volontairement, et je leur permet de connaître ce que je sait d’eux.
• Un web moral, je n’essaie pas de faire de l’argent en me demandant ensuite avec quel contenu, mais j’essaie de monétiser une idée originale.
• Un web transparent, je ne vends pas un service sans le décrire dans ses moindres détails et sans laisser une période d’essai complètement fonctionnelle. Si l’utilisateur n’est pas content cela ne lui coûte rien, il part en connaissance de cause, pas fâché…

J’en oublie peut être, je complèterai au fur et à mesure…

Ce web, j’ai essayé de le créer avec mybabygame, je ne deviendrait probablement pas millionnaire avec mes méthodes qui feraient fuir tous les « rentabiliseurs » du web… D’ailleurs ce n’est pas le but, je voulais juste offrir un service, de la meilleure possible, rendre mes utilisateurs heureux, leur offrir une belle expérience. Évidement, j’en tire un potentiel bénéfice, et heureusement, il récompense mon travail, mais il me semble plus justifié, et, quand mon code sera un peu plus rodé, je pourrais envisager de partager des bouts de code, sous forme de tutoriels pour partager ces longues heures de dev.

Et votre web ? Il ressemble à quoi ?

J’espère que le résultat vous plaira, il reste encore certainement du travail à faire dans ce sens, vous avez certainement des idées pour aller plus loin, j’attends votre avis sur la question…

Sur le même thème

• Fournir un webservice et son API
• Le temps passe vite…
• Livre : Réussir son site web en 60 fiches
• Gandi & Webaaz vous offrent un nom de domaine !
• Recette & environnements de test

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 !

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 !

Photo de Reinante El Pintor de Fuego depuis Flickr

Sur le même thème

• Retour à la réalité après un premier paris web !
• Webaaz, le développement web de A à Z !
• Soirée connect, j’y serai !
• Twitter & autres…
• Participons à l’utopie web !

Pour la sortie de Lucid Lynx, la dernière version d’Ubuntu, je vais donc vous donner envie de suivre ma voie, jusqu’au bout, ou au moins en partie…

Fond d’écran d’Ubuntu Lucid Lynx

Passer à Linux

Les raisons de passer à Linux peuvent être nombreuses, besoin d’un OS plus léger et rapide, libre, gratuit (le plus souvent)…

La première chose à faire à mon avis c’est de se renseigner ! On trouve des dizaines de témoignages sur Internet, faites vous votre avis. Pour que la migration soit une réussite il faut d’abord être convaincu par la démarche.

Je vous conseille notamment un site explicatif qui présente aussi bien les avantages et les inconvénients de chaque solution, et vous aide dans votre migration :

• Passer à Linux

Personnellement, j’ai d’abord été convaincu par la théorie, par l’esprit du libre, mais la pratique me faisait un peu peur. J’avais peur de perdre mes repères.
Il m’a donc fallu un certains temps, à peu près deux ans, pour y venir. Mais j’ai mis ce temps à profit !

Un bon témoignage sur le site Framasoft m’avait convaincu d’utiliser des logiciels libres multi-plateformes avant de passer à Linux, de manière à faciliter la migration. J’ai donc peu à peu adopté un ensemble de logiciels de grande qualité. Le jour de la migration, j’ai juste changé d’OS, pas de logiciels !

Et ils me permettent aujourd’hui de travailler dans de bonnes conditions. Comme professionnellement je travaille sous Windows, j’utilise donc les mêmes logiciels, un vrai bonheur !

Mes logiciels

Voici donc la liste des logiciels multiplateforme que j’utilise au quotidien. A titre personnel, le bénéfice est en partie spirituel, professionnellement, c’est très pratique de pouvoir utiliser des logiciels que je connais, qui sont mis à jour régulièrement, et ce quel que soit le client et pour un budget sans surprise.

Navigateurs

Côté navigateurs, on peut utiliser Chrome, Firefox ou Opera sur les deux plateformes, il ne manque que Internet Explorer mais est-ce vraiment gênant ?

Du coup quasiment toutes les extensions disponibles le sont aussi pour Linux, pas de problèmes donc à attendre de ce côté.

Suite bureautique

J’utilise bien évidemment Open-Office, l’un des logiciels libre les plus connus. A l’usage, l’ouverture de certains fichiers propriétaires pose parfois quelques problèmes cosmétiques, mais on s’en sort.

On me dit souvent que cette suite est moins complète que celle du concurrent, elle me parait plus simple d’utilisation, et réponds à toutes mes attentes.

Environnement de Développement Intégré

Les principaux IDE comme Eclipse ou NetBeans, sont basés sur Java et donc multiplateforme. J’utilise donc PDT sans aucune contrainte.

Logiciels de gestion de version

Quand on est comme moi habitué à Tortoise SVN sous Windows, on se retrouve un peu seul sous Linux. Il existe des solutions graphique mais qui ne m’ont pas donné entière satisfaction. La ligne de commande, a ses avantages par moments, mais j’ai finalement trouvé mon bonheur avec les extensions d’Eclipse ou de NetBeans.

Le seul point ou je ne suis pas entièrement convaincu donc.
Edit : Grâce aux commentaires, j’ai trouvé une solution qui me convient !

Gestion de base de données

Que j’utiliseMySQL ou PostgreSQL, MySQL Gui Tools et PGAdmin répondent correctement à mes attentes.

Client FTP

Sous Ubuntu, on peut utiliser le gestionnaire de fichiers pour accéder à des ressources distantes, je n’utilise donc plus de logiciel de transfert. Cependant si vous le souhaitez, Filezilla est une excellente solution qui existe aussi sous Linux.

Outils graphiques

The Gimp est évidemment moins performant que Photoshop même si certains disent le contraire. Je ne connais pas de graphistes qui l’utilisent ! Mais pour un développeur qui fait quelques retouches de temps en temps il est parfait ! Un peu déroutant avec son organisation multi-fenêtres, on finit par s’y faire avec le temps.

Outils divers

J’utilise Poedit pour gérer mes traductions ou 7zip pour les archives, là encore ces logiciels sont disponibles pour différents OS, pas de quoi être perturbé !

Webwares

Là vous l’aurez deviné pas de problèmes, mais du coup, autant que possible, j’utilise aussi des outils libres que j’installe sur mon propre serveur… Quand on commence à toucher au libre, on y reste attaché !

Passer le cap !

Vous pouvez le télécharger ou commander le CD sur le site d’Ubuntu :

• Télécharger Ubuntu

Au final, L’OS ne reste qu’une plateforme que l’on utilise finalement assez peu, le plus important est donc de trouver des logiciels adaptés au besoin.
Le plus dur pour passer à Ubuntu c’est d’oublier ce que vous savez de Windows et de réapprendre à votre rythme. Pour cela, je vous conseille un excellent livre, libre bien entendu, édité par Framabook et In Libro Veritas.

• Présentation du livre « Simple comme Ubuntu » par Framablog

• Simple comme Ubuntu 10.04
• Licence : Creative Commons By-SA 2.0
• Broché : 359 pages
• Éditeur : In Libro Veritas
• Édition : 1ère (3 mai 2010)
• Collection : Framabook
• Langue : Français
• ISBN-13: 978-2-35922-022-3

Ce livre étant libre, il est également disponible en téléchargement au format PDF sur le site Framabook :

• Simple comme Ubuntu 10.04 en PDF

Et si vous n’êtes pas encore convaincu, Le CD-rom d’Ubuntu est un Live CD, vous pouvez donc le mettre dans votre lecteur de CD-rom et démarrer votre PC sous Ubuntu sans l’installer. Idéal pour tester !

Conclusion

Finalement, le développement web sous Linux, ca se passe très bien ! Si avec tout ca vous ne changez pas, j’aurai au moins essayé, prenez votre temps, l’idée va faire son chemin et le moment venu vous passerez le cap…

Et quand vous l’aurez passé revenez me donner votre avis !

Sur le même thème

• MySQL GUI Tools
• La gestion des versions
• Livre : Pro Git
• Développer en équipe
• Navigateur Web standard : Firefox

Photo de Thomas Parisot depuis son blog (La case de l’oncle Tom)

Thomas Parisot offre 3 exemplaires dédicacés de son livre. Il suffit de commenter ce billet en expliquant votre point de vue sur les blogs professionnels, un tirage au sort le 1er mai désignera les gagnants !

Présentation

Que vous n’ayez jamais écrit une ligne sur Internet ou que vous soyez un blogueur averti, ce livre est fait pour vous ! C’est un condensé d’informations et de données sur les blogs professionnels. Il vous apportera les bases nécessaires pour débuter, les bonnes questions à se poser, les réponses techniques dont vous aurez besoin, et tout ce qu’il faut pour aller plus loin et gérer son réseau. En somme tout l’écosystème des blogs !

Image, communication et influence à la portée de tous

Ce livre se lit suivant son envie, d’un bout à l’autre pour bien maîtriser l’ensemble ou par chapitre suivant les envies et les besoins. Les explications sont à la fois précises mais sans êtres trop complexes à comprendre. Une multitude de sujets annexes sont abordés afin de bien cerner le sujet et d’explorer les à cotés.

En résumé, un livre très complet, bien écrit et agréable à lire qui aborde de façon détaillée la philosophie des blogs, le fonctionnel, la gestion d’un blog et ce qui tourne autour.

Chapitrage

Voici en détail les points traités :

• Les blogs : Chasser les idées reçues
• Un blog, pour quoi faire ?
  (Communication, expertise…)
• Les fonctionnalités de base des blogs
  (Billets, extensions, thèmes, syndication…)
• Avant de commencer : Les questions à se poser
  (Thèmes, public, méthodologie…)
• Gérer son blog au quotidien
  (Contenu, réputation, infrastructure, obligations légales…)
• Quel logiciel de blog choisir
  (Blogs, CMS & autres outils…)
• Étendre son réseau avec des services
  (Gérer les visiteurs, le contenu, les moteurs de recherche, les microblogs…)

Extrait

Pour que vous puissiez découvrir son livre, Thomas Parisot vous offre sur son blog le cinquième chapitre au format PDF :

• Voir l’extrait sur le blog de l’auteur
• Télécharer directement le chapitre : Gérer son blog au quotidien

L’auteur

Thomas Parisot est actuellement consultant au sein de l’agence bordelaise de Clever Age pour le meilleur et pour vous éviter le pire.
Il évangélise en faveur des logiciels libres, de l’accessibilité, du respect des standards (HTML, XHTML, CSS), de JavaScript et de l’ergonomie.

Vous pouvez également le lire sur son blog « La case de l’oncle Tom »

Interview de l’auteur

J’en veux un !

Thomas Parisot offre 3 exemplaires dédicacés de son livre. Il suffit de commenter ce billet en expliquant votre point de vue sur les blogs professionnels, un tirage au sort le 1er mai désignera les gagnants !

Attention : seules les personnes disposant d’une adresse postale en France peuvent participer (pour des questions de coûts d’expédition).

Pour les autres, vous pouvez vous le procurer dans toutes les bonnes librairies !

• Réussir son blog professionnel
• Image, communication et influence à la portée de tous
• Broché : 297 pages
• Éditeur : Eyrolles
• Édition : 1ère (3 septembre 2009)
• Collection : Accès Libre
• Langue : Français
• ISBN-13: 978-2212125146

Vous pouvez continuez sur ce thème en relisant mon billet sur le sujet : Pourquoi je blogue ?

Sur le même thème

• Livre : Réussir son site web en 60 fiches
• Veille techno Web de F à Z (partie 2)
• Livre : CSS3 pour les webdesigners
• Veille techno Web de A à F (partie 1)
• Métier : Directeur Artistique / Designer Web

Photo de i_gallagher depuis Flickr

Concept

L’expression « Réinventer la roue » exprime l’idée de ne pas refaire inutilement quelque chose qui a déjà été fait. « Réinventer la roue carrée » y ajoute l’idée d’une réinvention de moindre qualité. Wikipédia fais le point sur ces concepts :

• Réinventer la roue
• Réinventer la roue carrée

Les éléments à charge pour étayer l’expression sont évident et pourtant, dans certains cas ce n’est pas si évident…

Le pour

Donc le contre réinventer la roue.

Pour ce qui est des concepts élémentaires qui font leurs preuves depuis toujours, parfois avant même l’histoire de l’informatique, la question ne se pose souvent même pas. Sur certains problèmes simples, on connait la meilleure solution de traiter les cas, alors pourquoi chercher à faire autrement.

Déjà éprouvés

On a tous étés confrontés un jour à un code un peu complexe que l’on a fini par simplifier à l’extrême en découvrant une solution simple et efficace sur Internet mais à laquelle on avait pas pensé.

Internet favorise l’échange de savoirs de façon exponentielle. Tout internaute un peu curieux peu apprendre rapidement sur le sujet de son choix, on peut ainsi facilement trouver et utiliser une bibliothèque ou un framework et gagner un temps non négligeable en évitant de réécrire l’essentiel. Aujourd’hui très peu de projets partent de zéro, on s’appuie toujours sur une couche existante.

Un code optimisé et fiable c’est ce que tout bon développeur recherche alors si on vous le propose tout prêt, pourquoi hésiter ? Ne risquez pas de faire pire, réutilisez !

Gain de temps

Ce serait donc une perte de temps évidente de chercher à réinventer ce que d’autres ont développé. D’autant que bien souvent les projets communautaires sont d’une grande qualité et la somme des compétences techniques de leurs auteurs est bien plus grande que la votre ou celle de votre équipe. On ne peut pas être spécialiste dans tout les domaines ! Faites confiance à d’autres équipes, vous gagnerez en temps de développement et même sur la maintenance, les évolutions et corrections de bugs ne seront pas de votre ressort !

Le temps gagné vous permettra peut être de publier votre propre code et d’en faire gagner à quelqu’un d’autre.

Le contre

Donc le pour réinventer la roue.

Quel que soit l’outil ou le concept, on pense souvent que tout est déjà inventé et pourtant de nouvelles idées et de nouveaux produits voient le jour quotidiennement et ils paraissent tellement évidents qu’on se demande pourquoi on y à pas pensé soi-même un peu plus tôt… Comment ses idées ont elles germé ? Bien souvent en envisageant un problème sous un autre angle, en se posant une question de manière différente. Bien des inventions ne sont que la réunion de plusieurs.

Comprendre les concepts & les adapter à d’autres inventions

Avoir une approche différente est essentiel. Il faut comprendre le fonctionnement de la roue pour pouvoir l’améliorer ! Utiliser une bibliothèque ou un framework c’est bien, mais en comprendre le fonctionnement c’est encore mieux. Quand vous en maitriserez le fonctionnement, quand leur conception vous semblera claire, vous pourrez les réutiliser efficacement dans d’autres cas.

Votre y gagnerez en compétence et en efficacité.

Il y a quelques années, avant l’arrivée des frameworks PHP, j’ai développé ma propre solution. Cela m’a permis de gagner beaucoup de temps en mutualisant certains développement entre plusieurs projets. J’ai gagné en compétence car je souhaitais toujours trouver la meilleure solution à un problème donné. Aujourd’hui j’appréhende d’autant mieux les outils que j’utilise même si je ne les ai pas écrits moi même.

Nouvelles idées ou fonctionnalités

Re-développer un outil ou réfléchir à un concept avec un œil neuf vous apportera peut être une idée de génie. Le petit truc auquel personne n’avait pensé, la fonctionnalité évidente qui donnera une longueur d’avance à votre projet. Un truc évident, après coup, mais qui nécessitait un certain point de vue, certaines connaissances, tout un ensemble de choses que personne n’avait visiblement eues avant vous.

Usage spécifique & optimisation des performances

Dans certains cas, il faut savoir si la roue qu’on nous propose nous convient vraiment, et si on n’ a pas besoin de la modifier ou de la réinventer pour répondre de manière plus précise à son besoin. Pourquoi utiliser un outil avec des tas d’options si votre besoin est vraiment basique. L’analyse de l’outil et sa réécriture permettent de monter en compétence sur le sujet et d’avoir un produit répondant uniquement à votre besoin et du coup plus performant.

Le contraire est vrai aussi, et si un outil ne propose que 90% de vos besoins, améliorez le et proposez les améliorations à la communauté !

Conclusion

Réinventer le roue peut s’avérer utile pour innover, et c’est en tout cas un moyen formateur pour qui veut apprendre d’autres outils ou concept pour les faire évoluer ou en comprendre l’essence et l’adapter à d’autres cas. N’ayez plus peur de réinventer la roue, mais faîtes le en connaissance de causes et pour de bonnes raisons

Et vous alors ? Réinventez vous la roue ? Est ce pour de bonnes raisons ? Que pensez vous des miennes ?

En question subsidiaire, j’aimerai savoir d’ou vient l’expression, je n’ai pas trouvé d’information sur son origine.

Sur le même thème

• Les plugins Firefox : FoxyProxy
• Bien utiliser Zend Framework
• Bien définir son projet de site web
• Les plugins Firefox : Colorzilla
• Comment apprendre le développement web ?

Lors de la refonte d’un site, le prestataire à tendance à vouloir tout refaire sous prétexte que l’existant est inadapté, c’est peut être vrai, et d’ailleurs très souvent le cas, mais dans ce cas il faut réfléchir et travailler pour que cela ne se reproduise pas systématiquement à chaque version. Si le projet est bien pensé, une refonte graphique et quelques développements peuvent suffire la plupart du temps, à moins bien sûr que le fonctionnel change du tout au tout ou qu’un autre paramètre important ai changé de manière significative.

Comment prévoir et intégrer les évolutions du projet ? Quelles questions se poser ? Quelles sont les erreurs à ne pas faire ? Voilà tout l’enjeu de cette réflexion.

Photo de slinky2000 depuis Flickr

Modularité

Avec les moyens actuels, et le développement en couche, on peut facilement changer une partie d’un projet sans toucher au reste. Le principe MVC permet par exemple de changer complètement l’affichage de votre site sans toucher à la partie métier. On peut ainsi cloisonner le projet, les différentes parties travaillant chacune de leur coté, mais ensemble.

Il faut pour cela réfléchir à certains points en amont du projet. Voyons les questions à se poser le plus tôt possible.

Volumétrie

Le choix d’un site marchand est évident si vous vous lancez dans la vente, mais si vous commencez avec de faibles volumes, un site vitrine est peut être plus approprié, votre projet à 30 000 € peut attendre… Tout dépends de vos ambitions !

Et côté hébergement, suivants vos besoins actuels et à moyenne échéance, en terme de ressources processeur ou de bande passante, les extensions nécessaires, le prix… Il faudra faire le tri et trouver un hébergement au meilleur rapport qualité prix, mais facilement évolutif pour pouvoir migrer vers une offre supérieure simplement.

Je vous invite à voir l’article de Webaaz sur l’hébergement web.

Prévoyez donc de dimensionner votre projet en fonction de vos besoins à court terme et des évolutions à venir.

Fonctionnalités

On ne peut bien évidemment pas aborder ici toutes les problématiques fonctionnelles, voyons donc en deux points qui nous serviront d’exemple, comment envisager ces questions.

Public visé

En fonction de votre cible, vous ne ferez pas le même site web. Le collaboratif c’est plutôt orienté vers la génération X et la génération Xgénération Y, alors si vous vous adressez à un public plus âgé, faites plus simple, avec une ergonomie adaptée, des boutons plus gros par exemple…

Pensez tout de même à toujours garder votre site accessible à tous pour ne pas vous couper d’une partie de la population !

Multilinguisme

Sur le web votre site est accessible par tout le monde. Même les internautes auxquels vous n’avez pas pensé. Ils ont aussi le droit d’y venir, et même de consommer ! Vous n’allez tout de même pas vous priver de ces clients sous prétexte de ne pas parler la même langue ?

Bon, peut être que dans un premier temps vous ne pensez pas à cela et que votre marché est francophone, mais vous avez déjà pensé à vous étendre par la suite, alors dites le ! Intégrer plusieurs langues dans un site existant est très couteux, et oblige à revoir le site en profondeur, alors que développer un site multilingue n’est pas beaucoup plus compliqué qu’un site en une seule langue.

Alors à moins d’être sur un périmètre géographique très restreint, prévoyez ! Voyez grand !

Technologie

Je vais passer pour quelqu’un d’arriéré, mais non un site web statique n’est pas dépassé ! Même si aujourd’hui les besoins évoluent et que la mode est au web social, au web 2.0, à l’interactivité, posez vous la question : Ai-je besoin de tout cela ?

Si votre site ne nécessite que peu de pages et peu de mises à jour, un site vitrine fera parfaitement l’affaire. Pourquoi mettre une usine à gaz pour si peu de besoins ?

Et même si votre projet doit être dynamique, les fonctionnalités qui manquent à votre CMS ou à votre blog ne peuvent elles pas être juste des pages statiques en plus ?

Au final, des pages statiques, ce n’est pas forcément moins évolutif qu’un code dynamique.

Cahier des charges

Pour réunir toutes ces réflexions, et le résultat de toutes ces questions, un cahier des charges s’impose. Fonctionnel dans un premier temps pour définir clairement les besoins. Technique ensuite pour expliquer les moyens de répondre à la demande.

Fonctionnel

Vous pourrez y expliquer vos besoins précis en fonctionnalités en expliquant les règles métier spécifiques à votre entreprise.

Technique

Il sert à définir les solutions techniques retenues et la manière de les mettre en œuvre. Le développeur s’appuie dessus pour développer votre site web. Tout y est expliqué et en théorie, il y trouve toutes les réponses à ses questions.

Evolutivité

Coté évolutivité, il y a du boulot ! Il va falloir penser à ce dont vous aller avoir besoin, sans pour autant penser à des fonctionnalités que vous n’êtes pas sûrs d’utiliser, ce qui serait totalement contre productif. Si vous êtes une PME, n’imaginez pas que votre site vitrine puisse se transformer en site marchand ou en réseau social, mais pensez que vous aurez besoin de nouvelles pages pour les nouvelles agences du groupe par exemple.

Vous avez besoin de donner accès à votre catalogue à d’autres application ? Développez un webservice qui pourra resservir et évoluer.

Mise en œuvre

Je le fais moi même ou je le fais faire ?

La question ne se pose bien évidemment que pour un site perso, ou un site pro très simple genre site vitrine. Pour de plus grosses structures, c’est une question de crédibilité (encore que ce ne soit pas le cas pour tout le monde).

Pour un site plus conséquent, le temps, les compétences nécessaires et le résultat attendu ne vous laisseront bien évidemment pas le choix.

Bien sûr faire soi même son site web demande des compétences, mais pour un petit projet et pour peu que cela vous intéresse c’est tout à fait possible. Différentes formations abordent le sujet de façon plus ou moins approfondie.

L’article de Webaaz sur les formations web vous en apprendra plus sur le sujet.

Conclusion

Le but est de penser à tout ce qui pourrait arriver, et supprimer finalement tout ce qui n’arrivera pas. Quand on a enlevé tout le superflu, il ne reste que l’essentiel, et c’est ce dont vous avez besoin !

Vos besoins évolueront probablement, et lors de la prochaine refonte vous vous reposerez les mêmes questions, et vous n’aurez sûrement pas les mêmes réponses. Votre prestataire Internet vous dira peut être qu’il faut tout refaire, et il aura peut être raison, mais l’existant pourra resservir en partie grâce à la modularité ! C’est déjà ca de gagné !

Mise à jour

Le sujet est un peu vaste pour être abordé de façon complète dans un seul article. Je complèterai donc cet article et j’aborderai des sujets connexes de manière plus précise par la suite, en fonction de vos retours.

A vos commentaires !

Sur le même thème

• Réinventer la roue, ou pas ?
• Les plugins Firefox : XRefresh
• Les plugins Firefox : Colorzilla
• MySQL GUI Tools
• Bien utiliser Zend Framework

Cela fait déjà pas mal de temps que j’avais envie de lancer un blog. Mais si aujourd’hui on trouve tout type de blogs, de qualité variée et plus ou moins bien tenus, il était hors de question de m’y mettre pour arrêter au bout de quelques billets. Il fallait donc que le projet soit réfléchi, mûri, afin de mettre toutes les chances de mon côté pour que quelques mois après le pari soit réussi.

Genèse & motivation

J’ai donc réfléchi plusieurs mois pour définir précisément la ligne éditoriale afin de ne pas m’égarer, et ne pas perdre mes lecteurs par la même occasion. J’ai réfléchi aux sujets que je pourrai aborder, afin de voir si il y avait matière à rédiger régulièrement sur le domaine. Je me suis demandé si j’aurai l’envie nécessaire, le courage de continuer ce blog plus tard. Je me suis posé la question du nombre de billets que je devais me fixer par mois. Et quelle forme allais prendre mon blog…

D’un coup sans trop savoir pourquoi, j’ai décidé que le moment était venu. Il était 4 heures du matin et je n’arrivai pas à dormir, mais j’avais quelques idées pour commencer et je voyais ou je voulais aller. Le temps de trouver un nom de domaine sympa, court, simple à retenir… (D’ailleurs vous en pensez quoi du nom ?) Il ne restait plus qu’à installer un WordPress, de mettre un thème léger et un peu original (D’ailleurs vous en pensez quoi du thème ?), un logo vite fait et hop, le premier billet. (D’ailleurs vous en pensez quoi des billets ? Et puisque on est dans les questions, vous en pensez quoi des photos ?)

Webaaz

Presque 8 mois ont passé et depuis je me suis rendu compte que tenir un blog c’est un travail ! Je compte pour chaque article :

• Une bonne heure de recherche
• Une heure ou deux pour un premier jet
• Entre 5 minutes et une demi heure pour trouver une photo sympa et la retoucher
• Une demi heure à une heure de finalisation (relecture, d’ajout de liens…)

J’ai toujours quelques brouillons en cours sur des sujets que je veux creuser et je m’inspire de vos commentaires pour trouver le sujet qui va vous plaire. Je passe aussi un peu de temps à relire et mettre à jour d’anciens articles car j’ai choisi de ne pas les dater et de les mettre à jour en permanence afin d’avoir toujours une information valable.

Alors pourquoi ?

En fait ce blog c’est un peu mon wiki personnel, il me sert d’aide mémoire, j’y stocke des liens sympas, utiles et indispensables, et le fait d’écrire sur certains sujets qui concernent mon quotidien dans le web, me permet de poser les choses, d’y réfléchir, d’avoir une bonne vision d’ensemble des technos que j’utilise. Ce blog c’est avant tout pour moi, un outil de travail.

Le bonus, c’est que je peux échanger avec vous, car au final ce blog c’est un moyen de partager mes connaissances, de réunir sur un site un ensemble cohérent de trucs à connaitre pour travailler dans le web, au final un résumé de mon expérience, et le site que j’aurai aimé trouver à mes débuts dans la création de sites…

J’ai collecté en quelques années de bonnes adresses, des sites incontournables, j’ai repéré d’autres blogueurs, experts dans leurs domaines et de qui j’ai énormément appris, il fallait donc que je les partage ! Évidemment ce qui m’intéresse aussi c’est vos retours d’expériences vos questions, vos remarques afin d’en apprendre moi même encore plus sur le sujet.

Alors commentez, posez vos questions, proposez vos sujets, donnez-moi du boulot !

Photo de JKim1 depuis Flickr

Sur le même thème

• Webaaz & ses lecteurs
• Twitter & autres…
• Webaaz, le développement web de A à Z !
• Gandi & Webaaz vous offrent un nom de domaine !
• Paris Web 2010, j’y serai !

Photo de just.Luc depuis Flickr

Comment apprendre et pour devenir quoi ?

En guise d’introduction, c’est une question qui me vient à l’esprit : Comment apprendre et pour devenir quoi ? Si il y a quelques années, un « webmaster » faisait son site tout seul dans son coin avec des connaissances très limitées, le web et ses technologies se sont considérablement développés, et aujourd’hui, c’est souvent l’affaire de toute une équipe et de profils très différents. Les besoins sont tellement vastes qu’il est inutile de vouloir tout connaître. Il convient donc de savoir si l’on est plus attiré par la gestion de projet ou le design, la programmation ou le référencement…

Le parcours « classique »

Beaucoup de mes collègues, une majorité, viennent d’IUT ou d’écoles d’ingénieurs. C’est le parcours « classique » dans la plupart des domaines. C’est globalement le profil le plus recherché par les SSII. Les plus petites structures du style « web agency » recherchent probablement plus l’expérience et les compétence que le diplôme, il faut donc faire ses preuves.

Les formations web

Les formations orientée spécifiquement vers le web sont un moyen d’apprendre rapidement et arriver à un niveau acceptable pour créer ou maintenir de petits sites. On y apprends les bases de l’HTML, des CSS et du Javascript, l’utilisation d’un logiciel WYSIWYG et la publication FTP, mais aussi les bases de la retouche photo. Ces formations sont très souvent courtes, voire très courtes, de 10 jours à quelques semaines. Inutile de préciser qu’avec ces bases très légères vous serez parfaitement aptes à vous créer une page perso, mais inutile de voir plus loin. Si vous en doutez, faites une recherche sur les termes « formation webmaster » et regardez le programme ! Certaines formations vous apprennent Dreamweaver en deux jours, Flash en trois et Photoshop en deux heures le tout pour plus de 3000€ HT !

Il existe des formations plus poussées qui abordent la programmation, avec PHP le plus souvent. A l’heure du Web2.0 impossible de développer un site web sans connaitre les notions de POO ou MVC.

Ces formations ont l’avantage d’être d’accès facile, le prix est relativement élevé par rapport à la durée, mais n’importe qui peut y prétendre. Avec un DIF, ca peut être un moyen d’élargir ses compétences et de faire un premier pas vers le développement web.

Les formations généralistes

Bien sûr les formations généralistes sont bien plus poussées, mais leur durée, leur coût éventuel et leur accès y sont moins aisés.
La durée et le financement peuvent être des facteurs bloquants dans le cadre d’une reconversion par exemple, ou il sera difficile de se lancer dans un cursus d’école d’ingénieur ou un IUT. En revanche, pour un jeune bachelier, ou un étudiant déjà titulaire d’un DEUG ou d’un BTS, c’est certainement la meilleure solution qui soit. La formation est relativement généraliste et vous permettra de trouver assez facilement du travail, et d’évoluer vers le domaine qui vous plaira le plus (analyse, développement, gestion de projet, architecture, administration de bases de données…).

Ces formations vous ouvrent les portes aussi bien des grands comptes, des SSII des éditeurs de logiciel ou des web-agency, vous pourrez aussi bien travailler sur du site web, (internet, intranet ou extranet) que de la programmation logicielle classique, ou pour des téléphones ou smartphones (Androïd, Blackberry, Iphone…). les métiers et les emplois et les salaires sont divers et variés, et chacun peut y trouver son compte.

Le cas des webdesigners est un cas à part, puisqu’il vaut mieux passer par des écoles de design ou d’arts graphiques qui ont des formations dédiées à l’infographie.

Les formations professionnelles

C’est par là que je suis passé pour ma reconversion. Six mois intensifs à l’ENI, des modules sur la POO et les bases de données, l’apprentissage de .Net et Java. Ensuite, un stage de huit semaines en entreprise, et au final, un diplôme de niveau Bac+2 et une embauche.
Ces formations sont à l’écoute du marché et en contact permanent avec les acteurs informatiques locaux, leurs formations sont taillées sur mesure, et la plupart des élèves d’une promo sont embauchés dès la fin de leur formation.

Le prix de la formation me semble raisonnable vu la qualité des prestation et la quasi assurance de trouver du travail. De plus des aides municipales ou régionales sont souvent accordées, renseignez-vous !

L’auto-apprentissage

Tout le monde est plus ou moins autodidacte, mais pour arriver à se former vraiment tout seul, il faut énormément de temps, mais c’est important, car vous devrez en permanence savoir vous adapter pour répondre aux différentes problématiques que vous rencontrerez.

J’ai moi même appris tout seul, avec l’aide de sites web reconnus pour leur savoir faire, en développant des sites web associatifs de façon bénévole. C’est de là qu’est partie mon envie de me former de façon plus professionnelle afin d’acquérir plus de technique et de méthode.

Ma formation m’a permis d’être plus rigoureux, de travailler en équipe et detre bien plus crédible auprès des entreprises. C’est aujourd’hui un plus non négligeable sur mon CV.

L’expérience

Après une bonne formation, vous ne serez expert dans aucun domaine, mais vous aurez de solides bases, il ne tiendra plus qu’a vous de faire vos preuves et de vous spécialiser dans votre domaine de prédilection, sans pour autant vous enfermer dans une technologie qui risque de ne plus être d’actualités dans cinq ans. N’oubliez pas que le web va très vite !

L’expérience s’acquiert aussi bien au sein de votre entreprise que de manière autonome sur des projets persos ou en participant à des projets open-source. C’est un plus recherché par beaucoup d’employeurs.

Conclusion

Tous les moyens sont bons quand la motivation est là, une formation est un plus indispensable pour trouver du travail, et assoir ses compétences personnelles. Mais le diplôme ne suffit pas et la passion est un véritable plus qui fera la différence. C’est un métier ou les technologies que nous utiliserons dans cinq ou dix ans n’existent probablement pas encore.

Alors bon courage !

Sur le même thème

• Les plugins Firefox : XRefresh
• Réinventer la roue, ou pas ?
• Bien utiliser Zend Framework
• Bien définir son projet de site web
• Les plugins Firefox : FoxyProxy

Un billet un peu différent aujourd’hui puisqu’il inaugure les « billets d’humeur ». Avec maintenant plus d’une centaine de lecteurs par semaine en moyenne, j’ai envie de communiquer un peu plus avec vous afin d’en savoir un peu plus sur vous et de répondre un peu mieux à vos attentes. Ces billets seront moins intemporels et plus personnels que les articles techniques, afin d’échanger de façon ouverte sur le web d’une manière plus générale.

Le bilan c’est pour le moment 2000 visites et plus de 3000 pages vues en 7 mois. C’est d’autant plus intéressant que la progression est constante. Je m’étais fixé un article par semaine, j’en suis à un tout les 10 jours en moyenne, ce qui n’est déjà pas si mal, vu le temps de rédaction que je ne pensais pas si long et des projets web annexes très prenants. Avec mes billets d’humeur, je devrais pouvoir plus facilement atteindre mon objectif…

Si vous avez envie d’en savoir plus sur certains sujets, donnez vos idées, elles feront peut être l’objet d’un article dans les semaines à venir…
J’attends aussi tous vos commentaires sur ce qui vous plaît ou vous déplait sur ce blog, il y a sûrement des choses à améliorer !

Photo de gomattolson depuis Flickr

Sur le même thème

• Pourquoi je blogue ?
• Twitter & autres…
• Webaaz, le développement web de A à Z !
• Première bougie !
• Gandi & Webaaz vous offrent un nom de domaine !

Photo de just.Luc depuis Flickr

Présentation

Le Zend Framework ou ZF est en même temps un framework ou cadriciel et une bibliothèque de classes. Il est développé par Zend Technologies et distribué sous licence New BSD.
Il est actuellement considéré comme un outsider de Symfony mais ils sont à mon sens tout à fait concurrents et le choix entre les deux se fera juste sur le feeling que vous aurez avec l’un ou l’autre. Pour ma part, je trouve que ZF est plus souple que Symfony et qu’il correspond mieux à ma vision de PHP, mais c’est un avis très personnel basé sur mon expérience.

Pour plus d’informations sur le Zend Framework, lisez la présentation qu’en fait la communauté française :

• Présentation du ZF

Documentation

La documentation du Zend Framework est bien développée, pas toujours complète sur certains sujets, mais une excellente base avec beaucoup d’exemples. Elle est traduite dans un grand nombre de langue, mais pas toujours de façon exhaustive. La documentation française n’est faite qu’en partie, vous y trouverez donc des passages en anglais. Cependant, cela reste facilement accessible.

• Documentation française du Zend Framework

Normes

Pour profiter pleinement du framework de Zend il faut en respecter les principes, et notamment les régles d’écriture du code. Ainsi votre code sera plus lisible, et potentiellement plus facile à partager avec la communauté, ou pour vous faire comprendre sur les forums d’entraide.

• Règles d’écriture du framework

Bonnes pratiques

Pour progresser rapidement dans la compréhension et profiter au maximum des possibilités offertes par le Zend Framework, plusieurs bonnes pratiques s’imposent !

• Respect des concepts
• Analyse du code, pour comprendre le fonctionnement et les subtilités que la doc n’explique pas
• Utilisation de Google pour trouver des exemples, beaucoup de blogs font des tutos très intéressants
• Participation active à la communauté francophone par le biais du forum

En résumé, un framework ne vous apporte pas juste des bouts de codes, mais un cadre de travail standard, des bonnes pratiques, un état d’esprit en somme. Et c’est ce tout qui vous permet d’être efficace.

Communautés & Forums

Les communautés apportent donc des ressources supplémentaires, tutoriels, exemples de code, forums de discussion, mais demandent aussi de l’investissement pour ceux qui le souhaitent, alors si vous avez le temps et les capacités n’hésitez pas à proposer votre aide pour la traduction, la rédaction de cours, ou pour participer au développement même du framework !

• La communauté anglophone
• La communauté francophone
• Le forum de la communauté francophone
• La communauté francophone de developpez.com

Tutoriels

Google ne suffit pas toujours à trouver son bonheur, voici donc les sources ou je me fournit en tutos.
L’idéal pour bien appréhender un sujet, c’est le tutoriel vidéo, et pour le Zend Framework, un site lui est dédié :

• Zendcast

developpez.com propose également un tutoriel pour débuter :

• Tutoriel ZF pour débutant sur developpez.com

Je suis à la recherche d’autres sites avec des tutoriels de qualité, n’hésitez pas à m’indiquer les vôtres en commentaire.

Livres

Pour bien débuter, il est impératif de connaître PHP5 et la POO, et si possible le principe « Modèle Vue Contrôleur ».
Avec ces pré-requis le livre de Guillaume Ponçon et Julien Pauli devrait vous permettre de rapidement comprendre les principes de base :

• Bien développer en PHP de Guillaume Ponçon et Julien Pauli

Ce livre sera très bon pour les non-initiés, mais je ne vous le conseille pas si vous maîtrisez déjà PHP car il ne rentre pas assez dans le détail des rouages du framework et ré explique des concepts basiques pour le développeur PHP averti.

Et si vous avez besoin de vous remettre à jour sur PHP, deux articles de ce blog devraient vous permettre d’y arriver :

• Bien développer en PHP
• Les bons outils pour PHP

En savoir plus…

Pour en savoir plus sur les frameworks PHP, n’hésitez pas à aller voir le comparatif de frameworks PHP.

Sur le même thème

• Réinventer la roue, ou pas ?
• Les plugins Firefox : FoxyProxy
• Navigateur Web standard : Firefox
• Les plugins Firefox : XRefresh
• Les bons outils pour PHP (partie 2)

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

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 :

• Yslow
• Google Page Speed

Et des sites de mesure de performance :

• site-perf
• IBM Page Detailer
• Web Pagetest

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.

• Tests de compression de pages web
• Visualiseur de ressources réseau

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 :

• Mod_concat

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.

• CSSOptimiser
• CleanCSS

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 !

• Sprites CSS : Meurs, découpe d’images, meurs !
• CSSSprites
• SpriteGen

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.

• PNGCrush
• OptiPNG
• PunyPNG

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 :

• CSS-IG : Optimisation Web, format PNG

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

• Le blog d’Éric Daspet sur les performances web

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

• Les bonnes pratiques par Yahoo
• Les bonnes pratiques par Google
• Le blog de Steve Souders

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

• Les générateurs de sprites CSS
• Bien utiliser les feuilles de style (CSS)
• Recette & environnements de test
• Utiliser Chrome et violer la neutralité ?
• Les plugins Firefox : Colorzilla

Photo de Frédéric de Villamil depuis Flickr

Définitions

Javascript ou JScript, suivant le navigateur, est un langage de script orienté objet ou plus exactement orienté prototype qui s’exécute côté client, sur la machine de l’internaute. Il est issu de la norme ECMAScript.

• La définition de Javascript sur Wikipédia
• La définition d’ECMAScript sur Wikipédia

Historique

Javascript a été créé par Netscape en 1995 et mis en place dand Netscape Navigator dès 1996. Microsoft réagit rapidement et implémente alors JScript dans son navigateur. Netscape propose son implémentation à l’Ecma International pour le standardiser, ce qui sera fait en 1997.

Depuis Adobe a lui aussi créé sa propre implémentation du standard, ActionScript, utilisée dans Flash, et le standard évolue régulièrement pour apporter de nouvelles fonctionnalités.

Toutes ces implémentations sont quasiment respectueuses du standard, mais pas entièrement compatible entre elles. Les différences sont cependant minimes et l’utilisation d’un framework Javascript permet de ne pas se préoccuper de ces différences.

Ou apprendre ?

Pour bien débuter, Openweb propose une belle présentation du langage qui pourra à l’occasion servir d’aide mémoire. Je vous conseille également les articles sur le sujet de l’excellent Pompage, qui explique très bien comment écrire un code Javascript non-intrusif afin de ne pas gêner les utilisateurs qui le désactivent ou utilisent des navigateurs alternatifs sans Javascript comme les lecteurs d’écran.

• Tutoriel ECMAScript sur OpenWeb
• Tutoriels Javascript sur Pompage.net

Je n’ai pas d’autres ressources sous la main pour apprendre le JS, mais c’est un langage objet qui peut aussi être utilisé de façon procédurale, les habitué des ces techniques s’y retrouverons vite, pour les autres, l’apprentissage sera favorisé par un livre récent, mais là aussi, je n’en ai pas en référence. J’attends donc vos commentaires sur le sujet.

Documentation

La documentation est disponible sous différentes formes, je vous conseille les suivantes qui sont claires et complètes.

• Documentation Javascript de mozilla
• Documentation ECMAScript officielle

Méfiez vous des sites spécialisés en javascript « procédural » et qui ne proposent que des bouts de scripts, si ils étaient intéressants il y a quelques années, l’utilisation d’un framework est aujourd’hui une solution plus pérenne.

Questions / Réponses

Et comme la documentation ne suffira pas, la Faq de developpez.com et le forum Javascript d’Alsacréation devraient vous permettre de solutionner vos problèmes.

• Faq Javascript de Developpez.com
• Forum Javascript d’Alsacréation

Les frameworks et bibliothèques Javascript

Elles sont à l’origine du renouveau de Javascript car elles simplifient grandement le développement. Elles permettent de ne pas réinventer le roue en permanence, et permettent des effets très « web 2.0″ qui améliorent l’ergonomie et l’expérience utilisateur. Quelle que soit celle que vous choisissez les fonctionnalités sont en partie équivalentes, et le résultat dépendra surtout des plugins que vous pourrez installer ou des développements que vous ferez.

Pour simplifier, les plugisn permettent à l’utilisateur lamda de rapidement avoir l’effet voulu, mais pour un résultat plus rapide ou plus précis fonctionnellement, il faudra écrire son propre code.

J’utilise principalement JQuery avec JQueryUI pour les effets graphiques et Mootools. Ils sont simples à utiliser pour mettre facilement en place des effets simples sans trp de connaissances, ou pour des développements plus complexes avec une bonne expérience en JS.

• JQuery
• JQuery UI
• Mootools

Il en existe plein d’autres avec parmi les plus connus :

• Prototype
• Dojo Toolkit

Pour vous aider dans votre choix, des comparatifs existent sur Internet, Bestwebframeworks devrait vous aider dans cette tâche.

Outils

Pour déboguer vos scripts je vous conseille les extensions Firefox, en particulier Firebug que j’utilise en quotidiennement.

• Installer Firebug pour Firefox
• Installer Venkman pour Firefox

Je déborde un peu du sujet en abordant l’optimisation de code. Pour améliorer le temps de chargement de vos scripts, n’hésitez pas à utiliser des bibliothèques disponible sur les CDN de Google ou Yahoo par exemple et de compresser votre code avec Compressorrater.

• Compressorrater

Vous voilà avec l’essentiel des connaissances pour travailler sereinement avec Javascript.
Et pour ceux qui veulent creuser le sujet, je vous conseille une discussion sur l’implémentation de Javascript coté serveur sur Linuxfr.org.

Encore une fois je n’ai pas trouvé de photo illustrant parfaitement « Javascript », alors celle-ci avec ses branches tortueuses me rappelle un peu le Javascript approximatif d’il y a quelques années… C’est léger comme explication, mais c’est tout ce que j’ai, et puis la photo est belle, ça suffit non ?

Sur le même thème

• Les plugins Firefox : Firebug
• Les plugins Firefox : TileTabs
• Bien utiliser les feuilles de style (CSS)
• Bien développer en PHP (partie 1)
• Bien écrire HTML & XHTML

Photo de nitot depuis Flickr

Définitions

• Système de noms de domaine
• Nom de domaine
• Registar
• Hébergement de noms de domaine
• DNS

Présentation

Pour trouver un contenu hébergé sur Internet, on peut éventuellement y arriver via l’adresse ip du serveur, mais ce n’est bien sûr pas facile à retenir et pas parlant du tout. C’est pourquoi chaque serveur est associé à un nom de domaine via le DNS. Si vous avez un blog ou des photos en ligne chez un hébergeur, celui ci vous propose en général un sous domaine lié au sien du style : http://votre-nom.hebergeur.com. C’est une solution simple, gratuite et pratique vous n’avez rien à mettre en place, l’hébergeur s’occupe de tout et vos données sont facilement accessibles.

A quoi sert un nom de domaine ?

Mais la gestion de votre propre nom de domaine peut vous apporter bien plus que cela. Grâce à votre nom de domaine, vous pouvez afficher votre site avec une adresse bien à vous, avoir votre adresse email liée à votre nom de domaine, utiliser des sous-domaines afin de diffuser d’autres sites ou services… Nous allons voir tout cela dans le détail.

Comment choisir son nom de domaine ?

L’extension

Il existe déjà une multitude de noms de domaines, et il peut être compliqué voire impossible de trouver le nom que vous souhaitez avec la bonne extension. Les principales sont le .com pour les sites commerciaux, le .org pour les organisations et les extensions géographiques suivant le pays ciblé, comme le .fr pour la France geré par l’AFNIC. Si vous ciblez la Belgique, le .cn (chine) n’a aucun intérêt pour vous.

Pour plus d’informations vous pouvez voir la liste complète des extensions par pays

Certaines extensions de pays comme le .tv sont très convoitées par les chaines de télévision.

Des extensions sont également possibles par zone géographique

• .asia : Asie
• .eu : Europe

Les autres extensions possibles sont :

• .aero : pour l’aéronautique et l’aviation
• .biz : pour les activités commerciales
• .coop : pour les associations coopératives
• .edu : pour le système éducatif américain et universités américaines
• .gov : pour le gouvernement américain
• .info : pour les médias
• .int : l’international
• .mil : pour l’armée des Etats-Unis
• .mobi : pour les sites mobiles
• .museum : pour les musées
• .name : pour les particuliers
• .net : pour les organismes en rapport direct avec Internet et son évolution
• .pro : Pour les activités professionnelles

Bien entendu certaines vous seront interdites, le choix se limite donc rapidement. Cependant, la plupart restent ouvertes et n’importe qui peut déposer un .net sans avoir à se justifier.

Le .tel est un cas particulier puisqu’il ne vous permet pas de le lier à un hébergement mais de gérer des contacts et leurs coordonnées. C’est à mon avis un moyen de vendre encore plus de domaines, le protocole aurait pu simplement être implémenté sur n’importe quel domaine ne utilisant un sous domaine tel que tel.domaine.com. Il a pour le moment un succès mitigé.

Le nom

Si vous avez déjà un nom, pour votre entreprise par exemple, l’idéal est de l’utiliser, de la même manière si vous désirez un nom de domaine pour vous personnellement votre nom de famille ou la concaténation de votre prénom et de votre non peuvent faire l’affaire.

Mais votre choix sera limité, il existe déjà plus de 200 millions de noms de domaines sur le web !

La solution passe alors par des mots-clés. Vous pouvez composer votre nom de domaine avec un ou plusieurs mots-clés, éventuellement séparés par des tirets pour en faciliter la lecture. Le but étant de bien cibler votre activité, car si votre activité évolue, vous risquez d’avoir un nom de domaine obsolète et en termes de référencement, le nom de domaine à son importance et un changement n’est pas anodin.

Si vous avez du mal à trouver votre bonheur il existe sur internet des webwares qui pourront vous aider et vous conseiller d’autres propositions ou des variantes de votre idée originale si celle ci est déjà utilisée. Regardez par exemple : Domain Typer

Ou acheter son nom de domaine ?

Le travail de votre hébergeur de noms de domaine est donc de tenir à jour les informations liées au propriétaire d’un nom de domaine (en lien avec le registre) et les informations techniques qui constituent le paramétrage du nom de domaine et ceci avec une disponibilité totale.
Bien sûr un tel service se paie, les prix s’échelonnent de quelques euros à plusieurs dizaines d’euros pour un nom de domaine. Les prix sont inégaux et pourtant quel que soit l’extension choisie, le service est le même, mais chaque registre de noms de domaine peut monnayer son extension comme il le souhaite.

Par abus de langage on se dit souvent propriétaire d’un nom de domaine alors qu’on en est en fait que locataire à vie.

En France pour l’achat et l’hébergement de noms de domaines le numéro un des bureaux d’enregistrement est Gandi. Ils proposent un grand choix de domaines, et une interface de gestion simple à utiliser. Il existe d’autrs bureaux d’enregistrement, pensez tout de même à vérifier leurs références avant de passer à l’achat.

J’utilise Gandi depuis de nombreuses années et j’ai toujours été extrêmement satisfait de leurs travail en tant qu’hébergeur de noms de domaine. Leur savoir-faire est incontestable et même si leur tarifs sont peut-être un petit peu plus élevé qu’ailleurs, les prix sont tout de même compétitifs et au regard de la qualité, les tarifs sont au final très raisonnables.

La plupart des hébergeur de sites web proposent aujourd’hui d’acheter en même temps votre hébergement et votre nom de domaine. Cette solution à l’avantage de vous permettre de faire de belles économies, mais vous lie plus fortement à votre prestataire et en changer pourra être plus compliqué. La séparation des deux apporte plus de souplesse. Par ailleurs un bureau d’enregistrement propose souvent une gestion plus fine des noms de domaine que votre hébergeur qui se contente souvent de l’essentiel.

Le Whois

Le whois est un moteur de recherche pour les noms de domaine. Il permet de retrouver les contacts d’un nom de domaine et la date d’expiration. En effet à l’enregistrement de votre domaine vous devrez préciser qui est le « propriétaire » du nom de domaine et qui sont les contacts technique, administratif et de facturation.
Ces informations sont obligatoires et doivent être justes, sans quoi votre domaine sera suspendu. Ces informations peuvent cependant anonymisées par votre bureau d’enregistrement.

Voici deux whois qui regroupent la plupart des extensions :

• whois.net
• idwhois.info

Méfiez vous de certains prestataires (hébergeur, web agency) qui prennent à leur charge l’enregistrement du nom de domaine, et qui l’enregistrent dans leur nom. Ils vous bloquent ainsi chez eux vous empêchant de partir à la concurrence.

Bien configurer son domaine

• A : correspondance entre un nom d’hôte et une adresse IPv4
• AAAA : correspondance entre un nom d’hôte et une adresse IPv6
• CNAME : alias de domaine
• MX : définition des serveurs de courriel du domaine
• NS : définition des serveurs DNS du domaine
• PTR : correspondance entre une adresse IP et un nom d’hôte
• SOA : donne les informations sur la zone
• TXT : champ libre qui permet entre autres de gérer les enregistrements SPF pour définir les serveurs autorisés à envoyer des mails pour le domaine.

Je vous renvoie vers la documentation et le support de votre bureau d’enregistrement ainsi que la documentation Wikipédia citée plus haut pour plus de détail. Le wiki de Gandi vous sera aussi très profitable.

Pour en savoir plus

• Autoformation aux DNS par l’AFNIC

ps : Pour l’illustration de cet article, je n’ai pas trouvé de sujet photographique se rapportant de près ou de loin aux noms de domaines, j’ai donc choisi une belle photo sur Flicker, sans aucun lien avec le sujet, si vous avez une idée d’illustration je suis preneur.

Sur le même thème

• Trouver un bon hebergeur web, quels critères ?
• Optimiser son site web
• Comment apprendre le développement web ?
• Optimiser l’utilisation d’Eclipse
• Internationalisation & localisation

Partageons donc ces expériences, voici quelques conseils pour trouver l’hébergeur web qui correspond à vos besoins, en termes de capacité de stockage, de bande passante, de technologies utilisée, de support ou de qualités de service.

Photo de edgar asencios depuis Flickr

Identifier le besoin

Nous n’aborderons pas ici les points techniques, vous savez bien si vous avez besoin de PHP5 ou de Java, d’une base de données MySQL ou PostGreSQL, nous verrons plutôt tout ce qui tourne autour et auquel on ne fait pas forcément attention au premier abord mais qui est pourtant essentiel.

Basique

Le premier point important est d’identifier le besoin. Si vous hébergez un blog, vos besoins seront sans doutes minimes en termes de performances, pensez éventuellement à prévoir un peu de place si vous comptez offrir à vos visiteurs de la vidéo, ou un contenu riche en photos haute définition. Les offres d’hébergement premier prix sur des serveurs mutualisés sont légions il faudra juste faire attention aux détails (version des base de données, paramétrage de PHP…). Comptez entre 0€ et 4€ par mois en moyenne.

Modéré

Si vous pensez avoir un certain nombre de visiteurs, mais que votre budget est limité, il vous faudra alors une offre mutualisée, mais avec de plus fortes capacités, certaines permettent d’obtenir de très bons rapports performance/prix. Il faudra prévoir un budget entre 3€ et 10€ par mois.

Important

Si votre capacité financière le permet et si l’importance de votre projet le nécessite, vous pouvez passer sur un serveur dédié, vous serez le seul à héberger vos sites sur cette machine, le résultat sera forcément de bonne qualité, faites tout de même attention, car dans ce domaine également, tous les serveurs ne se valent pas, et il faudra qu’il soit dimensionné en fonction de vos besoins spécifiques. Les prix démarrent à 10€ par mois pour les offres les plus basiques et montent à plusieurs centaines d’euros par mois. Mais plusieurs offres autour de 30€ par mois permettent un bon compromis pour débuter avec un dédié sans trop de frais.

Un autre type d’offre se développe maintenant, la virtualisation. Cela consiste héberger les sites web sur des serveurs virtuels situés sur des serveurs physiques. Pour simplifier on mutualise des grappes de serveurs tout en gardant la souplesse du serveur dédié. On peut même paramétrer l’ensemble pour ajouter de la puissance de calcul si les besoins augmentent ou baisser automatiquement quand la charge redescend.

A terme j’imagine que tous les hébergement seront sur la base de serveurs virtuels, tant cela apporte en termes de souplesse autant à l’hébergeur qu’a l’hébergé.

Gratuit contre payant

Alors si vous êtes dans le premier cas cité ci-dessus, à savoir un blog ou un site web simple, la question peut se poser de choisir entre une offre gratuite, souvent proposée par votre FAI et une offre payante bon marché. Si vous débutez n’hésitez pas à tester vos première pages sur un hébergement gratuit, et si le besoin s’en fait sentir passez au payant, certaines offres sont très abordables et vous apporteront plus de qualité et de possibilités techniques. Un hébergeur payant sera forcément mieux qu’un gratuit, les offres évoluent plus souvent pour suivre les avancées techniques, les temps d’indisponibilités seront plus faibles, et vous ne serez pas limité sur certaines options comme l’envoi de mail par exemple.

Mutualisé contre dédié

Là encore à moins d’avoir un gros projet qui nécessitera rapidement de gros moyens, pour des projets non professionnels la suite logique est de commencer sur un serveur mutualisé et de monter en gamme progressivement jusqu’à ce que le serveur dédié s’impose.

Une autre bonne raison de passer au serveur dédié est d’avoir besoin de spécificités techniques qu’un hébergeur mutualisé ne pourra pas vous fournir. Si vous avez besoin de capacité de calcul très importantes ou de paramétrages particuliers, d’un OS spécifique, ou tout simplement d’avoir la main pour redémarrer suivant vos besoins, vous pourrez également changer de versions logicielles quand bon vous semble, et pas quand l’hébergeur l’aura décidé. Si votre application est critique, c’est le bon choix.

Si vos besoins explosent, alors vous pouvez même louer des baies chez un hébergeur pour y mettre vos propres serveurs, mais là c’est une autre histoire…

Et si vous n’y connaissez rien mais que vos besoin vous obligent à prendre un serveur dédié, des solutions d’inforgérance vous permettent de laisser la partie technique à un prestataire compétent.

Et le cloud computing alors ? Et les CDN ?

Une autre possibilité s’offre à vous si vous avez de gros besoins c’est la nouvelle tendance du moment : Le cloud computing. On est dans la virtualisation mais avec des moyens infinis grâce à des datacenters inter-connectés entre eux qui fournissent une puissance de calcul énorme. Vous payez en fonction des ressources serveur et réseaux réellement consommées.
Vous pouvez donc imaginer utiliser ce « système en nuages » pour héberger votre application ou juste pour effectuer des calculs coûteux en ressources via un webservice.

Si vos besoins sont importants en termes de ressources statiques notamment si vous souhaitez disposer d’une bande passante importante et partager vos données entre des datacenters répartis dans le monde entier pour fournir des pages à vos visiteurs dans un temps record, alors intérresez vous aux CDN. Certains services offrent même une offre de base gratuite, idéale pour se faire une idée.

Trouver des avis

Alors avant de franchir le pas et de vous jeter sur le premier hébergeur venu, essayez d’avoir des informations, des retours de clients bons et mauvais afin de vous faire une idée précise de ce qui vous attends. En tapant le nom de l’hébergeur dans Google, vous devriez déjà en savoir un peu plus. D’autres solutions existent, des comparateurs d’hébergement existent, ils recensent les offres et les avis des consommateurs. Demandez également autour de vous, aujourd’hui on connait tous quelqu’un qui à son site web, et il à sûrement de bons conseils, car une fois lié à un hébergeur pour un an ou plus, changer vous coûtera financièrement et la migration en elle même peut être compliquée.
Regardez aussi les forums de l’hébergeur, pour voir si les clients se plaignent et si les réponses apportées sont de qualité ou si l’hébergeur ne s’en préoccupe même pas !

Tester

Certains hébergeur proposent une période de test gratuit, ou un accès au panneau d’administration, profitez-en pour pour vérifier que l’hébergement tient toutes ses promesses et que l’ergonomie de l’interface de gestion est simple à appréhender. Vérifier que vos scripts sont traités rapidement et que vous ne risquez pas de regretter votre choix.
Pensez également à tester le support en posant des questions technique au service client pour évaluer leur rapidité et leur compétence technique. Je suis pour ma part déjà tombé sur des hébergeurs totalement incompétents !

Mes choix

Voici les hébergeurs dont je suis satisfait :

• OVH
• Nuxit

Je suis resté plusieurs années chez Nuxit, et je viens de migrer chez OVH car j’avais des besoins particuliers, notamment un serveur SVN et un accès SSH. Nuxit ne proposant pas ces options, j’ai donc décidé de changer, mais je conseille vraiment Nuxit, pour sa qualité de service et la rapidité de son service technique. Je n’ai jamais eu à m’en plaindre et je vous le recommande fortement.

Pour ce qui est d’OVH, je n’ai pas encore le recul nécessaire, mais sa réputation est bonne et pour le moment je n’ai pas à m’en plaindre, tout fonctionne très bien.

Prévoir les montées en charge

Pensez à vérifier que votre hébergeur proposent d’autres offres vous permettant d’upgrader votre solution facilement si le besoin s’en fait sentir, cela vous évitera des désagréments.
Pensez aussi à bien optimiser vos sites web, bien souvent une optimisation permet d’éviter de prendre une offre plus coûteuse pour le même résultat.

Ne pas mettre tous ses œufs dans le même panier

Si vous avez plusieurs sites, n’hésitez pas à prendre des hébergements séparés pour gérer séparément chaque site. Vous aurez ainsi la possibilité d’avoir des statistiques plus précises, pouvoir évoluer suivant les besoins de chaque site, avoir une arborescence simplifiée, si un site prends beaucoup de ressources, il n’impactera pas directement les autres… C’est cette solution que j’ai prise dernièrement, et au final cela ne me coûte pas plus cher pour une plus grande souplesse.

L’hébergement maison

Je n’ai pas abordé ce sujet, mais la possibilité existe d’héberger votre site web directement chez vous, sur un ordinateur dédié ou sur votre pc, mais ces solutions nécessitent de connaître parfaitement le sujet et ne sont pas sans inconvénients. Votre bande passante ne suffira probablement pas à offrir un service de qualités à vos visiteurs, et les coûts en électricité ne sont pas anodins, comptez autour de 70€ par an… Cette solution n’est donc pas viable dans la très grande majorité des cas.

Vérifier que tout est fonctionne bien

Une fois que votre site est en place, surveillez le activement pour voir si il n’est pas indisponible, vérifiez les statistiques, le temps de chargement des pages, et n’hésitez pas à faire des retours et des suggestions au service technique afin d’améliorer la qualité du service.

Rassurez vous, en général tout se passe bien, et vous pouvez vous concentrer sur votre site, mais il y aura toujours des points à surveiller, à commencer pas ne pas oublier de renouveler votre hébergement dans les délais…

Avez vous vous aussi des conseils ou des expériences à partager sur le sujet ?

Sur le même thème

• Trouver un bon hebergeur web, quels critères ?
• La gestion des versions
• Les bons outils pour PHP (partie 2)
• Bien définir son projet de site web
• Les plugins Firefox : FoxyProxy

Photo de Bensonkua depuis Flickr

Définition

Vous en avez peut être déjà vues sur certains sites officiels, souvent présentées au format PDF, sur une ou plusieurs pages, les cheat sheets, ou antisèches en français, sont un condensé des informations pas forcément facile à retenir, ou des informations que l’on se doit de connaître.

Ou les trouver ?

Plutôt que de les trouver par hasard ou de les rechercher pendant des heures, plutôt que de faire un aide-mémoire pour noter les urls de ces cheat sheets, je vous conseille de chercher à la source, puisque quelques sites en recensent plusieurs centaines triées par thèmes :

• Cheat Sheets
• Tech cheat sheets

Bien sûr ces différents sites présentent pour la plupart les mêmes contenus, à vous de voir celui qui vous convient le mieux. Pour ma part j’utilise Pushing Buttons.

Les mémentos

Très utiles aussi, la collection de mémentos chez Eyrolles, c’est l’équivalent des cheat sheets sur support physique, dans un format réduit et plastifié, ces fiches de très bonne qualité sont rédigées par des experts en la matière. En voici quelques uns :

• Mémento PHP5 & SQL de Cyril Pierre de Geyer et Guillaume Ponçon
• Mémento XHTML de Raphaël Goetter
• Mémento CSS de Raphaël Gotter

Il en existe d’autres sur les sujets suivants :

• Unix/Linux de Isabelle Hurbain
• Ergonomie web d’Amélie Boucher
• Sites web, les bonnes pratiques, d’Elie Sloïm
• MySQL de Rodolphe Rimelé

Conclusion

Avec toutes ces fiches vous voilà paré pour vos prochains développements. Avez vous vous aussi quelques sites de références pour les antisèches ?

Sur le même thème

• Bien écrire HTML & XHTML
• Bien utiliser les feuilles de style (CSS)
• Livre : Pro Git
• Bien développer en PHP (partie 1)
• Veille techno Web de A à F (partie 1)

Présentation

PHP est un acronyme récursif qui signifie « PHP Hypertext Preprocessor ». C’est un langage de scripts libre qui permet de générer des pages web de façon dynamique.
C’est un langage simple à apprendre, peu typé, il permet beaucoup de souplesse, ainsi il est très simple d’écrire du code PHP sans tout connaître du langage, mais c’est aussi une porte ouverte à un code simpliste et peu fiable. Bien utilisé en revanche, il est robuste, fiable et rapide.

• Le site officiel de PHP

En raison de sa richesse, PHP est plus considéré comme une plate-forme qu’un simple langage.

Sa mascotte est un « éléphpant » bleu créé par El roubio

Photo de Skoop depuis Flickr

Historique

PHP a été créé à partir de 1994 par Rasmus Lerdorf qui souhaitait présenter son CV sur Internet. A ce moment là, PHP/FI, signifie « Personal Home Page / Form Interpreteur ».
PHP va se développer à partir de la version 4 et l’arrivée de Andi Gutmans et Zeev Suraski qui vont réécrire le cœur du projet.
La professionnalisation viendra en 2004 avec la version 5, sobrement appelée PHP5, dont le moteur, Zend Engine en version 2 apporte son lot de nouveautés, parmi lesquelles, le support de la Programmation Orientée Objet.

PHP est aujourd’hui l’un des fers de lance du monde Open Source, présent sur plus de 30 millions de sites web. Cette philosophie d’excellence par le partage et l’entraide est présente à travers lui. En plus d’une belle idée, on associe un produit qui est fiable, stable, complet et multi plateforme.

La version 6 est un peu l’arlésienne de PHP, attendue depuis 2007, elle ne verra probablement pas le jour avant 2010. Elle est très attendue pour son support natif de l’unicode, qui oblige à une refonte assez complète de la plupart des fonctions PHP.

Zend

PHP ne serait pas PHP sans Zend Technologies et Zend n’existe que par PHP. Créée en 1999 la société est la base de l’écosystème PHP, ses ingénieurs participent au développement du langage, mais créent aussi des environnements de développements, de serveurs, des outils de monitoring, ou un encrypteur de code. Ils sont aussi à l’origine de Zend Framework, un framework MVC doté de multiples bibliothèques.

• Le site officiel de Zend >Technologies

Quelle version utiliser ?

Sortie depuis 2004 PHP5, apporte le support de la POO, une gestion simplifiée des fichiers XML, de la transformation XSL et du DOM. Suite au retard de la sortie de PHP6, les nouvelles fonctionnalités prévues comme la gestion des espaces de noms ont été intégrées directement dans PHP 5.3

PHP5 est donc aujourd’hui incontournable, d’autant plus que depuis l’été 2008 PHP n’est officiellement plus maintenu. La mise à jour des versions mineures ne posant aucun problème de compatibilité, il est fortement conseillé de suivre les nouvelles versions dès qu’elles sont disponibles afin de corriger les éventuels bugs.

Normes & bonnes pratiques

Il n’existe pas à proprement parler de normes, le respect de la syntaxe s’impose de lui même ! Par contre de bonnes pratiques vous permettront de développer avec plus dé sérénité et de qualité.

• Avoir de la rigueur !
• Indenter le code, utiliser la PHPDoc et écrire de commentaires dans le code
• Encoder vos fichiers source en UTF-8
• Ne pas réinventer le roue, utiliser les bibliothèques !
• Utiliser un framework et respecter l’architecture MVC pour des projets importants

A mon sens les trois premiers points sont les plus important, en particulier le premier. D’après moi,un bon développeur PHP est avant un développeur Java. Java ne permet pas la souplesse de PHP mais impose la rigueur. En passant à PHP, le programmeur habitué à la rigueur trouvera les avantages de la souplesse sans se laisser aller à la facilité.

Une initiative récente est tout de même intéressante à relever. The PHP standards initiative cherche à promouvoir un standard de développement pour PHP.

Comment apprendre ?

On trouve sur le sujet des milliers de « références » vous proposant d’apprendre PHP, une bonne partie est obsolète ou ne respecte pas les bonnes pratiques. C’est une des raisons qui fait que la plupart des sites web développés en PHP aujourd’hui ont des failles de sécurité. Mais ce n’est pas une fatalité, et il existe aussi d’excellents sites pour appréhender le langage.

Ma référence principale est la documentation officielle qui est vraiment bien faite et très complète. On y revient sans cesse et on y trouve très souvent les réponses que l’on cherche.

• Le manuel PHP
• Le guide des fonctions PHP

Vous trouverez également de l’aide sur les sites suivants :

• Apprendre PHP
• PHP Débutant
• Scripts PHP

Apprendre PHP est un site assez récent, mais qui propose des tutoriels très complets et un forum intérressant. Scriptsphp n’est plus du tout mis à jour, mais les quelques tutos présents sur le site sont de bonne qualité.

Bibliographie

Comme pour toute technique l’apprentissage est facilité par la lecture d’une « bible » de référence, pour PHP j’en ai trois :

• PHP 5 avancé d’Eric Daspet et Cyril Pierre de Geyer
• Sécurité PHP 5 et MySQL de Damien Seguy et Philippe Gamache
• Best practices PHP 5 de Guillaume Ponçon

Le premier en est à sa cinquième édition, et traite de tous les sujets de façon avancée mais abordable. Le second est très axé sur la sécurité et sera un bon complément pour développer des applications sensibles. Le dernier reprends PHP de façon plus globale afin de vous montrer toutes les facettes du développement d’un projet PHP dans les meilleurs conditions possibles. Il est réservé à l’utilisateur averti qui veux progresser dans les bonnes pratiques.

Et pour avoir toujours sous la main les références de base :

• Mémento PHP5 & SQL de Cyril Pierre de Geyer et Guillaume Ponçon

Les curieux pourront lire les quelques livres sortis sur PHP6 mais mieux vaux attendre la sortie de cette nouvelle mouture avant d’investir.

Références en vrac

• PHP Index, une FAQ d’une grande richesse
• PHP Classes, des centaines de classes très utiles

Flux RSS en vrac

Pour vous tenir informé de l’actualité de PHP, voici quelques flux pour votre agrégateur :

• Nexen : Toute l’information sur PHP
• PHP.net
• Professional PHP
• Dur comme faire : Revue de presse hebdomadaire

Et pour les plus curieux :

• Le blog de Zeev Suraski
• Le blog de Andrei Zmevski
• Le blog d’Andi Gutmans
• Le blog d’Ilia Alshanetsky

Et pour vraiment tout connaître sur PHP, se tenir informé, n’oubliez pas de passer par le Forum PHP tout les ans à Paris. Vous pourrez y rencontrer les principaux acteurs de PHP et MySQL et assister à leurs conférences. C’est un événement organisé par l’AFUP.

Comme en 2008, je serais présent au forum PHP 2009. Si vous y passez aussi, dites le moi !

La seconde partie de cet article traite des outils pour bien développer avec PHP

Sur le même thème

• Bien utiliser Zend Framework
• Les bons outils pour PHP (partie 2)
• Bien écrire HTML & XHTML
• Veille techno Web de F à Z (partie 2)
• Aide mémoire & antisèche : Les cheat sheets