Post on 04-Apr-2015
Comment monter son propre site WEBLes outils (partie 2)
Présenté au ClubRIB
par Daniel Pelletier
le 10 mars 2011
But de la présentation
• Comment fonctionne un navigateur Web et HTTP.
• Comment fonctionne HTML.
• Outils pour faire un site Web
Comment s’affiche une page Web?
get
/logo.gif
enter
get "logo.g if"
/index.htm l
affiche
N avigateur W ebU tilisateur H ébergeur W eb R éperto iredu site W eb
C om m andes H TTP
logo.g if
index.htm l
Fichier HTML• Décrit comment est composée une page
Web
• 100% texte
• Contient des balises (« tags ») qui indiquent comment formatter les sections de la page.
Format des balises HTML• Une étiquette encadrée entre un < et un >
(exemple: <table>)• Habituellement en couple qui encadre soit d’autres
balises, soit du texte: – balise de début (exemple <table>)
– balise de fin avec étiquette précédée par un /(exemple: </table> )
• Certaines sont célibataires: le / se trouve après l’étiquette (exemple: <br/>)
• Peuvent posséder un ou plusieurs attributs qui suivent le nom d’étiquette (exemple <table border="1">)
Types de balises• <p> : changement de paragraphe• <br>: retour à la ligne (« break »)• <strong> ou <b>: texte en gras• <em> ou <i>: texte en italique• <a>: hyperlien (« anchor »)• <img> : image• <div> : conteneur de section• <h1> <h2> <h3>… : titres de niveau• <table> <tr> <td>… : tableau• <ul> <li> : liste énumérative (« unordered »)• <ol> <li> : liste numérotée (« ordered »)
Exemple d’une page HTML
Pour en savoir plus sur le HTML
• http://fr.html.net/tutorials/html/
• http://mendeleiev.cyberscol.qc.ca/carrefour/formation/html/html1.html
• http://www.startyourdev.com/HTML/Balise-DIV.html
Outils pour faire un site Web• Aucune connaissance en informatique
requise.
• Requiert les outils:– Un éditeur HTML, pour composer les pages
Web sous forme de fichiers HTML.– Un programme de transfert FTP, qui permet de
transférer les fichiers vers l’hébergeur.
Editeurs HTML• KompoZer et Komodo Edit: gratuitiels de
grande qualité – WYSIWYG et/ou source HTML– Transfert FTP intégré– Aperçu des pages
• Notepad++: gratuitiel– éditeur de texte HTML seulement– Outils d’édition
Transfert FTP
• Peut se faire au moyen d’un navigateur, par exemple: ftp://pages.videotron.com/
• WinSCP: gratuitiel FTP très convivial avec interface Windows Explorer
Téléchargements
• KompoZer et son guide d’utilisation
• Komodo Edit
• WinSCP et son guide d’utilisation
• Notepad++