La présentation est en train de télécharger. S'il vous plaît, attendez

La présentation est en train de télécharger. S'il vous plaît, attendez

Josiane Ducournau CDDP Portail CDI juin 2007 Gérer un site avec Kompozer.

Présentations similaires


Présentation au sujet: "Josiane Ducournau CDDP Portail CDI juin 2007 Gérer un site avec Kompozer."— Transcription de la présentation:

1 Josiane Ducournau CDDP Portail CDI juin 2007 Gérer un site avec Kompozer

2 Josiane Ducournau CDDP Portail CDI juin 2007 Organisation, plan de travail… … Création de pages Tout les fichiers, dossiers, images auront des noms (ex. nouveautes.htm ; ces noms ne devront comporter ni espaces, ni caractères spéciaux, ni accents (cest impératif !) Le fichier de la page daccueil devra sappeler index et être placé à la racine du répertoire

3 Josiane Ducournau CDDP Portail CDI juin 2007 Organiser le travail Préparer au préalable les textes, images. Créer un dossier (mon site, par exemple) sur le poste en local dans lequel mettre les pages. Dans ce dossier, créer un dossier image (très conseillé) Penser à donner un titre à chacune des pages ex. orientation (utile pour un meilleur référencement)

4 Josiane Ducournau CDDP Portail CDI juin 2007 barre d'état corps du document Gestionnaire de site barre de mise en forme du texte onglet d'affichage La fenêtre de travail

5 Josiane Ducournau CDDP Portail CDI juin 2007 La barre d'outils de composition Gérer les documents Envoyer le document sur le site distant Voir le document dans le navigateur (s'il est enregistré dans un site) Insérer des objets Imprimer le document Outil de correction orthographique

6 Josiane Ducournau CDDP Portail CDI juin 2007 Le gestionnaire de site de Kompozer Sert à gérer le site « en local » et « en distant » Sert à publier le site

7 Josiane Ducournau CDDP Portail CDI juin 2007 Gestionnaire de site Kompozer Accessible via la touche F9 Pour p Accéder au paramétrage

8 Josiane Ducournau CDDP Portail CDI juin 2007 Gestionnaire de site Kompozer Définition d'un site local : il suffit de choisir le répertoire racine (Choisir un dossier que laura créé au préalable, ex. dossier Monsite sur le bureau) 1 2 3

9 Josiane Ducournau CDDP Portail CDI juin 2007 Gestionnaire de site Kompozer Pour un site distant (c.a.d. en ligne, sur le serveur) on dispose : Dune adresse ftp ex. cdidupont.free.fr Dune adresse web ou url exp. Dun login et dun mot de passe ftp Définition d'un site distant

10 Josiane Ducournau CDDP Portail CDI juin 2007 Gestionnaire de site Kompozer Définition d'un site distant

11 Josiane Ducournau CDDP Portail CDI juin 2007 opérations sur les répertoires et fichiers

12 Josiane Ducournau CDDP Portail CDI juin 2007 Gestionnaire de site Kompozer Pour publier …

13 Josiane Ducournau CDDP Portail CDI juin 2007 Paramétrages essentiels du logiciel Un peu de technique….

14 Josiane Ducournau CDDP Portail CDI juin 2007 Les propriétés de la page (Outils – Préférences) choix important pour reformater un document créé avec un autre logiciel (Word, …)

15 Josiane Ducournau CDDP Portail CDI juin 2007 Les propriétés de la page Choix de la police pour l'affichage, en mode Normal ou Aperçu Ces choix ninfluencent pas le résultat final (les pages crées) mais leur apparence

16 Josiane Ducournau CDDP Portail CDI juin 2007 Les propriétés de la page Paramètres par défaut des nouvelles pages crées

17 Josiane Ducournau CDDP Portail CDI juin 2007 Les différents modes d'affichage Mode Normal : pour éditer les pages

18 Josiane Ducournau CDDP Portail CDI juin 2007 Les différents modes d'affichage Mode Aperçu : pour voir le résultat de la mise en forme… mais le plus simple est de visualiser le résultat sous un navigateur : bouton

19 Josiane Ducournau CDDP Portail CDI juin 2007 Les différents modes d'affichage Mode Source : pour voir tout le code

20 Josiane Ducournau CDDP Portail CDI juin 2007 Les différents modes d'affichage Mode Balises HTML : pour voir les balises principales

21 Josiane Ducournau CDDP Portail CDI juin 2007 Créer une page/ Menu fichier pour publier la page sur le site distant Créer une page

22 Josiane Ducournau CDDP Portail CDI juin 2007 La mise en forme du texte le menu Format permet de définir les propriétés du texte : Police (Arial, …) Taille (1,…,7,…) Style (souligné, …) Couleur Direction de l'écriture Suppression des styles, des liens, des ancres Paragraphes (P, H1, …) Listes (3 types) Indentation - Alignement (centré, …) …

23 Josiane Ducournau CDDP Portail CDI juin 2007 Les barres de mise en forme du texte permettent d'accéder aux principales propriétés du texte style de paragraphe police de caractère couleur du texte couleur en arrière-plan des paragraphes * diminuer, augmenter la taille du texte gras, italique, souligné listes alignements de paragraphe retraits de paragraphe La mise en forme du texte couleur de surlignement du texte

24 Josiane Ducournau CDDP Portail CDI juin 2007 La mise en forme des pages Couleur d'arrière-plan, couleur de texte par défaut … : menu Format – Couleurs et fond de page Pour insérer un paragraphes( balise ) : utiliser la touche Entrée en mode paragraphe Pour insérer un saut de ligne (balise ), utiliser la touche Entrée en mode corps de texte Création d'en-têtes : avec le menu Format - Paragraphe ou la barre de mise en forme du texte Alignement des différents éléments : boutons de la barre d'outils

25 Josiane Ducournau CDDP Portail CDI juin 2007 Pour mettre du texte en retrait : menu Format – Augmenter / Diminuer le retrait ou boutons Lettres accentuées de tous types et symboles spéciaux : menu Insertion – Caractères et symboles

26 Josiane Ducournau CDDP Portail CDI juin 2007 Les barres horizontales : Pour créer une barre horizontale : menu Insertion – Ligne horizontale Double clic sur la ligne pour en définir les propriétés

27 Josiane Ducournau CDDP Portail CDI juin 2007 Les listes Création de listes numérotées et de listes à puces : Texte – Liste ou boutons Création de listes de définitions : saisir alternativement le terme à définir et la définition, séparés par des retours à la ligne (Entrée). Retraits et mise en forme sont automatiquement réalisés en sélectionnant les termes ou définitions et en cliquant sur Format – Liste – Terme ou Définition.

28 Josiane Ducournau CDDP Portail CDI juin 2007 Exercice : prise en main du logiciel et mise en forme du texte Créer/organiser les dossiers sur votre ordinateur, paramétrer le gestionnaire de site Créer une première page, enregistrez-la, donnez un titre à votre page (menu Format/titre et propriétés de la page Testez la mise en forme du texte : paragraphes, sauts de ligne, listes, titres, gras, retrait, etc…

29 Josiane Ducournau CDDP Portail CDI juin 2007 Les liens Insertion d'un lien : - Sélectionner le texte ou l'image déclencheur - Bouton ou menu Insertion – Lien Ouvrir le lien dans une nouvelle fenêtre Lien

30 Josiane Ducournau CDDP Portail CDI juin 2007 Autres liens : les ancres Insertion d'une ancre nommée (pour faire, après, un lien vers un endroit précis de la page) : bouton ou menu Insertion – Ancre. Insertion d'un lien vers cette ancre : - créer un lien - ajouter # suivi du nom de l'ancre (cas dun lien interne à la page) - ajouter nom de la page # suivi du nom de l'ancre (cas dun lien vers une ancre dans une autre page)

31 Josiane Ducournau CDDP Portail CDI juin 2007 Exercice sur les liens Créer plusieurs pages. Avoir une page nommée index (homepage) et dautres pages, faire des liens depuis la page index jusquaux autres pages, puis faire les liens retour. Insérer une ancre sur une page A et faire un lien interne sur cette page A jusquà lancre. Puis, faire un lien depuis une page B jusquà lancre sur la page A.

32 Josiane Ducournau CDDP Portail CDI juin 2007 Images Attention au poids des images ! Utilitaires gratuits (xnview, irfanview, pour convertir les images et réduire le poids)

33 Josiane Ducournau CDDP Portail CDI juin 2007 Les images Dabord, placez les images (gif, jpg, png) dans le dossier image Insertion d'une image : menu Insertion – Image ou bouton de la barre d'outils Propriétés de l'image (Attributs de la balise IMG) : définis dans l'Inspecteur de propriétés, à l'insertion de l'image ou par double clic sur l'image.

34 Josiane Ducournau CDDP Portail CDI juin 2007 Les images L'Inspecteur de propriétés des images : Source de l'image (SRC) Texte alternatif (ALT)

35 Josiane Ducournau CDDP Portail CDI juin 2007 Les images L'Inspecteur de propriétés des images : Largeur (width) Hauteur (height)

36 Josiane Ducournau CDDP Portail CDI juin 2007 Les images L'Inspecteur de propriétés des images : HSPACE VSPACE BORDER ALIGN

37 Josiane Ducournau CDDP Portail CDI juin 2007 Les images L'Inspecteur de propriétés des images : Lien sur l'image (A HREF) autres propriétés

38 Josiane Ducournau CDDP Portail CDI juin 2007 Exercice sur les images Placez des images dans le dossier images. Insérez ces images dans les pages. Testez les propriétés des images : bordure, positions, image cliquable

39 Josiane Ducournau CDDP Portail CDI juin 2007 Les tableaux Insertion d'un tableau :menu Tableau – Insérer - Tableau ou bouton

40 Josiane Ducournau CDDP Portail CDI juin 2007 Les tableaux Insertion d'un tableau : menu Tableau – Insérer - Tableau ou bouton

41 Josiane Ducournau CDDP Portail CDI juin 2007 Les tableaux d'autres attributs de mise en forme…

42 Josiane Ducournau CDDP Portail CDI juin 2007 Les tableaux Par défaut, toutes les cellules du tableau ont la même taille et la taille des cellules s'adapte automatiquement au contenu Pour modifier la taille des cellules, il suffit de déplacer les délimiteurs dans les règles horizontale et verticale :

43 Josiane Ducournau CDDP Portail CDI juin 2007 Les tableaux Les attributs du tableau peuvent être modifiés à tout moment par double-clic :

44 Josiane Ducournau CDDP Portail CDI juin 2007 Les tableaux Par défaut, toutes les cellules du tableau ont la même taille et la taille des cellules s'adapte automatiquement au contenu Pour modifier la taille des cellules, il suffit de déplacer les délimiteurs dans les règles horizontale et verticale :

45 Josiane Ducournau CDDP Portail CDI juin 2007 Exercice sur les tableaux Insérez un tableau pour présenter des données tabulaires Insérez un tableau servant à la mise en forme de la page

46 Josiane Ducournau CDDP Portail CDI juin 2007 Utiliser les modèles Qu'est ce qu'un modèle ? Un modèle est un document qui mémorise une mise en forme, pour pouvoir la reproduire dans de nombreuses autres pages. Une fois la mise en forme du modèle conçue, les autres pages sont créées à partir de ce modèle. La mise à jour du modèle affecte toutes les pages où il est utilisé. La page modèle n'est pas modifiable ; il faut y insérer les zones éditables dans lesquelles le contenu variable sera inséré.

47 Josiane Ducournau CDDP Portail CDI juin 2007 Utiliser les modèles A partir d'un document HTML existant : Fichier – Enregistrer sous – Type : Modèles HTML OU copier-coller le code source dans la nouvelle page Utiliser un modèle Fichier – Nouveau – Nouveau document utilisant un modèle. Sélectionner le modèle et valider (OK) Attention : Le chemin vers le modèle est le chemin absolu mais ce n'est pas grave, il n'est pas nécessaire de mettre le modèle sur le serveur !! Remarques : - Il n'est pas encore possible de mettre à jour les fichiers à partir du fichier modèle - Parfois, il est possible de modifier des zones prévues comme non éditables. à revoir …

48 Josiane Ducournau CDDP Portail CDI juin 2007 Ajouter une table des matières à une page Web 1.Utiliser les titres pour libeller les différents niveaux de sections puis enregistrer 2.Cliquer sur Insertion > Table des matières et choisissez Insérer. La fenêtre Table des matières apparaîtra. 3.Sélectionner les niveaux de titres utilisés pour les différentes sections 4.Cliquer sur OK pour construire la table des matières.

49 Josiane Ducournau CDDP Portail CDI juin 2007 Mettre à jour ou supprimer une table des matières Cliquer sur Insertion puis Table des matières et choisir « mettre à jour ». La table des matières sera mise à jour pour afficher les nouvelles entrées. Pour supprimer toute la table des matières, cliquer sur Insertion, puis Table des matières et choisir Supprimer.

50 Josiane Ducournau CDDP Portail CDI juin 2007 d'après le diaporama Gérer un site avec Nvu 1.0 d'Isabelle Motte Disponible sous Licence Creative Commons BY-NC-SA disponible sur :


Télécharger ppt "Josiane Ducournau CDDP Portail CDI juin 2007 Gérer un site avec Kompozer."

Présentations similaires


Annonces Google