{"id":4379,"date":"2017-08-29T10:40:57","date_gmt":"2017-08-29T08:40:57","guid":{"rendered":"https:\/\/graphiste.com\/blog\/?p=4379"},"modified":"2017-08-29T10:40:57","modified_gmt":"2017-08-29T08:40:57","slug":"10-conseils-responsive-design-efficace","status":"publish","type":"post","link":"https:\/\/graphiste.com\/blog\/10-conseils-responsive-design-efficace\/","title":{"rendered":"10 conseils pour un responsive design efficace"},"content":{"rendered":"<p>Au moment de construire un site internet aujourd\u2019hui, il est impossible de passer \u00e0 c\u00f4t\u00e9 du responsive design.<\/p>\n<p>C\u2019est le seul moyen pour pr\u00e9senter des pages qui seront aussi agr\u00e9ables \u00e0 regarder avec tous les supports, et notamment les mobiles.<\/p>\n<p>Voici les conseils dont vous avez besoin pour penser <a href=\"https:\/\/graphiste.com\/blog\/creer-un-logo-responsive\" target=\"_blank\" rel=\"noopener noreferrer\">responsive.<\/a><\/p>\n<p>&nbsp;<\/p>\n<h2>1. Restez simple<\/h2>\n<p>Les design trop \u00e9labor\u00e9s, qui comportent une quantit\u00e9 superflue de JavaScript ou de Flash, ne font pas bon m\u00e9nage avec les tablettes ou les smartphones.<\/p>\n<p><img decoding=\"async\" class=\"aligncenter size-full wp-image-13555\" src=\"https:\/\/graphiste.com\/blog\/wp-content\/uploads\/sites\/4\/2019\/09\/von_wong_photography_responsive_design_preview-e1569589978231.jpg\" alt=\"web design blog site de photographe\" width=\"650\" height=\"385\" \/><\/p>\n<p>Appuyez-vous plut\u00f4t sur une base \u00e9pur\u00e9e, \u00e0 partir d\u2019HTML5, de feuilles de style facilement modifiables.<\/p>\n<p>Les \u00e9l\u00e9ments les plus importants de votre page, comme <a href=\"https:\/\/graphiste.com\/blog\/creer-mega-menu-efficace\" target=\"_blank\" rel=\"noopener noreferrer\">les menus<\/a> ou les outils de navigation, ont tout int\u00e9r\u00eat \u00e0 \u00eatre r\u00e9alis\u00e9 \u00e0 partir de techniques simples, qui ont d\u00e9j\u00e0 fait leur preuve (ce qui ne vous emp\u00eache pas de les personnaliser).<\/p>\n<blockquote><p>\u00c0 lire aussi&nbsp;: <a href=\"https:\/\/graphiste.com\/blog\/alternative-menu-hamburger\">Navigation sur mobile&nbsp;: 4 alternatives au menu hamburger<\/a><\/p><\/blockquote>\n<p>&nbsp;<\/p>\n<h2>2. Respectez les dimensions d\u2019\u00e9cran des utilisateurs<\/h2>\n<p><img decoding=\"async\" class=\"aligncenter size-medium wp-image-4380\" src=\"https:\/\/graphiste.com\/blog\/wp-content\/uploads\/sites\/4\/2017\/08\/capture-1013-300x128.jpg\" alt=\"\" width=\"300\" height=\"128\" \/><\/p>\n<p>Utilisez les Media Queries pour que votre pr\u00e9sentation s\u2019adapte automatiquement \u00e0 celle de l\u2019\u00e9cran. Voici la liste des r\u00e9solutions les plus fr\u00e9quentes&nbsp;: <\/p>\n<ul>\n<li>Smartphone\u00a0: de 480 \u00e0 720 px<\/li>\n<li>iPad\u00a0: 720 \u00e0 768 px<\/li>\n<li>Tablette\u00a0en mode portrait\u00a0: 768 \u00e0 900 px<\/li>\n<li>Tablette en mode paysage\u00a0: 900 \u00e0 1024 px<\/li>\n<li>ordinateur\u00a0: 1024 \u00e0 1200 px<\/li>\n<\/ul>\n<p>&nbsp;<\/p>\n<h2>3. Soyez flexible<\/h2>\n<p><img decoding=\"async\" class=\"aligncenter size-medium wp-image-4381\" src=\"https:\/\/graphiste.com\/blog\/wp-content\/uploads\/sites\/4\/2017\/08\/capture-1014-300x159.jpg\" alt=\"\" width=\"300\" height=\"159\" \/><\/p>\n<p>Le moyen le plus simple d\u2019adapter sa pr\u00e9sentation \u00e0 tous les formats d\u2019\u00e9cran est d\u2019utiliser des colonnes, qui peuvent s\u2019agencer les unes par rapport aux autres.<\/p>\n<p>Mieux encore\u00a0: indiquez des valeurs relatives pour leur taille, plut\u00f4t que des dimensions\u00a0: le bloc le plus \u00e9troit occupera ainsi 15\u00a0% de l\u2019espace (et pas 200 px).<\/p>\n<p>Pensez aussi que les utilisateurs de tablettes, comme de smartphones, peuvent tourner leur \u00e9cran\u00a0: vos colonnes doivent suivre le mouvement\u00a0!<\/p>\n<p>&nbsp;<\/p>\n<h2>4. N\u2019oubliez pas les images<\/h2>\n<p>Les images aussi doivent se r\u00e9soudre \u00e0 se pr\u00e9senter dans un plus petit format.<\/p>\n<p>Il n\u2019y a rien de plus d\u00e9sagr\u00e9able pour un utilisateur que d\u2019\u00eatre oblig\u00e9 de scroller pour faire d\u00e9filer l\u2019int\u00e9gralit\u00e9 d\u2019une simple photo\u00a0!<\/p>\n<p>Pensez donc \u00e0 pr\u00e9voir ce redimensionnement d\u00e8s leur insertion.<\/p>\n<p>&nbsp;<\/p>\n<h2>5. Fixez des limites<\/h2>\n<p>Il faut que le design s\u2019adapte \u00e0 l\u2019\u00e9cran, mais ce n\u2019est pas une raison pour \u00e9tirer des colonnes de mani\u00e8re ridicule.<\/p>\n<p>Indiquez toujours des dimensions maximales et minimales pour chaque zone (et, cette fois, en pixels, pas en pourcentages).<\/p>\n<blockquote><p>\u00c0 lire aussi&nbsp;: <a href=\"https:\/\/graphiste.com\/blog\/utiliser-media-queries-responsive\">Web design&nbsp;: comment utiliser les media queries pour un site responsive&nbsp;?<\/a><\/p><\/blockquote>\n<p>&nbsp;<\/p>\n<h2>6. Pensez relativit\u00e9<\/h2>\n<p><img decoding=\"async\" class=\"aligncenter size-medium wp-image-4382\" src=\"https:\/\/graphiste.com\/blog\/wp-content\/uploads\/sites\/4\/2017\/08\/capture-1015-300x183.jpg\" alt=\"\" width=\"300\" height=\"183\" \/><\/p>\n<p>Dans votre feuille de style, vous avez \u00e9tabli la police des caract\u00e8res, la taille des photos, des blocs, avec une hi\u00e9rarchie entre tous ces \u00e9l\u00e9ments.<\/p>\n<p>Il faut donc que ces diff\u00e9rences se ressentent quelle que soit la pr\u00e9sentation finale. Il s\u2019agit ainsi de d\u00e9finir le format de chaque police de caract\u00e8re en fonction du contenu principal, et de l\u2019indiquer \u00e0 partir de pourcentages ou de <a href=\"https:\/\/www.impressivewebs.com\/understanding-em-units-css\/\">la m\u00e9thode EM<\/a> (ephemeral unit).<\/p>\n<p>&nbsp;<\/p>\n<h2>7. R\u00e9fl\u00e9chissez \u00e0 la lin\u00e9arit\u00e9<\/h2>\n<p>Sur l\u2019\u00e9cran d\u2019un ordinateur, vous disposez de nombreuses colonnes ou placer vos \u00e9l\u00e9ments. Sur un portable, ces colonnes s\u2019aligneront les unes en dessous des autres.<\/p>\n<p><img decoding=\"async\" class=\"aligncenter size-full wp-image-11228\" src=\"https:\/\/graphiste.com\/blog\/wp-content\/uploads\/sites\/4\/2019\/05\/theme-wordpress-responsive.jpg\" alt=\"\" width=\"700\" height=\"526\" \/><\/p>\n<p>Pour \u00e9viter que le contenu le moins important apparaisse en haut de page, d\u00e9finissez d\u00e8s le d\u00e9part l\u2019ordre des blocs, de mani\u00e8re lin\u00e9aire.<\/p>\n<p>&nbsp;<\/p>\n<h2>8. Allez \u00e0 l\u2019essentiel<\/h2>\n<p>Certains blocs n\u2019auront d\u2019ailleurs aucune raison d\u2019appara\u00eetre dans un contexte mobile, car ils ne seront pas utilis\u00e9s\u00a0: faites-les dispara\u00eetre. I<\/p>\n<p>l s\u2019agit d\u2019appliquer une .<em><strong>not_mobile class<\/strong> <\/em>\u00e0 ces \u00e9l\u00e9ments, tels que certaines publicit\u00e9s ou rubriques d\u2019aides.<\/p>\n<p>&nbsp;<\/p>\n<h2>10. Adaptez-vous, toujours.<\/h2>\n<p>Certains supports mobiles vont tenter de visualiser votre design comme s\u2019ils \u00e9taient des \u00e9crans d\u2019ordinateur. Une fausse bonne id\u00e9e, puisque vos contenus seront r\u00e9duits, peu lisibles, et peu pratiques \u00e0 l\u2019usage.<\/p>\n<p>Ins\u00e9rez dans la balise head une commande viewport qui obligera le navigateur \u00e0 respecter r\u00e9ellement ses dimensions\u2026 et donc \u00e0 profiter du <a href=\"https:\/\/graphiste.com\/blog\/5-erreurs-a-ne-pas-commettre-sur-un-site-responsive\">responsive design<\/a> que vous aurez pr\u00e9par\u00e9.<\/p>\n<p>&nbsp;<\/p>\n<p class=\"p1\"><strong>N\u2019h\u00e9sitez pas \u00e0 utiliser\u00a0<a href=\"https:\/\/graphiste.com\/\">Graphiste.com<\/a>\u00a0pour faire r\u00e9aliser votre webdesign responsive. En d\u00e9posant gratuitement une annonce, vous trouverez de nombreux webdesigners proposant leurs services.<\/strong><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Au moment de construire un site internet aujourd\u2019hui, il est impossible de passer \u00e0 c\u00f4t\u00e9 du responsive design. C\u2019est le seul moyen pour pr\u00e9senter des pages qui seront aussi agr\u00e9ables \u00e0 regarder avec tous les supports, et notamment les mobiles. Voici les conseils dont vous avez besoin pour penser responsive. &nbsp; 1. Restez simple Les [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":4384,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"inline_featured_image":false,"footnotes":""},"categories":[27],"tags":[],"class_list":["post-4379","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-webdesign"],"acf":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v25.9 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>10 conseils pour un responsive design efficace - Graphiste Blog<\/title>\n<meta name=\"description\" content=\"Au moment de construire un site internet aujourd\u2019hui, il est impossible de passer \u00e0 c\u00f4t\u00e9 du responsive design. C\u2019est le seul moyen pour pr\u00e9senter des\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/graphiste.com\/blog\/10-conseils-responsive-design-efficace\/\" \/>\n<meta property=\"og:locale\" content=\"fr_FR\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"10 conseils pour un responsive design efficace - Graphiste Blog\" \/>\n<meta property=\"og:description\" content=\"Au moment de construire un site internet aujourd\u2019hui, il est impossible de passer \u00e0 c\u00f4t\u00e9 du responsive design. C\u2019est le seul moyen pour pr\u00e9senter des\" \/>\n<meta property=\"og:url\" content=\"https:\/\/graphiste.com\/blog\/10-conseils-responsive-design-efficace\/\" \/>\n<meta property=\"og:site_name\" content=\"Graphiste.com\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/graphistesfreelances\" \/>\n<meta property=\"article:published_time\" content=\"2017-08-29T08:40:57+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/graphiste.com\/blog\/wp-content\/uploads\/sites\/4\/2017\/08\/webdesign-responsive-1.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"850\" \/>\n\t<meta property=\"og:image:height\" content=\"423\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"Laura Michaud\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@Graphistecom\" \/>\n<meta name=\"twitter:site\" content=\"@Graphistecom\" \/>\n<meta name=\"twitter:label1\" content=\"\u00c9crit par\" \/>\n\t<meta name=\"twitter:data1\" content=\"Laura Michaud\" \/>\n\t<meta name=\"twitter:label2\" content=\"Dur\u00e9e de lecture estim\u00e9e\" \/>\n\t<meta name=\"twitter:data2\" content=\"4 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/graphiste.com\/blog\/10-conseils-responsive-design-efficace\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/graphiste.com\/blog\/10-conseils-responsive-design-efficace\/\"},\"author\":{\"name\":\"Laura Michaud\",\"@id\":\"https:\/\/graphiste.com\/blog\/#\/schema\/person\/33c0ef04707fbe50a096f282050bb5f2\"},\"headline\":\"10 conseils pour un responsive design efficace\",\"datePublished\":\"2017-08-29T08:40:57+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/graphiste.com\/blog\/10-conseils-responsive-design-efficace\/\"},\"wordCount\":706,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\/\/graphiste.com\/blog\/#organization\"},\"image\":{\"@id\":\"https:\/\/graphiste.com\/blog\/10-conseils-responsive-design-efficace\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/graphiste.com\/blog\/wp-content\/uploads\/sites\/4\/2017\/08\/webdesign-responsive-1.jpg\",\"articleSection\":[\"Webdesign\"],\"inLanguage\":\"fr-FR\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/graphiste.com\/blog\/10-conseils-responsive-design-efficace\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/graphiste.com\/blog\/10-conseils-responsive-design-efficace\/\",\"url\":\"https:\/\/graphiste.com\/blog\/10-conseils-responsive-design-efficace\/\",\"name\":\"10 conseils pour un responsive design efficace - Graphiste Blog\",\"isPartOf\":{\"@id\":\"https:\/\/graphiste.com\/blog\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/graphiste.com\/blog\/10-conseils-responsive-design-efficace\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/graphiste.com\/blog\/10-conseils-responsive-design-efficace\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/graphiste.com\/blog\/wp-content\/uploads\/sites\/4\/2017\/08\/webdesign-responsive-1.jpg\",\"datePublished\":\"2017-08-29T08:40:57+00:00\",\"description\":\"Au moment de construire un site internet aujourd\u2019hui, il est impossible de passer \u00e0 c\u00f4t\u00e9 du responsive design. C\u2019est le seul moyen pour pr\u00e9senter des\",\"breadcrumb\":{\"@id\":\"https:\/\/graphiste.com\/blog\/10-conseils-responsive-design-efficace\/#breadcrumb\"},\"inLanguage\":\"fr-FR\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/graphiste.com\/blog\/10-conseils-responsive-design-efficace\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"fr-FR\",\"@id\":\"https:\/\/graphiste.com\/blog\/10-conseils-responsive-design-efficace\/#primaryimage\",\"url\":\"https:\/\/graphiste.com\/blog\/wp-content\/uploads\/sites\/4\/2017\/08\/webdesign-responsive-1.jpg\",\"contentUrl\":\"https:\/\/graphiste.com\/blog\/wp-content\/uploads\/sites\/4\/2017\/08\/webdesign-responsive-1.jpg\",\"width\":850,\"height\":423},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/graphiste.com\/blog\/10-conseils-responsive-design-efficace\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Blog\",\"item\":\"https:\/\/graphiste.com\/blog\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"10 conseils pour un responsive design efficace\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/graphiste.com\/blog\/#website\",\"url\":\"https:\/\/graphiste.com\/blog\/\",\"name\":\"Graphiste.com\",\"description\":\"graphiste\",\"publisher\":{\"@id\":\"https:\/\/graphiste.com\/blog\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/graphiste.com\/blog\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"fr-FR\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/graphiste.com\/blog\/#organization\",\"name\":\"Graphiste.com\",\"url\":\"https:\/\/graphiste.com\/blog\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"fr-FR\",\"@id\":\"https:\/\/graphiste.com\/blog\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/graphiste.com\/blog\/wp-content\/uploads\/sites\/4\/2022\/07\/logo-blog-graphiste.svg\",\"contentUrl\":\"https:\/\/graphiste.com\/blog\/wp-content\/uploads\/sites\/4\/2022\/07\/logo-blog-graphiste.svg\",\"width\":1,\"height\":1,\"caption\":\"Graphiste.com\"},\"image\":{\"@id\":\"https:\/\/graphiste.com\/blog\/#\/schema\/logo\/image\/\"},\"sameAs\":[\"https:\/\/www.facebook.com\/graphistesfreelances\",\"https:\/\/x.com\/Graphistecom\",\"https:\/\/www.linkedin.com\/company\/graphiste-com\/\",\"https:\/\/fr.pinterest.com\/Graphiste_Com\",\"https:\/\/www.instagram.com\/graphiste_com\/\"]},{\"@type\":\"Person\",\"@id\":\"https:\/\/graphiste.com\/blog\/#\/schema\/person\/33c0ef04707fbe50a096f282050bb5f2\",\"name\":\"Laura Michaud\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"fr-FR\",\"@id\":\"https:\/\/graphiste.com\/blog\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/c3328cc0c887f98cec6b2979af3311ab6333fc7cc2d4847514cfec6a56fa08a7?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/c3328cc0c887f98cec6b2979af3311ab6333fc7cc2d4847514cfec6a56fa08a7?s=96&d=mm&r=g\",\"caption\":\"Laura Michaud\"},\"description\":\"Laura connait tous les meilleurs outils pour g\u00e9rer des projets et une entreprise. Cr\u00e9ative, c'est aussi une sp\u00e9cialiste des outils de cr\u00e9ation graphique pour faire briller une entreprise.\",\"sameAs\":[\"https:\/\/www.linkedin.com\/in\/michaudlaura\/\"],\"url\":\"https:\/\/graphiste.com\/blog\/author\/laura\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"10 conseils pour un responsive design efficace - Graphiste Blog","description":"Au moment de construire un site internet aujourd\u2019hui, il est impossible de passer \u00e0 c\u00f4t\u00e9 du responsive design. C\u2019est le seul moyen pour pr\u00e9senter des","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:\/\/graphiste.com\/blog\/10-conseils-responsive-design-efficace\/","og_locale":"fr_FR","og_type":"article","og_title":"10 conseils pour un responsive design efficace - Graphiste Blog","og_description":"Au moment de construire un site internet aujourd\u2019hui, il est impossible de passer \u00e0 c\u00f4t\u00e9 du responsive design. C\u2019est le seul moyen pour pr\u00e9senter des","og_url":"https:\/\/graphiste.com\/blog\/10-conseils-responsive-design-efficace\/","og_site_name":"Graphiste.com","article_publisher":"https:\/\/www.facebook.com\/graphistesfreelances","article_published_time":"2017-08-29T08:40:57+00:00","og_image":[{"width":850,"height":423,"url":"https:\/\/graphiste.com\/blog\/wp-content\/uploads\/sites\/4\/2017\/08\/webdesign-responsive-1.jpg","type":"image\/jpeg"}],"author":"Laura Michaud","twitter_card":"summary_large_image","twitter_creator":"@Graphistecom","twitter_site":"@Graphistecom","twitter_misc":{"\u00c9crit par":"Laura Michaud","Dur\u00e9e de lecture estim\u00e9e":"4 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/graphiste.com\/blog\/10-conseils-responsive-design-efficace\/#article","isPartOf":{"@id":"https:\/\/graphiste.com\/blog\/10-conseils-responsive-design-efficace\/"},"author":{"name":"Laura Michaud","@id":"https:\/\/graphiste.com\/blog\/#\/schema\/person\/33c0ef04707fbe50a096f282050bb5f2"},"headline":"10 conseils pour un responsive design efficace","datePublished":"2017-08-29T08:40:57+00:00","mainEntityOfPage":{"@id":"https:\/\/graphiste.com\/blog\/10-conseils-responsive-design-efficace\/"},"wordCount":706,"commentCount":0,"publisher":{"@id":"https:\/\/graphiste.com\/blog\/#organization"},"image":{"@id":"https:\/\/graphiste.com\/blog\/10-conseils-responsive-design-efficace\/#primaryimage"},"thumbnailUrl":"https:\/\/graphiste.com\/blog\/wp-content\/uploads\/sites\/4\/2017\/08\/webdesign-responsive-1.jpg","articleSection":["Webdesign"],"inLanguage":"fr-FR","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/graphiste.com\/blog\/10-conseils-responsive-design-efficace\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/graphiste.com\/blog\/10-conseils-responsive-design-efficace\/","url":"https:\/\/graphiste.com\/blog\/10-conseils-responsive-design-efficace\/","name":"10 conseils pour un responsive design efficace - Graphiste Blog","isPartOf":{"@id":"https:\/\/graphiste.com\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/graphiste.com\/blog\/10-conseils-responsive-design-efficace\/#primaryimage"},"image":{"@id":"https:\/\/graphiste.com\/blog\/10-conseils-responsive-design-efficace\/#primaryimage"},"thumbnailUrl":"https:\/\/graphiste.com\/blog\/wp-content\/uploads\/sites\/4\/2017\/08\/webdesign-responsive-1.jpg","datePublished":"2017-08-29T08:40:57+00:00","description":"Au moment de construire un site internet aujourd\u2019hui, il est impossible de passer \u00e0 c\u00f4t\u00e9 du responsive design. C\u2019est le seul moyen pour pr\u00e9senter des","breadcrumb":{"@id":"https:\/\/graphiste.com\/blog\/10-conseils-responsive-design-efficace\/#breadcrumb"},"inLanguage":"fr-FR","potentialAction":[{"@type":"ReadAction","target":["https:\/\/graphiste.com\/blog\/10-conseils-responsive-design-efficace\/"]}]},{"@type":"ImageObject","inLanguage":"fr-FR","@id":"https:\/\/graphiste.com\/blog\/10-conseils-responsive-design-efficace\/#primaryimage","url":"https:\/\/graphiste.com\/blog\/wp-content\/uploads\/sites\/4\/2017\/08\/webdesign-responsive-1.jpg","contentUrl":"https:\/\/graphiste.com\/blog\/wp-content\/uploads\/sites\/4\/2017\/08\/webdesign-responsive-1.jpg","width":850,"height":423},{"@type":"BreadcrumbList","@id":"https:\/\/graphiste.com\/blog\/10-conseils-responsive-design-efficace\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Blog","item":"https:\/\/graphiste.com\/blog\/"},{"@type":"ListItem","position":2,"name":"10 conseils pour un responsive design efficace"}]},{"@type":"WebSite","@id":"https:\/\/graphiste.com\/blog\/#website","url":"https:\/\/graphiste.com\/blog\/","name":"Graphiste.com","description":"graphiste","publisher":{"@id":"https:\/\/graphiste.com\/blog\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/graphiste.com\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"fr-FR"},{"@type":"Organization","@id":"https:\/\/graphiste.com\/blog\/#organization","name":"Graphiste.com","url":"https:\/\/graphiste.com\/blog\/","logo":{"@type":"ImageObject","inLanguage":"fr-FR","@id":"https:\/\/graphiste.com\/blog\/#\/schema\/logo\/image\/","url":"https:\/\/graphiste.com\/blog\/wp-content\/uploads\/sites\/4\/2022\/07\/logo-blog-graphiste.svg","contentUrl":"https:\/\/graphiste.com\/blog\/wp-content\/uploads\/sites\/4\/2022\/07\/logo-blog-graphiste.svg","width":1,"height":1,"caption":"Graphiste.com"},"image":{"@id":"https:\/\/graphiste.com\/blog\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/graphistesfreelances","https:\/\/x.com\/Graphistecom","https:\/\/www.linkedin.com\/company\/graphiste-com\/","https:\/\/fr.pinterest.com\/Graphiste_Com","https:\/\/www.instagram.com\/graphiste_com\/"]},{"@type":"Person","@id":"https:\/\/graphiste.com\/blog\/#\/schema\/person\/33c0ef04707fbe50a096f282050bb5f2","name":"Laura Michaud","image":{"@type":"ImageObject","inLanguage":"fr-FR","@id":"https:\/\/graphiste.com\/blog\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/c3328cc0c887f98cec6b2979af3311ab6333fc7cc2d4847514cfec6a56fa08a7?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/c3328cc0c887f98cec6b2979af3311ab6333fc7cc2d4847514cfec6a56fa08a7?s=96&d=mm&r=g","caption":"Laura Michaud"},"description":"Laura connait tous les meilleurs outils pour g\u00e9rer des projets et une entreprise. Cr\u00e9ative, c'est aussi une sp\u00e9cialiste des outils de cr\u00e9ation graphique pour faire briller une entreprise.","sameAs":["https:\/\/www.linkedin.com\/in\/michaudlaura\/"],"url":"https:\/\/graphiste.com\/blog\/author\/laura\/"}]}},"_links":{"self":[{"href":"https:\/\/graphiste.com\/blog\/wp-json\/wp\/v2\/posts\/4379","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/graphiste.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/graphiste.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/graphiste.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/graphiste.com\/blog\/wp-json\/wp\/v2\/comments?post=4379"}],"version-history":[{"count":0,"href":"https:\/\/graphiste.com\/blog\/wp-json\/wp\/v2\/posts\/4379\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/graphiste.com\/blog\/wp-json\/wp\/v2\/media\/4384"}],"wp:attachment":[{"href":"https:\/\/graphiste.com\/blog\/wp-json\/wp\/v2\/media?parent=4379"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/graphiste.com\/blog\/wp-json\/wp\/v2\/categories?post=4379"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/graphiste.com\/blog\/wp-json\/wp\/v2\/tags?post=4379"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}