{"id":1548,"date":"2013-05-29T22:07:28","date_gmt":"2013-05-29T20:07:28","guid":{"rendered":"http:\/\/blog.stephaniewalter.fr\/?p=1548"},"modified":"2023-08-04T11:13:06","modified_gmt":"2023-08-04T09:13:06","slug":"sur-smashing-magazine-responsive-webdesign-present-et-futur-de-ladaptation-mobile","status":"publish","type":"post","link":"https:\/\/stephaniewalter.design\/fr\/blog\/sur-smashing-magazine-responsive-webdesign-present-et-futur-de-ladaptation-mobile\/","title":{"rendered":"Sur Smashing Magazine : Responsive Webdesign – pr\u00e9sent et futur de l’adaptation mobile"},"content":{"rendered":"
Ce contenu a \u00e9t\u00e9 r\u00e9dig\u00e9 il y a 12 ans. Il se peut qu'il ne soit plus \u00e0 jour.<\/div>

Apr\u00e8s plusieurs mois de recherche sur le sujet et plusieurs relectures, mon article qui dresse l’\u00e9tat des lieux de ce qui est aujourd’hui faisable en terme de responsive webdesign et adaptation mobile, ce qu’il reste \u00e0 creuser et am\u00e9liorer et surtout ce que l’on pourra (peut-\u00eatre) faire dans le futur est publi\u00e9 aujourd’hui sur Smashing Magazine<\/a>.<\/p>\n

Tout avait commenc\u00e9 en Octobre 2012, \u00e0 Paris Web, au hasard d’une rencontre autour de la machine a caf\u00e9 avec Vitaly Friedman. Apr\u00e8s une petite discussion il m’a donn\u00e9 sa carte de visite et me mis au d\u00e9fis d’\u00e9crire pour Smashing Magazine. Challenge accepted. Plusieurs mois de recherche, de boulot intensif pas toujours facile sur les sp\u00e9cifications W3C en constante \u00e9volution, un brouillon de sommaire valid\u00e9, 21 pages PDF plus loin et deux relectures, une r\u00e9-\u00e9criture d’une partie dont les specs avaient chang\u00e9es, et voil\u00e0 donc mon article publi\u00e9 aujourd’hui :<\/p>\n

The State Of Responsive Web Design <\/use><\/svg><\/span><\/a><\/p>\n

L’article est long, voir tr\u00e8s long. Il faut dire que le sujet est vaste. Je souhaitais aborder plusieurs points du responsive webdesign, et pas uniquement me concentrer sur les banalit\u00e9s que l’on lit partout. Le but de l’article et la mission que Vitaly m’avait donn\u00e9e : faire un \u00e9tat des lieux du domaine du responsive webdesign \u00e0 un instant T. Voir ce qui fonctionne, plus ou moins bien, ce qui est faisable aujourd\u2019hui, et ensuite voir plus loin dans le futur. Il y a pleins d’articles sur comment utiliser les media-queries, comme passer une mise en page de deux colonnes \u00e0 une colonne etc., si vous souhaitez lire une introduction pour apprendre \u00e0 vous servir des media-queries, ce n’est pas dans cet article que vous la trouverez. (vous pouvez toujours jeter un coup d’oeil \u00e0 mon cours pour les masters<\/a>\u00a0par contre)<\/p>\n

Pour cet article, nous voulions aller plus loin, et surtout mettre l’accent non seulement sur ce qui est possible aujourd’hui, mai surtout sur TOUT ce qui n’est pas encore possible, ce qui est difficile \u00e0 faire, \u00e0 optimiser<\/strong>. \u00a0J’ai donc essay\u00e9 de proposer un tour d’horizon de tout ce qui reste encore \u00e0 faire : meilleur gestion des images, faciliter les changements de mise en page avec des syst\u00e8mes plus \u00ab\u00a0flexibles\u00a0\u00bb que des flottants, mieux g\u00e9rer les contenus complexes comme les formulaires, les tableaux, les maps, les navigations, les contenus tierces r\u00e9cup\u00e9r\u00e9s sur nos sites (comme les iframes et les vid\u00e9os). Pour tous ces \u00ab\u00a0probl\u00e8mes\u00a0\u00bb sont propos\u00e9es des d\u00e9buts de piste de r\u00e9ponse, plus ou moins compl\u00e8tes, mais la solution parfaite n’existe pas encore. Une partie de l’article est \u00e9galement consacr\u00e9e aux sp\u00e9cificit\u00e9s des terminaux, aux nouvelles media-queries pas encore finalis\u00e9es avec un avant go\u00fbt de CSS level 4 et aux APIs. Enfin l’article conclus sur les utilisateurs, la gestion des workflows, des r\u00e9dacteurs de contenus et des CMSs qui eux aussi font aujourd’hui parti de tout ce qu’il faut prendre en compte lors de la cr\u00e9ation d’un site optimis\u00e9 sur plusieurs supports.<\/p>\n

La probl\u00e9matique du responsive est bien plus complexe que ce qu’on peut lire sur certains blogs qui essaient de nous faire croire qu’il suffit aujourd’hui, pour optimiser un site pour mobile, d’ajouter 2 media-queries pour l’iPhone et l’iPad et redimensionner toutes les image. Je n’ai pas la pr\u00e9tention de changer le monde, d’avoir la v\u00e9rit\u00e9 absolue, dans cet article je souhaitais juste montrer au lecteur le reste de ce gigantesque iceberg dont les media-queries n’en sont que la surface. Le responsive webdesign reste une technique et une infime partie de ce qui est aujourd’hui appel\u00e9 \u00ab\u00a0Adaptive Webdesign<\/a>\u00ab\u00a0.\u00a0Le but de l’article n’est pas non plus de d\u00e9courager les gens qui optimisent des sites pour mobile, mais de mettre le doigt sur ce qui aujourd’hui pose probl\u00e8me, est bancal, pour ensemble, trouver une solutions \u00e0 ces diff\u00e9rents probl\u00e8mes.<\/p>\n","protected":false},"excerpt":{"rendered":"

Ce contenu a \u00e9t\u00e9 r\u00e9dig\u00e9 il y a 12 ans. Il se peut qu’il ne soit plus \u00e0 jour.Apr\u00e8s plusieurs mois de recherche sur le sujet et plusieurs relectures, mon article qui dresse l’\u00e9tat des lieux de ce qui est aujourd’hui faisable en terme de responsive webdesign et adaptation mobile, ce qu’il reste \u00e0 creuser et am\u00e9liorer et surtout ce que l’on pourra (peut-\u00eatre) faire dans le futur est publi\u00e9 aujourd’hui sur Smashing Magazine. Tout avait commenc\u00e9 en Octobre 2012, …<\/p>\n","protected":false},"author":3,"featured_media":1550,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"categories":[224],"tags":[],"class_list":["post-1548","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-articles-dates-pas-mis-a-jours"],"yoast_head":"\nSur Smashing Magazine : Responsive Webdesign - pr\u00e9sent et futur de l'adaptation mobile - par St\u00e9phanie Walter - UX Researcher & Designer<\/title>\n<meta name=\"description\" content=\"L'\u00e9tat des lieux de ce qui est aujourd'hui faisable en terme de responsive webdesig, ce qu'il reste \u00e0 creuser et am\u00e9liorer et surtout ce que l'on pourra (peut-\u00eatre) faire dans le futur\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/stephaniewalter.design\/fr\/blog\/sur-smashing-magazine-responsive-webdesign-present-et-futur-de-ladaptation-mobile\/\" \/>\n<meta property=\"og:locale\" content=\"fr_FR\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Sur Smashing Magazine : Responsive Webdesign - pr\u00e9sent et futur de l'adaptation mobile - par St\u00e9phanie Walter - UX Researcher & Designer\" \/>\n<meta property=\"og:description\" content=\"L'\u00e9tat des lieux de ce qui est aujourd'hui faisable en terme de responsive webdesig, ce qu'il reste \u00e0 creuser et am\u00e9liorer et surtout ce que l'on pourra (peut-\u00eatre) faire dans le futur\" \/>\n<meta property=\"og:url\" content=\"https:\/\/stephaniewalter.design\/fr\/blog\/sur-smashing-magazine-responsive-webdesign-present-et-futur-de-ladaptation-mobile\/\" \/>\n<meta property=\"og:site_name\" content=\"St\u00e9phanie Walter - Senior UX designer, experte mobile, conf\u00e9rences et articles.\" \/>\n<meta property=\"article:published_time\" content=\"2013-05-29T20:07:28+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2023-08-04T09:13:06+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/stephaniewalter.design\/wp-content\/blogs.dir\/2\/files\/2013\/05\/state-of-responsive.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"700\" \/>\n\t<meta property=\"og:image:height\" content=\"200\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"St\u00e9phanie Walter\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@walterstephanie\" \/>\n<meta name=\"twitter:site\" content=\"@walterstephanie\" \/>\n<meta name=\"twitter:label1\" content=\"\u00c9crit par\" \/>\n\t<meta name=\"twitter:data1\" content=\"St\u00e9phanie Walter\" \/>\n\t<meta name=\"twitter:label2\" content=\"Dur\u00e9e de lecture estim\u00e9e\" \/>\n\t<meta name=\"twitter:data2\" content=\"3 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/stephaniewalter.design\/fr\/blog\/sur-smashing-magazine-responsive-webdesign-present-et-futur-de-ladaptation-mobile\/\",\"url\":\"https:\/\/stephaniewalter.design\/fr\/blog\/sur-smashing-magazine-responsive-webdesign-present-et-futur-de-ladaptation-mobile\/\",\"name\":\"Sur Smashing Magazine : Responsive Webdesign - pr\u00e9sent et futur de l'adaptation mobile - par St\u00e9phanie Walter - UX Researcher & Designer\",\"isPartOf\":{\"@id\":\"https:\/\/stephaniewalter.design\/fr\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/stephaniewalter.design\/fr\/blog\/sur-smashing-magazine-responsive-webdesign-present-et-futur-de-ladaptation-mobile\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/stephaniewalter.design\/fr\/blog\/sur-smashing-magazine-responsive-webdesign-present-et-futur-de-ladaptation-mobile\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/stephaniewalter.design\/fr\/files\/2013\/05\/state-of-responsive.jpg\",\"datePublished\":\"2013-05-29T20:07:28+00:00\",\"dateModified\":\"2023-08-04T09:13:06+00:00\",\"author\":{\"@id\":\"https:\/\/stephaniewalter.design\/fr\/#\/schema\/person\/643a9e5afcb1e550b6f4dca290fbf4cf\"},\"description\":\"L'\u00e9tat des lieux de ce qui est aujourd'hui faisable en terme de responsive webdesig, ce qu'il reste \u00e0 creuser et am\u00e9liorer et surtout ce que l'on pourra (peut-\u00eatre) faire dans le futur\",\"inLanguage\":\"fr-FR\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/stephaniewalter.design\/fr\/blog\/sur-smashing-magazine-responsive-webdesign-present-et-futur-de-ladaptation-mobile\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"fr-FR\",\"@id\":\"https:\/\/stephaniewalter.design\/fr\/blog\/sur-smashing-magazine-responsive-webdesign-present-et-futur-de-ladaptation-mobile\/#primaryimage\",\"url\":\"https:\/\/stephaniewalter.design\/fr\/files\/2013\/05\/state-of-responsive.jpg\",\"contentUrl\":\"https:\/\/stephaniewalter.design\/fr\/files\/2013\/05\/state-of-responsive.jpg\",\"width\":700,\"height\":200},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/stephaniewalter.design\/fr\/#website\",\"url\":\"https:\/\/stephaniewalter.design\/fr\/\",\"name\":\"St\u00e9phanie Walter - Senior UX designer, experte mobile, conf\u00e9rences et articles.\",\"description\":\"Je partage ici mes conseils, mes ressources et outils sur la conception centr\u00e9e utilisateur, la recherche et tests utilisateur, le design de produits, la strat\u00e9gie mobile, l'utilisabilit\u00e9 et l'accessibilit\u00e9.\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/stephaniewalter.design\/fr\/?s={search_term_string}\"},\"query-input\":\"required name=search_term_string\"}],\"inLanguage\":\"fr-FR\"},{\"@type\":\"Person\",\"@id\":\"https:\/\/stephaniewalter.design\/fr\/#\/schema\/person\/643a9e5afcb1e550b6f4dca290fbf4cf\",\"name\":\"St\u00e9phanie Walter\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"fr-FR\",\"@id\":\"https:\/\/stephaniewalter.design\/fr\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/f383c6a4dc55e331bbe2987b622cee6b?s=96&d=retro&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/f383c6a4dc55e331bbe2987b622cee6b?s=96&d=retro&r=g\",\"caption\":\"St\u00e9phanie Walter\"},\"description\":\"UX Researcher & Product Designer. Mobile Expert. Public speaker. Blog writer. Google Dev Expert Web Platform and Product Design (GDE)\",\"sameAs\":[\"https:\/\/stephaniewalter.design\/\",\"https:\/\/www.linkedin.com\/in\/stephaniewalterpro\/\",\"https:\/\/x.com\/walterstephanie\"]}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Sur Smashing Magazine : Responsive Webdesign - pr\u00e9sent et futur de l'adaptation mobile - par St\u00e9phanie Walter - UX Researcher & Designer","description":"L'\u00e9tat des lieux de ce qui est aujourd'hui faisable en terme de responsive webdesig, ce qu'il reste \u00e0 creuser et am\u00e9liorer et surtout ce que l'on pourra (peut-\u00eatre) faire dans le futur","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/stephaniewalter.design\/fr\/blog\/sur-smashing-magazine-responsive-webdesign-present-et-futur-de-ladaptation-mobile\/","og_locale":"fr_FR","og_type":"article","og_title":"Sur Smashing Magazine : Responsive Webdesign - pr\u00e9sent et futur de l'adaptation mobile - par St\u00e9phanie Walter - UX Researcher & Designer","og_description":"L'\u00e9tat des lieux de ce qui est aujourd'hui faisable en terme de responsive webdesig, ce qu'il reste \u00e0 creuser et am\u00e9liorer et surtout ce que l'on pourra (peut-\u00eatre) faire dans le futur","og_url":"https:\/\/stephaniewalter.design\/fr\/blog\/sur-smashing-magazine-responsive-webdesign-present-et-futur-de-ladaptation-mobile\/","og_site_name":"St\u00e9phanie Walter - Senior UX designer, experte mobile, conf\u00e9rences et articles.","article_published_time":"2013-05-29T20:07:28+00:00","article_modified_time":"2023-08-04T09:13:06+00:00","og_image":[{"width":700,"height":200,"url":"https:\/\/stephaniewalter.design\/wp-content\/blogs.dir\/2\/files\/2013\/05\/state-of-responsive.jpg","type":"image\/jpeg"}],"author":"St\u00e9phanie Walter","twitter_card":"summary_large_image","twitter_creator":"@walterstephanie","twitter_site":"@walterstephanie","twitter_misc":{"\u00c9crit par":"St\u00e9phanie Walter","Dur\u00e9e de lecture estim\u00e9e":"3 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/stephaniewalter.design\/fr\/blog\/sur-smashing-magazine-responsive-webdesign-present-et-futur-de-ladaptation-mobile\/","url":"https:\/\/stephaniewalter.design\/fr\/blog\/sur-smashing-magazine-responsive-webdesign-present-et-futur-de-ladaptation-mobile\/","name":"Sur Smashing Magazine : Responsive Webdesign - pr\u00e9sent et futur de l'adaptation mobile - par St\u00e9phanie Walter - UX Researcher & Designer","isPartOf":{"@id":"https:\/\/stephaniewalter.design\/fr\/#website"},"primaryImageOfPage":{"@id":"https:\/\/stephaniewalter.design\/fr\/blog\/sur-smashing-magazine-responsive-webdesign-present-et-futur-de-ladaptation-mobile\/#primaryimage"},"image":{"@id":"https:\/\/stephaniewalter.design\/fr\/blog\/sur-smashing-magazine-responsive-webdesign-present-et-futur-de-ladaptation-mobile\/#primaryimage"},"thumbnailUrl":"https:\/\/stephaniewalter.design\/fr\/files\/2013\/05\/state-of-responsive.jpg","datePublished":"2013-05-29T20:07:28+00:00","dateModified":"2023-08-04T09:13:06+00:00","author":{"@id":"https:\/\/stephaniewalter.design\/fr\/#\/schema\/person\/643a9e5afcb1e550b6f4dca290fbf4cf"},"description":"L'\u00e9tat des lieux de ce qui est aujourd'hui faisable en terme de responsive webdesig, ce qu'il reste \u00e0 creuser et am\u00e9liorer et surtout ce que l'on pourra (peut-\u00eatre) faire dans le futur","inLanguage":"fr-FR","potentialAction":[{"@type":"ReadAction","target":["https:\/\/stephaniewalter.design\/fr\/blog\/sur-smashing-magazine-responsive-webdesign-present-et-futur-de-ladaptation-mobile\/"]}]},{"@type":"ImageObject","inLanguage":"fr-FR","@id":"https:\/\/stephaniewalter.design\/fr\/blog\/sur-smashing-magazine-responsive-webdesign-present-et-futur-de-ladaptation-mobile\/#primaryimage","url":"https:\/\/stephaniewalter.design\/fr\/files\/2013\/05\/state-of-responsive.jpg","contentUrl":"https:\/\/stephaniewalter.design\/fr\/files\/2013\/05\/state-of-responsive.jpg","width":700,"height":200},{"@type":"WebSite","@id":"https:\/\/stephaniewalter.design\/fr\/#website","url":"https:\/\/stephaniewalter.design\/fr\/","name":"St\u00e9phanie Walter - Senior UX designer, experte mobile, conf\u00e9rences et articles.","description":"Je partage ici mes conseils, mes ressources et outils sur la conception centr\u00e9e utilisateur, la recherche et tests utilisateur, le design de produits, la strat\u00e9gie mobile, l'utilisabilit\u00e9 et l'accessibilit\u00e9.","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/stephaniewalter.design\/fr\/?s={search_term_string}"},"query-input":"required name=search_term_string"}],"inLanguage":"fr-FR"},{"@type":"Person","@id":"https:\/\/stephaniewalter.design\/fr\/#\/schema\/person\/643a9e5afcb1e550b6f4dca290fbf4cf","name":"St\u00e9phanie Walter","image":{"@type":"ImageObject","inLanguage":"fr-FR","@id":"https:\/\/stephaniewalter.design\/fr\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/f383c6a4dc55e331bbe2987b622cee6b?s=96&d=retro&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/f383c6a4dc55e331bbe2987b622cee6b?s=96&d=retro&r=g","caption":"St\u00e9phanie Walter"},"description":"UX Researcher & Product Designer. Mobile Expert. Public speaker. Blog writer. Google Dev Expert Web Platform and Product Design (GDE)","sameAs":["https:\/\/stephaniewalter.design\/","https:\/\/www.linkedin.com\/in\/stephaniewalterpro\/","https:\/\/x.com\/walterstephanie"]}]}},"acf":[],"_links":{"self":[{"href":"https:\/\/stephaniewalter.design\/fr\/wp-json\/wp\/v2\/posts\/1548","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/stephaniewalter.design\/fr\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/stephaniewalter.design\/fr\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/stephaniewalter.design\/fr\/wp-json\/wp\/v2\/users\/3"}],"replies":[{"embeddable":true,"href":"https:\/\/stephaniewalter.design\/fr\/wp-json\/wp\/v2\/comments?post=1548"}],"version-history":[{"count":1,"href":"https:\/\/stephaniewalter.design\/fr\/wp-json\/wp\/v2\/posts\/1548\/revisions"}],"predecessor-version":[{"id":8452,"href":"https:\/\/stephaniewalter.design\/fr\/wp-json\/wp\/v2\/posts\/1548\/revisions\/8452"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/stephaniewalter.design\/fr\/wp-json\/wp\/v2\/media\/1550"}],"wp:attachment":[{"href":"https:\/\/stephaniewalter.design\/fr\/wp-json\/wp\/v2\/media?parent=1548"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/stephaniewalter.design\/fr\/wp-json\/wp\/v2\/categories?post=1548"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/stephaniewalter.design\/fr\/wp-json\/wp\/v2\/tags?post=1548"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}