Coconception

Design

Tout le monde se ressemble

Design éthique

Le design doit être profitable à tous les utilsateurs. Il ne doit pas répondre à un modèle économique de la captation de l'attention rendant profitable la consommation continue de contenus.

En aucun cas, le design ne doit tromper l'utilisateur.

Ecodesign & philosophie low-tech

Favoriser un design simple, épuré, adapté au web sur tous types de terminal, va dans le sens de la sobriété.

La plupart des thèmes clés en main disponible pour les principaux CMS privilégient l'esthétique et la richesse fonctionnelle au détriment de l'efficience, de l'accessibilité, et de l'écoconception.

Esthétique

Le site web sont de plus en plus complexes à concevoir, les règles d'ergonomie, d'accessibilité et de compatibilité multi-écrans forcent les concepteurs et les designers à utiliser des bibliothèques de logiciel ou des modèles de template prêtes à l'emploi, très souvent maintenu par les monopoles de la Silicon Valley.

Les contraintes environnementales ne facilitent pas non plus la recherche de la singularité.

De ce point de vue le site cheminement.io est un parfait exemple.

En dépendant des modèles pour créer le Web, nous envoyons un message sur notre moment actuel: celui-ci est dominé par le contrôle de l'entreprise, nos propres préférences individuelles et sensibilités esthétiques influencées par la commodité et la conformité.

Animations

Les animations sont consommatrices d'énergie et leur fonctionnellement le plus souvent inutile. Dans un souci de sobriété, elles sont à éviter.

Voir aussi

Contraintes techniques du web-design, concevoir graphiquement un site web

Albums

{"item_0":{"type":"breadcrump","online":1,"paddingTop":"20","paddingBottom":"20","paddingLeft":"20","paddingRight":"20","backgroundColor":"#FFFFFF","sectionColor":"#EEEEEE","param_selector":"#view-params"},"item_1":{"type":"h1","online":1,"paddingTop":"20","paddingBottom":"20","paddingLeft":"20","paddingRight":"20","backgroundColor":"#FFFFFF","sectionColor":"#EEEEEE","param_selector":"#view-params"},"item_2":{"type":"text","value":"\u003Ch5\u003EDesign \u00e9thique\u003C\/h5\u003E\u003Cp\u003ELe design doit \u00eatre profitable \u00e0 tous les utilsateurs. Il ne doit pas r\u00e9pondre \u00e0 un mod\u00e8le \u00e9conomique de la captation de l'attention rendant profitable la consommation continue de contenus.\u003C\/p\u003E\u003Cp\u003EEn aucun cas, le design ne doit tromper l'utilisateur.\u003C\/p\u003E","backgroundColor":"transparent","online":1,"paddingTop":"20","paddingBottom":"20","paddingLeft":"20","paddingRight":"20","sectionColor":"#EEEEEE","section-id":"","param_selector":"#view-params"},"item_3":{"type":"text","value":"\u003Ch5\u003EEcodesign & philosophie low-tech\u003C\/h5\u003E\u003Cp\u003E\u003Cstrong\u003EFavoriser un design simple, \u00e9pur\u00e9, adapt\u00e9 au web sur tous types de terminal, va dans le sens de la sobri\u00e9t\u00e9.\u003C\/strong\u003E\u003C\/p\u003E\u003Cp\u003E\u003Cbr\u003E\u003C\/p\u003E\u003Cp\u003ELa plupart des th\u00e8mes cl\u00e9s en main disponible pour les principaux CMS privil\u00e9gient l'esth\u00e9tique et la richesse fonctionnelle au d\u00e9triment de l'efficience, de l'accessibilit\u00e9, et de l'\u00e9coconception.\u003C\/p\u003E","backgroundColor":"transparent","online":1,"paddingTop":"20","paddingBottom":"20","paddingLeft":"20","paddingRight":"20","sectionColor":"#EEEEEE","section-id":"","param_selector":"#view-params"},"item_4":{"type":"text","value":"\u003Ch5\u003EEsth\u00e9tique\u003C\/h5\u003E\u003Cp\u003ELe site web sont de plus en plus complexes \u00e0 concevoir, les r\u00e8gles d'ergonomie, d'accessibilit\u00e9 et de compatibilit\u00e9 multi-\u00e9crans forcent les concepteurs et les designers \u00e0 utiliser des biblioth\u00e8ques de logiciel ou des mod\u00e8les de template pr\u00eates \u00e0 l'emploi, tr\u00e8s souvent maintenu par les monopoles de la Silicon Valley.\u003C\/p\u003E\u003Cp\u003E\u003Cbr\u003E\u003C\/p\u003E\u003Cp\u003ELes contraintes environnementales ne facilitent pas non plus la recherche de la singularit\u00e9.\u003C\/p\u003E\u003Cp\u003E\u003Cbr\u003E\u003C\/p\u003E\u003Cp\u003E\u003Cstrong\u003EDe ce point de vue le site cheminement.io est un parfait exemple. \u003C\/strong\u003E\u003C\/p\u003E\u003Cp\u003E\u003Cbr\u003E\u003C\/p\u003E\u003Cp\u003EEn d\u00e9pendant des mod\u00e8les pour cr\u00e9er le Web, nous envoyons un message sur notre moment actuel: celui-ci est domin\u00e9 par le contr\u00f4le de l'entreprise, nos propres pr\u00e9f\u00e9rences individuelles et sensibilit\u00e9s esth\u00e9tiques influenc\u00e9es par la commodit\u00e9 et la conformit\u00e9.\u003C\/p\u003E","backgroundColor":"transparent","online":1,"paddingTop":"20","paddingBottom":"20","paddingLeft":"20","paddingRight":"20","sectionColor":"#EEEEEE","section-id":"","param_selector":"#view-params"},"item_5":{"type":"text","value":"\u003Ch5\u003EAnimations\u003C\/h5\u003E\u003Cp\u003ELes animations sont consommatrices d'\u00e9nergie et leur fonctionnellement le plus souvent inutile. Dans un souci de sobri\u00e9t\u00e9, elles sont \u00e0 \u00e9viter.\u003C\/p\u003E\u003Cp\u003E\u003Cbr\u003E\u003C\/p\u003E","backgroundColor":"transparent","online":1,"paddingTop":"20","paddingBottom":"20","paddingLeft":"20","paddingRight":"20","sectionColor":"#eeeeee","section-id":"","param_selector":"#view-params"},"item_6":{"type":"separator","online":1,"paddingTop":"20","paddingBottom":"20","paddingLeft":"20","paddingRight":"20","backgroundColor":"#c2c2c2","sectionColor":"#EEEEEE","height":1,"fullwidth":"1","param_selector":"#view-params"},"item_7":{"type":"line","items":[{"id":"83","table":"page","label":"Comprendre les contraintes techniques du web-design, concevoir graphiquement un site web","preview":"0","edit_url":"\/extra\/site\/page\/edit\/","titre":"Comprendre les contraintes techniques du web-design, concevoir graphiquement un site web","item_id":0,"param_selector":"#view-params","online":1,"paddingTop":"20","paddingBottom":"20","paddingLeft":"20","paddingRight":"20","backgroundColor":"#FFFFFF","sectionColor":"#EEEEEE","type":"bloc","size":4,"link":"\/fr\/services\/education-populaire\/ateliers-formations\/comprendre-les-contraintes-techniques-du-web-design","data":{"children":[],"parent":null,"rank":1,"label":"Contraintes techniques du web-design, concevoir graphiquement un site web","icone":"","hidden":0,"depth":0,"statut":"ALL","login":"LOGIN","versions":{"title_fr":"Contraintes techniques du web-design, concevoir graphiquement un site web","slug_fr":"comprendre-les-contraintes-techniques-du-web-design","description_fr":"Comprendre les contraintes, les enjeux graphiques et ergonomiques d'un site Internet","tags_fr":"D\u00e9veloppement,Design,Conception","template_lang_fr":"{\u0022item_0\u0022:{\u0022type\u0022:\u0022breadcrump\u0022,\u0022online\u0022:1,\u0022paddingTop\u0022:\u002220\u0022,\u0022paddingBottom\u0022:\u002220\u0022,\u0022paddingLeft\u0022:\u002220\u0022,\u0022paddingRight\u0022:\u002220\u0022,\u0022backgroundColor\u0022:\u0022#FFFFFF\u0022,\u0022sectionColor\u0022:\u0022#EEEEEE\u0022},\u0022item_1\u0022:{\u0022type\u0022:\u0022h1\u0022,\u0022online\u0022:1,\u0022paddingTop\u0022:\u002220\u0022,\u0022paddingBottom\u0022:\u002220\u0022,\u0022paddingLeft\u0022:\u002220\u0022,\u0022paddingRight\u0022:\u002220\u0022,\u0022backgroundColor\u0022:\u0022#FFFFFF\u0022,\u0022sectionColor\u0022:\u0022#EEEEEE\u0022},\u0022item_2\u0022:{\u0022type\u0022:\u0022text\u0022,\u0022value\u0022:\u0022\u003Cp\u003E\u003Cem style=\\\u0022background-color: transparent; color: rgb(0, 0, 0);\\\u0022\u003EComprendre les principes du d\u00e9veloppement informatique permet de rendre tangible notre d\u00e9pendance aveugle et inconsciente envers les personnes qui savent coder.\u003C\/em\u003E\u003C\/p\u003E\u003Cp\u003E\u003Cbr\u003E\u003C\/p\u003E\u003Cp\u003E\u003Cspan style=\\\u0022background-color: transparent; color: rgb(0, 0, 0);\\\u0022\u003ECet atelier a pour but de faire comprendre aux cr\u00e9ateurs visuels (graphistes, artistes plasticiens) les contraintes graphiques d\u2019un site Internet en leur proposant une initiation au d\u00e9veloppement HTML \/ CSS \/ Javascript. \u003C\/span\u003E\u003C\/p\u003E\u0022,\u0022backgroundColor\u0022:\u0022transparent\u0022,\u0022online\u0022:1,\u0022paddingTop\u0022:\u002220\u0022,\u0022paddingBottom\u0022:\u002220\u0022,\u0022paddingLeft\u0022:\u002220\u0022,\u0022paddingRight\u0022:\u002220\u0022,\u0022sectionColor\u0022:\u0022#EEEEEE\u0022,\u0022section-id\u0022:\u0022\u0022},\u0022item_3\u0022:{\u0022type\u0022:\u0022separator\u0022,\u0022online\u0022:1,\u0022paddingTop\u0022:\u00220\u0022,\u0022paddingBottom\u0022:\u00220\u0022,\u0022paddingLeft\u0022:\u002220\u0022,\u0022paddingRight\u0022:\u002220\u0022,\u0022backgroundColor\u0022:\u0022#9c9c9c\u0022,\u0022sectionColor\u0022:\u0022transparent\u0022,\u0022height\u0022:\u00221\u0022,\u0022fullwidth\u0022:\u00221\u0022},\u0022item_4\u0022:{\u0022type\u0022:\u0022text\u0022,\u0022value\u0022:\u0022\u003Ch5\u003E\u003Cspan style=\\\u0022color: rgb(67, 67, 67); background-color: transparent;\\\u0022\u003EPHILOSOPHIE DE L\u2019ATELIER\u003C\/span\u003E\u003C\/h5\u003E\u003Cp\u003E\u003Cspan style=\\\u0022color: rgb(0, 0, 0); background-color: transparent;\\\u0022\u003EL\u2019atelier ne se pr\u00e9sente pas comme une formation cl\u00e9 en main avec un formateur sachant et des \u00e9l\u00e8ves. Les participant.s.es sont invit\u00e9.s.es \u00e0 co-produire le contenu. Ils.elles con\u00e7oivent eux-m\u00eames des parties du programme \u00e0 travers les notions qu\u2019ils.elles souhaitent aborder et les questionnements li\u00e9s \u00e0 leurs projets et leurs pratiques.\u003C\/span\u003E\u003C\/p\u003E\u0022,\u0022backgroundColor\u0022:\u0022transparent\u0022,\u0022online\u0022:1,\u0022paddingTop\u0022:\u002220\u0022,\u0022paddingBottom\u0022:\u002220\u0022,\u0022paddingLeft\u0022:\u002220\u0022,\u0022paddingRight\u0022:\u002220\u0022,\u0022sectionColor\u0022:\u0022#EEEEEE\u0022,\u0022section-id\u0022:\u0022Philosophie\u0022},\u0022item_5\u0022:{\u0022type\u0022:\u0022separator\u0022,\u0022online\u0022:1,\u0022paddingTop\u0022:\u00220\u0022,\u0022paddingBottom\u0022:\u00220\u0022,\u0022paddingLeft\u0022:\u002220\u0022,\u0022paddingRight\u0022:\u002220\u0022,\u0022backgroundColor\u0022:\u0022#9c9c9c\u0022,\u0022sectionColor\u0022:\u0022transparent\u0022,\u0022height\u0022:\u00221\u0022,\u0022fullwidth\u0022:\u00220\u0022},\u0022item_6\u0022:{\u0022type\u0022:\u0022text\u0022,\u0022value\u0022:\u0022\u003Ch5\u003E\u003Cspan style=\\\u0022background-color: transparent; color: rgb(67, 67, 67);\\\u0022\u003EINFORMATIONS PRATIQUES\u003C\/span\u003E\u003C\/h5\u003E\u003Cp\u003E\u003Cstrong style=\\\u0022background-color: transparent; color: rgb(0, 0, 0);\\\u0022\u003EDur\u00e9e\u003C\/strong\u003E\u003Cspan style=\\\u0022background-color: transparent; color: rgb(0, 0, 0);\\\u0022\u003E : 30 heures\u003C\/span\u003E\u003C\/p\u003E\u003Cp\u003E\u003Cstrong style=\\\u0022background-color: transparent; color: rgb(0, 0, 0);\\\u0022\u003EDate\u003C\/strong\u003E\u003Cspan style=\\\u0022background-color: transparent; color: rgb(0, 0, 0);\\\u0022\u003E : 5 jours, selon les disponibilit\u00e9s des participants\u003C\/span\u003E\u003C\/p\u003E\u003Cp\u003E\u003Cstrong style=\\\u0022background-color: transparent; color: rgb(0, 0, 0);\\\u0022\u003EHoraires \u003C\/strong\u003E\u003Cspan style=\\\u0022background-color: transparent; color: rgb(0, 0, 0);\\\u0022\u003E: 9H30 \u00e0 12H30 - 14H \u00e0 17H\u003C\/span\u003E\u003C\/p\u003E\u003Cp\u003E\u003Cstrong style=\\\u0022background-color: transparent; color: rgb(0, 0, 0);\\\u0022\u003ECo\u00fbt : \u003C\/strong\u003E\u003Cspan style=\\\u0022background-color: transparent; color: rgb(0, 0, 0);\\\u0022\u003E300 euros : prix conseill\u00e9 minimum par participant\u003C\/span\u003E\u003C\/p\u003E\u003Cp\u003E\u003Cstrong style=\\\u0022background-color: transparent; color: rgb(0, 0, 0);\\\u0022\u003EEffectif\u003C\/strong\u003E\u003Cspan style=\\\u0022background-color: transparent; color: rgb(0, 0, 0);\\\u0022\u003E : 5 participants minimum, 10 participants maximum\u003C\/span\u003E\u003C\/p\u003E\u003Cp\u003E\u003Cstrong style=\\\u0022background-color: transparent; color: rgb(0, 0, 0);\\\u0022\u003ELieu : \u003C\/strong\u003EUn Lieu Pour Respirer, 15 rue Chassagnolle 93260 - Les Lilas\u003C\/p\u003E\u0022,\u0022backgroundColor\u0022:\u0022transparent\u0022,\u0022online\u0022:1,\u0022paddingTop\u0022:\u002220\u0022,\u0022paddingBottom\u0022:\u002220\u0022,\u0022paddingLeft\u0022:\u002220\u0022,\u0022paddingRight\u0022:\u002220\u0022,\u0022sectionColor\u0022:\u0022#EEEEEE\u0022,\u0022section-id\u0022:\u0022Informations pratiques\u0022},\u0022item_7\u0022:{\u0022type\u0022:\u0022separator\u0022,\u0022online\u0022:1,\u0022paddingTop\u0022:\u00220\u0022,\u0022paddingBottom\u0022:\u00220\u0022,\u0022paddingLeft\u0022:\u002220\u0022,\u0022paddingRight\u0022:\u002220\u0022,\u0022backgroundColor\u0022:\u0022#9c9c9c\u0022,\u0022sectionColor\u0022:\u0022transparent\u0022,\u0022height\u0022:\u00221\u0022,\u0022fullwidth\u0022:\u00220\u0022},\u0022item_8\u0022:{\u0022type\u0022:\u0022text\u0022,\u0022value\u0022:\u0022\u003Ch5\u003E\u003Cspan style=\\\u0022color: rgb(67, 67, 67); background-color: transparent;\\\u0022\u003EPUBLICS\u003C\/span\u003E\u003C\/h5\u003E\u003Cp\u003E\u003Cspan style=\\\u0022color: rgb(0, 0, 0); background-color: transparent;\\\u0022\u003EL\u2019atelier s\u2019adresse aux graphistes ayant une culture visuel du print souhaitant se familiariser avec les contraintes des sites web et aux artistes plasticiens cherchant \u00e0 utiliser l\u2019internet dans leur pratique ou souhaitant simplement pr\u00e9senter leurs projets.\u003C\/span\u003E\u003C\/p\u003E\u0022,\u0022backgroundColor\u0022:\u0022transparent\u0022,\u0022online\u0022:1,\u0022paddingTop\u0022:\u002220\u0022,\u0022paddingBottom\u0022:\u002220\u0022,\u0022paddingLeft\u0022:\u002220\u0022,\u0022paddingRight\u0022:\u002220\u0022,\u0022sectionColor\u0022:\u0022#EEEEEE\u0022,\u0022section-id\u0022:\u0022Publics\u0022},\u0022item_9\u0022:{\u0022type\u0022:\u0022separator\u0022,\u0022online\u0022:1,\u0022paddingTop\u0022:\u00220\u0022,\u0022paddingBottom\u0022:\u00220\u0022,\u0022paddingLeft\u0022:\u002220\u0022,\u0022paddingRight\u0022:\u002220\u0022,\u0022backgroundColor\u0022:\u0022#9c9c9c\u0022,\u0022sectionColor\u0022:\u0022transparent\u0022,\u0022height\u0022:\u00221\u0022,\u0022fullwidth\u0022:\u00220\u0022},\u0022item_10\u0022:{\u0022type\u0022:\u0022text\u0022,\u0022value\u0022:\u0022\u003Ch5\u003E\u003Cspan style=\\\u0022background-color: transparent; color: rgb(67, 67, 67);\\\u0022\u003EPR\u00c9REQUIS\u003C\/span\u003E\u003C\/h5\u003E\u003Cp\u003E\u003Cspan style=\\\u0022background-color: transparent; color: rgb(0, 0, 0);\\\u0022\u003EL\u2019atelier n\u00e9cessite l\u2019utilisation d\u2019un ordinateur, il est conseill\u00e9 d\u2019apporter une machine personnelle disposant de Google Chrome ou Firefox et d\u2019un logiciel de FTP (Filezila ou \u00e9quivalent), un smartphone.\u003C\/span\u003E\u003C\/p\u003E\u0022,\u0022backgroundColor\u0022:\u0022transparent\u0022,\u0022online\u0022:1,\u0022paddingTop\u0022:\u002220\u0022,\u0022paddingBottom\u0022:\u002220\u0022,\u0022paddingLeft\u0022:\u002220\u0022,\u0022paddingRight\u0022:\u002220\u0022,\u0022sectionColor\u0022:\u0022#EEEEEE\u0022,\u0022section-id\u0022:\u0022Pr\u00e9requis\u0022},\u0022item_11\u0022:{\u0022type\u0022:\u0022separator\u0022,\u0022online\u0022:1,\u0022paddingTop\u0022:\u00220\u0022,\u0022paddingBottom\u0022:\u00220\u0022,\u0022paddingLeft\u0022:\u002220\u0022,\u0022paddingRight\u0022:\u002220\u0022,\u0022backgroundColor\u0022:\u0022#9c9c9c\u0022,\u0022sectionColor\u0022:\u0022transparent\u0022,\u0022height\u0022:\u00221\u0022,\u0022fullwidth\u0022:\u00221\u0022},\u0022item_12\u0022:{\u0022type\u0022:\u0022text\u0022,\u0022value\u0022:\u0022\u003Ch5\u003E\u003Cspan style=\\\u0022color: rgb(67, 67, 67); background-color: transparent;\\\u0022\u003EOBJECTIFS \u003C\/span\u003E\u003C\/h5\u003E\u003Cp\u003E\u003Cspan style=\\\u0022color: rgb(0, 0, 0); background-color: transparent;\\\u0022\u003EA l\u2019issue de l\u2019atelier, les participants comprennent les principes fondamentaux de la programmation d\u2019un site Internet, ils sont capables de concevoir graphiquement un site prenant en compte les contraintes techniques li\u00e9es au HTML et celles li\u00e9es au multi-\u00e9cran. Ces connaissances leur permettront de collaborer avec des d\u00e9veloppeurs et seront un premier pas vers plus d\u2019autonomie technique.\u003C\/span\u003E\u003C\/p\u003E\u0022,\u0022backgroundColor\u0022:\u0022transparent\u0022,\u0022online\u0022:1,\u0022paddingTop\u0022:\u002220\u0022,\u0022paddingBottom\u0022:\u002220\u0022,\u0022paddingLeft\u0022:\u002220\u0022,\u0022paddingRight\u0022:\u002220\u0022,\u0022sectionColor\u0022:\u0022#EEEEEE\u0022,\u0022section-id\u0022:\u0022Objectif\u0022},\u0022item_13\u0022:{\u0022type\u0022:\u0022separator\u0022,\u0022online\u0022:1,\u0022paddingTop\u0022:\u00220\u0022,\u0022paddingBottom\u0022:\u00220\u0022,\u0022paddingLeft\u0022:\u002220\u0022,\u0022paddingRight\u0022:\u002220\u0022,\u0022backgroundColor\u0022:\u0022#9c9c9c\u0022,\u0022sectionColor\u0022:\u0022transparent\u0022,\u0022height\u0022:\u00221\u0022,\u0022fullwidth\u0022:\u00221\u0022},\u0022item_14\u0022:{\u0022type\u0022:\u0022text\u0022,\u0022value\u0022:\u0022\u003Ch5\u003E\u003Cspan style=\\\u0022background-color: transparent; color: rgb(67, 67, 67);\\\u0022\u003EPROGRAMME\u003C\/span\u003E\u003C\/h5\u003E\u003Cp\u003E\u003Cspan style=\\\u0022background-color: transparent; color: rgb(0, 0, 0);\\\u0022\u003ELe programme doit \u00e9voluer en fonction des souhaits et des savoirs de chaque participant.e. Une premi\u00e8re session de travail entre les participant.s.es et le formateur a pour but de d\u00e9terminer plus pr\u00e9cis\u00e9ment son contenu.\u003C\/span\u003E\u003C\/p\u003E\u003Cp\u003E\u003Cbr\u003E\u003C\/p\u003E\u003Cp\u003E\u003Cstrong style=\\\u0022background-color: transparent; color: rgb(0, 0, 0);\\\u0022\u003EJOUR 1\u003C\/strong\u003E\u003Cspan style=\\\u0022background-color: transparent; color: rgb(0, 0, 0);\\\u0022\u003E : Introduction, co-conception du programme. Historique et principaux concepts du web, les outils de d\u00e9veloppement\u003C\/span\u003E\u003C\/p\u003E\u003Cp\u003E\u003Cstrong style=\\\u0022background-color: transparent; color: rgb(0, 0, 0);\\\u0022\u003EJOUR 2\u003C\/strong\u003E\u003Cspan style=\\\u0022background-color: transparent; color: rgb(0, 0, 0);\\\u0022\u003E : Comprendre le HTML\/CSS, une initiation \u00e0 la programmation orient\u00e9e visuelle\u003C\/span\u003E\u003C\/p\u003E\u003Cp\u003E\u003Cstrong style=\\\u0022background-color: transparent; color: rgb(0, 0, 0);\\\u0022\u003EJOUR 3\u003C\/strong\u003E\u003Cspan style=\\\u0022background-color: transparent; color: rgb(0, 0, 0);\\\u0022\u003E : La conception graphique d\u2019un site web, ergonomie vs design, \u003C\/span\u003E\u003C\/p\u003E\u003Cp\u003E\u003Cstrong style=\\\u0022background-color: transparent; color: rgb(0, 0, 0);\\\u0022\u003EJOUR 4\u003C\/strong\u003E\u003Cspan style=\\\u0022background-color: transparent; color: rgb(0, 0, 0);\\\u0022\u003E : Programmer du design et de l\u2019interaction, initiation au javascript, d\u00e9couverte de biblioth\u00e8ques de code orient\u00e9 animation et design\u003C\/span\u003E\u003C\/p\u003E\u003Cp\u003E\u003Cstrong style=\\\u0022background-color: transparent; color: rgb(0, 0, 0);\\\u0022\u003EJOUR 5\u003C\/strong\u003E\u003Cspan style=\\\u0022background-color: transparent; color: rgb(0, 0, 0);\\\u0022\u003E : Ethique, co-conception, \u00e9co-conception d\u2019un site web\u003C\/span\u003E\u003C\/p\u003E\u0022,\u0022backgroundColor\u0022:\u0022transparent\u0022,\u0022online\u0022:1,\u0022paddingTop\u0022:\u00220\u0022,\u0022paddingBottom\u0022:\u00220\u0022,\u0022paddingLeft\u0022:\u002220\u0022,\u0022paddingRight\u0022:\u002220\u0022,\u0022sectionColor\u0022:\u0022transparent\u0022,\u0022section-id\u0022:\u0022Programme\u0022},\u0022item_15\u0022:{\u0022type\u0022:\u0022separator\u0022,\u0022online\u0022:1,\u0022paddingTop\u0022:\u00220\u0022,\u0022paddingBottom\u0022:\u00220\u0022,\u0022paddingLeft\u0022:\u002220\u0022,\u0022paddingRight\u0022:\u002220\u0022,\u0022backgroundColor\u0022:\u0022#9c9c9c\u0022,\u0022sectionColor\u0022:\u0022transparent\u0022,\u0022height\u0022:\u00221\u0022,\u0022fullwidth\u0022:\u00221\u0022},\u0022item_16\u0022:{\u0022type\u0022:\u0022line\u0022,\u0022items\u0022:[{\u0022id\u0022:\u002216\u0022,\u0022table\u0022:\u0022personne\u0022,\u0022label\u0022:\u0022J\u00e9r\u00f4me Sullerot\u0022,\u0022preview\u0022:\u00220\u0022,\u0022edit_url\u0022:\u0022\/extra\/data\/personne\/edit\/\u0022,\u0022titre\u0022:\u0022J\u00e9r\u00f4me Sullerot\u0022,\u0022item_id\u0022:0,\u0022online\u0022:1,\u0022paddingTop\u0022:\u002220\u0022,\u0022paddingBottom\u0022:\u002220\u0022,\u0022paddingLeft\u0022:\u002220\u0022,\u0022paddingRight\u0022:\u002220\u0022,\u0022backgroundColor\u0022:\u0022#FFFFFF\u0022,\u0022sectionColor\u0022:\u0022#EEEEEE\u0022,\u0022type\u0022:\u0022bloc\u0022,\u0022size\u0022:4}],\u0022online\u0022:1,\u0022paddingTop\u0022:\u002220\u0022,\u0022paddingBottom\u0022:\u002220\u0022,\u0022paddingLeft\u0022:\u002220\u0022,\u0022paddingRight\u0022:\u002220\u0022,\u0022backgroundColor\u0022:\u0022#FFFFFF\u0022,\u0022sectionColor\u0022:\u0022transparent\u0022,\u0022label\u0022:\u0022L'intervenant\u0022,\u0022chapeau\u0022:\u0022\u0022},\u0022item_17\u0022:{\u0022type\u0022:\u0022data\u0022,\u0022online\u0022:1,\u0022paddingTop\u0022:\u002220\u0022,\u0022paddingBottom\u0022:\u002220\u0022,\u0022paddingLeft\u0022:\u002220\u0022,\u0022paddingRight\u0022:\u002220\u0022,\u0022backgroundColor\u0022:\u0022#FFFFFF\u0022,\u0022sectionColor\u0022:\u0022#EEEEEE\u0022,\u0022table\u0022:\u0022personne\u0022,\u0022data_id\u0022:\u0022\u0022}}","options_lang_fr":"","id":"83"},"template":"free","photo_id":0,"preview":"0","controller":"","options":"","attach":"","droits":"pottiok","popin":0,"background":"","slug":"comprendre-les-contraintes-techniques-du-web-design","description":"","URL":"\/fr\/services\/education-populaire\/ateliers-formations\/comprendre-les-contraintes-techniques-du-web-design","commentable":"0","nbComments":0,"comments":[],"main_entity_table":"","main_entity_id":"0","a":null,"p":null,"title":"","params":[],"deletable":"0","has_page":"1","date_online":"2020-06-08 15:32:43","date_offline":"0000-00-00 00:00:00","online":"1","erreurs":[],"id":"83","created":"2020-06-08 15:32:34","created_id":"1","updated":"2021-06-13 12:28:25","updated_id":"1","deleted":"0","table":null,"created_label":null,"updated_label":null,"properties":[],"origine":"BACK","created_user":null,"client_id":null,"_table":null}},{"id":"121","table":"page","label":"Albums","preview":"52","edit_url":"\/extra\/site\/page\/edit\/","titre":"Albums","link":"\/fr\/communs\/ressources\/albums","data":{"children":[],"parent":null,"rank":1,"label":"Albums","icone":"","hidden":0,"depth":0,"statut":"ALL","login":"LOGIN","versions":{"title_fr":"Albums","slug_fr":"albums","description_fr":"","tags_fr":"","template_lang_fr":"{\u0022item_0\u0022:{\u0022type\u0022:\u0022breadcrump\u0022,\u0022online\u0022:1,\u0022paddingTop\u0022:\u002220\u0022,\u0022paddingBottom\u0022:\u002220\u0022,\u0022paddingLeft\u0022:\u002220\u0022,\u0022paddingRight\u0022:\u002220\u0022,\u0022backgroundColor\u0022:\u0022#FFFFFF\u0022,\u0022sectionColor\u0022:\u0022#EEEEEE\u0022},\u0022item_1\u0022:{\u0022type\u0022:\u0022h1\u0022,\u0022online\u0022:1,\u0022paddingTop\u0022:\u002220\u0022,\u0022paddingBottom\u0022:\u002220\u0022,\u0022paddingLeft\u0022:\u002220\u0022,\u0022paddingRight\u0022:\u002220\u0022,\u0022backgroundColor\u0022:\u0022#FFFFFF\u0022,\u0022sectionColor\u0022:\u0022#EEEEEE\u0022}}","options_lang_fr":"","id":"121"},"template":"albums","photo_id":0,"preview":"52","controller":"","options":"","attach":"","droits":"pottiok","popin":0,"background":"","slug":"albums","description":"","URL":"\/fr\/communs\/ressources\/albums","commentable":"0","nbComments":0,"comments":[],"main_entity_table":"","main_entity_id":"0","a":null,"p":null,"title":"","params":[],"deletable":"0","has_page":"1","date_online":"0000-00-00 00:00:00","date_offline":"0000-00-00 00:00:00","online":"1","erreurs":[],"id":"121","created":"2020-07-01 17:23:25","created_id":"1","updated":"2021-06-13 07:44:07","updated_id":"1","deleted":"0","table":null,"created_label":null,"updated_label":null,"properties":[],"origine":"BACK","created_user":null,"client_id":null,"_table":null}}],"online":1,"paddingTop":"20","paddingBottom":"20","paddingLeft":"20","paddingRight":"20","backgroundColor":"#FFFFFF","sectionColor":"#EEEEEE","label":"Voir aussi","chapeau":"","param_selector":"#view-params"}}

{"login":0,"user":[],"HOST":"www.cheminement.io","HTTP":"https:\/\/","FRONT":"\/","showcookies":"1","cookies":[],"content_security":{"google_doc":{"name":"google drive","frame-src":"https:\/\/www.google.com","type":"divers"},"google_analytics":{"name":"google analytics","frame-src":"","type":"analytic"},"pottiok_analytics":{"name":"cheminement.io","frame-src":"self","type":"analytic"},"matomo":{"name":"matomo","type":"analytic"},"google_map":{"name":"google map","frame-src":"https:\/\/","type":"carte"},"vimeo":{"name":"vimeo","frame-src":"https:\/\/player.vimeo.com","type":"video"},"youtube":{"name":"youtube","frame-src":"https:\/\/www.youtube.com","type":"video"},"helloasso":{"name":"helloasso.com","frame-src":"https:\/\/helloasso.com","type":"divers"},"stripe":{"name":"stripe","frame-src":"https:\/\/js.stripe.com\/","type":"divers"},"livestorm":{"name":"livestorm","frame-src":"https:\/\/app.livestorm.com","type":"divers"},"facebook":{"name":"facebook","type":"social"},"twitter":{"name":"twitter","type":"social"},"linkedin":{"name":"linekedin","type":"social"}},"langue_slug":"fr","cookies_api":"\/fr\/gestion-des-cookies","cookies_message":"En poursuivant votre navigation sur ce site, vous acceptez l\u2019utilisation de Cookies ou autres traceurs.","dict":{"all":{"cookies_message":"En poursuivant votre navigation sur ce site, vous acceptez l\u2019utilisation de Cookies ou autres traceurs.","Gestion des cookies":"Gestion des cookies","Valider":"Valider","Annuler":"Annuler","J'accepte":"J'accepte","Je refuse":"Je refuse","Je configure":"Je configure","Enregistrer":"Enregistrer","Autoriser tout":"Autoriser tout","Pr\u00e9f\u00e9rences pour tous les services":"Pr\u00e9f\u00e9rences pour tous les services","Analyse de donn\u00e9es":"Analyse de donn\u00e9es","Services vid\u00e9os":"Services vid\u00e9os","cookies_data_mention":"Lorsque vous naviguez sur notre site internet, des informations sont susceptibles d'\u00eatre enregistr\u00e9es, ou lues, dans votre terminal, sous r\u00e9serve de vos choix.","cookies_social_mention":"Les r\u00e9seaux sociaux permettent d'am\u00e9liorer la convivialit\u00e9 du site et aident \u00e0 sa promotion via les partages.","R\u00e9seaux sociaux":"R\u00e9seaux sociaux","cookies_video_mention":"Les services de partage de vid\u00e9o permettent d'enrichir le site de contenu multim\u00e9dia et augmentent sa visibilit\u00e9.","cookies_map_mention":"Les services de cartographie permettent l\u2019affichage de cartes interactives.","Besoin d'un compte ?":"Besoin d'un compte ?","Cr\u00e9er un compte":"Cr\u00e9er un compte","Mot de passe":"Mot de passe","Identifiant":"Identifiant","Merci d'indiquer le r\u00e9sultat de ce calcul":"Merci d'indiquer le r\u00e9sultat de ce calcul","S'identifier":"S'identifier","Mot de passe oubli\u00e9 ?":"Mot de passe oubli\u00e9 ?","mon adresse email":"mon adresse email","Le formulaire comporte des erreurs":"Le formulaire comporte des erreurs","Vous \u00eates identifi\u00e9(e)":"Vous \u00eates identifi\u00e9(e)","Le r\u00e9sultat du calcul est faux.":"Le r\u00e9sultat du calcul est faux.","Identifiant invalide":"Identifiant invalide","Je ne suis pas un robot":"Je ne suis pas un robot","Saisir le r\u00e9sultat du calcul":"Saisir le r\u00e9sultat du calcul","Bonjour":"Bonjour","Se d\u00e9connecter":"Se d\u00e9connecter","Nom":"Nom","Pr\u00e9nom":"Pr\u00e9nom","Civilit\u00e9":"Civilit\u00e9","Adresse email":"Adresse email","Ville":"Ville","Code postal":"Code postal","Pays":"Pays","Ma photo de profil":"Ma photo de profil","Photo de profil":"Photo de profil","Vos donn\u00e9es sont bien au chaud sur le serveur.":"Vos donn\u00e9es sont bien au chaud sur le serveur.","J'ai d\u00e9j\u00e0 un compte.":"J'ai d\u00e9j\u00e0 un compte.","Je m'identifie.":"Je m'identifie.","Votre mot de passe":"Votre mot de passe","password-mention":"Pour des raisons de s\u00e9curit\u00e9, votre mot de passe doit comporter une majuscule, un chiffre et au moins 8 caract\u00e8res.","Je m'abonne \u00e0 la newsletter":"Je m'abonne \u00e0 la newsletter","form-mention":"Tous les champs marqu\u00e9s * sont obligatoires","J'ai pris connaissance des informations l\u00e9gales":"En cliquant sur le bouton \"Cr\u00e9er un compte\", vous d\u00e9clarez avoir pris connaissance des informations l\u00e9gales et de la politique de confidentialit\u00e9 du site"}},"selectedPage":"\/fr\/services\/coconception\/design","page_id":"108","site_mode":"APP","template":"free","global_api":"\/fr\/api","uploads":"\/uploads\/"}