Rendez la conception Web plus efficace avec les outils en ligne gratuits de Mudcu.be

Si vous avez déjà essayé la création de sites Web et que vous n'êtes pas vraiment un artiste, alors vous savez que la non-programmation “conception” une partie de l'équation peut être un peu difficile.

Pour certaines personnes, comme certains membres de ma famille qui sont trop bon marché pour acheter un logiciel de création d'images, la difficulté survient quand ils veulent personnaliser des logos ou des arrière-plans. Pour certains programmeurs, le problème survient lorsque le code CSS est nécessaire, et ils ne sont pas encore au courant des dernières normes CSS..

Vous pouvez passer beaucoup de temps à vous tenir au courant des dernières tendances et normes en matière de conception Web. Avec l'avènement de nombreux outils de conception Web WYSIWYG, la création de sites Web tombe davantage dans le domaine des non-programmeurs que des programmeurs de nos jours. Le problème, c’est que lorsqu’il s’agit d’améliorer un dessin pour qu’il fasse ce que vous voulez vraiment, vous devez revenir à un programmeur, vous ne pouvez pas vous en sortir..

Heureusement, il existe de nombreuses ressources qui peuvent vous aider avant de devoir chercher de l'aide auprès d'un programmeur. Chez MUO, nous aimons beaucoup la conception de sites Web et abordons souvent ce sujet, par exemple Ann's Firebug. Guide de l'amateur pour personnaliser la conception de sites Web avec FireBug Blogs à suivre 6 meilleurs blogs de design Web à suivre .

Mudcu.be est un site qui fournit une liste complète d'outils de conception de sites Web vraiment utiles que tout le monde peut utiliser..

Mudcu.be Outils de conception Web

Mudcu.be est ce que j'appellerais une boîte à outils d'outils de base pour un concepteur de sites Web travaillant sur un très petit budget (ou pas de budget). Les outils que vous trouverez sur ce site sont très centrés sur les graphiques, la conception et la coordination des couleurs de votre site Web. En fin de compte, les couleurs sont vraiment ce qui peut faire ou défaire un dessin, ce sont donc des outils importants à avoir à portée de main.

Si vous êtes un de ces gens qui n’ont tout simplement pas l’argent nécessaire pour un logiciel de création de peinture ou de création d’images de qualité, ou si vous voyagez avec un petit ordinateur portable ou un netbook et que vous avez besoin d’une solution d’édition d’images sur le Web. Un outil chez Mudcu.be qui peut aider est le Sketchpad.

L'outil Sketchpad vous permettra de créer toute image de votre choix dans un outil Web similaire à Windows Paint. Cependant, après avoir utilisé Sketchpad pendant un certain temps, j’ai vraiment eu l’impression que c’était beaucoup plus facile à utiliser et beaucoup plus souple que Windows Paint. Lorsque vous avez terminé, il vous suffit de cliquer sur la petite image de disque en haut pour enregistrer l'image que vous venez de créer sur votre ordinateur. C'est si facile.

À mon avis, les outils les plus intéressants proposés par Michael Deal sur son site sont la sélection d’outils à dégradé de couleurs COLRD. Il s'agit d'une série d'outils de palette de couleurs qui vous permettent d'ajuster avec soin les éléments de couleur pour obtenir la nuance exacte de la couleur souhaitée. Vous ajustez la teinte, la saturation et la luminance, ainsi que les niveaux de rouge, de vert et de bleu. Vous pouvez simplement sélectionner dans la zone des couleurs similaires de la droite si vous le souhaitez. Lorsque vous avez terminé, le code de couleur de la nuance que vous avez créée est affiché juste au-dessus des curseurs..

La série d'outils COLRD comprend des applications Web similaires à celle ci-dessus. le “Créer” Le menu vous permet de choisir l’outil Couleur ci-dessus, ou vous pouvez utiliser une palette, un dégradé ou une image ADN..

Les autres outils s’expliquent d'eux-mêmes, mais Image DNA vaut vraiment la peine d’être mentionnée. Avec cet outil, vous pouvez ouvrir n’importe quelle image de votre ordinateur, puis utiliser cet outil pour identifier les couleurs de la photo..

La beauté d'un outil comme celui-ci réside dans le fait que si vous prévoyez d'utiliser certaines images sur votre page Web, cette application Web vous permet d'identifier les couleurs que vous pouvez utiliser sur votre page Web et qui correspondent parfaitement aux couleurs dominantes de votre photo. Cela peut aider les concepteurs de sites Web amateurs à résoudre le problème très courant de conflit de couleurs sur une page Web - en transformant ce qui pourrait être un design décent en un site Web atroce..

En parlant de sites Web atroces, pourquoi les gens ont-ils encore des antécédents qui semblent sortir tout droit des années 1990? Une fois que vous avez trié les couleurs et les images de votre site Web avec les outils ci-dessus, vous pouvez passer au générateur de fond..

Cette application Web vous permettra de choisir parmi une longue liste de “les textures” pour vos antécédents. Certaines d'entre elles peuvent sembler ringardes si vous ne les posez pas correctement, mais beaucoup ont l'air vraiment bien si vous utilisez les sélections Dégradé pour affiner la nuance de couleur afin qu'elle corresponde bien aux images et aux couleurs de votre site Web. Une fois que vous avez terminé, cliquez simplement sur le bouton “Générer du CSS” bouton, et le code CSS est généré pour vous. Ça ne devient pas plus facile que ça.

L'outil vient même avec un “simulateur” fonctionnalité, où vous pouvez tester l’arrière-plan de votre page Web avant de l’implémenter. Voici à quoi ça ressemble quand je lance le simulateur sur Google.com.

Michael aime la couleur et aucun outil ne le montre mieux que sa sphère de couleur. Comme il le décrit sur le site Web, la sphère de couleur est censée vous laisser “visualiser les harmonies de couleurs” en utilisant des formules qu'il est venu avec. C'est en fait assez impressionnant, car il vous permet de commencer avec une certaine sélection de couleurs, disons le rouge - puis il décompose votre couleur de choix en un dégradé d'autres couleurs qui se jettent à l'intérieur “harmonie”. Ce sont les couleurs que vous souhaitez coller sur votre site Web pour vous assurer que toutes les couleurs vont bien ensemble

En jouant avec Color Sphere pendant un moment, je dois dire que, même si je ne sais pas quelles formules il utilise, les choix de couleurs fonctionnent vraiment bien ensemble.

Une autre application de Michael qui mérite d'être mentionnée est en fait une offre Appspot appelée Daltonize. C'est un outil vraiment impressionnant qui vous permet d'identifier le type de daltonisme que vous avez, puis d'utiliser cette sélection pour permettre à votre navigateur de vous afficher des pages Web dans un format tenant compte de votre daltonisme..

Une fois le signet installé dans votre navigateur, en suivant les instructions, une icône représentant un globe apparaît dans votre barre d’outils (au moins dans Chrome). Les paramètres de daltonisation vous permettent d'identifier les problèmes de vision des couleurs lorsque vous ouvrez le navigateur. Vous pouvez également modifier le type de daltonisme à tout moment..

Voici à quoi ressemble la page résultante lorsque vous utilisez le filtre daltonien. Si vous n'êtes pas daltonien, l'image ci-dessous montrera mon blog, qui a normalement une nuance orange pour les côtés de l'en-tête et la couleur de l'icône, sous la forme d'une couleur pourpre éclatante. On dirait que certaines images du site ont également été teintées. Outil très impressionnant!

Ce n'est pas une liste de tous les outils de conception disponibles sur Mudcu.be. Si la couleur vous intéresse ou si vous recherchez des moyens de mieux l'intégrer à votre conception de sites Web, ce site est une visite incontournable..

Avez-vous déjà eu des problèmes de couleurs dans vos efforts de conception de sites Web? Quels outils ou techniques utilisez-vous pour faire correspondre les choses? Partagez vos pensées et vos idées dans la section commentaires ci-dessous!

Crédit d'image: conception de sites Web via Shutterstock