L’avenir du Web Design (partie 1)

Cet article a pour but de vous donner différentes pistes concernant l’avenir du Web Design, en s’appuyant sur certains éléments présentés lors de la récente conférence « Futur Of Web Design » (FOWD pour les intimes) qui a eu lieu à New York.

Le monde de l’information et de la communication a suivit une évolution exponentielle ces dernières années, celle-ci est due, en grande partie, à la généralisation mondiale d’Internet. Un des tournant s’est fait à partir de l’arrivée du web2.0 qui place l’utilisateur comme un acteur et non plus comme un simple spectateur. Aujourd’hui n’importe qui peut créer un site digne de ce nom, contrairement à ces dernières années où seul les webmasters pouvaient créer en créer ansi que les grandes marques qui avait le “luxe” d’avoir un site web.Dans cette première partie, je parlerai plutôt des évolutions du web design dit « classique » (xhtml/css), et dans un second billet, je tacherai d’exposer les futures évolutions des applications Flash et rich media.

Une évolution matérielle

Il est certain qu’on peut maintenant affirmer qu’ Internet est bien ancré dans les « mœurs française », en effet une grande majorité des français a déjà surfé sur le web. Même si tout le monde n’est pas encore acteur de ce grand réseau, un grand nombre l’utilise quotidiennement (ne serait-ce que pour des raisons professionnelles). L’évolution du matériel informatique a eu une grande influence sur l’évolution du web design, notamment avec l’augmentation de la puissance des ordinateurs et des vitesses de connexion internet. Permettant ainsi aux nouvelles technologies, souvent très gourmande en ressources, et au web design plus complexes et plus lourds (en termes d’images, de scripts, …) de se développer.

L’évolution des diagonales d’écrans a aussi marqué cette évolution, en effet il y a quelques années, posséder un écran en 800*600 était quelque chose qui permettait de naviguer agréablement sur la toile. Alors qu’aujourd’hui la plupart des sites développés sont au moins fait pour les résolutions de 1024*768 et supérieur (80% des utilisateurs web en janvier 2007 d’après les statistiques officiel W3C), ce qui offre beaucoup plus d’espace aux différents éléments graphiques. Nous pourrions également évoquer le fait que les couleurs sur le web au départ ce réduisait à 256 afin d’être compatible avec toutes les configurations qui affiche maintenant des milliards de couleurs.

Notons aussi une grande amélioration au niveau des logiciels de créations graphique avec des softs bitmap de plus en plus puissant (Photoshop par exemple qui offre maintenant la possibilité de manier des objets 3D et de la vidéo), mais aussi des contenus flash de plus en plus impressionnants (maîtrise de la 3d grâce à PaperVision, inclusion vidéo détourée, …) ainsi que des applications rich media sur lesquels nous reviendront dans un prochain article.

Rentrons maintenant dans le vif du sujet, et abordons les choses qui font vraiment évoluer le web design.

Rss & Atom, l’obligation de toujours faire mieux

Il est clair que l’arrivée des flux RSS aussi bien qu’Atom a sérieusement remis en cause l’univers du web design. En effet, un site placé dans un agrégateur de flux n’a plus besoin d’être affiché, l’utilisateur pouvant lire les articles uniquement par affichage du texte. Ce qui signifie qu’un site, même avec une très bonne qualité graphique ne peut être que moyennement visiter. L’évolution de ceux-ci pousse les différents sites (et webmaster) à se démarquer par leur aspect visuel donnant ainsi l’envie aux visiteurs de revenir. Et d’un autre côté, les flux permettent aux visiteurs de revenir à chaque nouveauté et ainsi de suivre plus facilement l’évolution du site.

Du web design accessible à tous

Il est clair que l’univers du web design devient de plus en plus accessible à tous. Que ce soit avec la multitude de template proposé par les différents services, mais aussi grâce aux générateurs et ressources en ligne très présents ces derniers temps sur la toile.Du site de logos gratuit au générateur de background en passant par les sites d’icônes gratuites, il est maintenant possible de trouver n’importe quelle ressource permettant à un utilisateur quelconque de créer son site web sans ouvrir le moindre logiciel de création graphique.

Nous pourrons aussi citer l’arrivée d’applications rich media tel que Scrapblog, PicNik bien que depuis la fin de la beta un grand nombre de fonctions soit devenu payant ou encore Vector Magic qui permettent à n’importe qui de retoucher des images directement sur le net, de façon totalement gratuite sans avoir à obtenir une licence.Cependant celles-ci n’auront peut être pas de véritable notion de mise en page.

Même si les éléments récoltés peuvent, individuellement, se révéler très jolis graphiquement, l’ensemble ne serra pas forcement cohérent et ne donnera pas toujours une bonne lisibilité au site.La tendance pousse donc les futurs web design à vraiment apporter des éléments innovant en matière de graphisme si l’ont ne veut pas se retrouver avec des éléments qu’un utilisateur x peut aussi avoir sur le sien.

Vers un monde d’Ajax

Grâce à l’arrivée des applications dites «web 2.0 », les scripts Ajax se sont répandus sur un grand nombre de site. Celui-ci présente une bonne alternative à des langages d’animation tel que l’action script (flash) sans pour autant avoir besoin que l’utilisateur installe un player externe (la plupart des navigateurs pouvant lire le java script de base). Il permet aussi de charger du contenu sans avoir pour autant à recharger une nouvelle page. Bien que ceux-ci soient parfois assez lourd à utiliser, les scripts Ajax continuent à se développer et deviennent de plus en plus malléable. Ainsi, il n’est plus rare de trouver des scripts, tel que Light Box, sur de nombreux site, cependant celui-ci pose de grande question d’accessibilité, en effet, mal utilisé il peut rendre un site totalement inaccessible.

CSS3, c’est pour bientôt

On entend de plus en plus parler de CSS3, que ce soit par des sites dédiés, ou par des blogs. Mais quelles nouveautés ont été apporté par rapport au développement CSS2 actuel ?Même si la plupart des propriétés évoquées ci-dessous n’en sont encore qu’au stade de la recommandation, un grand nombre d’entre-elles ont des chances d’être approuvées par le W3C.

Tout d’abord on note une grande amélioration des background, qui seront beaucoup plus simple à manipuler comme bon nous semble. Nous aurons la possibilité de les positionner ceux-ci par rapport à un éléments en lui-même (le centré par exemple) ou par rapport à son origine, ainsi que la possibilité d’avoir des background multiple pour un même élément.Évolution qui se produit aussi au niveau des bords de cadre, car nous aurons la possibilité de les arrondir directement en css, et de les passer en images (l’image choisi suivant le contour du cadre).

Au niveau des couleurs, il est dorénavant possible de les écrire directement en RVB (et non plus seulement en hexadécimal), ainsi que de leur donner un certain pourcentage d’opacité.

Pour la mise en page, les min-width et max-width permettront de donner une largeur minimal et maximal à chaque élément, et les mutli-colonnes permettront d’avoir plusieurs colonnes de texte dans un même éléments très simplement. A noter aussi l’arrivée des drop shadow sur les textes avec plusieurs paramètres à la manière de Photoshop.Je finirai cette partie avec la présentation de «Creating Sexy Stylesheets» de l’excellente Jina Bolton, graphiste & artiste à la Silicon Valley, une des auteurs de « The Art & Science Of CSS », consultante entre autre pour le W3C.Pour information il faut savoir que l’actuel Internet Explorer 7 ne supporte pas encore le CSS 2.1, on est encore loin (enfin surtout chez Microsoft ^^)…

Illustrations et identité visuelle

Il est clair que pour se démarquer, les sites web doivent de plus en plus avoir une identité visuelle qui leur est propre. Ce qui explique la présence grandissante d’illustrations (j’entends par là la mascotte vectoriel) dans le domaine du web design.Mettre en avant un personnage illustré sur l’ensemble du site permet une meilleure identification visuelle par l’utilisateur qui la repèrera dès le premier coup d’oeil.

Ce genre d’illustration qui n’apparaissait jusqu’à présent que dans le logo du site, est maintenant utilisé plusieurs fois dans des « positions différentes » pour orienter l’internaute à travers les différentes catégories, allant parfois jusqu’à remplacer le texte. Bien sûr ce genre d’identité visuelle est plutôt réservé au blog « corporate » qui peuvent faire appel aux services d’un illustrateur où aux illustrateurs eux-mêmes, car celle-ci doit être intelligemment utilisée pour ne pas gêner la lisibilité (des exemples sont disponibles dans un de mes précédents billet.

L’effet Web 2.0

Le style graphique « web2.0 » est-il un simple phénomène de mode ou un véritable « renouveau » du web design ?Les reflets dit « web2.0 », les dégradés avec des effets « glossy » (bande blanche à opacité réduite) ou encore les bords arrondis n’ont jamais été aussi tendance. Ils forment ce qu’on pourrait appeler « l’effet web 3.0 ».

Durant la conférence du FOWD, Elliot Jay a présenté son point de vue sur le sujet, et il n’y va pas avec des pincettes :D, mais sa conférence se révèle réellement intéressant.En effet, il nous rappelle que la plupart des sites des « grands » web designers n’ont presque rien de cette tendance web2.0, et que les éléments qui sont la base de cette tendance graphique sont inutiles et présentent une véritable gêne pour l’internaute. Pour ma part, je pense que tout comme l’effet dit « futuriste » de ces dernier temps, cette tendance n’est qu’un simple phénomène de mode et va passer pour laisser place à une autre.Je vous invite donc à consulter la présentation de sa conférence ci-dessous ainsi que son blog.

| View | Upload your own

Et après ?

Pour conclure sur cette première partie consacrée au web design dit « classique », il est clair qu’avec la popularisation du web design et au vu du nombre toujours grandissant de site, les sites web devront de plus en plus se faire remarquer d’un point de vue graphique pour être consulté (à part peut être les « gros » sites référents).

Pour ma part, je pense que l’arrivée de nouvelle norme tel que le CSS3 va pleinement contribuer à une réelle avancée en terme de graphisme, et même si le web design devient de plus en plus accessible pour n’importe quel utilisateur, les vraies innovations sortant du lot continurons à ce faire.

Pour finir voici quelque article résumant le conférence FOWD: ici (fr),ici, et ici.

A bientôt pour la prochaine partie de ce « mini dossier » consacré au futur du web design.

Lexique (Wikipedia):

Ajax

AJAX, ou Asynchronous JavaScript And XML (« XML et Javascript asynchrones »), est un acronyme désignant une solution informatique libre pour le développement d’applications Web.À l’image de DHTML ou de LAMP, AJAX n’est pas une technologie en elle-même, mais un terme qui évoque l’utilisation conjointe d’un ensemble de technologies libres couramment utilisées sur le Web.

Atom

L’appellation Atom réfère à deux standards liés. Le Format de Syndication Atom est un format de document basé sur XML conçu pour la syndication de contenu périodique, tel que les weblogs ou les sites d’actualités, tandis que le Protocole de Publication Atom (APP) est un protocole simple basé sur HTTP pour la création et la mise à jour de ressources Web.

Background

Un fond d’écran est une image qui est utilisée comme surface du bureau. Selon les systèmes d’exploitation, les termes varient mais désignent trivialement une image qui est choisie comme fond d’écran. Avec Windows, il s’agit de papier-peint (ou wallpaper en anglais), alors qu’avec Mac OS, il s’agit d’image de bureau (en référence au terme motif de bureau qui désigne une petite image répétée plusieurs fois de façon à remplir l’écran). On retrouve également le terme arrière-plan (ou background en anglais).

CSS

Le langage informatique CSS (Cascading Style Sheets kæ’ske?d?? sta?l ?i?ts : feuilles de style en cascade) est utilisé pour décrire la présentation d’un document structuré écrit en HTML ou en XML, et c’est le World Wide Web Consortium (W3C) qui en a la direction.

RSS

Ce système est habituellement utilisé pour diffuser les mises à jour de sites dont le contenu change fréquemment, typiquement les sites d’information ou les blogs. L’utilisateur peut s’abonner aux flux, ce qui lui permet de consulter rapidement les dernières mises à jour sans avoir à se rendre sur le site.

W3C

Le World Wide Web Consortium, abrégé W3C, est un consortium fondé en octobre 1994 pour promouvoir la compatibilité des technologies du World Wide Web telles que HTML, XHTML, XML, RDF, CSS, PNG, SVG et SOAP. Le W3C n’émet pas des normes au sens européen, mais des recommandations à valeur de standards industriels.Le W3C est supervisé par Tim Berners-Lee, le principal créateur du protocole URL, de l’HTTP, et de l’HTML.