Tutoriels pour apprendre HTML & CSS

Il existe de très nombreuses ressources pour apprendre les langages du web HTML & CSS. Bien sûr, les spécifications du W3C en la matière sont un passage indispensable, mais il ne faut pas oublier qu’il existe des tutoriels plus… didactiques. Ceux que je vous présente vous prendront par la main pour que le plongeon dans le grand bain de l’intégration web ne se transforme pas en «plat» douloureux. Continuer la lecture de Tutoriels pour apprendre HTML & CSS

Quelques notes — Programme de formation HTML & CSS

Les langages du web HTML et CSS sont généralement structurés autour de concepts qui ont peu à voir avec la manière dont ils seront utilisés. Ce qui est normal après tout : les concepteurs ne sont généralement pas les auteurs. Il appartient à ces derniers de tâtonner un peu, beaucoup ou passionnément et d’en parler avec leurs voisins pour connaitre les bonnes pratiques du jour. Pour dire les choses autrement, les langages du web ne sont pas livrés avec «le» mode d’emploi. La plupart des tutoriels que l’on trouve sur le web reprennent généralement le découpage que l’on trouve dans les spécifications du W3C. Continuer la lecture de Quelques notes — Programme de formation HTML & CSS

Le petit journal du web — WordPress, développement web, etc.

Dans ce petit journal du web, je vous propose quelques liens qui ont retenu mon attention ces dernières semaines. Du côté de WordPress : optimisation de la base de données, des images, du cache, du nombre de requêtes dans les templates ; quelques diapositives issues du dernier WordCamp ; des explications sur le succès de WordPress face à ses concurrents ; un retour d’expérience sur la vente de thèmes WordPress ; et des fonctions utiles pour votre fichier functions.php. Du côté du développement web et du webdesign : une documentation interactive complète sur les API’s des langages du web (CSS, HTML, JavaScript, DOM & jQuery) ; un blog de qualité sur le développement web ; un tutoriel sur jQuery et un autre sur les fondamentaux de JavaScript ; et 18 outils gratuits pour faire des maquettes d’interface graphique. Et bien d’autres liens à garder sous la molette ! Continuer la lecture de Le petit journal du web — WordPress, développement web, etc.

Calculer une grille de mise en page « typo » avec le nombre d’Or

Le calcul d’une grille de mise en page modulaire avec le nombre d’Or est une bonne occasion pour mettre en pratique le manifeste pour un interlignage minimum syndical et les cinq règles pour améliorer l’affichage de vos textes. L’objectif est de déterminer une taille de police de caractère et une largeur de colonnes d’après un interlignage «idéal». Après l’aperçu d’une méthode pour créer des gabarits destinés à l’imprimé, j’expliquerai comment utiliser l’interlignage pour concevoir des grilles adaptées à une résolution inférieure ou égale à 1 024 pixels de large. J’ai choisi un interlignage compatible avec le ratio du nombre d’Or typographique (1,5) et du nombre d’Or Classique (1,618). Toutefois, le concept de cette grille fonctionne très bien avec d’autres valeurs. J’ai mis des exemples de grilles réalisées avec Illustrator sous la forme d’un GIF animé (désolé). Continuer la lecture de Calculer une grille de mise en page « typo » avec le nombre d’Or

4 tutoriels SEO et quelques liens pour surveiller votre référencement

Il existe de nombreux sites pour apprendre les ficelles des référenceurs. Mais quoi de mieux qu’un bon guide SEO qui reprend les bases pour faire le point sur les différentes techniques ? Réponse : quatre bons guides ! J’ai fait mon Monsieur Plus en ajoutant quelques ressources qui pourraient s’avérer utiles si vous voulez faire le point sur les liens qui pointent vers votre site ou si vous désirez surveiller vos contenus et votre réputation sur le web. Continuer la lecture de 4 tutoriels SEO et quelques liens pour surveiller votre référencement

Conception dans le navigateur avec HTML5 & CSS3 (amélioration progressive)

Le design dans le navigateur est une technique de Webdesign qui fait l’impasse sur la maquette Photoshop. Derrière ce concept se trouve l’idée selon laquelle dans « Webdesign » il y a d’abord « Web » : pourquoi commencer le travail dans Photoshop pour refaire ensuite presque la même chose en HTML et en CSS ? Surtout quand la prise en charge progressive de CSS3 par les navigateurs récents autorise des effets graphiques qui nécessitaient autrefois de nombreuses images et un marquage HTML surnuméraire… Continuer la lecture de Conception dans le navigateur avec HTML5 & CSS3 (amélioration progressive)

Frameworks CSS — Blueprint vs 960 Grid System

Blueprint et 960 Grid System sont deux frameworks CSS que j’ai utilisés parmi les 25 que j’ai recensés et survolés dans Choisir un framework CSS. J’ai ainsi pu me faire une idée plus précise de leurs qualités respectives. Je ne me suis pas attardé sur les aspects typographiques — même s’ils ont leur importance : j’ai préféré faire l’analyse du système de grille de mise en page (grid.css et 960.css). Pourquoi comparer ces deux frameworks ? Tout simplement parce qu’ils proposent pratiquement les mêmes «fonctionnalités» avec quelques différences dans la mise en oeuvre. Après une rapide introduction sur Blueprint et 960 Grid System, vous trouverez dans la suite de cet article une comparaison et une explication de code. Continuer la lecture de Frameworks CSS — Blueprint vs 960 Grid System