Doc, J'ai ouvert le logiciel Dreamweaver, mais je ne sais pas par où commencer pour créer un site web! Comment débuter un site web dans Dreamweaver?
Pas de panique mon petit Marty! Après avoir fermer le fenêtre d'accueil de Dreamweaver, voici la marche à suivre pour faire le squelette de ton site... Suis moi bien!
Partie 1 : Le SQUELETTE
1) - Dans le menu, clic sur Site > Nouveau Site, Inscris le nom de ton site et indiques son dossier de destination.2) - Dans le panneau Fichiers (Fenêtre>Fichiers), organise ton futur organigramme avec d'abord un fichier "index.html" (clic droit > Nouveau fichier). Puis, un dossier css (clic droit > Nouveau dossier) avec à l'intérieur un fichier "feuille.css".
- Crée aussi un dossier image à la racine du site qui servira aux images de décoration du site (qui ne changent pas donc).
- Et enfin, crée pour chaque page du site, un dossier bien nommé avec sa feuille .html à l'intérieur et un dossier image correspondant aux futures images de la page.
3) - On va lier tout de suite chaque page .html au fichier "feuille.css". Ouvres une page html et clic sur l'icône en forme de chaine du panneau Styles CSS. Une fenêtre "Ajouter une feuille de style externe" apparait, recherche le fichier "feuille.css" et coches le bouton Lien et OK.
- Faire la même chose pour chaque page.
4) - On édite dès le départ le fichier "feuille.css" comme suit :
Dans le panneau Styles CSS, clic sur l'îcone "Nouvelle règle de CSS"
5) - La balise "body" est a éditer aussi. Dans le panneau Styles CSS>Nouvelle règle de CSS>Type de sélecteur>Balise>Nom du sélecteur>Body. Puis dans la fenêtre de définition des règles, Type>Font-family (avec la famille de police à utiliser). Arrière-plan>Background-color (la couleur de fond). Et surtout Boîte > Padding (pour établir une marge intérieure à notre site pour qu'il ne colle pas la fenêtre de navigation en haut (Top) et surtout en bas (Bottom).
6) - On édite aussi tout de suite une classe pour supprimer les bordures de décoration sur les images lorsque celles-ci servent de lien. Ce qui est très gênant. Dans le panneau Styles CSS >Nouvelle règle de CSS>Type de sélecteur>Composé>Nom du sélecteur> a img. Puis dans la fenêtre de définition des règles, Bordure>Width>0 px.
7) - Dans le fichier index.html, dans la partie création, entre les balises <body> et </body>, écris les mots "tetiere", "corps"et "pied" à la suite l'un en dessous de l'autre en appuyant sur Enter, afin de créer 3 paragraphes avec la balise <p>. On sélectionne le tout et on crée la div "conteneur" en cliquant sur l'icône "Insérer la balise Div" du panneau Insertion. Puis pour l' ID, tapes : "conteneur", et OK.
Attention! Je rappelle qu'il est formellement interdit d'utiliser des majuscules ou des caractères accentués pour tous les noms de vos dossiers et fichiers.
j'ai fait un don à la fondation du Doc, pas eu le kit en retour.
RépondreSupprimerMa fondation de te remercie. Grâce à toi, je vais pouvoir finalisé mes recherches sur le presse-purée. Le lien du kit vient de t'être envoyé. Merci!!
RépondreSupprimerJ'ai bien eu le kit !
RépondreSupprimer