Archives des tags : quelques notes

Pas encore de description pour le tag quelques notes. Suggérez à l'administrateur du site de d'y remédier.

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.

Quelques notes sur les éléments graphiques du webdesign

Une fois n’est pas coutume, je vais aborder la question du web design sous l’angle du graphisme, sans considération de langage de développement ou de technique en général. Je n’aborderai pas les questions liées à l’architecture de l’information, à l’ergonomie ou à l’accessibilité. A la place, après un aperçu sur le travail du Directeur artistique et du graphiste, je vous propose une liste commentées des éléments graphiques que l’on trouve de manière récurrente sur les sites web, avec pour chacun un rapide commentaire. 

Quelques notes sur les fonctions de l’intégrateur web et de l’intégratrice web

Parmi les nombreux intervenants dans la chaine de production des métiers de l’internet, l’intégrateur web est sans doute celui qui se cherche le plus. C’est le «vilain petit canard» de l’Open Space. Souvent coincé entre les graphistes et les développeurs web, il peut se sentir à l’étroit. Placé au bout de la chaine, de nombreuses erreurs de conception faites en amont lui tombent dessus, à commencer par les délais. Le retro-planning donne souvent l’impression d’avoir zappé le temps nécessaire à «l’intégration». Pourtant, l’intégrateur HTML & CSS est une ressource précieuse que toute entreprise sérieuse devrait valoriser. C’est le garant de la qualité globale du site mis en ligne, du respect de la charte graphique à l’expérience utilisateur en terme de performance d’affichage des pages.

BlueGriffon — Un éditeur HTML5 & CSS3 WYSIWYG avec des morceaux de Firefox

Après ma longue liste commentée des éditeurs HTML plus ou moins WYSIWYG, voici mes premières impressions sur BlueGriffon. C’est un éditeur HTML complètement WYSIWYG dont l’affichage est confié au moteur de rendu qui équipe le navigateur Firefox. Le créateur s’y connait, puisqu’il s’agit de Daniel Glazman (@glazou pour les intimes) qui travaillait déjà sur Composer, l’éditeur HTML de la suite Netscape, puis sur Nvu dans le cadre de Disruptive Innovations. Il fait partie du groupe de travail de normalisation du langage CSS au W3C : c’est un vrai spécialiste des CSS.

Webdesign — L’essence précède l’existence (Wireframe, Mockup et Mood Board)

Les processus à l’oeuvre lors de la création d’un site web sont généralement chargés d’affects. Tout semble compliqué alors qu’il ne s’agit souvent que de choses complexes que l’on peut facilement partitionner. Dans le meilleur des cas, la réflexion part d’un brief qui présente la société, le projet, la cible, les attentes, etc. à partir duquel l’équipe créative (ou votre cerveau droit si travaillez seul) doit proposer une ou plusieurs propositions graphiques qui, une fois affinées, donneront naissance à un site Web.

Quelques notes sur la balise h1 avec HTML5

La réponse courte à la question « Combien de balises `h1` dans une page Web HTML5 ? » est : « Autant que nécessaire ! » En gros, chaque fois que vous avez une nouvelle section, vous  pouvez mettre un `h1`. D’une manière générale, `h1` accompagnera `article`, `aside`, `nav` ou `section` avec brio ! (cf. Sectioning content). Allons voir ce que nous disent les spécifications HTM5 sur l’emploi des balises de titre `h1` — `h6`, notamment les exemples concernant les niveaux de titre. Ils sont assez parlant bien que parfois déroutant lorsqu’on a l’habitude du balisage utilisé jusqu’à présent. Les éléments `h1` — `h6` représentent les niveaux d’en-têtes de leurs sections respectives. Quant à l’élément `hgroup`, il regroupe un ensemble d’en-têtes composé d’au moins deux niveaux de titre, comme un titre et son sous-titre ou un titre et le slogan associé (un bon candidat pour Logo et Motto, faute de mieux).

Quelques notes sur le design graphique des sites web et autres futilités

Ces quelques notes sont le fruit d’une réflexion rapide qui fait suite au commentaire de Papier-pixel sur l’article Conception dans le navigateur avec HTML5 & CSS3. Il regrette grosso modo qu’il y a des thèmes récurrents dans mes billets qui tendent à laisser penser que le webdesign et la mise en place d’une vraie charte graphique ne sont pas indispensables. Le fait de coder directement dans le navigateur ou d’oublier photoshop pour finir par m’interroger sur la pertinence du design qui serait « inutile » dans 80% des cas nous entrainerait dans un web uniforme, sans véritable réflexion visuelle en amont.

Une très brève histoire des métiers du web et de la PAO (publication assistée par ordinateur)

Lorsque j’ai publié mon dernier billet sur le design dans le navigateur avec HTML5 et CSS3, je m’attendais à des commentaires sur mon interprétation du rôle et de l’utilisation des nouvelles balises HTML5 pour structurer les contenus telles que `header`, `hgroup`, `section`, `aside`, `nav`, `article` ou `footer`. A la place, j’ai vu apparaitre une discussion plutôt orientée « graphistes vs. intégrateurs » web au sens large, qui m’a donné envie de faire un retour en arrière sur mon expérience des métiers de la chaine graphique et des métiers du web.

Quel tarif pour un thème WordPress ?

C’est une question récurrente : mais combien coûte un thème WordPress ? A cette question simple, je voudrais apporter quelques éléments de réflexion, vu qu’une réponse toute faite ne saurait être juste. Pour commencer, je trouve qu’il règne une certaine hypocrisie sur la formation des prix dans le Webdesign. Il semble normal — lorsqu’on achète une voiture ou une machine à laver — de donner des indices sur le budget que l’on est prêt à consacrer. Dans le Web Design (et sans doute dans les prestations de services en général), la question du budget semble taboue. J’ai même parfois l’impression que les clients potentiels ne se posent pas la question, comme si l’on vendait du vent ; pourtant, livrer un site Web correspondant aux besoins du client n’est pas une mince affaire et demande beaucoup de travail, y compris en utilisant un CMS comme WordPress.

Quelques notes — Prévoir un supplément pour rendre un site compatible avec IE6 ?

« Si le client veut qu’on prenne en compte IE6, il faudra qu’il paie pour ça » via @fran6. C’est clair, c’est net, mais un peu court (en même temps en 140 caractères, difficile de développer). Ca fait longtemps que pour les développeurs et les intégrateurs web, IE6 est comme une écharde qui n’arrête pas de s’infecter ou plutôt comme le dit Microsoft lui-même : «Surfer avec Internet Explorer 6, c’est comme boire du lait périmé depuis 9 ans». Mais de quoi parle-t-on exactement ?