Présentation

Liens

Créer un Blog

Recherche

Calendrier

Juin 2012
L M M J V S D
        1 2 3
4 5 6 7 8 9 10
11 12 13 14 15 16 17
18 19 20 21 22 23 24
25 26 27 28 29 30  
<< < > >>
Lundi 20 juillet 2009 1 20 /07 /Juil /2009 19:10

Cette partie est la suite du chapitre préédent. Nous avions été maloncontreusement coupés, à cause d'une sombre histoire de mots dépassés .

Heureusement, j'ai décidé que vous ne seriez pas les vistimes de cet incident. De ce fait, je n'ai infligé aucun dommage à mon clavier qui demeure intact, et au lieu d'aller me questionner sur l'utilité réélle des blogs qui n'est apparement pas d'ecrire des articles utiles, mais plutot de photographier le plafond  ,encore mieux son Hamster ou meme preferer les phrases sobres du genre :  ce matin j'ai mangé un croissan ( Ah, dsl c'est facebook ça ); j'ai décidé de continuer d'écrire pour toi publique ...

 

Un peu de pratique

L'heure est venue de créer votre première page.
TU VAS LA FERMER OUI ? c’est la millième fois que j’entend ça

Désolé :

1- Créez un répertoire (ou vous voulez), cette partie n’est pas essentielle mais vous en aurez vite besoin dans de prochains chapitres.

2- ouvrez Notepad++


Ceci est le code dont je me suis servi au début pour vous donner une idée de la structure d’une page.

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" >

        <head>

                <title>Cou cou je suis ton pire cauchemard</title>

                <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />

        </head>

        <body>



              <!-- c'est ici qu'on bossera le plus   -->



        </body>

</html>

 



 

3-  Copié-collé le dans votre page.

Au passage, si vous avez bien choisi HTML dans langage comme je vous l’avais expliqué précédemment. Vous devriez voir les balises d’une couleur bleu, et les attributs d’une couleur rouge ( Comme les versions de Notepad++, changent, l’essentiel est que les balises et les attributs soient de deux couleurs différentes ).

4-  Faites Fichier à Enregistre sous.

Dans le nom du fichier mettez ce que vous voulez(index, de préférence ). Et dans type choisissez « Hypertext Makup Langage ».

5-  Sauvegardez puis quittez.

6-  Allez dans votre dossier puis double cliquez sur le fichiez que vous venez de créer.

            Le navigateur web va ouvrir une page vierge...



Bravo !!!, vous venez de créer votre première page WEB et elle est blanche ...



Ce tuto de *******, ça fait 15 minutes que je me ************* à ****** pour sa !!!!!!

 

Mais ne vous énervez pas comme ça, vous avez fait du très bon travail .

Déjà les balises qui se trouvent dans le document, ne sont pas apparu dans le navigateur ce qui veut dire que le navigateur les a traduites en quelque sorte. En plus si vous allez regarder la fenêtre dans la barre des taches vous allez voir : « Cou cou je suis ton pire cauchemar »

Eh oui, c'est la phrase dans la balise <title> </title>.

Enfin, si vous n’estes toujours pas convaincus, vous pouvez toujours aller dans body et écrire ce que vous voulez entre la balise suivant :

<h1> </h1>.

 

Exemple :

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" >

        <head>

                <title>Cou cou je suis ton pire cauchemard</title>

                <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />

        </head>

        <body>



<H1>
Bonjour, je suis un apprenti programmeur qui a perdu la foi. Je lis depuis maintenant 1 bonne heure ce tutoriel et je n’ai rien appris </H1>

</H1>



        </body>

</html>



     7- Réenregistrez la page et ouvrez la de nouveau.

                  

Remarque:

La balise dans laquelle nous avons inséré notre texte est une balise qui sert normalement à ecrire des titres. Nous la retrouverons dans le prochain chapitre.



  

Index.html ou index.php

 

Si vous avez un jour prêté attention à votre barre de navigation d’internet vous avez sans doute déjà vu le mot index.

En fait le livre de la jungle version internet, veut que index soit donné à la page qu’on veut afficher en premier.

Je vous donne un exemple, je veux par exemple allez sur un site qui s’appelle gogo.com quand je m’y connecte c’est comme si je rentrais dans le dossier de se site. Ce dossier contient plusieurs pages qui ont un nom différent. La page qui s’appellera index sera la page que j’afficherai sur mon navigateur.

Remarque :

« index.html » doit bien être écrite sous cette forme, c'est-à-dire en minuscules et porter une extension à la fin.

Si le site se trouve dans un dossier qui contient un autre dossier qui contient une page appelée index.html, la page html se trouvant dans le premier dossier et non le sous dossier sera affiché.

 

 

Les commentaires


Disponibles dans absolument tous les langages, les commentaires vous servent de repère afin que vous puissiez comprendre ce que vous avez fait.

C’est comme si vous vous parliez à vous même en quelque sorte.

Ça ne serre a rien alors.

Détrompez-vous …

Imaginez que vous quittiez votre site pendant 3 mois, et que passé se délai vous vouliez corrigé un bug graphique que vous venez de remarquer. Dans ce cas le commentaire vous aidera a mieux comprendre ce que vous avez fait.

D’autant plus que votre page ne va pas contenir 5 ou 10 lignes comme maintenant mais bien des centaines de lignes.

 

On les ecis de la manière suivante : <!-- commentaire -->



Exemple :



<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" >

        <head>

                <title>Cou cou je suis ton pire cauchemard</title>

                <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />

<!-- La partie ou on travaillera le moins -->       



        </head>

<body>



<!-- Vous allez deseter toute vie sociale grâce a cette partie -->   



</body>



</html>
<!-- Elle restera vide pour la fin des temps, en fait meme les commentaires n'existent pas içi ( c'est juste un exemple ) -->  



Fini pour cette deuxieme partie  .

Alors bien ou pas, et ça n'est rien. Dans le prochain chapitre, on va rentrer dans le vif du sujet. Ce sera d'ailleur la partie la plus improtante de tout le tutoriel, puisqu'elle vous apprendra a utiliser la plupart des balises HTML disponibles ( Vous souhaitez la lire ?? ça vous coutera 20 commentaires )...

Par Renji - Publié dans : HTML/CSS
Ecrire un commentaire - Voir les 0 commentaires
Retour à l'accueil
 
Créer un blog gratuit sur over-blog.com - Contact - C.G.U. - Rémunération en droits d'auteur - Signaler un abus