{"id":594,"date":"2012-03-15T22:02:39","date_gmt":"2012-03-15T20:02:39","guid":{"rendered":"http:\/\/blog.stephaniewalter.fr\/?p=594"},"modified":"2014-03-31T21:13:29","modified_gmt":"2014-03-31T19:13:29","slug":"des-pixels-et-du-code-01","status":"publish","type":"post","link":"https:\/\/stephaniewalter.design\/fr\/blog\/des-pixels-et-du-code-01\/","title":{"rendered":"Des pixels et du code #01"},"content":{"rendered":"
Ce contenu a \u00e9t\u00e9 r\u00e9dig\u00e9 il y a 14 ans. Il se peut qu'il ne soit plus \u00e0 jour.<\/div>

Premi\u00e8re \u00e9dition, d\u2019une rubrique que je vais tenter de mettre \u00e0 jour, toutes les semaines, ou deux semaines.<\/p>\n

Ma premi\u00e8re id\u00e9e \u00e9tait de restructurer le blog, pour utiliser les \u201cformats\u201d de WordPress pour poster des liens courts comme sur twitter, mais avec un commentaire un peu plus long que 140 carract\u00e8res pour permettre de d\u00e9velopper un peu plus. Par manque de temps pour le moment (temps pour coder le format et le \u00a0template d\u00e9di\u00e9 WordPress), j\u2019ai d\u00e9cid\u00e9 de plut\u00f4t r\u00e9unir ces ressources sur une seule page, class\u00e9es par titre et cat\u00e9gories. Ce seront des ressources sympas et utiles, glan\u00e9es au courant de la semaine sur twitter et diff\u00e9rents r\u00e9seaux sociaux, li\u00e9es au Webdesign au sens large, \u00e0 savoir code, graphisme, de Photoshop \u00e0 CSS en passant par les frameworks, la mobilit\u00e9, etc.
\nVous y trouverez des ressources que vous risques d\u2019avoir d\u00e9j\u00e0 vu si vous me suivez sur twitter, mais j\u2019essaierai \u00e9galement d\u2019y ajouter d\u2019autres ressources. Sachez \u00e9galement que je fais ennormement de veille en anglais, donc il y a de fortes chances que 80% des articles au moins soient en anglais. Voici donc la toute premi\u00e8re \u00e9dition de \u201cdes pixels et du code\u201d<\/p>\n

#Ergonomie<\/h2>\n

Understanding the F-Layout in Web Design\u00a0<\/a> un article en anglais qui reprend les principes cl\u00e9s d’un layout en ergonomie qu’on appelle le \u00ab\u00a0F-layout\u00a0\u00bb.<\/p>\n

#Design<\/h2>\n

Principles for Successful Button Design\u00a0<\/a> 10 astuces pour r\u00e9ussir le design des boutons de son site ou interface web.<\/p>\n

Photoshopetiquette.com ,<\/a> un manifeste de 40 \u201cbonnes pratiques\u201d pour ses fichiers .PSD, du nommage aux calques en passant par le non destructif, les filtres et l’organisation de ses fichiers.<\/p>\n

#QueryMobile \/ #Selfpromotion (tant qu\u2019\u00e0 faire)<\/h2>\n

jQuery Mobile Tutorial: Creating a Restaurant Picker Web App <\/a>, mon tutoriel sur Noupe pour cr\u00e9er une mini application de choix de restaurant en jQueryMobile, du HTML au CSS et jQuery.<\/p>\n

#Typographie<\/h2>\n

WhatTheFont<\/a> : vous vous \u00eates toujours demand\u00e9 quelle \u00e9tait la police de tel ou tel logo, ce\u00a0 service qui va vous permettre de trouver cette police d’\u00e9criture \u00e0 partir d’une image.<\/p>\n

Fontomas<\/a> plusieurs librairies de font icons r\u00e9unies au m\u00eame endroit. Vous pourrez y cr\u00e9er vos propres sets d’icones avec celles dont vous avez besoin.<\/p>\n

#Apprentissage<\/h2>\n

Codecademy.com ,<\/a> le site pour apprendre \u00e0 coder en s’amusant, \u00e0 l’aide de petits exercices, explications et minis projets. C’est tr\u00e8s ludique et addictif, pour le moment sont disponibles des cours de JavaScript, mais d’autres cours sont \u00e0 venir.<\/p>\n

#Pour le fun<\/h2>\n

Seo-quotes.tumblr.com ,<\/a> un blog qui r\u00e9uni quelques citations de SEO, d\u00e9veloppeurs et webdesigners.<\/p>\n

#Mobile<\/h2>\n

\u201cNative vs Web is total bullshit\u201d<\/a> : ou pourquoi au final ce d\u00e9bat n\u2019a pas lieu d\u2019\u00eatre, le but \u00e9tant de choisir le bon outil pour le bon projet : \u201c Define a problem. Then solve that problem and decide on what channels make sense to carry out the solution.\u201d<\/p>\n

Lovelyui.com<\/a>\u00a0: une galeries de screenshots d\u2019applications mobiles et \u00e9l\u00e9ments d\u2019interface mobile class\u00e9s par cat\u00e9gories, pratique si vous \u00eates en manque d\u2019inspiration.<\/p>\n

#CSS<\/h2>\n

Une autre technique que le classe text-indent<\/a> : -9999px hack qui nous permet de replacer du texte par des images, ou cacher des liens d\u2019\u00e9vitement pour les screenreaders.<\/p>\n

#Logo<\/h2>\n

Le guide pratique \u00e0 l’usage des entreprises pour cr\u00e9er ou changer de logo,\u00a0 <\/a>une ressource utile pour les entreprises comme pour les designers qui cr\u00e9ent des logos, \u00e0 lire de toute urgence.<\/p>\n

C’est tout pour aujourd’hui, si vous avez d’autres liens sympas \u00e0 partager n’h\u00e9sitez pas \u00e0 laisser un petit mot dans les commentaires !<\/p>\n","protected":false},"excerpt":{"rendered":"

Ce contenu a \u00e9t\u00e9 r\u00e9dig\u00e9 il y a 14 ans. Il se peut qu’il ne soit plus \u00e0 jour.Premi\u00e8re \u00e9dition, d\u2019une rubrique que je vais tenter de mettre \u00e0 jour, toutes les semaines, ou deux semaines. Ma premi\u00e8re id\u00e9e \u00e9tait de restructurer le blog, pour utiliser les \u201cformats\u201d de WordPress pour poster des liens courts comme sur twitter, mais avec un commentaire un peu plus long que 140 carract\u00e8res pour permettre de d\u00e9velopper un peu plus. Par manque de temps …<\/p>\n","protected":false},"author":3,"featured_media":602,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"categories":[105],"tags":[],"class_list":["post-594","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-veille-liens-utiles"],"yoast_head":"\nDes pixels et du code #01 - par St\u00e9phanie Walter - UX Researcher & Designer<\/title>\n<meta name=\"description\" content=\"Typographie, jQueryMobile, ergonomie, mobilit\u00e9, webdesign et CSS : les liens utiles glan\u00e9s cette semaine sur twitter et les r\u00e9seaux sociaux.\" \/>\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\/des-pixels-et-du-code-01\/\" \/>\n<meta property=\"og:locale\" content=\"fr_FR\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Des pixels et du code #01 - par St\u00e9phanie Walter - UX Researcher & Designer\" \/>\n<meta property=\"og:description\" content=\"Typographie, jQueryMobile, ergonomie, mobilit\u00e9, webdesign et CSS : les liens utiles glan\u00e9s cette semaine sur twitter et les r\u00e9seaux sociaux.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/stephaniewalter.design\/fr\/blog\/des-pixels-et-du-code-01\/\" \/>\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=\"2012-03-15T20:02:39+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2014-03-31T19:13:29+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/stephaniewalter.design\/wp-content\/blogs.dir\/2\/files\/2012\/03\/pixeltcode1.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=\"@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\/des-pixels-et-du-code-01\/\",\"url\":\"https:\/\/stephaniewalter.design\/fr\/blog\/des-pixels-et-du-code-01\/\",\"name\":\"Des pixels et du code #01 - par St\u00e9phanie Walter - UX Researcher & Designer\",\"isPartOf\":{\"@id\":\"https:\/\/stephaniewalter.design\/fr\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/stephaniewalter.design\/fr\/blog\/des-pixels-et-du-code-01\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/stephaniewalter.design\/fr\/blog\/des-pixels-et-du-code-01\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/stephaniewalter.design\/fr\/files\/2012\/03\/pixeltcode1.jpg\",\"datePublished\":\"2012-03-15T20:02:39+00:00\",\"dateModified\":\"2014-03-31T19:13:29+00:00\",\"author\":{\"@id\":\"https:\/\/stephaniewalter.design\/fr\/#\/schema\/person\/643a9e5afcb1e550b6f4dca290fbf4cf\"},\"description\":\"Typographie, jQueryMobile, ergonomie, mobilit\u00e9, webdesign et CSS : les liens utiles glan\u00e9s cette semaine sur twitter et les r\u00e9seaux sociaux.\",\"inLanguage\":\"fr-FR\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/stephaniewalter.design\/fr\/blog\/des-pixels-et-du-code-01\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"fr-FR\",\"@id\":\"https:\/\/stephaniewalter.design\/fr\/blog\/des-pixels-et-du-code-01\/#primaryimage\",\"url\":\"https:\/\/stephaniewalter.design\/fr\/files\/2012\/03\/pixeltcode1.jpg\",\"contentUrl\":\"https:\/\/stephaniewalter.design\/fr\/files\/2012\/03\/pixeltcode1.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\":{\"@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\/3311148a94caa2e5ae146ff1cdf9aaf3a0127a7db0337d8c8cbbfc4a425cab0e?s=96&d=retro&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/3311148a94caa2e5ae146ff1cdf9aaf3a0127a7db0337d8c8cbbfc4a425cab0e?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":"Des pixels et du code #01 - par St\u00e9phanie Walter - UX Researcher & Designer","description":"Typographie, jQueryMobile, ergonomie, mobilit\u00e9, webdesign et CSS : les liens utiles glan\u00e9s cette semaine sur twitter et les r\u00e9seaux sociaux.","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\/des-pixels-et-du-code-01\/","og_locale":"fr_FR","og_type":"article","og_title":"Des pixels et du code #01 - par St\u00e9phanie Walter - UX Researcher & Designer","og_description":"Typographie, jQueryMobile, ergonomie, mobilit\u00e9, webdesign et CSS : les liens utiles glan\u00e9s cette semaine sur twitter et les r\u00e9seaux sociaux.","og_url":"https:\/\/stephaniewalter.design\/fr\/blog\/des-pixels-et-du-code-01\/","og_site_name":"St\u00e9phanie Walter - Senior UX designer, experte mobile, conf\u00e9rences et articles.","article_published_time":"2012-03-15T20:02:39+00:00","article_modified_time":"2014-03-31T19:13:29+00:00","og_image":[{"width":700,"height":200,"url":"https:\/\/stephaniewalter.design\/wp-content\/blogs.dir\/2\/files\/2012\/03\/pixeltcode1.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\/des-pixels-et-du-code-01\/","url":"https:\/\/stephaniewalter.design\/fr\/blog\/des-pixels-et-du-code-01\/","name":"Des pixels et du code #01 - par St\u00e9phanie Walter - UX Researcher & Designer","isPartOf":{"@id":"https:\/\/stephaniewalter.design\/fr\/#website"},"primaryImageOfPage":{"@id":"https:\/\/stephaniewalter.design\/fr\/blog\/des-pixels-et-du-code-01\/#primaryimage"},"image":{"@id":"https:\/\/stephaniewalter.design\/fr\/blog\/des-pixels-et-du-code-01\/#primaryimage"},"thumbnailUrl":"https:\/\/stephaniewalter.design\/fr\/files\/2012\/03\/pixeltcode1.jpg","datePublished":"2012-03-15T20:02:39+00:00","dateModified":"2014-03-31T19:13:29+00:00","author":{"@id":"https:\/\/stephaniewalter.design\/fr\/#\/schema\/person\/643a9e5afcb1e550b6f4dca290fbf4cf"},"description":"Typographie, jQueryMobile, ergonomie, mobilit\u00e9, webdesign et CSS : les liens utiles glan\u00e9s cette semaine sur twitter et les r\u00e9seaux sociaux.","inLanguage":"fr-FR","potentialAction":[{"@type":"ReadAction","target":["https:\/\/stephaniewalter.design\/fr\/blog\/des-pixels-et-du-code-01\/"]}]},{"@type":"ImageObject","inLanguage":"fr-FR","@id":"https:\/\/stephaniewalter.design\/fr\/blog\/des-pixels-et-du-code-01\/#primaryimage","url":"https:\/\/stephaniewalter.design\/fr\/files\/2012\/03\/pixeltcode1.jpg","contentUrl":"https:\/\/stephaniewalter.design\/fr\/files\/2012\/03\/pixeltcode1.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":{"@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\/3311148a94caa2e5ae146ff1cdf9aaf3a0127a7db0337d8c8cbbfc4a425cab0e?s=96&d=retro&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/3311148a94caa2e5ae146ff1cdf9aaf3a0127a7db0337d8c8cbbfc4a425cab0e?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\/594","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=594"}],"version-history":[{"count":0,"href":"https:\/\/stephaniewalter.design\/fr\/wp-json\/wp\/v2\/posts\/594\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/stephaniewalter.design\/fr\/wp-json\/wp\/v2\/media\/602"}],"wp:attachment":[{"href":"https:\/\/stephaniewalter.design\/fr\/wp-json\/wp\/v2\/media?parent=594"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/stephaniewalter.design\/fr\/wp-json\/wp\/v2\/categories?post=594"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/stephaniewalter.design\/fr\/wp-json\/wp\/v2\/tags?post=594"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}