{"id":16769,"date":"2020-02-07T10:30:07","date_gmt":"2020-02-07T09:30:07","guid":{"rendered":"https:\/\/graphiste.com\/blog\/?p=16769"},"modified":"2025-08-19T17:15:33","modified_gmt":"2025-08-19T15:15:33","slug":"web-design-comment-utiliser-effet-parallax","status":"publish","type":"post","link":"https:\/\/graphiste.com\/blog\/web-design-comment-utiliser-effet-parallax\/","title":{"rendered":"Web design\u00a0: comment utiliser l’effet Parallax\u00a0?"},"content":{"rendered":"

Il y a des tendances qui passent aussi vite qu\u2019elles sont apparues, d\u2019autres qui disparaissent apr\u00e8s un long \u00e2ge d\u2019or (la technologie flash semble \u00eatre de celles-ci)<\/em> et enfin certaines qui semblent durer et que personne ne semble pouvoir arr\u00eater.<\/p>\n

L\u2019effet Parallax<\/a> appartient encore \u00e0 cette derni\u00e8re cat\u00e9gorie. Apparu en 2011, il continue \u00e0 s\u2019attirer les faveurs des webdesigners et \u00e0 faire son petit effet sur les internautes de tout poil.<\/p>\n

Qu\u2019est-il exactement et comment bien l\u2019utiliser\u00a0? Accrochez-vous \u00e0 vos souris, cet article sera \u00e0 deux vitesses.<\/p>\n

 <\/p>\n

D\u00e9finition et Origine<\/h2>\n

Malgr\u00e9 son nom barbare laissant imaginer une notion tr\u00e8s technique, le parallax<\/a> effect est en fait plut\u00f4t simple \u00e0 expliquer.<\/p>\n

Il consiste \u00e0 cr\u00e9er plusieurs plans sur votre site web et de les faire se d\u00e9placer \u00e0 des vitesses diff\u00e9rentes. De cette mani\u00e8re, vous cr\u00e9ez une impression de profondeur se rapprochant de la 3D.<\/p><\/blockquote>\n

\"parallax
Un exemple de d\u00e9filement parallax\u00a0: le plan du fond est immobile et les deux autres d\u00e9filent \u00e0 des vitesses diff\u00e9rentes<\/figcaption><\/figure>\n

Mais l\u2019effet parallax n\u2019est pas que l\u2019apanage du webdesign, loin de l\u00e0.\u00a0Utilis\u00e9 tout d\u2019abord en animation comme par exemple dans Blanche Neige et les Sept Nains, il fut par la suite repris par la plupart des premiers jeux vid\u00e9os, la technique ayant \u00e9t\u00e9 popularis\u00e9e par le jeu d\u2019arcade Moon Patrol d\u00e8s 1982.<\/p>\n

\u00c0 lire aussi :\u00a0Web design\u00a0: 8 astuces pour r\u00e9ussir un site minimaliste<\/a><\/p><\/blockquote>\n

 <\/p>\n

Comment cr\u00e9er le parallax effect\u00a0?<\/h2>\n

Utilisez un conteneur et ajoutez lui une image avec une hauteur sp\u00e9cifique.<\/p>\n

Placez ensuite la balise background-attachment: fixed<\/strong><\/code> pour cr\u00e9er le parallax effect. Il faudra ensuite modifier les autres propri\u00e9t\u00e9s pour centrer et cadrer l\u2019image selon vos souhaits\u00a0:<\/p>\n

<style>\n.parallax {\n\/* Image utilis\u00e9e *\/\nbackground-image:url(\"img_parallax.jpg\");\n\n\/* D\u00e9finissez une hauteur *\/\nheight:500px;\n\n\/* Cr\u00e9ez le parallax effect *\/\nbackground-attachment:fixed;\nbackground-position:center;\nbackground-repeat:no-repeat;\nbackground-size:cover;\n}\n<\/style>\n\n<!\u2014Conteneur -->\n<div class=\"parallax\"><\/div>\n<\/pre>\n
Suivez ce lien<\/a> pour voir le code en action !<\/p>\n
Voil\u00e0 pour le parallax effect de base, que vous pourrez impl\u00e9menter facilement sur vos sites web en quelques lignes de code.<\/p>\n
Mais cette technique peut apporter des effets visuels bien plus impressionants dont voici quelques exemples, bien que leur mise en pratique requi\u00e8re une certaine ma\u00eetrise des outils de design et des notions plus avanc\u00e9es de codage.<\/p>\n
\u00c0 lire aussi :\u00a0Web design\u00a0: quand utiliser une illustration\u00a0?<\/a><\/p><\/blockquote>\n
 <\/p>\n
Stock dutch design<\/a><\/h2>\n
\"effet<\/a><\/p>\n
Ce site de designers hollandais mise sur la simplicit\u00e9 et le minimalisme, mettant en avant de magnifiques photos et un texte soign\u00e9.<\/p>\n
Notez les quatre niveaux de profondeur<\/strong> pr\u00e9sents sur la page d\u2019accueil, donnant une impression de fausse 3D qui donne un effet particuli\u00e8rement moderne \u00e0 ce site web malgr\u00e9 une interface d\u00e9nud\u00e9e.<\/p>\n
Le parallax effect est ici utilis\u00e9 avec parcimonie et go\u00fbt, qui r\u00e9v\u00e8le les comp\u00e9tences de l\u2019entreprise en la mati\u00e8re.<\/p>\n
\u00c0 lire aussi : Logo, typographie, web design, graphisme : les meilleures tendances de 2020<\/a><\/p><\/blockquote>\n
 <\/p>\n
Next Level Fairs<\/a><\/h2>\n
\"\"<\/a><\/p>\n
A l\u2019image des galeries d\u2019art qu\u2019elle repr\u00e9sente, ce site pour une agence de design est une exp\u00e9rience immersive, pas toujours tr\u00e8s claire certes, mais qui a le don de titiller notre curiosit\u00e9 par son myst\u00e8re auquel la musique contribue grandement.<\/p>\n
On peine \u00e0 savoir de prime abord ce \u00e0 quoi ce site est destin\u00e9, mais on se surprend \u00e0 scroller malgr\u00e9 tout pour avoir le fin mot de l\u2019histoire\u2026 Et le voyage vaut le d\u00e9tour\u00a0!<\/p>\n
\u00c0 lire aussi : Inspiration : 8 sites web qui int\u00e8grent parfaitement le son \u00e0 leur design<\/a><\/p><\/blockquote>\n
 <\/p>\n
Missing<\/a><\/h2>\n
\"parallaxe<\/p>\n
Documentaire interactif cr\u00e9\u00e9 pour la cha\u00eene de t\u00e9l\u00e9vision australienne SBS, \u00ab\u00a0Missing\u00a0\u00bb utilise avec brio le parallax effect<\/strong> pour mieux nous plonger dans une enqu\u00eate visant \u00e0 retrouver une petite fille kidnapp\u00e9e.<\/p>\n
En effet, \u00e0 chaque chapitre de l\u2019histoire une image nous est pr\u00e9sent\u00e9e en patchwork de petites photos sur des dizaines de plans diff\u00e9rents, comme autant de pi\u00e8ces de puzzle de cette disparition inqui\u00e9tante.<\/p>\n
Ces derni\u00e8res se regroupent ensuite en une seule pour servir de d\u00e9cor \u00e0 la suite de l\u2019histoire. Une magnifique utilisation de la technique pour servir la narration.<\/p>\n
\u00c0 lire aussi : Comment optimiser vos images pour le web ?<\/a><\/p><\/blockquote>\n
 <\/p>\n
BAD DIESEL<\/a><\/h2>\n
\"\"<\/p>\n
Poursuivons avec une marque bien connue de la plupart d\u2019entre nous, Diesel.<\/p>\n
Si tous les sites pr\u00e9c\u00e9dents utilisaient le scrolling comme moyen de navigation, celui-ci est l\u2019exception qui confirme la r\u00e8gle\u00a0: la navigation en\u00a0\u00ab\u00a0drag and drop\u00a0\u00bb<\/em> se marie parfaitement bien avec l\u2019effet dont il est question dans cet article et sert \u00e0 merveille la d\u00e9couverte des diff\u00e9rentes r\u00e8gles du \u00ab\u00a0bad guide\u00a0\u00bb<\/em> ainsi que du parfum associ\u00e9.<\/p>\n
\u00c0 lire aussi : Inspiration : 15 effets de scroll originaux<\/a><\/p><\/blockquote>\n
 <\/p>\n
Deafeat B.O.C.O<\/a><\/h2>\n
\"\"<\/a><\/p>\n
Ce serious game sur l\u2019UX design empreinte son exp\u00e9rience aux jeux vid\u00e9o retro<\/a> dans un style minimaliste particuli\u00e8rement l\u00e9ch\u00e9.<\/p>\n
Un tour de force r\u00e9alis\u00e9 par une entreprise \u0153uvrant dans ce domaine, qui fait preuve une fois de plus de leur comp\u00e9tence en la mati\u00e8re.<\/p>\n
Le scroll, tant\u00f4t horizontal tant\u00f4t vertical est ici un moyen d\u2019avancer dans le paysage et dans les conseils donn\u00e9s par le site dans le but ultime de vaincre BOCO, Beast of Confliting Opinions (le monstre des opinions conflictuelles). Une sorte de rappel que le parallax effect ne date pas d\u2019hier, mais qu\u2019il a encore de beaux jours devant lui.<\/p>\n
\u00c0 lire aussi : 8 conseils graphiques pour r\u00e9ussir votre affiche minimaliste<\/a><\/p><\/blockquote>\n
 <\/p>\n
Vous souhaitez faire appel \u00e0 un graphiste pour r\u00e9aliser un site de ce type\u00a0? Rendez-vous sur Graphiste.com<\/a>\u00a0!<\/p>\n","protected":false},"excerpt":{"rendered":"
Il y a des tendances qui passent aussi vite qu\u2019elles sont apparues, d\u2019autres qui disparaissent apr\u00e8s un long \u00e2ge d\u2019or (la technologie flash semble \u00eatre de celles-ci) et enfin certaines qui semblent durer et que personne ne semble pouvoir arr\u00eater. L\u2019effet Parallax appartient encore \u00e0 cette derni\u00e8re cat\u00e9gorie. Apparu en 2011, il continue \u00e0 s\u2019attirer […]<\/p>\n","protected":false},"author":1,"featured_media":16847,"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-16769","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-webdesign"],"acf":[],"yoast_head":"\nWeb design\u00a0: comment utiliser l'effet Parallax\u00a0? - Graphiste Blog<\/title>\n<meta name=\"description\" content=\"Il y a des tendances qui passent aussi vite qu\u2019elles sont apparues, d\u2019autres qui disparaissent apr\u00e8s un long \u00e2ge d\u2019or (la technologie flash semble \u00eatre de\" \/>\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\/web-design-comment-utiliser-effet-parallax\/\" \/>\n<meta property=\"og:locale\" content=\"fr_FR\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Web design\u00a0: comment utiliser l'effet Parallax\u00a0? - Graphiste Blog\" \/>\n<meta property=\"og:description\" content=\"Il y a des tendances qui passent aussi vite qu\u2019elles sont apparues, d\u2019autres qui disparaissent apr\u00e8s un long \u00e2ge d\u2019or (la technologie flash semble \u00eatre de\" \/>\n<meta property=\"og:url\" content=\"https:\/\/graphiste.com\/blog\/web-design-comment-utiliser-effet-parallax\/\" \/>\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=\"2020-02-07T09:30:07+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2025-08-19T15:15:33+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/graphiste.com\/blog\/wp-content\/uploads\/sites\/4\/2020\/02\/une-graphiste-utiliser-parallax-effect-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=\"6 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/graphiste.com\/blog\/web-design-comment-utiliser-effet-parallax\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/graphiste.com\/blog\/web-design-comment-utiliser-effet-parallax\/\"},\"author\":{\"name\":\"Laura Michaud\",\"@id\":\"https:\/\/graphiste.com\/blog\/#\/schema\/person\/33c0ef04707fbe50a096f282050bb5f2\"},\"headline\":\"Web design\u00a0: comment utiliser l’effet Parallax\u00a0?\",\"datePublished\":\"2020-02-07T09:30:07+00:00\",\"dateModified\":\"2025-08-19T15:15:33+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/graphiste.com\/blog\/web-design-comment-utiliser-effet-parallax\/\"},\"wordCount\":933,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\/\/graphiste.com\/blog\/#organization\"},\"image\":{\"@id\":\"https:\/\/graphiste.com\/blog\/web-design-comment-utiliser-effet-parallax\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/graphiste.com\/blog\/wp-content\/uploads\/sites\/4\/2020\/02\/une-graphiste-utiliser-parallax-effect-1.jpg\",\"articleSection\":[\"Webdesign\"],\"inLanguage\":\"fr-FR\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/graphiste.com\/blog\/web-design-comment-utiliser-effet-parallax\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/graphiste.com\/blog\/web-design-comment-utiliser-effet-parallax\/\",\"url\":\"https:\/\/graphiste.com\/blog\/web-design-comment-utiliser-effet-parallax\/\",\"name\":\"Web design\u00a0: comment utiliser l'effet Parallax\u00a0? - Graphiste Blog\",\"isPartOf\":{\"@id\":\"https:\/\/graphiste.com\/blog\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/graphiste.com\/blog\/web-design-comment-utiliser-effet-parallax\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/graphiste.com\/blog\/web-design-comment-utiliser-effet-parallax\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/graphiste.com\/blog\/wp-content\/uploads\/sites\/4\/2020\/02\/une-graphiste-utiliser-parallax-effect-1.jpg\",\"datePublished\":\"2020-02-07T09:30:07+00:00\",\"dateModified\":\"2025-08-19T15:15:33+00:00\",\"description\":\"Il y a des tendances qui passent aussi vite qu\u2019elles sont apparues, d\u2019autres qui disparaissent apr\u00e8s un long \u00e2ge d\u2019or (la technologie flash semble \u00eatre de\",\"breadcrumb\":{\"@id\":\"https:\/\/graphiste.com\/blog\/web-design-comment-utiliser-effet-parallax\/#breadcrumb\"},\"inLanguage\":\"fr-FR\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/graphiste.com\/blog\/web-design-comment-utiliser-effet-parallax\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"fr-FR\",\"@id\":\"https:\/\/graphiste.com\/blog\/web-design-comment-utiliser-effet-parallax\/#primaryimage\",\"url\":\"https:\/\/graphiste.com\/blog\/wp-content\/uploads\/sites\/4\/2020\/02\/une-graphiste-utiliser-parallax-effect-1.jpg\",\"contentUrl\":\"https:\/\/graphiste.com\/blog\/wp-content\/uploads\/sites\/4\/2020\/02\/une-graphiste-utiliser-parallax-effect-1.jpg\",\"width\":850,\"height\":423},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/graphiste.com\/blog\/web-design-comment-utiliser-effet-parallax\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Blog\",\"item\":\"https:\/\/graphiste.com\/blog\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Webdesign\",\"item\":\"https:\/\/graphiste.com\/blog\/webdesign\/\"},{\"@type\":\"ListItem\",\"position\":3,\"name\":\"Web design\u00a0: comment utiliser l’effet Parallax\u00a0?\"}]},{\"@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":"Web design\u00a0: comment utiliser l'effet Parallax\u00a0? - Graphiste Blog","description":"Il y a des tendances qui passent aussi vite qu\u2019elles sont apparues, d\u2019autres qui disparaissent apr\u00e8s un long \u00e2ge d\u2019or (la technologie flash semble \u00eatre de","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\/web-design-comment-utiliser-effet-parallax\/","og_locale":"fr_FR","og_type":"article","og_title":"Web design\u00a0: comment utiliser l'effet Parallax\u00a0? - Graphiste Blog","og_description":"Il y a des tendances qui passent aussi vite qu\u2019elles sont apparues, d\u2019autres qui disparaissent apr\u00e8s un long \u00e2ge d\u2019or (la technologie flash semble \u00eatre de","og_url":"https:\/\/graphiste.com\/blog\/web-design-comment-utiliser-effet-parallax\/","og_site_name":"Graphiste.com","article_publisher":"https:\/\/www.facebook.com\/graphistesfreelances","article_published_time":"2020-02-07T09:30:07+00:00","article_modified_time":"2025-08-19T15:15:33+00:00","og_image":[{"width":850,"height":423,"url":"https:\/\/graphiste.com\/blog\/wp-content\/uploads\/sites\/4\/2020\/02\/une-graphiste-utiliser-parallax-effect-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":"6 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/graphiste.com\/blog\/web-design-comment-utiliser-effet-parallax\/#article","isPartOf":{"@id":"https:\/\/graphiste.com\/blog\/web-design-comment-utiliser-effet-parallax\/"},"author":{"name":"Laura Michaud","@id":"https:\/\/graphiste.com\/blog\/#\/schema\/person\/33c0ef04707fbe50a096f282050bb5f2"},"headline":"Web design\u00a0: comment utiliser l’effet Parallax\u00a0?","datePublished":"2020-02-07T09:30:07+00:00","dateModified":"2025-08-19T15:15:33+00:00","mainEntityOfPage":{"@id":"https:\/\/graphiste.com\/blog\/web-design-comment-utiliser-effet-parallax\/"},"wordCount":933,"commentCount":0,"publisher":{"@id":"https:\/\/graphiste.com\/blog\/#organization"},"image":{"@id":"https:\/\/graphiste.com\/blog\/web-design-comment-utiliser-effet-parallax\/#primaryimage"},"thumbnailUrl":"https:\/\/graphiste.com\/blog\/wp-content\/uploads\/sites\/4\/2020\/02\/une-graphiste-utiliser-parallax-effect-1.jpg","articleSection":["Webdesign"],"inLanguage":"fr-FR","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/graphiste.com\/blog\/web-design-comment-utiliser-effet-parallax\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/graphiste.com\/blog\/web-design-comment-utiliser-effet-parallax\/","url":"https:\/\/graphiste.com\/blog\/web-design-comment-utiliser-effet-parallax\/","name":"Web design\u00a0: comment utiliser l'effet Parallax\u00a0? - Graphiste Blog","isPartOf":{"@id":"https:\/\/graphiste.com\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/graphiste.com\/blog\/web-design-comment-utiliser-effet-parallax\/#primaryimage"},"image":{"@id":"https:\/\/graphiste.com\/blog\/web-design-comment-utiliser-effet-parallax\/#primaryimage"},"thumbnailUrl":"https:\/\/graphiste.com\/blog\/wp-content\/uploads\/sites\/4\/2020\/02\/une-graphiste-utiliser-parallax-effect-1.jpg","datePublished":"2020-02-07T09:30:07+00:00","dateModified":"2025-08-19T15:15:33+00:00","description":"Il y a des tendances qui passent aussi vite qu\u2019elles sont apparues, d\u2019autres qui disparaissent apr\u00e8s un long \u00e2ge d\u2019or (la technologie flash semble \u00eatre de","breadcrumb":{"@id":"https:\/\/graphiste.com\/blog\/web-design-comment-utiliser-effet-parallax\/#breadcrumb"},"inLanguage":"fr-FR","potentialAction":[{"@type":"ReadAction","target":["https:\/\/graphiste.com\/blog\/web-design-comment-utiliser-effet-parallax\/"]}]},{"@type":"ImageObject","inLanguage":"fr-FR","@id":"https:\/\/graphiste.com\/blog\/web-design-comment-utiliser-effet-parallax\/#primaryimage","url":"https:\/\/graphiste.com\/blog\/wp-content\/uploads\/sites\/4\/2020\/02\/une-graphiste-utiliser-parallax-effect-1.jpg","contentUrl":"https:\/\/graphiste.com\/blog\/wp-content\/uploads\/sites\/4\/2020\/02\/une-graphiste-utiliser-parallax-effect-1.jpg","width":850,"height":423},{"@type":"BreadcrumbList","@id":"https:\/\/graphiste.com\/blog\/web-design-comment-utiliser-effet-parallax\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Blog","item":"https:\/\/graphiste.com\/blog\/"},{"@type":"ListItem","position":2,"name":"Webdesign","item":"https:\/\/graphiste.com\/blog\/webdesign\/"},{"@type":"ListItem","position":3,"name":"Web design\u00a0: comment utiliser l’effet Parallax\u00a0?"}]},{"@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\/16769","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=16769"}],"version-history":[{"count":0,"href":"https:\/\/graphiste.com\/blog\/wp-json\/wp\/v2\/posts\/16769\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/graphiste.com\/blog\/wp-json\/wp\/v2\/media\/16847"}],"wp:attachment":[{"href":"https:\/\/graphiste.com\/blog\/wp-json\/wp\/v2\/media?parent=16769"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/graphiste.com\/blog\/wp-json\/wp\/v2\/categories?post=16769"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/graphiste.com\/blog\/wp-json\/wp\/v2\/tags?post=16769"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}