Dreamweaver CS6 pour Dummies Cheat Sheet - dummies

Par Janine Warner

Si vous débutez en conception Web ou créez des pages HTML depuis des années, Adobe Dreamweaver CS6 est l'outil idéal pour la construction de votre site web. Dans la version CS6, vous trouverez un nouvel écran de bienvenue et un support pour les dernières feuilles de style en cascade (CSS3) et HTML5. Dreamweaver est un programme populaire parmi les concepteurs de sites Web professionnels, ainsi que les personnes qui veulent créer des sites pour leurs loisirs, clubs, familles et petites entreprises.

L'écran de bienvenue d'Adobe Dreamweaver CS6

L'interface graphique conviviale de Dreamweaver et sa puissante liste de fonctionnalités en font un choix populaire parmi les concepteurs de sites Web professionnels et les amateurs. Avec chaque nouvelle version, Dreamweaver CS6 offre de nouvelles fonctionnalités, mais vous trouverez toujours l'écran de bienvenue habituel pour vous aider à démarrer.

Dreamweaver CS6: Ajout de textures avec CSS3

Dans Dreamweaver CS6, vous pouvez améliorer vos conceptions et enrichir vos pages en ajoutant des ombres de texte aux règles CSS3, la toute dernière technologie Web. L'ajout d'ombres de texte facilite la lecture de vos mots, en particulier si votre arrière-plan est complexe ou si les couleurs de l'arrière-plan et du texte manquent de contraste.

crédit: Paul Gual, istockphoto. com

Dreamweaver CS6 prend en charge les ombres de texte CSS3 lorsque vous utilisez le volet Propriétés dans le panneau Styles CSS. Vous pouvez créer des styles de classe ou d'ID avec des ombres de texte et vous pouvez ajouter des ombres de texte aux éléments HTML existants en définissant un style de tag, tel que le style de titre 1 utilisé dans l'image.

Le code CSS3 qui crée cette ombre de texte est

h1 {texte-ombre: 2px 2px 3px # 000;}

Les nombres dans le code spécifient que l'ombre de texte doit s'étendre 2 pixels vers la droite et 2 pixels au-dessous du texte avec un flou de 3 pixels. De plus, l'ombre est créée avec la couleur noire, spécifiée par le code de couleur hexadécimal abrégé # 000.

Lors de la création de règles pour les ombres de texte, vous pouvez spécifier jusqu'à quatre valeurs:

• Horizontal et vertical: Les deux premières valeurs numériques sont requises et spécifient les décalages horizontaux et verticaux. texte (horizontal) et à droite du texte (vertical).

• Rayon de flou: La troisième valeur spécifie la quantité de flou dans l'ombre. Si vous n'incluez pas de rayon de flou, la valeur par défaut est 0, ce qui fait apparaître l'ombre comme une couleur unie.

• Couleur: La quatrième valeur spécifie la couleur de l'ombre et peut être définie à l'aide d'un code couleur hexadécimal ou d'un code couleur RGBa.

Vous pouvez ajouter une ombre de texte à l'aide du volet Propriétés en bas du panneau Styles CSS, comme indiqué dans l'image.Pour ce faire, procédez comme suit:

1. Cliquez sur le lien Ajouter une propriété dans la partie gauche du volet Propriétés des styles CSS.

2. Entrez le nom de la règle de style CSS3, text-shadow ou sélectionnez la règle de style dans la liste déroulante.

   Lorsque le nom apparaît sur le côté gauche, une petite flèche apparaît sur la droite.

3. Cliquez pour sélectionner la flèche à droite de texte-ombre.

   Une boîte apparaît.

4. Entrez les décalages X et Y, le rayon de flou et la couleur.

Sites Web et ressources pour les concepteurs Web

Les concepteurs Web expérimentés, qu'ils utilisent Adobe Dreamweaver ou un autre logiciel de conception Web, se réfèrent souvent aux ressources en ligne pour suivre leurs compétences et ajouter des fonctionnalités spéciales à leurs sites Web. Cette liste vous permet de trouver facilement des sites Web et des ressources en ligne qui peuvent vous aider dans vos projets de conception de sites Web.

• Services d'hébergement audio et vidéo:

  • YouTube

  • Vimeo

  • SoundCloud

• Blogs et programmes CMS

  • Blogger

  • Joomla

  • MovableType

  • TypePad

  • Tumblr > WordPress

  • Services de partage de médias sociaux

• Ajouter ceci

  • Lockerz Share

  • Services de rapports de trafic:

• Google Analytics

  • Yahoo! Web Analytics

  • HubSpot

  • Navigateurs web populaires:

• Apple Safari

  • Google Chrome

  • Microsoft Internet Explorer

  • Mozilla Firefox

  • Opera

  • Services de test du navigateur Web:

• Adobe Navigateur Lab

  • BrowserShots

  • Cross Browser Testing

  • Navigateur Sandbox depuis Spoon (anciennement Xenocode)

  • Dreamweaver, CSS et ressources de conception Web:

• Dreamweaver Developer Center

  • Formation Web Design chez DigitalFamily. com

  • W3 Conversions Ressources HTML5 et CSS3

  • Liste A côté