Remerciez-le!

Remerciez @Admin pour avoir partagé cet document gratuitement, de la manière la plus simple, en partageant sur les réseaux sociaux.

Auteur : M@teo21 Créé le : 20/07/2005 à 23h22 Modifié le : 05/08/2006 à 17h30 A

Auteur : M@teo21 Créé le : 20/07/2005 à 23h22 Modifié le : 05/08/2006 à 17h30 Avancement : 100% Imprimer tout le tutorial Vous aimez ce cours ? Alors vous aimerez le livre du même auteur ! Apprenez à créer votre site web ! Comment on fait un site web ? C'est compliqué ? C'est long ? C'est pour les pros ? Que nenni ! Faire un site web aujourd'hui, c'est facile et passionnant. Pas besoin d'être un expert pour en faire un, il suffit juste d'avoir un tutorial qui vous explique depuis le début comment ça fonctionne, à votre rythme. Ca tombe bien, car j'ai créé ce tutorial spécialement pour vous qui n'y connaissez rien. Ici, pas de connaissances requises. On part de Zér0, depuis le début, et on apprend au fur et à mesure comment ça fonctionne. Faites chauffer vos claviers, vous allez bientôt impressionner vos proches ! Ce cours est composé des parties suivantes : Les bases du XHTML I. C'est plus joli avec du CSS ! II. XHTML & CSS, toujours plus forts ! III. Annexes IV. Partie 1 : Les bases du XHTML Découvrez ce qu'est le XHTML... Et apprenez à vous en servir pour faire votre site web ! 1) Avant de commencer... XHTML ? CSS ? C'est quoi ça ? L'éditeur Les navigateurs Q.C.M. 2) Votre première page XHTML Les balises et attributs Une page XHTML Les commentaires Q.C.M. 3) Organiser son texte Les paragraphes Les titres Mettre en valeur le texte Quelques balises plus rares (mais utiles !) Q.C.M. 4) Créer des liens Relatif ou absolu ? Un lien vers une autre page Un lien vers une ancre Q.C.M. 5) Les images Différents formats d'images Insérer une image Q.C.M. Partie 2 : C'est plus joli avec du CSS ! Maintenant que vous connaissez les bases du XHTML Donnez du "style" à votre page ! 1) Mettre en place le CSS Où mettre du CSS ? Appliquer un style à des balises Utiliser les class et id Q.C.M. 2) Formatage du texte en CSS (partie 1/2) Taille du texte Polices Alignement Q.C.M. 3) Formatage du texte en CSS (partie 2/2) Effets de style Les couleurs Le fond Q.C.M. 4) Les pseudo-formats Des liens sympas Première lettre et première ligne Avant / Après Q.C.M. Partie 3 : XHTML & CSS, toujours plus forts ! Non, vous n'avez pas encore tout vu, Combinez XHTML et CSS, c'est magique ! 1) Les listes à puces Différents types de listes (XHTML) Décorez vos listes (CSS) Q.C.M. 2) Mise en boîte (partie 1/2) Block et Inline c'est pas pareil ! La taille Les bordures Les marges Q.C.M. 3) Mise en boîte (partie 2/2) Transformer un inline en block (et vice-versa) Les flottants Positionnement absolu, fixe et relatif Q.C.M. 4) Créons le design de votre site web ! Bon, par quoi on commence ? Primo, le XHTML Secundo, le CSS Attendez, c'est pas fini ! 5) Les tableaux Un tableau simple Des tableaux plus élaborés Et avec un peu de CSS... Q.C.M. 6) Les formulaires Créer un formulaire Les zones de saisie Elements d'options Un formulaire accessible et design ? Y'a plus qu'à appuyer sur le bouton ! Q.C.M. 7) Et maintenant, on fait quoi ? (Conclusion) L'heure du bilan a sonné On va quand même pas s'arrêter là ? Q.C.M. Partie 4 : Annexes Les annexes contiennent d'autres informations qui vous seront utiles lors de la création de votre site web, comme des Mémos (résumé), ou encore des explications sur la façon dont on envoie un site sur le web. Vous n'êtes pas obligés de lire ces informations à la fin, vous pouvez vous en servir n'importe quand lors de votre lecture du cours. 1) Envoyez votre site sur le web Le nom de domaine L'hébergeur Utiliser un client FTP Vous aimez ce cours ? Alors vous aimerez le livre du même auteur ! 2) Gagner de l'argent grâce à la publicité Qu'est-ce qu'une bonne publicité ? Installation d'une bannière publicitaire Le vocabulaire de la pub Vos questions courantes 3) Le W3C et les standards du web L'histoire du web Du HTML au XHTML Votre site est-il valide ? 4) Liste des propriétés CSS Propriétés de formatage de texte Propriétés de couleur et de fond Propriétés des boîtes Propriétés de positionnement et d'affichage Propriétés des listes Propriétés des tableaux Autres propriétés 5) Liste des balises XHTML Balises de premier niveau Balises d'en-tête Balises de structuration du texte Balises de liste Balises de tableau Balises de formulaire Balises génériques Partie 1 : Les bases du XHTML Découvrez ce qu'est le XHTML... Et apprenez à vous en servir pour faire votre site web ! Avant de commencer... Bonjour et bienvenue à toutes et à tous ! Voici donc le premier chapitre de ce cours pour débutants, qui va vous apprendre à créer votre site web ! Nous allons passer quelques temps ensemble, tout dépendra de la vitesse à laquelle vous apprendrez. Si vous lisez ce cours régulièrement et à une bonne vitesse, vous l'aurez terminé en une semaine. Mais si vous avez besoin d'un peu plus de temps, ne vous inquiétez pas : le principal est que vous y alliez à votre rythme, en prenant du bon temps. Ah, mais je parle, je parle, et je ne me suis pas encore présenté Donc moi, c'est M@teo21 (du moins c'est mon pseudo, vous vous doutez bien que ce n'est pas mon vrai nom ) Je serai votre guide tout au long de ce cours... Je vais essayer de faire en sorte que l'apprentissage soit pour vous un vrai plaisir Ce tutorial va donc vous apprendre à créer un site web de A à Z. Vous allez y découvrir 2 langages informatiques, appelés XHTML & CSS. Ce sont eux qui vous permettront de créer votre site web. Commençons tout de suite par voir ce que sont ces langages au nom... plutôt imprononçable XHTML ? CSS ? C'est quoi ça ? Pour créer un site web, on doit indiquer des informations à l'ordinateur. Il ne suffit pas de simplement taper le texte qu'il y aura dans son site, il faut aussi savoir placer ce texte, insérer des images, faire des liens etc... Pour expliquer à l'ordinateur ce que vous voulez, il va falloir utiliser un langage qu'il comprend. Il existe des langages qui servent à créer des programmes, comme le C++ ou encore le Java. Ces langages sont néanmoins complexes et destinés à des personnes qui ont déjà quelques connaissances en informatique. Les langages XHTML et CSS, eux, servent précisément à créer des sites web, et ils ont été créés de manière à être simples à utiliser. Mon rôle sera de vous apprendre à vous en servir. Bon, mais pourquoi apprendre 2 langages pour créer un site web ? Un seul n'aurait pas suffit ? C'est vrai que, quand je vous dis que vous allez apprendre 2 langages à la fois, vous vous demandez si ce n'est pas déjà trop pour vous. Pas d'inquiétude, vous allez vous rendre compte au fur et à mesure que tout a été très bien pensé. Chacun de ces 2 langages sert à faire quelque chose de précis, et les deux se complètent naturellement pour au final donner un site web : XHTML : c'est l'abréviation de eXtensible HyperText Markup Language. Entre nous, si vous ne retenez pas ce que ça veut dire, ça ne vous empêchera pas de dormir Ce langage XHTML, c'est celui avec lequel vous taperez le contenu de votre site web. Il contient des informations logiques : vous direz par exemple "Ceci est mon titre, ceci est mon menu, là c'est le texte principal de la page, là il y a une image etc etc...". Le XHTML est le langage qui remplace l'ancien, appelé HTML, dont vous avez peut-être entendu parler. Il y ressemble assez, mais le fonctionnement du XHTML est beaucoup mieux pensé. Bref, c'est lui le plus récent, c'est donc lui que nous allons apprendre. CSS : c'est l'abréviation de Cascading Style Sheets ("Feuille de style"). Ce langage nous sert uniquement à présenter la page web. C'est en CSS que l'on dira : "Mes titres sont en rouge et sont soulignés, mon texte est dans la police arial, mon nom est centré, mon menu a un fond blanc..." etc etc. Grâce à ce langage, nous allons pouvoir créer rapidement et simplement la mise en page de votre site. Nous pourrons ainsi lui donner une belle présentation, sans pour autant être des experts en graphisme (et ça tombe bien, parce que côté graphisme je suis carrément nul ) En résumé, on se sert de : XHTML pour écrire le contenu de nos pages web. CSS pour présenter ce contenu. Ces langages sont donc complémentaires, l'un ne va pas sans l'autre. Si vous retenez que XHTML sert à taper le contenu, et CSS à présenter ce contenu, alors croyez-moi : vous avez déjà compris 95% du principe ! Dans la première partie de ce cours pourtant, on ne va pas parler de suite de CSS. uploads/s3/ le-site-du-zero-apprenez-a-creer-votre-site-web-100.pdf