Dreamweaver gratuit

Pack d'icônes de qualité pro

23 juin 2009 | Posté par caroder à 09:00

Voici un pack de 90 icônes totalement gratuites que vous pouvez aussi bien utiliser dans des projets commerciaux ou personnels. Vous ne pouvez cependant ni le revendre, ni en reprendre la diffusion pour votre propre compte. Chaque icone est disponible à la taille 64 x 64 px au format PNG.

Ce pack a été designé par Andy Gongea, designer roumain, qui l'a spécialement dessiné pour Smashing Magazine. Pour le télécharger : http://www.smashingmagazine.com/2009/06/18/freebie-release-quartz-icon-set/ 

Dreamweaver CS4 et Photoshop : gestion des images - Tutorial de Jpierre

21 avril 2009 | Posté par caroder à 08:53

JPierre propose sur le site ASP-PHP.net un tutorial sur les fonctionnalités de Dreamweaver CS4 permettant de mieux gérer les images d'un site. En effet, il vous est offert la possibilité de créer une synchronisation entre le travail de l'image dans Photoshop CS4 et l'import de l'image dans une page web avec Dreamweaver.

J'en profite pour effectuer un petit rappel sur les formats d'images web et leur utilisation :

• Le format JPG : compression d'image supportant jusqu'à des millions de couleurs différentes (plus la compression choisie est élevée moins vous préservez la variété des couleurs et la netteté de la photo d'origine). Ce format d'image est particulièrement indiqué pour les photos et plus généralement tout image comportant un dégradé.
• Le format GIF : la palette gif comporte au maximum 256 couleurs ; c'est pourquoi ce format de compression sans perte est plus adapté aux images comportant des aplats de couleurs telles que des logos ou des illustrations type "ligne claire". Ce format d'image supporte très mal la réduction, homothétique ou non. A éviter donc quand on souhaite afficher des vignettes sans création de fichier spécifique.
• Le format PNG : il supporte des images en 24 bits et 32 bits (soit16 millions de couleurs + 256 niveaux de transparence). C'est donc la panacé ? Pas si sûr... Car pour des images comportant de nombreuses couleurs le poids des fichiers est nettement plus important que les 2 précédents formats !

Pour consulter le tutorial de Jpierre : http://www.asp-php.net/tutorial/asp-php/dreamweaver-cs4-et-photoshop-cs4.php

Le nouveau design de Dreamweaver Gratuit

19 avril 2009 | Posté par caroder à 15:53

Non, non, vous ne rêvez pas... Vous le découvrez en lisant ces lignes, le site Dreamweaver Gratuit fait peau neuve.

Comme vous pouvez le constater, j'ai voulu la jouer un peu "décalé" par rapport aux sites "geek" habituel : je donne dans le résolument girly, raisonnablement, certes, puisque je reste dans les tons classiques du vert Dreamweaver (au lieu d'un rose plus attendu dans ce style de design), mais girly tout de même.

Que mes (très et majoritairement) nombreux lecteurs masculins ne m'en tiennent pas rigueur, qu'ils ne se sentent pas déboussolés par ce style un peu particulier pour un site de tutorials. J'ose même espérer qu'ils apprécieront... Oui, je suis une femme et pourquoi ne pas le revendiquer par le design dans un domaine aussi peu sensible à la feminité !

En tout état de cause, hommes ou femmes, vos avis m'intéressent. N'hésitez pas à vous exprimer en commentant ce billet.

Avis aux utilisateurs de la plate-forme Canalblog : je tiens à leur disposition ma CSS et mon code commenté pour ceux qui en feront la demande (attention : ce blog est conçu en "mode avancé") afin de comprendre comment je suis parvenue à ce résultat.

Les 20 sites indispensables pour webdesigners

24 mars 2009 | Posté par caroder à 09:20

Je sais, je sais... Le site que vous consultez ne représente pas une performance graphique... et pourtant, mon premier job, c'est la direction artistique... Voici ma liste des 20 incontournables en matière de design de site web :

Au commencement était... l'ergonomie :

• Un peu de théorie, ça ne fait pas de mal : http://www.ergolab.net/. Comprendre le pourquoi et le comment  de l'usability... Une excellente ressource. Ma bible.

Comprendre les CSS et les mettre en application :

• les normes du W3C : http://openweb.eu.org/ (à consulter absolument, l'article sur le positionnement float : http://openweb.eu.org/articles/initiation_float)
• les problèmes liés à IE : http://esprit-creatif.blog.mongenie.com/index.php?idblogp=406297 et le HAsLayout http://www.alsacreations.com/article/lire/76-haslayout-internet-explorer.html
• le validateur du W3C : http://validator.w3.org/

Gabarits de mises en page :

La base de tout... C'est avec eux que je commence tous mes designs... Plus le gabarit est dépouillé, moins la CSS contient de ligne de code, plus j'aime !

• la boite à outil d'Alsacréations : http://www.alsacreations.com/outils/
• 224 gabarits  de mise en page : http://layouts.ironmyers.com/
• A ne pas oublier : les gabarits proposés par Dreamweaver (via la commande fichier >> nouveau)

Templates gratuites :

Ici on croit résoudre ses problèmes, mais attention ! ce ne sont QUE des templates...
Il existe des centaines de sites avec des templates gratuites. Voici ceux que je considère comme les meilleurs, la crème de la crème...

• Templates : http://www.freecsstemplates.org/css-templates/
• Templates dédiés à Dreamweaver : http://www.ex-designz.net/template/tempcat.asp?cat_id=9
• Une liste de thème Wordpress : http://www.opensourcehunter.com/2009/03/03/55-free-and-beautiful-wordpress-themes/
• Thèmes pour Wordpress de qualité pro : http://topwpthemes.com/

Ressources graphiques :

• Des milliers d'images gratuites, de pinceaux et de pattern photoshop, bref une ressource inépuisable ! http://www.deviantart.com/
• Des puces à foison pour de jolies listes : http://www.stylegala.com/features/bulletmadness/
• Travailler sur la couleur et les compatibilités de gamme : http://www.colorblender.com/
• Vérifier le rendu d'un site dans tous les navigateurs : http://browsershots.org/

Trouver l'inspiration (qu'est-ce qui est in et out en matière de design CSS web) :

• CSS Vault : http://cssvault.com/
• CSS Beauty : http://www.cssbeauty.com/
• CSS Zen Garden : http://www.csszengarden.com/ (CSS Zen Garden est plus un exercice de style ou une performance au sens artistique du terme mais c'est aussi un excellent reflet de l'air du temps)
• Style Gala : http://stylegala.com/
• CSS Drive : http://www.cssdrive.com/

Si vous en avez d'autres, n'hésitez pas à commenter :-)