[tutoriel] Créer un site internet

Je ne sais pas si ça interesse beaucoup de monde, mais bon... je me lance Cool

Donc voilà, de nos jours de plus en plus de monde désire créer son propre site internet.
Donc moi je vais essayer de vous apprendre à en faire un ^^ Bon rien de très compliqué, avec moi vous allez apprendre le html (ou Xhtml, c'est pareil), c'est à dire un langage très simple qui vous permettra de faire de jolies pages web.

Plan du tuto :
1) créer un site web, oui mais pour qui ? Pourquoi ?
2) le matériel
3) les bases du html
4) mettre une image et un lien
en construction...

Première partie : Créer un site... Oui, mais pourquoi ? Pour qui ?

Le premier truc à faire avant de créer un site c'est... de savoir précisemment de quoi vous allez parler ! ça peut paraître débile comme conseil et pourtant... Parfois on est tellement heureux de savoir manier quelques balises qu'on désire créer un site... sans pour autant savoir que mettre dedans mdr (je parle de vécu là xD ). Donc d'abord, le sujet. Un site sur les chevaux ? Certes, mais bon ça reste vaste. Sur l'ethologie ? C'est déjà plus précis. Cernez bien votre sujet pour être sûre de ne pas parler de tout et de n'importe quoi et de noyer les visiteurs sous des infos.

Bon vous connaissez le thème général de votre site, c'est bien. Maintenant, il faut voir ce que vous allez mettre dedans ! C'est là que je vous conseille de prendre un papier et un crayon pour noter toutes vos idées ^^ Ensuite, vous pourrez les regrouper dans des catégories afin de voir un peu à quoi le contenu de votre futur site ressemblera. Une partie photos, une partie actualité, une partie histoire par exemple... Ce ne sont que des exemples, vous mettez ce que vous voulez xD

Arrivé là, vous connaissez donc à peu près le contenu de votre site, c'est un excellent début ^^

Maintenant, dernière chose avant de commencer sa création... Savoir ce que vous allez ajouter au monde du web et quel public vous visez. En effet, comme vous l'aurez remarqué, Internet croule sous le nombre de sites. Je ne sais pas combien il s'en créé chaque jour mais c'est assez énorme lol ! Dont certainement plusieurs traitant le même sujet que le vôtre...
Alors pourquoi voulez-vous en faire un ? Réfléchissez bien à cette question, je n'ai malheureusement pas de réponse à vous donner. Mais si vous pensez que votre site sera totalement inutile alors c'est vous qui voyez ^^ Mais bon le seul fait de vouloir pratiquer pour progresser est (selon moi) un excellent argument Wink

Quant à la cible... Je fais juste cette petite parenthèse pour souligner le fait qu'un site ne sera pas identique selon que vous visez un public jeune ou non, de débutants ou d'expérimentés. Je ne vais pas débattre plus longtemps là-dessus, mais n'oubliez pas cela Wink

Deuxième partie : le matériel.

Pour faire du html, peu de matos suffit, d'ailleurs en général vous avez ce qu'il vous faut sur votre ordi. Un logiciel simple comme le bloc notes suffit. Personnellement, j'ai téléchargé notepad++ , je le trouve tout simplement génial ! Mais vous n'êtes pas obligés de le prendre, le bloc notes marche très bien aussi.

Pour télécharger notepad , clique ici Wink

Troisième partie : les bases du html.

Bon je rappelle que le html et le Xhtml sont exactement le même langage. Xhtml serait même un terme plus correct, mais j'ai l'habitude de l'autre :oops:

Tout d'abord, les balises. Ce langage est composé de nombreuses balises. Ces balises sont invisibles pour le visiteur du site. Vous vous demandez sûrement alors à quoi elles servent lol ! C'est tout simple, les balises indiquent au navigateur (internet explorer, mozilla firefox et tant d'autres) où se situent les images et comment se présente le texte (s'il est en gras ou souligné par exemple, ou bien en couleur, les retour à la ligne...) etc. Elles permettent de ne pas voir un texte uniforme sur une seule ligne sans retours à la ligne ni rien et donc de faire une page bien plus esthétique et lisible... quoique sans certaines balises votre texte ne s'afficherait même pas mdr

Une balise se présente de cette manière là :

[tutoriel] Créer un site internet Balisege3

[tutoriel] Créer un site internet Balisege3

Le "/" indique qu'on referme une balise précedemment ouverte. N'oubliez pas de les refermer sinon ça fera buguer votre page lol.

Voilà quelques balises très utiles :

[tutoriel] Créer un site internet Balise2yl9

[tutoriel] Créer un site internet Balise2yl9

Je n'ajouterai pas de balises pour le moment, avec cela vous avez déjà la base ^^

Bon maintenant que vous savez ce qu'est une balise, on va commencer à préparer la page...
Donc ouvrez notepad++ (ou le bloc note ou n'importe quoi d'autre), et recopiez le code suivant :

[tutoriel] Créer un site internet Fondpagehtmlwu8

[tutoriel] Créer un site internet Fondpagehtmlwu8

ça, c'est la structure de base d'une page web.
Vous remarquerez que la page se commence et se termine par les balises "html", ça indique au navigateur quel langage va être utilisé sur la page.
Entre les balises "head", vous pourrez indiquer le titre de votre site par exemple, ou encore des informations pour le navigateur comme quoi il faut se référer à une feuille de style... Mais n'allons pas trop vite pour le moment :5:
Enfin, entre les balises "body", se sera le contenu de votre page web : votre texte, vos images...

Bon maintenant, voyons une autre balise, très importante, la balise du paragraphe. A l'intérieur de cette balise vous allez pouvoir écrire votre texte normalement.
Je vous montre un petit exemple :

[tutoriel] Créer un site internet 17762915yw9

[tutoriel] Créer un site internet 17762915yw9

Donc la balise avec le "p" est indispensable.

Ensuite, une autre petite balise rapidemment : la balise <br>
Elle ne se ferme pas, c'est juste une balise qui indique un retour à la ligne, c'est tout. Elle se met au milieu d'un paragraphe :)

Arf faut que je vous laisse sorry :oops:

Désolée d'avoir tout laissé en plan comme ça lol. Donc je reprends...

Donc maintenant vous avez donc la balise du paragraphe et du retour à la ligne. Vous pouvez donc commencer à créer votre site web. Pour le moment, on va faire le texte d'accueil tout simplement. Je vous rappelle que vous avez appris les balises paragraphes, mais aussi italique, gras et souligné ^^ Avec ces quelques balises vous allez pouvoir créer un texte d'intro Smile

[tutoriel] Créer un site internet 95383541ib5

Votre texte est créé, il suffit de le mettre entre les balises et sur votre squelette de page web.

Bon maintenant vous savez donc faire à peu près une page web toute simple. Moche car sans couleurs, sans design, sans vraiment d'effet sur le texte, sans images etc etc, mais une page web tout de même et ça c'est le plus important.

Je vous apprendrai à faire une belle page plus tard, pour le moment, on va terminer cette page là. Vous allez donc apprendre à créer des liens et à mettre des images sur votre page.

IV ème partie : insérer une image et mettre un lien.

Comment faire pour afficher une image ? Tout simplement en se servant d'une balise xD Et oui, une de plus ! Et c'est pas fini mdr
Donc cette balise, la voilà :
[tutoriel] Créer un site internet 40929448lc5

[tutoriel] Créer un site internet 40929448lc5

Vous remarquerez qu'elle se présente différemment des balises vu précedemment.

Bon vous vous en doutez, si vous mettez juste ça, vous n'aurez pas grand chose :5:
Bon je vous montre comment ça se présente, je vous expliquerai après :8:

[tutoriel] Créer un site internet 85104652pp5

[tutoriel] Créer un site internet 85104652pp5

Vous reconnaissez donc les balises image. Et vous voyez apparaître deux autres trucs : "src" et "alt".
"Src" signifie "source", vous mettez ensuite l'adresse où l'image se trouve entre guillemets. Elle se trouve souvent dans un dossier "images", d'où ce nom, et ensuite on met le nom de la photo, moi je l'ai nommée "photo1.jpg". N'oubliez pas de bien mettre si c'est jgp, gif, png etc ^^
"Alt" signifie euh... pour tout vous avouer j'en sais rien, on va dire que ça signifie Attaque La Tentacule Cool

*sors* Plus sérieusement je ne sais pas trop, mais ça n'a pas d'importance. Ce "alt" sert à ajouter un petit texte lorsqu'on passe le curseur sur la photo.

Vous avez compris comment mettre une image ?? On va passer à la dernière étape de la page en elle-même... les liens Cool

» Navigateur internet
» sites internet
» J'ai fais une rencontre internet !