Le Blog de Büh - Accessibilité et conformité

Une nouvelle guerre d'envergure vient de débuter : celle qu'oppose Microsoft avec Microsoft Office Live et Google avec Google Apps.

Ces deux nouveaux services proposent aux entreprises des prestations assez similaires :

• un hébergement et un nom de domaine pour des prix dérisoires, voire gratuits,
• des outils pour le travail collaboratif en entreprise (calendrier, courrier, messagerie instantané), à quoi il faut rajouter :
  • pour Google : traitement de texte et tableur,
  • pour Microsoft : Applications de gestion des contacts professionnels, des ventes, du temps, des projets, des documents, des informations administratives de la société,
• application pour créer facilement son site internet.

Ce qui m'a fait tiquer c'est ce dernier point. Ces deux grands géants essaient de convaincre les entreprises qu'elles n'ont pas besoin de faire appel aux professionnels du web pour réaliser leurs sites webs.

Chez Microsoft, le discours, c'est : Le Concepteur de site est un outil simple, mais puissant, de conception Web qui vous aidera à créer un site Web professionnel et totalement personnalisé. Vous pouvez créer rapidement un site Web et n'êtes plus contraint d'engager du personnel technique pour le gérer.

Chez Google, c'est sensiblement la même chose : Avec Google Page Creator, vous pouvez créer des pages Web directement dans votre navigateur pour ensuite les publier sur le Web d'un simple clic, sans avoir à programmer quoi que ce soit. Inutile de télécharger un logiciel ni de faire appel à un concepteur de sites Web pour que vos pages soient originales, uniques et professionnelles.

Peut-on vraiment parler de sites webs à la qualité professionnelle avec du préfabriqué ? sans spécifications techniques ? sans charte graphique ? sans se préoccuper du référencement et du trafic du site ? Et je ne parle même pas de l'accessibilité que doit offrir ce type de site.

Je ne le pense pas, mais avec leurs politiques de prix très agressives Microsoft et Google ont une chances de convaincre bon nombre de petits entrepreneurs car il faut reconnaître que les coûts d'un site internet (réalisation, référencement, maintenance), ne sont pas négligeables pour une pme.

Je me suis intéréssé à ce sujet via le billet Domaine et hébergement Gratuits chez Microsoft ! sur Business Garden.

Je vous propose la consultation d'un livre Blanc de Digimind qui vaut le détour.

Le Web 2.0 pour la veille et la recherche d'information

Attention, pour accéder au pdf il faut s'enregistrer.

J'ai trouvé le document très intéressant car il fournit une mine d'informations et de liens sur les services utiles du Web 2.0.

Sommaire

• Qu’est-ce que le web 2.0 ?
  • préambule
  • définition du web 2.0
  • les 7 principes du web 2.0
  • les évolutions par rapport au web 1.0 : le rôle de l’internaute
• glossaire du web 2.0
• les technologies du web 2.0
• les familles d’applications du web 2.0
  • typologie
  • comment identifier un site web 2.0 ?
• les applications web 2.0 pour la veille et la recherche d’informations
  • les types d’applications
    • i. partager et collaborer
      • a. les bookmarks sociaux
      • b. le multimédia : photos et vidéos
      • c. partage de cv et réseaux sociaux
      • d. les sites d’actualités collaboratives : recommandation et notation
    • ii. rechercher, collecter
      • a. la recherche de blogs et de flux rss
      • b. la recherche par tags
      • c. la recherche de personnes et d’informations entreprises
      • d. les moteurs de recherche “humains”
      • e. les moteurs de recherche “collaboratifs”
      • f. la verticalisation par la personnalisation du périmètre de recherche
      • g. l’enrichissement de bases de données façon web2.0
      • h. conserver et exploiter l’historique de vos recherches et navigations
      • i. les “mash-up”
    • iii. diffuser
      • a. les blogs et le flux rss
      • b. les wikis
    • iv. surveiller
      • a. la détection du flux rss
      • b. la mise en surveillance
      • c. pourquoi une veille via le rss ?
    • v. carte des outils et ressources web 2.0
  • exemple d’une recherche et veille via le web 2.0
• les limites du web 2.0
  • la participation
    • i. une participation hétérogène
    • une minorité participative…
    • wikipedia, un faux modèle collaboratif ?
    • ii. une participation d’”amateurs” ?
  • le web 1.0 reste nécessaire
    • le mail résiste
    • une population souvent isolée et non représentative
    • des domaines mal couverts
• Conclusion

Fred Cavazza nous dresse sur son blog un panorama de ce qui existe comme services exploitant les technologies du Web 2.0, et surtout, comment ces services vont pouvoir évoluer.

Hypothèses d’évolution pour le web 2.0

Un billet très intéressant, non seulement pour les hypothèses envisagées mais aussi pour le passage en revue de l'existant.

Pour coder nos pages, nous utilisons souvent Dreamweaver, mais il existe, au travers des extensions de Firefox et IE, des outils bien utiles et qui peuvent faciliter le développement et le déboguage des des pages internet.

IE Tab

Cette extension pour Firefox permet d'ouvrir dans Firefox la page courante dans un onglet mais avec le moteur d'Internet Explorer. Cela permet de rester dans Firefox pour tester une page, et donc, de gagner du temps.

L'activation se fait via un bouton qui vient se nicher dans la barre d'état.

La barre d'outils Web Developer

Il s'agit d'une extension Firefox qui rajoute une barre d'outils à la fenêtre du navigateur, et qui offre d'énormes possibilités :

• vous pouvez désactiver les css, le javascript, ou les images,
• vous pouvez entourez en rouge les éléments que vous êtes entrain de survoler,
• vous avez un acces rapide aux validateurs,
• vous obtenez des informations sur votre page.

La liste est longue de toutes les possibilités de cet outil.

ColorZilla

Une petite extension Firefox qui permet d'avoir l'outil pipette à l'intérieur de Firefox. Cela récupère une couleur issue de la page courante (possibilité de l'avoir en hexa) et ensuite nous pouvons l'appliquer dans notre code.

FireBug

Il s'agit d'une extension puissante de Firefox qui permet d'analyser son code xhtml et css, tout en restant dans Firefox.

Comme je vous le montre dans cette capture, vous avez une fenêtre au bas de votre navigateur (que vous pouvez détacher) qui affiche sur la partie de gauche votre code xhtml. Lorsque vous cliquez sur une balise, l'élément désigné va se colorer dans votre page internet : ainsi sur la capture, on voit que l'élément h2 possède une marge au dessus (coloré en jaune).

De plus en bas, dans la fenêtre de Firebug, à droite, vous avez un schéma de l'élément qui vous indique les dimensions de votre éléments, son padding, son border, et son margin.

L'onglet Style lui permet de repérer dans votre css les éléments redondants en les barrant. Vous pouvez désactiver temporairement un style en cliquant sur l'icône précédant une css.

Cet outil propose aussi un debogueur javascript.

Dust-Me Selectors

Il s'agit d'une extension Firefox qui ajoute un bouton dans votre fenêtre d'état qui vous permet d'afficher dans une nouvelle fenêtre les sélecteurs css que vous utilisez dans votre page, et qui ne sont pas utilisés. Pratique pour nettoyer sa css, mais il faut quand même faire attention à ne pas supprimer des selecteurs css utilisés dans d'autres pages du site.

LinkChecker

LinkChecker vérifie la validité de chaque lien d'une page Web.

Une coloration de type vert, jaune, rouge vous indique si le lien est valide, douteux ou cassé.

Internet Explorer Developer Toolbar

Il arrive souvent qu'une page s'affiche correctement sous Firefox, mais pose problème sous IE. Cette extension IE permet, entre autres, d'afficher dans une fenêtre les attributs xhtml et css des éléments survolés, comme vous pouvez le voir dans cette capture.

Petite trouvaille de la soirée : on peut se débarrasser, en css, du contour en pointillés autour des liens qui apparait lorsque l'on clique dessus.

Cela ressemble à cela :

Le code css :

a{
 outline: none;
}

Et le tour est joué

Correction du 30 août 2007 :

L'utilisation de de cet astuce est certes plus esthétique, mais elle empêche une navigation au clavier.

En effet, avec la touche tab, il est possible de naviguer de liens en liens, sans avoir recours à la souris. Cela permet au personnes qui ne peuvent pas (ou ne veulent pas) utiliser la souris de pouvoir tout de même naviguer sur le site.

Ainsi, si on enlève les pointillés autour du lien qui a le focus, cela empêche de repérer le focus, et donc la navigation ne sera plus possible.

Conclusion : on oublie cette astuce