10 octobre 2012 Grégory Petit

Présentation au sujet: "10 octobre 2012 Grégory Petit"— Transcription de la présentation:

1 10 octobre 2012 Grégory Petit http://lrcm.com.umontreal.ca/greg/COM2580/

2 La semaine dernière… On a fixé les dates importantes : 31 octobre : premier travail à rendre 28 novembre : second travail à rendre 16 janvier : présentation et remise du travail de session

3 La semaine dernière Sinon, on a vu : Pourquoi ce cours est pertinent, une courte introduction au HTML, une courte introduction à Dreamweaver.

4 Et donc on fait quoi aujourdhui? Pourquoi fait-on des sites Web? Entête des pages Web Organisation des fichiers dun site Web La structure des pages Web Atelier

5 Pourquoi fait-on des sites Web?

6 Alors pourquoi? Pour promouvoir quelque chose : Un produit Une entreprise Une personne Pour présenter des informations Pour le plaisir?

7 Pour communiquer avec le monde!

8 Noms de domaine Voir http://www.ic.gc.ca/epic/site/dir-ect.nsf/fr/h_uw00890f.html http://www.ic.gc.ca/epic/site/dir-ect.nsf/fr/h_uw00890f.html Votre produit, votre nom (accès intuitif) chocolats.miam-miam.ca Éviter dinclure le fournisseur daccès (Bell, Videotron, etc.) Les noms de domaines sont payant et réglementé. Généralement.com ou.ca

9 Noms de domaines.com - Destiné à être utilisé par les domaines commerciaux..org - Destiné à être utilisé par les organismes non-commerciaux..biz - Destiné aux entreprises..info - Destiné aux organismes fournissant de linformation..name - Limité aux noms des particuliers..net - Principalement utilisé par les entreprises et les organismes disposant dun réseau..edu - Limité aux établissements denseignement qui sont des collèges ou universités offrant un programme de quatre ans..mil - Limité au secteur militaire des États-Unis..gov - Limité au gouvernement des États-Unis..int - Limité aux organismes dont lexistence résulte dun traité international..museum - Limité aux musées..coop - Limité aux coopératives.

10 Entête des pages Web (Racine invisible de notre arbre)

11 Entête des pages Web Les entêtes de pages doivent contenir les éléments : Titre ( ) Description Mot-clé Il faut penser à ces données pour toutes les pages du site.

12 Titre de la Page Utilisez un titre pertinent, court et expressif. Nécrivez pas un paragraphe. Nécrivez pas une suite de mots descriptifs. Généralement, le nom du site suivi par le nom de la page. (ex : COM2580 Applications Web – Evaluation)

13 Description Assurez-vous de connaître parfaitement le contenu du site. Énoncez de manière claire et concise les fonctions ou services décrits dans votre site. Rédigez le texte comme sil sagissait dun texte publicitaire. Employez des mots susceptibles dattirer la clientèle. Incorporez le plus de mots-clés possibles. Assurez-vous dinclure les méta-références dans le code source. Employez entre 100 et 200 caractères.

14 Mots-Clés Prévoyez les mots-clés que votre clientèle cible utilisera pour chercher ce que vous offrez. Considérez les mots-clés comme un moyen dattirer lattention sur votre site. Choisissez le singulier ou le pluriel, de faire des phrases. Ne répétez pas les mots-clés plus de 3 fois car vous serez pénalisé. Ninscrivez pas des mots qui sont sans rapport avec le contenu de votre page. Nutilisez pas plus de 20 mots-clés.

15 Dans Dreamweaver Description et Mots-clé Titre

16 HTML Tutorial COM2571

17 Organisation des fichiers dun site Web

18 Création dun nouveau site avec Dreamweaver Dreamweaver permet de créer un nouveau site et son infrastructure. Il est aussi possible de gérer ses sites à distance avec Dreamweaver (voir cours Intégration Web)

19 Création dun nouveau site avec Dreamweaver

20

21 Organisation des fichiers Créer des répertoires pour : Les images Les styles Éventuellement pour larborescence du site si celui-ci est massif

22 Arborescence des fichiers

23 Concrètement ça donne quoi?

24 Il est important de laisser le chemin relatif au document.

25 Et pour les hyperliens?

26 Comme pour les images, il est important de laisser le chemin relatif au document. Menu1

27 Les structures de page Web

28 On va apprendre un nouvel élément HTML!

29 La division Lélément div permet de séparer sa page Web en plusieurs parties. Cest utile pour la mise en page. Cest utile aussi pour regrouper les éléments ensembles.

30 La division

31 Vous êtes obligés de remplir lattribut id. Plusieurs div peuvent avoir la même valeur pour lattribut id. Pour lattribut class, on verra ça plus tard avec les feuilles de style.

32 HTML Bienvenue!

33 Atelier

34 Créez un nouveau site Web avec Dreamweaver. Vous devez concevoir une page Web avec plusieurs divisions. Il doit y avoir au moins : Une division dentête où vous mettrez plusieurs liens pour faire une sorte de menu, Une division pour le contenu, Uns division pour le pied de page. La division dentête doit contenir des liens vers dautres pages que vous aurez créés.

35 Des questions??? Merci de votre attention! A la semaine prochaine! gregory.petit@umontreal.ca http://lrcm.com.umontreal.ca/greg/COM2580/