Développement web avec Dreamweaver

La première étape du développement web est la phase de planification au cours de laquelle vous analysez les besoins du public, les exigences techniques et marketing. De plus, vous réunissez toutes les informations nécessaires pour concevoir et publier votre site web et vous avez des réponses à des questions telles que :

• Quel fournisseur de services puis-je choisir pour l’hébergement du site web ? Ai-je accès au chargement des fichiers sur le serveur de publication ?
• Quel nom de domaine doit être utilisé pour le site web ?
• Au cas où vous migrez des sites web existants dans Dreamweaver, où les fichiers et les actifs sont-ils actuellement stockés ? Ai-je accès au serveur sur lequel ces informations sont stockées ?
• Si vous souhaitez créer un site web dynamique, quel serveur pouvez-vous utiliser pour vérifier si les données s’affichent de façon dynamique ? Est-ce que je possède les détails du serveur de l’application web que je souhaite utiliser pour charger des données dynamiques ?
• Quels types d’actifs sont nécessaires pour le site web ?
• Seront-ils des actifs créés à partir de zéro ? Si les actifs sont déjà disponibles, y ai-je déjà accès ?
• Quelles sont les applications que je souhaite utiliser pour concevoir des actifs ?
• Puis-je planifier la création d’un site web réactif ? 

En supposant que vous sachiez précisément quel site web vous souhaitez développer, comment et où vous souhaitez l’héberger et que vous avez choisi Dreamweaver et Creative Cloud pour le processus de développement web, passez à l’étape suivante.

Vérifiez si vous disposez de tous les actifs requis pour votre site web. Rassemblez-les et classez-les dans vos dossiers locaux ou dans les Bibliothèques Adobe Creative Cloud.

Créez un nouveau document dans Dreamweaver en utilisant :

• Un document vierge ;
• Des modèles de démarrage fournis avec Dreamweaver, ou ;
• Des fichiers de modèle (*.dwt) créés par quelqu’un d’autre.

Consacrez quelques minutes pour vous familiariser avec l’espace de travail de Dreamweaver. Recherchez un espace de travail qui vous convient et définissez un thème de couleur. Réorganisez les différents panneaux comme vous le souhaitez.

Configurez votre site dans Dreamweaver. Procédez à la création une structure de dossiers contenant des fichiers et des actifs. Après avoir organisé vos informations et défini une structure, vous pouvez commencer la création de votre site. (Consultez la section À propos des sites Dreamweaver.)

À ce stade, il est aussi conseillé de configurer des connexions à des serveurs distants ainsi que des serveurs d'évaluation (si vous avez un contenu dynamique). 

Commencez le codage de vos pages web en mode Code ou créez-les en mode Création/En direct.

Si vous prévoyez d’utiliser des compositions Photoshop, vous pouvez les extraire dans Dreamweaver et travailler dessus. Pour plus d’informations sur l’utilisation de compositions Photoshop, consultez la section Extract sous Dreamweaver.

Ajoutez des éléments de conception, par exemple du texte, des images, des images avec effet de survol, des cartes graphiques, des couleurs, des animations, des sons, des liens HTML, des tableaux, etc.

Définissez l’aspect de votre page Web à l’aide de CSS. 

Vous pouvez travailler avec CSS dans Dreamweaver de différentes façons :

• Vous pouvez rédiger manuellement le CSS. Pour plus d’informations sur les fonctionnalités de codage de Dreamweaver concernant l’encodage manuel de votre CSS, consultez la section Environnement de codage sous Dreamweaver.
• Si vous n’êtes pas habitué à créer des pages CSS, vous pouvez faire appel au panneau CSS Designer pour vous aider à créer votre langage CSS. Pour plus d’informations, consultez la section Mise en forme de pages avec CSS Designer.
• Si vous préférez travailler avec des fichiers Sass et Less, Dreamweaver prend également en charge cette option, vous permettant d’importer des fichiers Sass et Less dans votre site Dreamweaver et de travailler dessus. Dreamweaver compile ensuite ces fichiers (ou vous pouvez décider de les compiler manuellement) et vous voyez les résultats de vos modifications CSS en temps réel. Pour plus d’informations sur l’utilisation de fichiers Sass et Less avec Dreamweaver, consultez la section Préprocesseurs CSS.

Configurez une application web pour créer un contenu dynamique.

De nombreux sites web contiennent des pages dynamiques qui permettent aux visiteurs d’afficher les informations stockées dans des bases de données, voire d’ajouter ou de modifier des données dans certains cas. Pour créer ce type de pages, vous devez d’abord configurer un serveur web et un serveur d’application, créer ou modifier un site Dreamweaver et vous connecter à une base de données. Pour plus d’informations, consultez la section Sites, pages et formulaires web dynamiques.

Créez des pages dynamiques.

Sous Dreamweaver, vous pouvez définir diverses sources de contenu dynamique, y compris des jeux d’enregistrements extraits de bases de données, des paramètres de formulaire et des composants JavaBeans. Pour ajouter le contenu dynamique à une page, il suffit de le faire glisser vers cette dernière.

Vous pouvez définir une configuration de page qui affiche un ou plusieurs enregistrements à la fois (ou plusieurs pages d’enregistrements), ajoute des liens spéciaux permettant de passer d’une page d’enregistrements à une autre et crée des compteurs d’enregistrements pour faciliter la gestion de ces derniers. Pour plus d’informations, consultez la section Sites, pages et formulaires web dynamiques.

Testez, prévisualisez et publiez votre site Web. 

Lorsque vous créez des pages, vous devez les prévisualiser pour vérifier que votre site web progresse selon votre modèle. Vous pouvez coder en mode fractionné, en conservant les affichages en mode Code et En direct côte à côte.

Vous pouvez également prévisualiser des pages Web en temps réel sur un navigateur.

Si vous ne souhaitez pas voir l’aperçu en direct, vous pouvez utiliser la prévisualisation d’aperçu normale via un navigateur.

Si vous avez déjà défini des connexions à des serveurs distants, pour publier votre site Web, vous devez placer vos fichiers dans le serveur distant afin de les afficher en direct.