Qu’est-ce qu’un expert, dans la terminologie OpenWeb ? Il s’agit d’un professionnel du Web, qu’il soit développeur/concepteur ou webmestre, qui dispose de plusieurs années d’expérience du Web.
Si tel est votre cas, vous avez l’expérience du développement pour Netscape 4 et IE 4+, vous dominez HTML 3.2 et 4.01, vous avez sûrement employé occasionnellement les CSS, tout ayant recours à JavaScript. Par contre, vous rencontrez de plus en plus les limites des méthodes de développement initiées en 1996 ou 97 : vous savez à quel point il est pénible de concilier les exigences de Netscape 4 et de MSIE.
Vous souhaitez probablement que vos pages soient utilisable dans les nombreux navigateurs alternatifs qui respectent les standards.
Votre secteur d’activité, ou vos convictions personnelles vous poussent à produire des pages accessibles, et vous constatez qu’avec les techniques traditionnelles, c’est bien souvent aux dépens de l’esthétique et du budget.
OpenWeb a pour vocation de vous aider à passer progressivement aux standards. Tous les membres du collectif ont déjà effectué cette démarche qui nécessite de faire évoluer les réflexes du développeur, oublier les mauvaises habitudes pour en prendre de nouvelles et ainsi tirer parti des avantages des standards.
Le parti pris d’OpenWeb est de n’utiliser que des technologies standards (XHTML, CSS, ECMAScript, DOM) dans les exercices et tutoriels. Certains tutoriels pour le profil gourou peuvent faire appel à des technologies non encore ratifiées par le W3C (nous prévenons alors le développeur des limites de notre approche).
Un premier tutoriel, passer aux standards prend l’exemple d’une page réalisée avec les méthodes traditionnelles (utilisation de tableaux pour la mise en page, d’éléments FONT en HTML non validé) et la rend conforme aux derniers standards (XHTML 1.0 strict et CSS valides), rendant ainsi la page accessible, plus facilement maintenable, et plus compacte de 40%.
Les touches d’accès clavier sont a priori un mécanisme d’accessibilité très séduisant par sa simplicité de mise en oeuvre. Mais les nombreux obstacles rencontrés du fait d’une implémentation inachevée en limitent considérablement la portée. Seules une poignée de touches numériques s’avèrent finalement pertinentes, et ce uniquement en renfort d’autres mesures d’accessibilité plus éprouvées.
En ce début d’année 2006, après quatre années à promouvoir les standards et l’accessibilité du web, il est temps de voir si ces idées ont faites leur chemin dans le milieu professionnel du web. Nous avons donc rédigé une série de questions que nous avons posées à quatre professionnels chacun ayant son approche, son vécu et sa façon d’utiliser et de produire du code standard et accessible. Ce qui démontre si besoin est, que bien qu’utilisant des standards communs, la diversité est plus que jamais présente chez les professionnels du web...
En ce début d’année 2006, après quatre années à promouvoir les standards et l’accessibilité du web, il est temps de voir si ces idées ont faites leur chemin dans le milieu professionnel du web. Nous avons donc rédigé une série de 18 questions que nous avons posées à quatre professionnels chacun ayant son approche, son vécu et sa façon d’utiliser et de produire du code standard et accessible. Ce qui démontre si besoin est, que bien qu’utilisant des standards communs, la diversité est plus que jamais présente chez les professionnels du web...
En ce début d’année 2006, après quatre années à promouvoir les standards et l’accessibilité du web, il est temps de voir si ces idées ont faites leur chemin dans le milieu professionnel du web. Nous avons donc rédigé une série de 18 questions que nous avons posées à quatre professionnels chacun ayant son approche, son vécu et sa façon d’utiliser et de produire du code standard et accessible. Ce qui démontre si besoin est, que bien qu’utilisant des standards communs, la diversité est plus que jamais présente chez les professionnels du web...
En ce début d’année 2006, après quatre années à promouvoir les standards et l’accessibilité du web, il est temps de voir si ces idées ont faites leur chemin dans le milieu professionnel du web. Nous avons donc rédigé une série de 18 questions que nous avons posées à quatre professionnels chacun ayant son approche, son vécu et sa façon d’utiliser et de produire du code standard et accessible. Ce qui démontre si besoin est, que bien qu’utilisant des standards communs, la diversité est plus que jamais présente chez les professionnels du web...
En ce début d’année 2006, après quatre années à promouvoir les standards et l’accessibilité du web, il est temps de voir si ces idées ont faites leur chemin dans le milieu professionnel du web. Nous avons donc rédigé une série de 18 questions que nous avons posées à quatre professionnels chacun ayant son approche, son vécu et sa façon d’utiliser et de produire du code standard et accessible. Ce qui démontre si besoin est, que bien qu’utilisant des standards communs, la diversité est plus que jamais présente chez les professionnels du web...
Les styles alternatifs : leur utilité, leurs avantages, et la mise en place d’une structure unique permettant leur implémentation.
En fouinant sur le web, on peut découvrir plusieurs pratiques pour appeler des scripts en Javascript qui vérifient le contenu d’un formulaire. Mais elles sont, hélas, rarement correctes dans le sens où beaucoup d’entre elles réduisent l’accessibilité et l’ergonomie des formulaires, voire sont inefficaces. Cet article vous propose de passer en revue ce qu’il faut faire et ne pas faire en la matière.
CSS signifie « feuilles de styles en cascade »... Mais au fait, la cascade, qu’est-ce que c’est, à quoi ça sert, comment cela fonctionne ? Plongez avec nous dans la cascade sans risque de noyade !
Préparer l’internationalisation d’un site n’est pas une opération triviale, car dans la plupart des cas, elle nécessite de passer d’un jeu de caractères à un autre. Or, un site Web résulte d’un assemblage de plusieurs logiciels, où les questions de jeux de caractères apparaissent à chaque niveau. Cet article résume les différents points de la configuration d’un site « classique » dans le cadre de l’utilisation d’UTF-8.
Cette page présente les caractères codés de 128 à 159 - propres à Windows, mais invalides selon les spécifications HTML 4+ et XHTML, ainsi que leurs codes de substitution valides.
Participez à la relecture francophone du projet de la spécification XHTML 2.0 du W3C.
Quelles sont les unités et les valeurs à utiliser pour dimensionner la taille des caractères de façon homogène sur le plus grand nombre possible de navigateurs Web ? Aurélien Levy a mené une campagne de tests pour donner une réponse à ce problème récurrent pour les développeurs de sites web.
Est-il possible et souhaitable pour un site de grande importance ou qui recueille des contenus de la part de ses utilisateurs, voire d’un certain nombre de contributeurs d’atteindre et de conserver durablement la conformité absolue de toutes ses pages aux standards ? Existe t-il des cas où la recherche de la conformité à tous prix peut nuire à la qualité du site ?
Pas à pas, comment construire un fil RSS au format RDF Site Summary 1.0.
Comment ouvrir une nouvelle fenêtre sans se priver des internautes qui ne disposent pas de JavaScript ou l’ont désactivé ?
Les images constituent le premier obstacle majeur à l’accessibilité des pages Web. Voici quand et comment en donner un équivalent sous forme de texte.
Comment insérer un script ECMAScript dans un fichier HTML.
Réalisons un menu déroulant qui soit à la fois portable, utilisable sans JavaScript et accessible aux personnes handicapées.
Faire des tableaux de données accessibles et respectant les standards avec les CSS
Les fils de syndication, et particulièrement ceux au format RSS, connaissent un succès chaque jour croissant. Mais on voit en parallèle s’accroître la consommation de bande passante et de temps serveur. Comment faire pour ne pas effectuer de multiples requêtes inutiles sur des informations actualisées tout au plus quotidiennement ?
Les différentes méthodes de centrage d’un contenu HTML.
Par défaut, les navigateurs affichent les boîtes issues du document html dans l’ordre du flux normal. En position relative, un élément peut être décalé verticalement et/ou horizontalement.
La position float retire une boîte du flux normal pour la placer le plus à droite ou le plus gauche possible dans son conteneur. Comment l’utiliser dans une mise en page CSS ?
La position absolue et la position fixe permettent de placer une boîte par rapport aux limites de la zone d’affichage ou du conteneur. Comment les utiliser dans une mise en page CSS ?
"Aujourd’hui, l’objectif est d’écrire du code lisible par tout dispositif de lecture ayant accès aux référentiels (langue, langages, caractères...) tels qu’ils sont précisés dans chacune des pages. On change la donne, et on revient à des enjeux foncièrement documentaires."
Daniel Glazman est impliqué depuis 1991 dans le monde des standards et depuis 1994 dans celui du Web. Il a participé au HTML Working Group pour la standardisation de HTML 4 et au CSS Working Group pour CSS 2 et CSS 3. Sa société Disruptive Innovations est membre du World Wide Web Consortium (W3C) depuis 2006. Il est depuis peu co-chairman du CSS Working Group au W3C. Son rôle au W3C, ses compétences techniques hors-pair et son inaptitude totale à la pratique de la langue de bois nous ont donné envie de lui poser quelques questions sur l’avenir des feuilles de style. Interview.
En nous présentant les différentes actions de la cellule accessibilité de BrailleNet, Pierre Guillou fait pour nous le point sur les problématiques d’accessibilité du Web.
Qu’est-ce qu’un jeu de caractères ? Quelle est la différence entre ISO-8859-1, UTF-8 et Windows-1252 ? Steve Frécinaux nous présente les différents jeux de caractères.
Pour mieux comprendre l’accessibilité, faisons un tour d’horizon des handicaps et des technologies permettant de les contourner, et comment le W3C s’attelle à faire du Web un endroit accessible à tous.
De nouvelles applications web ont vu le jour récemment : recherche avec complétion automatique, sauvegarde instantanée d’informations, interface mail hyperdynamique, cartographie, etc. mais aucune ne fait appel à des plugins tiers comme Flash ou Java. On parle alors souvent de méthode AJAX qui s’articule essentiellement autour de Javascript et d’un objet (dans le sens de la programmation orientée objets) en particulier : XMLHttpRequest.
Qui est donc ce remplaçant du GIF, datant de 1996 et méconnu de la plupart des graphistes, amateurs comme professionnels ?
Ned Baldessin, professionnel du Web, nous présente le point de vue des graphistes sur les différentes technologies qui forment les standards de l’Internet.
Après plusieurs années d’hégémonie quasi totale d’un seul navigateur Web, de nouveaux outils sont apparus, et ils représentent maintenant une part considérable du parc des navigateurs installés. De plus en plus utilisés par les internautes, qui apprécient leur rapidité, leur robustesse et leurs fonctionnalités, ils respectent les standards du Web et facilitent ainsi le travail des développeurs Web. Fort de cette appropriation à grande échelle par le grand public et les professionnels, ces nouveaux navigateurs ne sont nullement exotiques ou alternatifs. En toute logique, cet article publié initialement en 2003 sous le titre "Les navigateurs alternatifs" a été rebaptisé "les navigateurs modernes", qui décrit plus justement la réalité actuelle.
L’accessibilité de contenus et de services web peut-elle se réduire à l’atteinte de niveaux prédéfinis et réglementés ? Répondre « oui » d’emblée serait réducteur et contre-productif, et c’est pourtant ce qui a été fait jusqu’à présent. Ce premier article va montrer que la problématique est bien plus complexe qu’il n’y paraît.
Le premier article sur la démarche d’accessibilité a montré qu’une approche exclusivement centrée sur des résultats ponctuels et quantifiés était limitée et insuffisante. Mais quels sont les moyens d’anticiper et de maîtriser les risques de façon continue ? Quels sont les outils ? Quelles sont les perspectives ? Ce second article décline quelques élements de réflexion et de réponse.
Pourquoi éviter les tableaux pour faire de la mise en page.
Les métadonnées du Dublin Core permettent de donner des informations à propos de pages Web. Dans cet article, nous voyons la forme de ces descriptions, ainsi que la façon de les intégrer dans des pages Web.
Au sein des PMI ou des grands comptes, on voit fréquement des projets Internet ou intranet souffrir des effets pervers d’un double pilotage par les directions informatiques (DSI) et les directions communication.
Dans la première partie de cet article, nous avons vu qu’il était quelquefois difficile de faire travailler ensemble des directions ou des personnes issues de cultures différentes. Dans cette dexième partie, nous allons voir comment l’accessibilité peut mettre tout le monde d’accord et limiter les sources de conflit.
Vous utilisiez les balises HTML de présentation ? Pour tirer parti des avantages offerts par les standards, découvrez le vocabulaire élémentaire des feuilles de style.
Les règles à suivre pour passer de la syntaxe HTML à la norme XHTML.
Quelques raisons pour lesquelles les cadres devraient être évacués de tout bonne pratique Web.
A l’heure où certains pays se dotent d’une législation nationale sur l’accessibilité numérique, ce document rappelle les enjeux internationaux de l’accessibilité, et l’ensemble de ses bénéfices sociaux, financiers, techniques et managériaux.
Interopérabilité, accessibilité, portabilité, pérennité des documents, réduction des coûts... l’avenir du Web passe par les Standards.
Les balises et attributs devenus obsolètes entre le HTML ou XHTML strict et transitional, et les moyens de les remplacer.
Pourquoi et comment utiliser les balises (X)HTML à bon escient.
Comment rendre un site existant conforme aux normes XHTML et CSS, en prenant une page non conforme, et en la transformant pour obtenir une page respectant les standards.
Entre les attributs HTML, les éléments meta et les en-têtes HTTP, les moyens de spécifier la ou les langue(s) d’une page Web ne manquent pas. Mais la pratique montre l’existence de deux besoins bien différents en la matière : il importe de différencier langue primaire d’une ressource Web et langue de traitement d’un contenu, et d’utiliser à bon escient les outils à notre disposition pour les indiquer.
Le rendu final d’une page Web n’est pas le produit figé des règles de présentation fixée par son auteur : il résulte de la combinaison des 3 sources de styles de l’auteur, de l’agent utilisateur et de l’utilisateur lui-même.
Validation, Déclaration de Type de Document : la grammaire d’un langage Web universel.
Une solution CSS qui remplace avantageusement la version imprimable d’un document.
Les formulaires sont souvent utilisés mais parfois de manière peu souhaitable ou peu accessible. Cet article est là pour faire un tour d’horizon des possibilités et des bonnes habitudes. Il peut être autant utile au débutant cherchant à comprendre les formulaires qu’au confirmé cherchant quelques notions d’accessibilité.
Comment utiliser une feuille de style pour insérer dans le contenu HTML des images décoratives.
La simple mise en place de formulaires sur un site peut devenir une opération assez complexe dès lors que l’on souhaite effectuer des contrôles sur les données saisies par les utilisateurs. Pour effectuer ce type de contrôles, deux possibilités nous sont offertes :
Dans cet article, nous allons montrer l’intérêt que peut apporter le Modèle Objet de Document (DOM) pour effectuer des contrôles côté client. Cette deuxième solution ne devra toutefois pas nous faire oublier la nécessité absolue d’effectuer dans le même temps des contrôles côté serveur. Ces derniers permettront d’une part d’éviter la soumission complète des données dans un format invalide, et d’autre part nous permettront d’assurer l’accessibilité de nos formulaires aux utilisateurs n’ayant pas la possibilité ou ayant fait le choix de ne pas activer Javascript sur leur poste de travail.
Si la solution proposée ici est un plus par rapport aux indispensables contrôles côté serveur, elle ne manque pas d’intérêt : elle permet d’éviter des échanges de données fastidieux avec le serveur, d’accélérer la validation des formulaires, et également d’enrichir et de faciliter la saisie pour les utilisateurs.
Mais avant de commencer, que devons nous savoir :
Depuis son invention par Tim Berners-Lee en 1989, le web est passé par nombreuses phases d’évolution. Celles-ci l’ont rendu de plus en plus complexe au point d’en perdre son objectif premier : la simplicité et le partage avec tous. Heureusement, le W3C s’est mis au travail pour uniformiser les pratiques. Aujourd’hui, grâce aux standards que sont le XHTML et les CSS, on peut créér des sites liant esthétisme, interopérabilité et accessibilité.
Une rapide introduction à XHTML, qui vous permettra de faire vos premières armes avec ce langage de description.
Page valide XHTML 1 Strict,
CSS2 et
accessible AA.
Ce site s'affiche mieux dans un navigateur conforme aux standards,
voici pourquoi.
Site hébergé par l'APINC
et propulsé par SPIP.