background preloader

Couleur web : l'accord des couleurs, le cercle chromatique et la palette web

Couleur web : l'accord des couleurs, le cercle chromatique et la palette web
Assembler les couleurs est un exercice difficile pour le webdesigner. Les couleurs sont là pour servir le design, mettre en valeur le site web et le rendre attrayant. Bien souvent la lisibilité d'un site et la clarté de l'information passe aussi par le bon choix des couleurs. "Quel est le bon choix de couleurs pour un site web ?" L'accord des couleurs n'est pas une science exacte, mais connaître quelques principes n'est pas inutile. Les couleurs, c'est subjectif Utiliser les couleurs web Le cercle chromatique et l'accord des couleurs La palette web 1. L'accord des couleurs est subjectif. Certaines personnes vont préférer le rouge alors que d'autres plébiciteront le vert. Il est très difficile de séparer la subjectivité de la symbolique des couleurs car les couleurs ont toutes une influence sur nos émotions, nos humeurs, notre ressentiment... en fonction de notre environnement culturel. Les couleurs sont infinies et il y a tant a dire. 2. Le cahier des charges définie les couleurs. 3.

Structure de site Internet : comment faire ? La structure d’un site a un impact énorme sur le référencement naturel. Une mauvaise conception pose problème: perte de positionnement, contenus non indexés, incompréhension du visiteur… La solution est d’adopter le plus tôt possible une structure adaptée pour votre site. Oui, mais comment… ? Arborescence générale Avant même de parler technique, il faut parler de contenus et de cibles. A qui votre site s’adresse, pour répondre à quels besoins, avec quels outils ou quels contenus ? Dans l’ordre, voici les points clés de la structure de votre site Internet : Quel type de site utiliser ? La dernière question est sans doute la plus épineuse. lister tous les contenus (actuels ou à venir) de votre site webles regrouper en catégoriesles structurer Rien de tel qu’une image pour mieux comprendre : Le problème, c’est que cette structure dépend de votre point de vue. La méthode du tri des cartes et les personas La méthode de tri des cartes implique une aide extérieure. L’html et structure Les balises html

VISIBILITÉ - Glossaire des termes d'ATO indexation Procédure destinée à décrire et à caractérsier le contenu d'un texte ou d'un document (ou d'une partie d'un texte ou d'un document) à l'aide de mots (dits mots-clé ou descripteurs) représentant les concepts ou informations dans ce document, et ce, à des fins classification et pour en faciliter la recherche. De fait, un processus d'indexation comporte, d'une part, la reconnaissance et l'extraction des concepts informatifs (ou mots porteurs d'informations) et, d'autre part, la traduction de ces concepts dans un langage (dit langage documentaire) approprié à la classification et à la recherche de documents. Voir aussi catégorisation. Retour à l'index indice de calibrage Résultat d'ordre numérique obtenu suite aux analyses visant à situer un texte par rapport à un ensemble de textes tenus pour référence ou établis pour des objectifs précis. Voir aussi calibrage de texte. indice discriminant (de Salton) Désigne, en ATO, une mesure d'ordre numérique, dû à G. Voir aussi distance. inférence

Le web design : agencer les couleurs. (Part 2) La première partie de l’article sur le web design mettait en avant les avantages d’un agencement réussi (structure d’une page Internet, affichage…), mais vous aidait aussi à choisir votre police. Qu’en est-il des couleurs en web design ? Il est vrai que leur agencement n’est pas évident pour tous. Qui sait si le rouge va bien avec le vert ? C’est ici que nous intervenons pour essayer de vous expliquer comment utiliser les couleurs sur votre site Internet. Quelles couleurs choisir pour valoriser votre site? Le choix des couleurs devra correspondre, le cas échéant, aux couleurs de l’organisation (notamment aux couleurs du logo) et exprimer une ambiance particulière. Les couleurs possèdent une symbolique implicite. physiquement : appétit, sommeil, température du corps, etc.émotionnellement : sentiment de peur, de sécurité, de joie, etc.psychologiquement : dynamisme, concentration, etc. Google+ Auteur et éditeur de sites Web depuis 1992...

Pourquoi les standards du W3C ? Pour débuter, un peu d'histoire… Depuis les premières heures du Web, les principaux fabricants de navigateurs ont tenté de se créer un public captif en créant des extensions HTML propriétaires, restituée uniquement par leurs produits respectifs. Le Web s'est ainsi divisé en deux camps : MSIE et Netscape. Pour que leurs sites soient accessibles aux deux principaux navigateurs, les développeurs Web ne pouvaient opter que pour des choix aussi insatisfaisants les uns que les autres : n'utiliser qu'une syntaxe commune aux deux navigateurs, et se retrouver avec un site très pauvre, se démarquant peu de la concurrence ; ne s'adresser qu'à l'un des deux camps et sacrifier ainsi une grande partie de son audience et de sa clientèle potentielle ; faire deux versions du même site, au prix d'un travail bien plus important et forcément plus coûteux. La concurrence entre Netscape et Microsoft a donc mené à une balkanisation du Web, allant complètement à l'encontre de son ambition initiale. Conclusion

Photoshop Comment changer facilement l’écran d’un téléphone avec Photoshop Je vous propose d’apprendre à utiliser les objets dynamiques de Photoshop pour remplacer (...) Toutes les astuces pour créer un fichier photoshop propre et organisé Lisez toutes ces astuces et bonnes pratiques vous permettant de créer un fichier source (...) Tuto Photoshop Créer l’icône google gmail avec Photoshop Je vous propose dans ce tuto photoshop de reproduire l’icône du service google gmail en (...) Modifier simplement les couleurs dominantes d’une photo dans Photoshop Petite astuce Photoshop pour modifiant en quelques secondes les couleurs dominantes d’une (...) Insolite le clavier shortcut-S magique spécial Photoshop Ce clavier spécialement étudié pour les professionnels de l’infographie regroupe et une (...) Créer un magnifique effet de chrome brillant avec Photoshop Apprenez dans ce tutoriel Photoshop à créer un sublime effet de texte chromé brillant avec (...) Astuce pour mieux voir votre image sous Photoshop

Rendre l'information accessible à tous | brochure-translations | Guidelines | Resources | European Blind Union L'Union Européenne des Aveugles demande que l'information soit accessible à tous, y compris aux personnes aveugles et malvoyantes, en même temps qu'aux autres et sans frais supplémentaires. Dans la présente publication, nous nous intéressons à l'accessibilité des documents imprimés et des documents électroniques, destinés à un large public, dont les sites web, les livres, les factures, les lettres, les prospectus, etc. Cette publication a été réalisée avec l'aide du programme communautaire pour l'emploi et la solidarité sociale - PROGRESS (External link) . 1.1. À qui s'adresse cette publication ? Les responsables de la communication réaliseront que rendre l'information accessible à tous n'a rien de compliqué et que ce geste peut faire une réelle différence pour leur organisation ou leur entreprise. Comme tout le monde, les personnes aveugles et malvoyantes lisent sur plusieurs supports. 2. Tout d'abord, parce que c'est juste. 3. 4.1. L'information est plus qu'un simple texte. 4.1.1. 4.1.2.

Apprendre à utiliser Photoshop pour les nuls - tutoriel pour débutants Photoshop est un logiciel de traitement d'image professionnel qui permet de faire de la retouche photo, du dessin (digital painting), du graphisme ou encore du webdesign. Il est utilisé dans de nombreux domaines : les agences de publicité, les photographes, les graphistes, le cinéma ou encore les particuliers. Photoshop est édité par Adobe et fait partie d'un ensemble de logiciels : la Creative Suite. Même s'il peut paraître difficile à utiliser aux yeux d'un débutant, il n'en est rien. Si Photoshop n'est pas déjà installé sur votre PC ou Mac, il va falloir l'ajouter. L'objectif de cette première partie est de vous apprendre toutes les notions qu'il est indispensable de connaître pour pouvoir exploiter tout le potentiel de Photoshop. Cette partie s'adresse surtout aux débutants, bien que vous y apprendrez surement des choses que vous ne savez pas si vous connaissez déjà Photoshop... Cette seconde partie aborde des points plus ciblés :

Une obsession. Simplifier le Web. Je possède une adresse de courrier électronique depuis 1986. À ce moment existait au Canada un réseau point à point du nom de Bitnet. C'était un peu après les dinosaures ;-) Plus tard, au début des années 90, j'ai utilisé les premiers outils qui ont été conçus pour Internet : Archie, Gopher, WAIS, Telnet, IRC, FTP... Nommez-les, je les ai utilisés. Je me rappelle comme si c'était hier lorsque j'ai consulté le site gnn.com (global network nativigator) avec la première version de Mosaïc sur mon Mac portable. C'est mon entrée en matière aujourd'hui pour une raison très simple. Or simplifier et un travail d'une très grande complexité! Je me suis donc donné sur une série de repères pour mieux comprendre et mieux expliquer le Web. Je ne sais si j'y suis parvenu. Clef #1 : la visibilité Pour une présence efficace sur le Web, il faut d'abord que les gens vous trouvent. Mon guru de la visibilité s'appelle Matt Cutts de Google. Clef #2 : l'interopérabilité Clef #3 : l'utilisabilité

Créer un design web de A à Z Étape 1 : Création du .psd Je commence par créer un document de 1400x1000, résolution de 72 pixels/pouce. Étape 2 : Header Le header de ce design prendra toute la largeur et sera haut de 150px. Pour connaitre la taille de ma sélection il suffit de regarder dans informations [raccourcis : F8]. J'en profite pour placer une règle, si vous ne les voyez pas faites CTRL+R. je crée un nouveau calque et remplie cette sélection d'un gris foncé (#2c2c2c). Pour l'instant je n'ai qu'un seul calque, mais j'en aurai bientôt bien plus et il sera moins évident de se repérer, je commence dès maintenant à créer un dossier "Header" ! Je vais délimiter la largeur du design, je choisis de faire un design de 960px de largeur, vu que notre document fait 1400px de large, il faut mettre des règles à 220px et 1180px. Je vais un peu agrémenter cet header, en commençant par ajouter une Ombre interne. Je me sers de la règle pour faire un dégradé radial, puis je l'étire sur les cotés [raccourcis : CTRL + T].

Techniques pour les règles d'accessibilité du contenu Web 1.0 Note du W3C 5-mai-1999 Cette version: Les autres versions de ce document ne sont pas disponibles. Latest version: Version précédente : Dernière version des "règles pour l'accessibilité du contenu Web 1.0" Editeurs : Wendy Chisholm, Centre R & D Trace, Université du Wisconsin -- Madison Gregg Vanderheiden, Centre R & D Trace, Université du Wisconsin -- Madison Ian Jacobs, W3C Copyright © 1999 W3C (MIT, INRIA, Keio), Tous droits réservés. Résumé Ce document est une liste de techniques qui met en place la liste des contrôles définie dans le guide des "règles d'accessibilité du contenu Web 1.0". Ce document fait partie d'une série de documents sur l'accessibilité publiés par le groupe d'initiative sur l'accessibilité du Web (WAI). Statut de ce document 1 Priorités [Priorité 1] [Priorité 2] [Priorité 3]

Ergonomie web - Interview de l'auteur : Amélie Boucher L'ergonomie c'est comme le référencement : les secrets sont généralement bien gardés ! Cet ouvrage s'aventure donc dans les terres inconnues de l'Edition. Qu'est-ce que Ergonomie web, paru aux Editions Eyrolles, apporte aux lecteurs en quête d'informations en matière d'ergonomie et à qui s'adresse-t-il ? Amélie Boucher : C'est un non-sens de vouloir faire de l'ergonomie une discipline qui entretienne la culture du secret. Ergonomie web offre donc à la fois des conseils pratiques simples à appliquer et des pistes méthodologiques pour intégrer l'ergonomie au quotidien dans un projet web. Quelque soit leur métier, tous les acteurs du web pourront y acquérir un niveau de base, une sorte de "culture générale" d'ergonomie web. Retour au sommaire On comprend bien à la lecture de votre ouvrage que l'ergonomie ce n'est pas que du bon sens et d'ailleurs qu'est-ce que le "bon sens" ! Il existe d'abord les véritables "normes", au sens propre, de type ISO.

Ergonomie : Pourquoi il est dangereux de s’écarter des conventions ? Ne pas respecter les conventions, c’est s’exposer à des risques L’ergonomie n’est pas une question de règles absolues. C’est aussi, bien au contraire, le respect des conventions que les usages du web imposent et qui vont, parfois, à l’encontre des bonnes pratiques ergonomiques. Aussi, bousculer une convention, vouloir faire mieux peut partir d’une bonne intention, mais représente toujours un risque. En innovant, vous risquez d’aller à l’encontre de ce que les internautes peuvent rencontrer, les désorienter et, finalement, les perdre. Voyons voir comment. La page panier de C-and-a.com Je prendrai mon exemple de chez C-and-a.com, site récemment sorti dont on pourrait discuter longuement de l’ergonomie, mais dont un point en particulier a retenu mon attention. Un panier peu conventionnel Comme vous pouvez le voir, dans une tentative de « griller » les étapes, le panier contient également le module d’identification. Mais en ayant compressé ainsi l’action, il a pris plusieurs risques : Conclusion

Related: