{"id":5941,"date":"2016-11-18T10:51:48","date_gmt":"2016-11-18T09:51:48","guid":{"rendered":"http:\/\/blog.stephaniewalter.fr\/?p=5941"},"modified":"2016-11-21T11:28:23","modified_gmt":"2016-11-21T10:28:23","slug":"semaine-pixels-18-novembre-2016","status":"publish","type":"post","link":"https:\/\/stephaniewalter.design\/fr\/blog\/semaine-pixels-18-novembre-2016\/","title":{"rendered":"La semaine en pixels \u2013 18 novembre 2016"},"content":{"rendered":"
Ce contenu a \u00e9t\u00e9 r\u00e9dig\u00e9 il y a 9 ans. Il se peut qu'il ne soit plus \u00e0 jour.<\/div>

Comme chaque semaine, \u00a0un condens\u00e9 de mes lectures et ma veille web design et graphisme, exp\u00e9rience utilisateurs, design d’interface et mobilit\u00e9, mais aussi des outils et ressources pour le web design et de l’inspiration en tout genre : illustrations, photos, sites web, etc.<\/p>\n

Au programme :\u00a0modales de confirmation, alternatives au burger menu, design de slides de pr\u00e9sentation, formulaires sur mobile, utilisation des couleurs, des animations et des illustrations en webdesign, optimisation et conversion et progressive web apps. Ne manquez pas un tutoriel pour afficher le mot de passe, un m\u00e9lange de flexbox et CSS grids, des outils d’accessibilit\u00e9 et plusieurs d\u00e9mos CSS \/ JavaScript bien sympathiques.<\/p>\n

Pour plus de liens chaque matin vous pouvez me suivre sur twitter<\/a>. Bonne lecture :)<\/p>\n

tl;dnr, s’il devait n’en rester qu’un ?<\/h2>\n

#Slides<\/p>\n

Quelques conseils pour faire des slides de pr\u00e9sentations sympas et efficaces<\/a><\/p>\n

\"\"<\/p>\n

#Conf #Mobile #Formulaires<\/p>\n

Aidez-moi \u00e0 remplir vos formulaires mobile ! \u2013 Blend Web Mix 2016<\/a><\/p>\n

<\/p>\n

Les articles de la semaine<\/h2>\n

#UX<\/p>\n

Designing Confirmation<\/a>, designer une modale de confirmation<\/p>\n

\"\"<\/p>\n

#mobile #Menu<\/p>\n

Hamburger menu alternatives for mobile navigation<\/a>, des alternatives au burger menu. Au final pour moi la dropdown c\u2019est un peu comme un burger menu sans l\u2019ic\u00f4ne mais on garde le fait de masquer une partie du menu par d\u00e9faut<\/p>\n

\"\"<\/p>\n

#Design<\/p>\n

50 Shades of #FAFAFA, A moderately inappropriate look at silly things designers do and don\u2019t do,<\/a> I love the \u00ab\u00a0Here\u2019s a UI I made using Lato Thin.\u201d part, a little bit nasty but so true<\/p>\n

\"\"<\/p>\n

#Animation<\/p>\n

10 principles for smooth web animations<\/a>, des principes de code et de design pour vous aider \u00e0 construire des animations<\/p>\n

\"\"<\/p>\n

 <\/p>\n

#Design<\/p>\n

How to Make Color Overlays Work in Your Design<\/a>, quelques conseils pour faire fonctionner des superpositions de couleurs dans un design<\/p>\n

\"\"<\/p>\n

#UX<\/p>\n

Stop Blaming the User<\/a>, arr\u00eater de rejeter la faute sur les utilisateurs<\/p>\n

\"\"<\/p>\n

#Design<\/p>\n

5 Tips for Mixing Photos & Illustrations in a Single Design<\/a>, des conseils pour m\u00e9langer illustrations et photos dans un seul et m\u00eame design<\/p>\n

\"\"<\/p>\n

#UX<\/p>\n

The Difference Between User Experience and Conversion Rate Optimization<\/a>, la diff\u00e9rence entre l\u2019optimisation de la conversion et l\u2019exp\u00e9rience utilisateur (pratique pour expliquer \u00e0 un client)<\/p>\n

\"\"<\/p>\n

#Design #UX<\/p>\n

Stop Pressuring Me to Sign Up to Your Newsletter!<\/a> arr\u00eatons de forcer les utilisateurs \u00e0 souscrire aux newsletters \u00e0 coup de grosses pop-up condescendantes<\/p>\n

\"\"<\/p>\n

#PWA<\/p>\n

Native Apps are Doomed<\/a>, une analyse int\u00e9ressante sur la construction de progressive web apps et comment elles peuvent remplacer des applications natives<\/p>\n

\"\"<\/p>\n

#Fun #Design<\/p>\n

100 Excuses for Designers<\/a>, pour vous aider la prochaine fois que vous faites une b\u00eatise ^^<\/p>\n

\"\"<\/p>\n

\u00a0Les tutoriels de la semaine<\/h2>\n

#Illustrator<\/p>\n

Trendy Folded Logo Design in Illustrator<\/a>, un petit tuto logo pour d\u00e9buter dans Illustrator<\/p>\n

\"\"<\/p>\n

#Form<\/p>\n

Password visibility toggles<\/a>, pas super convaincue par le 1e exemple par contre, j\u2019ai peur que les utilisateurs confondent cette checkbox avec la checkbox \u201c se souvenir de moi \u201d qui se trouve souvent \u00e0 cet emplacement<\/p>\n

\"\"<\/p>\n

#CSS<\/p>\n

CSS Grid, Flexbox And Box Alignment: Our New System For Web Layout<\/a> flexbox et le grid layout pour cr\u00e9er des mises en page pour le web<\/p>\n

\"\"<\/p>\n

#SVG<\/p>\n

SVG Line Animation for the Uninitiated<\/a>, quick and easy to understand tutorial<\/p>\n

\"\"<\/p>\n

Des ressources utiles, outils et plugins pour vous faciliter la vie<\/h2>\n

#CSS #Loader<\/p>\n

CSS Loader<\/a> des loaders de chargement en CSS<\/p>\n

\"\"<\/p>\n

#Accessibility<\/p>\n

Tools for Developing Accessible Websites<\/a>, des outils pour vous aider \u00e0 construire des sites accessibles<\/p>\n

\"\"<\/p>\n

Pour le fun: jeux et d\u00e9mos sympas et impressionnantes<\/h2>\n

#Gems<\/p>\n

La d\u00e9mo fun du jour, \u00e0 base de gems<\/a><\/p>\n

#UX<\/p>\n

If Satan was a web developer<\/a> si satan \u00e9tait d\u00e9veloppeur il ferait des choses horribles mais dr\u00f4les<\/p>\n

\"\"<\/p>\n

#Nyancat<\/p>\n

Le truc inutile mais dr\u00f4le : Stupid Nyan Cat animation on your +$2k MacBook Pro’s Touchbar. Enjoy.<\/a><\/p>\n

\"\"<\/p>\n

#Canva #Animation<\/p>\n

La petite d\u00e9mo codepen qui envoie du lourd<\/a><\/p>\n

\"\"<\/p>\n

#Demo #CSS<\/p>\n

box-decoration-break demos<\/a>, une demo de texte avec un arri\u00e8re plan qui passe sur deux lignes<\/p>\n

\"\"<\/p>\n

#CSS<\/p>\n

Image Effects with CSS<\/a>, des effets d\u2019image fun avec du CSS<\/p>\n

\"\"<\/p>\n","protected":false},"excerpt":{"rendered":"

Ce contenu a \u00e9t\u00e9 r\u00e9dig\u00e9 il y a 9 ans. Il se peut qu’il ne soit plus \u00e0 jour.Comme chaque semaine, \u00a0un condens\u00e9 de mes lectures et ma veille web design et graphisme, exp\u00e9rience utilisateurs, design d’interface et mobilit\u00e9, mais aussi des outils et ressources pour le web design et de l’inspiration en tout genre : illustrations, photos, sites web, etc. Au programme :\u00a0modales de confirmation, alternatives au burger menu, design de slides de pr\u00e9sentation, formulaires sur mobile, utilisation des …<\/p>\n","protected":false},"author":3,"featured_media":5931,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"link","meta":{"_acf_changed":false,"footnotes":""},"categories":[105],"tags":[],"class_list":["post-5941","post","type-post","status-publish","format-link","has-post-thumbnail","hentry","category-veille-liens-utiles","post_format-post-format-link"],"yoast_head":"\nLa semaine en pixels \u2013 18 novembre 2016 - par St\u00e9phanie Walter - UX Researcher & Designer<\/title>\n<meta name=\"description\" content=\"A ne pas manquer:\u00a0modales de confirmation, alternatives au burger menu, design de slides de pr\u00e9sentation, formulaires mobile, couleurs, animations et illustrations en webdesign, afficher le mot de passe de formulaire, flexbox et CSS grids, outils d'accessibilit\u00e9\" \/>\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\/semaine-pixels-18-novembre-2016\/\" \/>\n<meta property=\"og:locale\" content=\"fr_FR\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"La semaine en pixels \u2013 18 novembre 2016 - par St\u00e9phanie Walter - UX Researcher & Designer\" \/>\n<meta property=\"og:description\" content=\"A ne pas manquer:\u00a0modales de confirmation, alternatives au burger menu, design de slides de pr\u00e9sentation, formulaires mobile, couleurs, animations et illustrations en webdesign, afficher le mot de passe de formulaire, flexbox et CSS grids, outils d'accessibilit\u00e9\" \/>\n<meta property=\"og:url\" content=\"https:\/\/stephaniewalter.design\/fr\/blog\/semaine-pixels-18-novembre-2016\/\" \/>\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=\"2016-11-18T09:51:48+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2016-11-21T10:28:23+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/stephaniewalter.design\/wp-content\/blogs.dir\/2\/files\/2016\/11\/liensemaine-18octobre.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"850\" \/>\n\t<meta property=\"og:image:height\" content=\"350\" \/>\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=\"@https:\/\/bsky.app\/profile\/stephaniewalter.bsky.social\" \/>\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\/semaine-pixels-18-novembre-2016\/\",\"url\":\"https:\/\/stephaniewalter.design\/fr\/blog\/semaine-pixels-18-novembre-2016\/\",\"name\":\"La semaine en pixels \u2013 18 novembre 2016 - par St\u00e9phanie Walter - UX Researcher & Designer\",\"isPartOf\":{\"@id\":\"https:\/\/stephaniewalter.design\/fr\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/stephaniewalter.design\/fr\/blog\/semaine-pixels-18-novembre-2016\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/stephaniewalter.design\/fr\/blog\/semaine-pixels-18-novembre-2016\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/stephaniewalter.design\/fr\/files\/2016\/11\/liensemaine-18octobre.jpg\",\"datePublished\":\"2016-11-18T09:51:48+00:00\",\"dateModified\":\"2016-11-21T10:28:23+00:00\",\"author\":{\"@id\":\"https:\/\/stephaniewalter.design\/fr\/#\/schema\/person\/643a9e5afcb1e550b6f4dca290fbf4cf\"},\"description\":\"A ne pas manquer:\u00a0modales de confirmation, alternatives au burger menu, design de slides de pr\u00e9sentation, formulaires mobile, couleurs, animations et illustrations en webdesign, afficher le mot de passe de formulaire, flexbox et CSS grids, outils d'accessibilit\u00e9\",\"inLanguage\":\"fr-FR\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/stephaniewalter.design\/fr\/blog\/semaine-pixels-18-novembre-2016\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"fr-FR\",\"@id\":\"https:\/\/stephaniewalter.design\/fr\/blog\/semaine-pixels-18-novembre-2016\/#primaryimage\",\"url\":\"https:\/\/stephaniewalter.design\/fr\/files\/2016\/11\/liensemaine-18octobre.jpg\",\"contentUrl\":\"https:\/\/stephaniewalter.design\/fr\/files\/2016\/11\/liensemaine-18octobre.jpg\",\"width\":850,\"height\":350,\"caption\":\"La semaine en pixels \u2013 18 octobre 2016\"},{\"@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\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"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\/2bc37c927707e853de94250cad44e4ffc13bee34ad9eda7a69651ca5ee19948b?s=96&d=retro&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/2bc37c927707e853de94250cad44e4ffc13bee34ad9eda7a69651ca5ee19948b?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\/https:\/\/bsky.app\/profile\/stephaniewalter.bsky.social\"]}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"La semaine en pixels \u2013 18 novembre 2016 - par St\u00e9phanie Walter - UX Researcher & Designer","description":"A ne pas manquer:\u00a0modales de confirmation, alternatives au burger menu, design de slides de pr\u00e9sentation, formulaires mobile, couleurs, animations et illustrations en webdesign, afficher le mot de passe de formulaire, flexbox et CSS grids, outils d'accessibilit\u00e9","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\/semaine-pixels-18-novembre-2016\/","og_locale":"fr_FR","og_type":"article","og_title":"La semaine en pixels \u2013 18 novembre 2016 - par St\u00e9phanie Walter - UX Researcher & Designer","og_description":"A ne pas manquer:\u00a0modales de confirmation, alternatives au burger menu, design de slides de pr\u00e9sentation, formulaires mobile, couleurs, animations et illustrations en webdesign, afficher le mot de passe de formulaire, flexbox et CSS grids, outils d'accessibilit\u00e9","og_url":"https:\/\/stephaniewalter.design\/fr\/blog\/semaine-pixels-18-novembre-2016\/","og_site_name":"St\u00e9phanie Walter - Senior UX designer, experte mobile, conf\u00e9rences et articles.","article_published_time":"2016-11-18T09:51:48+00:00","article_modified_time":"2016-11-21T10:28:23+00:00","og_image":[{"width":850,"height":350,"url":"https:\/\/stephaniewalter.design\/wp-content\/blogs.dir\/2\/files\/2016\/11\/liensemaine-18octobre.jpg","type":"image\/jpeg"}],"author":"St\u00e9phanie Walter","twitter_card":"summary_large_image","twitter_creator":"@https:\/\/bsky.app\/profile\/stephaniewalter.bsky.social","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\/semaine-pixels-18-novembre-2016\/","url":"https:\/\/stephaniewalter.design\/fr\/blog\/semaine-pixels-18-novembre-2016\/","name":"La semaine en pixels \u2013 18 novembre 2016 - par St\u00e9phanie Walter - UX Researcher & Designer","isPartOf":{"@id":"https:\/\/stephaniewalter.design\/fr\/#website"},"primaryImageOfPage":{"@id":"https:\/\/stephaniewalter.design\/fr\/blog\/semaine-pixels-18-novembre-2016\/#primaryimage"},"image":{"@id":"https:\/\/stephaniewalter.design\/fr\/blog\/semaine-pixels-18-novembre-2016\/#primaryimage"},"thumbnailUrl":"https:\/\/stephaniewalter.design\/fr\/files\/2016\/11\/liensemaine-18octobre.jpg","datePublished":"2016-11-18T09:51:48+00:00","dateModified":"2016-11-21T10:28:23+00:00","author":{"@id":"https:\/\/stephaniewalter.design\/fr\/#\/schema\/person\/643a9e5afcb1e550b6f4dca290fbf4cf"},"description":"A ne pas manquer:\u00a0modales de confirmation, alternatives au burger menu, design de slides de pr\u00e9sentation, formulaires mobile, couleurs, animations et illustrations en webdesign, afficher le mot de passe de formulaire, flexbox et CSS grids, outils d'accessibilit\u00e9","inLanguage":"fr-FR","potentialAction":[{"@type":"ReadAction","target":["https:\/\/stephaniewalter.design\/fr\/blog\/semaine-pixels-18-novembre-2016\/"]}]},{"@type":"ImageObject","inLanguage":"fr-FR","@id":"https:\/\/stephaniewalter.design\/fr\/blog\/semaine-pixels-18-novembre-2016\/#primaryimage","url":"https:\/\/stephaniewalter.design\/fr\/files\/2016\/11\/liensemaine-18octobre.jpg","contentUrl":"https:\/\/stephaniewalter.design\/fr\/files\/2016\/11\/liensemaine-18octobre.jpg","width":850,"height":350,"caption":"La semaine en pixels \u2013 18 octobre 2016"},{"@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":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"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\/2bc37c927707e853de94250cad44e4ffc13bee34ad9eda7a69651ca5ee19948b?s=96&d=retro&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/2bc37c927707e853de94250cad44e4ffc13bee34ad9eda7a69651ca5ee19948b?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\/https:\/\/bsky.app\/profile\/stephaniewalter.bsky.social"]}]}},"acf":[],"_links":{"self":[{"href":"https:\/\/stephaniewalter.design\/fr\/wp-json\/wp\/v2\/posts\/5941","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=5941"}],"version-history":[{"count":0,"href":"https:\/\/stephaniewalter.design\/fr\/wp-json\/wp\/v2\/posts\/5941\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/stephaniewalter.design\/fr\/wp-json\/wp\/v2\/media\/5931"}],"wp:attachment":[{"href":"https:\/\/stephaniewalter.design\/fr\/wp-json\/wp\/v2\/media?parent=5941"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/stephaniewalter.design\/fr\/wp-json\/wp\/v2\/categories?post=5941"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/stephaniewalter.design\/fr\/wp-json\/wp\/v2\/tags?post=5941"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}