Le code source
Avec nous vous êtes propriétaire du code source de votre site internet.
La meilleure façon de se faire une idée de ce qu’est le code source, c’est d’aller voir ! Regardez le code source de cette page en cliquant sur “Affichage” puis “source” (l’intitulé exact du menu dépend de votre navigateur).
Ca y est ? Je sens dans votre regard que vous êtes plutôt perplexe:-)
A priori cela n’a pas l’air très motivant. Mais dans certains cas on aura besoin de modifier directement le code source :
- pour y inclure du code php
- pour corriger des bugs (lorsqu’un bloc est trop petit pour le voir dans l’éditeur WYSIWYG par exemple)
- pour ajouter des éléments qui n’existe pas dans l’éditeur utilisé.
Les balises
Le langage HTML est composé de balises. Une balise est un mot clé entouré des symboles < et >. On écrit un mot clé pour ouvrir la balise et le même mot clé avec un “/” en plus pour la fermer.
Par exemple lorsque j’écris <strong>coucou</strong>, cela signifie que “coucou” doit être mis en valeur. Cela se traduit par l’écriture en gras du texte dans la plupart des navigateurs. <strong> est la balise ouvrante et </strong> la balise fermante.
Le squelette d’une page
Toute page commence par la balise <html> et se termine par la balise </html>.
Ensuite on trouve <head> et </head>. Entre ces deux balises on écrira les informations d’entête. Elles sont invisibles pour le lecteur mais apportent des informations pour le logiciel navigateur ou pour les moteurs de recherche. Cela peut être une description de la page, des mots clés, le nom de l’auteur, le type de police, le nom de l’éditeur utilisé pour créer la page, …
Vient ensuite la balise la plus importante qui va délimiter le code qui génèrera la partie visible de la page : <body> et </body>.
Ce qui donne donc pour la page :
<html>
<head>
<TITLE>Creation site internet - Michael B</TITLE></head>
<body>
Creation site internet
</body>
</html>
Quelques balises
Voici quelques balises qui vous permettront de repérer les éléments les plus importants d’une page :
| <table></table> | Tableau. Tout ce qui se trouve entre ces balises fait partie d’un tableau. |
| <tr></tr> | ligne d’un tableau |
| <td></td> | à l’intérieur d’une ligne, délimite chaque cellule |
| <form></form> | formulaire |
| <li></li> | liste à puce |
| <a></a> | lien hypertexte |
| <p></p> | Paragraphe |
| <center></center> | centrer du texte (balise abandonnée en XHTML Strict) |
| <br /> | passer à la ligne. Pas de balise fermante, donc on rajoute un / en XHTML |
| <title></title> | permet de spécifier le titre de la page. |
Les attributs
Toutes ces balises sont accompagnées d’attributs. En effet, tous les tableaux n’ont pas la même apparence. Pour les différencier on ajoute des mots clés que l’on appelle attributs.
Exemples : un tableau avec une bordure de 1 pixel s’écrira :
<table border=”1″> Contenu du tableau </table>
Un lien hypertexte s’écrira :
<a href=”http://www.creationdesiteinternetparis.com”>Creation site internet</a>
Rappel : en XHTML on n’utilise pas les attributs de mise en page. Dans l’exemple ci-dessus on n’écrirait pas “border=1″, mais on mettrait cette information dans une feuille de style.
POUR DEMANDER UN DEVIS CLIQUEZ-ICI
POUR RETOURNER A L’ACCUEIL CLIQUEZ-ICI
