


















































































































[{"content":"Certains projets débutent par une commande claire, d\u0026rsquo;autres par le sentiment diffus que quelque chose ne convient plus. Les deux sont de bons points de départ, à condition d\u0026rsquo;accepter de regarder les choses en face. Dans ces cas-là, nous posons d\u0026rsquo;abord les questions qui dérangent : qu\u0026rsquo;est-ce qui fonctionne vraiment aujourd\u0026rsquo;hui ? Quelles pages ne sont jamais consultées ? Quels contenus n\u0026rsquo;existent que parce qu\u0026rsquo;ils ont toujours été là ?\nLes réponses mènent presque toujours à un site plus petit et plus clair. Moins de pages, mais meilleures : c\u0026rsquo;est le plus souvent la voie la plus rapide vers un meilleur résultat.\n","cover":"https://glacier-hugo.netlify.app/images/blog/blog-1.jpg","excerpt":null,"tags":["Site web","Hugo"],"title":"Moins de pages, mais meilleures","url":"/fr/blog/called-i-that-waters-dry-one/"},{"content":"Une image ne porte une page que si elle raconte quelque chose. Une décoration sans propos coûte du temps de chargement et détourne du texte au lieu de le soutenir. Le format, le cadrage et la position comptent autant que le sujet lui-même.\nLes images les plus efficaces prolongent le texte au lieu de le répéter. Elles offrent une respiration à l\u0026rsquo;œil et un contexte au contenu.\n","cover":"https://glacier-hugo.netlify.app/images/blog/blog-2.jpg","excerpt":null,"tags":["Site web"],"title":"Un langage visuel tout en retenue","url":"/fr/blog/fruit-so-open/"},{"content":"Une image ne porte une page que si elle raconte quelque chose. Une décoration sans propos coûte du temps de chargement et détourne du texte au lieu de le soutenir. Nous préférons donc quelques visuels forts, auxquels on laisse de la place, plutôt que de remplir chaque espace.\n","cover":"https://glacier-hugo.netlify.app/images/blog/blog-3.jpg","excerpt":null,"tags":["Site web"],"title":"Des images qui racontent","url":"/fr/blog/darkness-made-great/"},{"content":"L\u0026rsquo;accessibilité est souvent traitée comme une tâche supplémentaire, alors qu\u0026rsquo;elle découle presque toujours des décisions qui améliorent déjà une page : structure claire, contraste suffisant, langue compréhensible.\nDes niveaux de titre cohérents n\u0026rsquo;aident pas seulement les lecteurs d\u0026rsquo;écran, mais aussi les moteurs de recherche et tous ceux qui parcourent une page en diagonale. Un formulaire dont les libellés sont correctement associés est plus simple à utiliser pour chacun.\nLe test le plus simple ne coûte rien : poser la souris et parcourir la page au seul clavier. Ce qui reste inaccessible ainsi le restera pour une partie de vos visiteurs.\n","cover":"https://glacier-hugo.netlify.app/images/blog/blog-4.jpg","excerpt":null,"tags":["Hugo"],"title":"Accessible dès le départ","url":"/fr/blog/together-had-said-given-day-spirit/"},{"content":"La vitesse est un choix de conception. Une page qui s\u0026rsquo;affiche immédiatement paraît plus soignée qu\u0026rsquo;une page élaborée qui met deux secondes.\nLe principal levier reste presque toujours les images. Une taille adaptée, un format moderne et un chargement différé bien appliqué rapportent plus que n\u0026rsquo;importe quelle micro-optimisation du code.\nVient ensuite la typographie. Chaque famille supplémentaire coûte du temps de chargement, et rares sont les projets qui en réclament plus de deux.\nLes scripts constituent le troisième point. Beaucoup de choses qui exigeaient autrefois une bibliothèque se règlent aujourd\u0026rsquo;hui en quelques lignes de code natif.\nLes sites statiques partent avec un avantage : aucune requête en base de données susceptible d\u0026rsquo;être lente, aucun cache à entretenir.\nAu bout du compte, seul importe ce qui parvient à un appareil ordinaire sur un réseau ordinaire. Le reste relève de la statistique.\n","cover":"https://glacier-hugo.netlify.app/images/blog/blog-5.jpg","excerpt":null,"tags":["Golang"],"title":"La vitesse est une question de design","url":"/fr/blog/spirit-subdue-two-dont/"},{"content":"Au départ, il y a toujours une question, pas une palette de couleurs. Que doit accomplir cette page, pour qui, et à quoi verrons-nous que cela a fonctionné ? Sans ces réponses, le design devient affaire de goût. Vient ensuite la partie ingrate : trier, couper, hiérarchiser. C\u0026rsquo;est elle qui décide du résultat.\nCe n\u0026rsquo;est qu\u0026rsquo;une fois la structure arrêtée que la mise en forme commence. Nous démarrons en niveaux de gris, pour que le contraste et la hiérarchie ne reposent que sur la taille et l\u0026rsquo;espace.\nLa couleur arrive en dernier, avec parcimonie. Elle doit guider et non décorer : un seul accent suffit le plus souvent à conduire le regard au bon endroit.\nEnfin, nous testons sur de vrais appareils, avec de vrais contenus et une connexion lente. Ce qui tient là tient partout.\n","cover":"https://glacier-hugo.netlify.app/images/blog/blog-10.jpg","excerpt":null,"tags":["Hugo","Programmation"],"title":"[Format d'article] Standard","url":"/fr/blog/post-format-standard/"},{"content":"Une image seule ne porte un article que si elle montre ce que le texte n\u0026rsquo;a pas besoin de dire. Le reste n\u0026rsquo;est que décoration.\nLa résolution compte : le sujet doit rester net sur les grands écrans sans alourdir le temps de chargement.\nNous livrons donc ici un format soigneusement recadré, capable de s\u0026rsquo;adapter à toutes les largeurs de colonne.\n","cover":"https://glacier-hugo.netlify.app/images/blog/blog-8.jpg","excerpt":null,"tags":["Programmation"],"title":"[Format d'article] Image","url":"/fr/blog/post-format-image/"},{"content":"Une bonne grille est invisible. On ne la remarque que lorsqu\u0026rsquo;elle manque : les marges semblent arbitraires, les titres sortent de l\u0026rsquo;axe et l\u0026rsquo;œil ne trouve plus d\u0026rsquo;appui.\nLe rythme du texte compte tout autant. Interlignage, approche et corps vont de pair ; modifier l\u0026rsquo;un oblige à repenser les autres.\nQui maîtrise ces deux aspects a besoin de très peu de décoration. Deux graisses, une couleur d\u0026rsquo;accent et de larges blancs suffisent à presque tous les projets.\n","cover":"https://glacier-hugo.netlify.app/images/blog/blog-6.jpg","excerpt":null,"tags":["Site web","Programmation"],"title":"[Format d'article] Citation","url":"/fr/blog/post-format-quote/"},{"content":"Une mise en page claire commence par décider ce que l\u0026rsquo;on retire. Ce n\u0026rsquo;est qu\u0026rsquo;une fois le superflu écarté que le contenu dispose de la place nécessaire pour agir.\nNous travaillons donc de l\u0026rsquo;intérieur vers l\u0026rsquo;extérieur : d\u0026rsquo;abord la structure, ensuite la typographie, la couleur en dernier. L\u0026rsquo;ordre paraît évident, mais il évite la plupart des détours.\nIl en résulte une page qui se lit calmement et fonctionne sur tous les écrans, sans laisser deviner le travail qu\u0026rsquo;elle a demandé.\n","cover":"https://glacier-hugo.netlify.app/images/blog/blog-7.jpg","excerpt":null,"tags":["Site web","Hugo","Programmation"],"title":"[Format d'article] Lien","url":"/fr/blog/post-format-link/"},{"content":"Les images racontent plus vite que le texte. Une galerie fonctionne donc mieux quand la sélection reste courte et que chaque photographie a une raison précise d\u0026rsquo;y figurer.\nNous cherchons un rythme calme : des cadrages proches, une gamme de couleurs commune, des marges identiques. Il en résulte une série plutôt qu\u0026rsquo;un empilement.\nAu clic, chaque image s\u0026rsquo;ouvre en pleine taille. La mise en page reste en arrière-plan afin de ne pas perdre le contexte.\n","cover":"https://glacier-hugo.netlify.app/images/blog/blog-8.jpg","excerpt":null,"tags":["Site web","Programmation"],"title":"[Format d'article] Galerie","url":"/fr/blog/post-format-gallery/"},{"content":"Une mise en page claire commence par décider ce que l\u0026rsquo;on retire. Ce n\u0026rsquo;est qu\u0026rsquo;une fois le superflu écarté que le contenu dispose de la place nécessaire pour agir.\nNous travaillons donc de l\u0026rsquo;intérieur vers l\u0026rsquo;extérieur : d\u0026rsquo;abord la structure, ensuite la typographie, la couleur en dernier. L\u0026rsquo;ordre paraît évident, mais il évite la plupart des détours.\nIl en résulte une page qui se lit calmement et fonctionne sur tous les écrans, sans laisser deviner le travail qu\u0026rsquo;elle a demandé.\n","cover":"https://glacier-hugo.netlify.app/images/blog/blog-9.jpg","excerpt":null,"tags":["Programmation"],"title":"[Format d'article] Slider","url":"/fr/blog/post-format-slider/"},{"content":"Une mise en page claire commence par décider ce que l\u0026rsquo;on retire. Ce n\u0026rsquo;est qu\u0026rsquo;une fois le superflu écarté que le contenu dispose de la place nécessaire pour agir.\nNous travaillons donc de l\u0026rsquo;intérieur vers l\u0026rsquo;extérieur : d\u0026rsquo;abord la structure, ensuite la typographie, la couleur en dernier. L\u0026rsquo;ordre paraît évident, mais il évite la plupart des détours.\nIl en résulte une page qui se lit calmement et fonctionne sur tous les écrans, sans laisser deviner le travail qu\u0026rsquo;elle a demandé.\n","cover":"https://glacier-hugo.netlify.app/images/parallax-6.jpg","excerpt":null,"tags":["Site web","Hugo","Programmation"],"title":"[Format d'article] Vidéo HTML5","url":"/fr/blog/post-format-video-html5/"},{"content":"Une bonne grille est invisible. On ne la remarque que lorsqu\u0026rsquo;elle manque : les marges semblent arbitraires, les titres sortent de l\u0026rsquo;axe et l\u0026rsquo;œil ne trouve plus d\u0026rsquo;appui.\nLe rythme du texte compte tout autant. Interlignage, approche et corps vont de pair ; modifier l\u0026rsquo;un oblige à repenser les autres.\nQui maîtrise ces deux aspects a besoin de très peu de décoration. Deux graisses, une couleur d\u0026rsquo;accent et de larges blancs suffisent à presque tous les projets.\n","cover":"https://glacier-hugo.netlify.app/images/parallax-8.jpg","excerpt":null,"tags":["Site web","Programmation"],"title":"[Format d'article] Vidéo Vimeo","url":"/fr/blog/post-format-video-vimeo/"},{"content":"Une bonne grille est invisible. On ne la remarque que lorsqu\u0026rsquo;elle manque : les marges semblent arbitraires, les titres sortent de l\u0026rsquo;axe et l\u0026rsquo;œil ne trouve plus d\u0026rsquo;appui.\nLe rythme du texte compte tout autant. Interlignage, approche et corps vont de pair ; modifier l\u0026rsquo;un oblige à repenser les autres.\nQui maîtrise ces deux aspects a besoin de très peu de décoration. Deux graisses, une couleur d\u0026rsquo;accent et de larges blancs suffisent à presque tous les projets.\n","cover":"https://glacier-hugo.netlify.app/images/parallax-5.jpg","excerpt":null,"tags":["Programmation","Hugo"],"title":"[Format d'article] Vidéo YouTube","url":"/fr/blog/post-format-video-youtube/"},{"content":"Avant d\u0026rsquo;écrire la moindre ligne de code, nous déterminons qui visite le site et ce que ces personnes veulent y accomplir. Tout le reste découle de cette réponse.\n","cover":"https://glacier-hugo.netlify.app/images/blog/blog-14.jpg","excerpt":null,"tags":["Programmation"],"title":"[Format d'article] Audio","url":"/fr/blog/post-format-audio/"},{"content":"","cover":"https://glacier-hugo.netlify.app/images/portfolio/portfolio-item-1.jpg","excerpt":"Design, photographie et développement de bout en bout, du premier croquis...","tags":null,"title":"Tasses","url":"/fr/portfolio/cups/"},{"content":"","cover":"https://glacier-hugo.netlify.app/images/portfolio/portfolio-item-2.jpg","excerpt":"Design, photographie et développement de bout en bout, du premier croquis...","tags":null,"title":"Cactus","url":"/fr/portfolio/cactus/"},{"content":"","cover":"https://glacier-hugo.netlify.app/images/portfolio/portfolio-item-3.jpg","excerpt":"Design, photographie et développement de bout en bout, du premier croquis...","tags":null,"title":"Danse","url":"/fr/portfolio/dance/"},{"content":"","cover":"https://glacier-hugo.netlify.app/images/portfolio/portfolio-item-4.jpg","excerpt":"Design, photographie et développement de bout en bout, du premier croquis...","tags":null,"title":"Bouteilles","url":"/fr/portfolio/bottles/"},{"content":"","cover":"https://glacier-hugo.netlify.app/images/portfolio/portfolio-item-5.jpg","excerpt":"Design, photographie et développement de bout en bout, du premier croquis...","tags":null,"title":"Arbre","url":"/fr/portfolio/tree/"},{"content":"","cover":"https://glacier-hugo.netlify.app/images/portfolio/portfolio-item-6.jpg","excerpt":"Design, photographie et développement de bout en bout, du premier croquis...","tags":null,"title":"Rêve","url":"/fr/portfolio/dream/"},{"content":"","cover":"https://glacier-hugo.netlify.app/images/portfolio/portfolio-item-7.jpg","excerpt":"Design, photographie et développement de bout en bout, du premier croquis...","tags":null,"title":"Logo","url":"/fr/portfolio/logo/"},{"content":"","cover":"https://glacier-hugo.netlify.app/images/portfolio/portfolio-item-8.jpg","excerpt":"Design, photographie et développement de bout en bout, du premier croquis...","tags":null,"title":"Album de musique","url":"/fr/portfolio/music-album/"},{"content":"","cover":"https://glacier-hugo.netlify.app/images/portfolio/portfolio-item-9.jpg","excerpt":"Design, photographie et développement de bout en bout, du premier croquis...","tags":null,"title":"Livre","url":"/fr/portfolio/book/"},{"content":"","cover":"https://glacier-hugo.netlify.app/images/portfolio/portfolio-item-10.jpg","excerpt":"Design, photographie et développement de bout en bout, du premier croquis...","tags":null,"title":"Photo","url":"/fr/portfolio/photo/"},{"content":"","cover":"https://glacier-hugo.netlify.app/images/portfolio/portfolio-item-11.jpg","excerpt":"Design, photographie et développement de bout en bout, du premier croquis...","tags":null,"title":"Main","url":"/fr/portfolio/hand/"},{"content":"","cover":"https://glacier-hugo.netlify.app/images/portfolio/portfolio-item-12.jpg","excerpt":"Design, photographie et développement de bout en bout, du premier croquis...","tags":null,"title":"Emballage","url":"/fr/portfolio/package/"},{"content":"","cover":"https://glacier-hugo.netlify.app/images/portfolio/portfolio-item-13.jpg","excerpt":"Design, photographie et développement de bout en bout, du premier croquis...","tags":null,"title":"Téléphone","url":"/fr/portfolio/phone/"}]