HTML & CSS

BBComposer — l’éditeur HTML à consommer sur place ou à emporter

Initialement développé pour les besoins internes de la société ElitWork, BBComposer est un éditeur de texte qui produit du code HTML (mais aussi du Wiki, BBCodes et XBBCodes) dans un environnement WYSIWYG. Nicolas et Mathieu Froidure ont prêté une attention particulière au code généré, avec la sémantique des balises comme fil directeur. BBComposer est une extension Firefox, ce qui le distingue des autres éditeurs HTML sur le marché comme TinyMCE ou CKEditor. Il est donc possible d’utiliser cet éditeur HTML dans votre CMS préféré sans ajouter de plugin. →

Design & Graphisme

Quelques notes sur les grilles de mise en page

A mesure que les techniques des langages du web l’ont permis, des designers web talentueux ont travaillé à l’élaboration d’environnement de travail permettant de mettre en place des systèmes de grille adaptés aux contraintes de la création de pages web. Contrairement à l’imprimé où le langage de description de page Postscript d’Abode est un standard, il n’existe pas sur le web de dispositif « officiel » pour créer des colonnes à l’épreuve des différences de rendu entre les agents utilisateurs (les navigateurs). →

Intégration web

Tester un site dans plusieurs navigateurs (mais surtout dans IE6 avec Vista)

Tester ses pages web dans les différents navigateurs présents sur le marché est souvent source de frustration. Même lorsqu’on utilise un système Windows, on rencontre des difficultés pour tester les sites dans IE6, IE7 et IE8 en même temps. Opera, Firefox, Google Chrome ou Safari ne posent pas de problème particulier. Selon votre configuration, il existe plusieurs techniques permettant d’assurer un affichage homogène sur la majorité des navigateurs : virtualisation, logiciels, services en ligne ou pourquoi pas un deuxième ordinateur dédié comme un NetBook ? →

Le petit journal du web

Auditez votre site web avec Browser Size de Google

Avec Browser Size, Google Labs nous propose de découvrir la part de contenu visible dans la fenêtre des internautes selon des moyennes statistiques réalisées d’après les visites sur les sites de Google, c’est-à-dire un peu tout le monde ! On découvre ainsi que 99% des visiteurs ont une fenêtre d’environ 550 pixels de large pour 350 pixels de haut avec des chiffres qui chutent assez vite à mesure que la taille augmente : seulement 90% des visiteurs visualisent une surface de plus de 950 pixels par 500 pixels. Quand aux tailles supérieures à 1200 pixels de largeur, elles concernent moins de 50% des utilisateurs. →

CMS WordPress

Afficher / masquer votre grille de base avec jQuery

Si vous travaillez avec une grille pour harmoniser la disposition des blocs sur la page, vous passez certainement du temps à afficher puis masquer cette grille pour vérifier que tout est en ordre. Pour cela on peut ajouter une classe CSS dans le code HTML ou mettre entre commentaires une ligne concernant le `background` de la page dans la feuille de style… Les deux solutions sont assez fastidieuses. C’est pourquoi, je vous propose une petite astuce toute simple qui s’applique à tout type d’intégration avec toutefois un bonus pour WordPress que vous adapterez sans peine à votre CMS préféré. →

HTML & CSS

Boks — Éditeur visuel de grilles CSS pour Blueprint, etc.

Boks est un éditeur de grille CSS développé avec Air (utilisable sur Windows, Mac et Linux) qui fournit une interface visuelle pour travailler avec le framework CSS Blueprint. Les frameworks sont souvent très utiles mais le paramétrage d’un pas de grille personnalisé peut s’avérer fastidieux. Outre la configuration du nombre de colonnes, de la largeur de la page et de la valeur de la gouttière, Boks permet de configurer la grille verticale en déterminant les valeurs des principales balises HTML. →

Intégration web

Ressources Javascript pour intégrateurs web front-end

Si les fondations du design web sont constituées de HTML et de CSS, il faut reconnaitre qu’il est de plus en plus difficile de se passer de Javascript et des frameworks comme jQuery. C’est pourquoi je propose aux webdesigners et aux intégrateurs web un lien Javascript chaque jour (ou presque). Mon choix se portera plus particulièrement sur les développements préservant la séparation de la forme et du fond (oui ça veut dire non-intrusif) dans la droite ligne des bonnes pratiques HTML et CSS. →

HTML & CSS

HTML5 et CSS pour l’intégrateur web

L’actualité du développement web est riche et c’est sans compter les liens plus anciens qui en ont encore sous le pied. Après le petit journal du web et celui consacré à WordPress, voici une sélection de ressources qui devrait plaire aux intégrateurs HTML et CSS. Au menu : un paquet de référence sur la prise en compte des balises HTML5 et des propriétés CSS par les différents navigateurs ; du nouveau pour aller au-delà des polices installées sur le poste client ; quelques Frameworks CSS à tester pour occuper les longues soirées hivernales et du `float` en veux-tu en voilà ! →

HTML & CSS

10 liens pour faire plaisir à votre intégrateur web

Cette liste de ressources devrait rendre de grands services à l’intégrateur HTML & CSS ainsi qu’au développeur web. en effet, vous y trouverez : un générateur de miniatures pour la page d’accueil de votre blog WordPress ; des outils pour valider l’ensemble de votre site ; un fichier PHP pour gérer votre base de données et des plugins jQuery tous plus intéressants les uns que les autres, etc. Il s’agit du meilleur des bons plans que je propose sur mon compte Twitter integrateur_css. Stay tuned and mind the gap! →