COMMENT CRÉER UN SITE WEB
Faite une recherche
par mot clé sur toutes les pages de mon site
Introduction
Éditeurs HTML de base
Éiteurs HTML en mode texte
Éditeurs HTML WYSIWYG (What You See Is What You Get)
Éditeurs HTML de type convertisseur
Éditeurs HTML et caractères accentués
Logiciels de retouche d'images/photos
FTP (File Protocol Transfer)
Organisation des fichiers
Nom de domaine
Hébergement
Site Web
Pour créer un site Web, il vous faut normalement trois logiciels; un logiciel d'édition HTML, un logiciel d'édition d'images (facultatif) et un logiciel de transfert FTP. Codage HTML
Avant de choisir un logiciel d'édition HTML, il est important de se familiariser avec son codage.
Le codage HTML représente la charpente d'un site Web. Pour ceux qui n'ont aucune notion de base en programmation, voici quelques ouvrages utiles disponibles en français sur le Web. Logiciels d'édition HTML
Éditeur HTML WYSIWYG (Mode normal) 4. Éditeur HTML de type « convertisseur » Les caractères accentués et les éditeurs HTML
Si un éditeur HTML ne possède pas de fonction de caractère spéciaux ou accentués, voici les autres solutions
possibles; Pour un document XML, le type de codage est indiqué sur la première ligne du document comme suit Éditeurs HTML gratuits et payants
1. Éditeurs HTML de base et en mode texte gratuits Parmi les éditeurs payants les plus connus, on retrouve : Dreamweaver de Macropedia, FrontPage de Microsoft, WebExpert 4.0 de Visicom Media,
GoLive d'Adobe, et WebEditor de Namo. Logiciels d'étition d'images payants
Les logiciels d'édition d'images les plus connus sont Logiciel de transfert FTP Comme il a été dit précédemment, certains éditeurs sont munis de leur propre application FTP. Pour les autres éditeurs HTML, on doit utilser un logiciel FTP.
Logiciels FTP Payants Logiciels FTP gratuits Comment procéder : Le premier écran « système local » contient tous les fichiers créés pour le site Web. Le deuxième écran « système distant » est destiné à recevoir les fichiers sur le site d'hébergement.
« Filezilla est un client FTP libre, gratuit et en français qui permet de transférer des fichiers (sons, images, vidéos, html etc.) de votre ordinateur vers votre page perso ou votre site Internet.
« Votre page Web commence dans votre répertoire personnel dans un dossier (ou répertoire) appelé public_html. C'est à cet endroit que vous placerez tout le matériel relié à votre site Web (fichiers et dossiers). Nom de domaine : Domain Name System (DNS)
Le nom de domaine permet à l'utilisateur de choisir le nom spécifique de son adresse, ceci est particulièrement intéressant pour les entreprises ou organismes qui ont besoin d'être repéré facilement grâce à leurs adresses. « La procédure d'obtention des noms de
domaine générique (.com, .net .org) Traditionnellement,
on distingue les noms de domaine génériques
des noms de domaine géographiques.
Du fait de leur connotation internationale, les premiers sont les plus
populaires. Il s'agit essentiellement des
« .com »,
« .net »,
« .org ». Ces noms de domaine
peuvent être enregistrés par n'importe quel
registraire quelque soit le pays du requérant. Au Canada
trois nouveaux registraires de « .com »
viennent d'être accrédités par ICANN,
l'organisme privé qui administre au niveau international le
système des noms de domaine (www.icann.org Les noms de domaines géographique
L'attribution des noms de
domaine géographiques
relève d'une toute autre organisation - donc hors des
compétences de ICANN. Les domaines
« .ca »,
« .fr »,
« .uk », par exemple, sont
administrés par des organismes nationaux selon une charte de
nommage propre à chaque pays. Au Canada, le domaine
« .ca »
est géré par une équipe informatique
de l'Université de Colombie Britannique. Le
répertoire des noms de domaine « .ca » doit
être transféré d'ici
l'été 2000 à un nouvel organisme, l'Autorité
canadienne pour les enregistrements Internet ou ACEI
(ou, en anglais, la Canadian Internet Registration Agency,
CIRA, www.cira.ca). Ce registraire
assumera la gestion du domaine canadien et veillera à
l'application d'une nouvelle politique d'attribution. En attendant
cette restructuration les anciennes règles d'attribution
sont toujours en vigueur. » -- Les noms de domaine au Canada : ".ca" et ".com" /Par Maître Pierre-Emmanuel Moyse.
On doit coder manuellement tout le code HTML dans l'éditeur.
Source :
Site officiel de la province de Liège
2. Éditeurs HTML en mode texte
Il s'agit d'un éditeur HTML avec une interface similaire à un éditeur de texte (ex. Word) i.e.
muni d'un barre d'outil plus ou moins élaborée
qui permet l'intégration automatique de certaines balises.
et l'utilisation de fonctions variées.
L'utilistaur de ce type d'éditeur n'a pas à connaître le langage HTML pour construire un Web. On inscrit son texte
normalement (comme dans Word) dans l'éditeur. Le codage HTML se fait automatiquement.
Vous pouver voir le codage en cliquant sur le « mode HTML ». Toutefois les éditeurs « WYSIWYG » ne font pas de miracle,
pour ceux qui ne connaissent pas le codage HTML, ils vos faudra vous contenter de ce que l'éditeur vous offre par défaut comme choix de typographie, couleurs, etc.
Pour les plus expérimentés, il est possible de modifier le codage existant dans le mode HTML pour réaliser.
Une de ces fonctions permet de
voir la page web tel qu'elle apparaîtra dans un navigateur
après son transfert sur le Web. Cette fonction permet de vérifier continuellement le codage
avant de l'enregistrer et ainsi éviter de trop grosses corrections après coup.
Source :
Toolcharger.com: Aperçu du logiciel CoffeeCup HTML Editor.
3. Éditeurs HTML WYSIWIG (What You See Is What You Get)
Éditeur HTML WYSIWYG (Mode HTML)
Pour ceux qui aiment les produits clé en main. L'éditeur fait tout pour vous : contient des modèles tout prêt que vous pouvez
adapter à vos besoins, transfert des fichiers et publication sur le Web intégrés. Petit désavantage : manque d'originalité.
La majorité des éditeurs HTML ont été
conçus par et pour des utilisateurs anglophones qui n'utilisent
(presque) pas de signes diacritiques (les accents).
Pour composer avec ce problème,
il existe sur le marché des éditeurs HTML qui ont une commande qui transforme tous les caractères accentués en une seule fonction. Pour les utilisateurs de
la langue latine dont le français. Ce genbre d'éditeur est assez rare; en voici deux exemples : un gratuit et l'autre payant.
Le premier logiciel HTML Writer créé Kris Nosack a été discontinué en 1995. Il est toutefois encore disponible
par téléchargement gratuitement sur le Web.
Le processus est simple et facile,
écrivez votre texte normalement avec tous les accents,
allez ensuite dans la barre du haut de l'éditeur, et cliquer sur la touche
de conversion des caractères et tous les accents vont se coder automatiquement.
La barre d'outils diffère d'un éditeur à l'autre.
Dans l'exemple de gauche, on doit cliquer sur « HTML » et ensuite
sur « Convert Ext. Char. » puis enregistrer.
I y a aussi un logiciel conçu par une compagnie française
HTMLedit, version 2.6.2
« Il est composé d'une multitude de
fonctions permettant des réalisations rapides et efficaces,
telles que le remplacement automatique
des caractères accentués, l'insertion de liens, d'images, de listes, de tableaux, de formulaires, etc. »
Il est disponible pour 15 € pour une licence monposte.
On peut le télécharger pour un essai gratuit.
« Il constitue un excellent moyen d'apprentissage du langage HTML et s'avère tout aussi
utile et pratique pour les plus expérimentés. »
--HTMLedit.
Après la conversion
Codage et caractères : conversion et charset
1. Entités HTML pour caractères accentués et spéciaux
Coder chaque caractère individuellement en utilisant les tables de conversion des entités HTML
(voir : Caractères ASCII, ISO8859-1, Unicode, UT-8), par exemple
Laisser le "é à la place de "é".
On peut aussi utiliser un éditeur qui possède une fonction de conversion pour seulement un caractère à la fois,
commme le logiciel 1st page 2000 d'Evrsoft.
Voir les deux écrans ci-dessous.
Cliquer sur « Special Character Symbols » et cliquer ensuite sur
le caractère choisi parmi la liste offerte dans le carré.
2. Charset (chaîne de caractères)
é" tel quel et préciser le charset que
vous utilisez au début du fichier HTML (dans la balise <head>)
<meta http-equiv="Content-type" content="text/html;
charset=ISO-8859-1">
(ISO-8859-1 est le jeu de caractère latin
courant sous Windows.)
<meta http-equiv="Content-type"
content="text/html; charset=UTF-8">
L'ISO-8859-1
convient pour la plupart des langues latines ou occidentales (anglais, français,
allemand, espagnol...), et l'UTF-8 vous sera indispensable pour les autres
langues (japonais, hébreu, etc.).
Codage XML
Norme W3C : l'UTF-8 est devenu le codage par défaut des
documents en XML donc en XHTML.
Le passage à l'UTF-8 est invisible pour les anglophones. En revanche un texte écrit en ISO-8859-1 est modifié pour les lettres accentuées représentées en UTF-8
sur 2 caractères. La taille d'un texte avec des accents est donc modifiée.
Lorsque que vous choississez un charset particulier, utiliser toujours le même pour tous vos codages.
Si vous insérer du code XML en UTF-8 dans un squelette HTML ISO-8859-1,
vous risquez fortement des résultats étranges (caractères bizarres ou message d'erreur)
dans le fureteur. L'UTF-8 en font donc le codage à préférer pour toutes les applications
Pour savoir le codage d'une page Web : cliquer sur Affichage
et puis sur codage
<?xml version="1.0" encoding="ISO-8859-1"?>
<?xml version="1.0" encoding="UTF-8"?>
A noter qu'on peut utiliser indifféremment UTF-8 ou utf-8
Source : Jean-Paul Figer
AOLpress
Easy HTML
EZpad
NoteTab Light 4.95
2. Éditeurs HTML WYSIWYG gratuits
Nvu
Trellian WebPAGE
Mozilla 1.7.8 (Ce logiciel comprend une messagerie, un lecteur de Newsgroups,
un client IRC et un éditeur HTML (Nvu).)
WYSIWYG Web Builder 1.8
Un éditeur payant fait généralement tous le codage HTML à votre place, mais il ne produit pas nécessairement un bon site Web.
L'utilisateur doit veiller à ce que les principes de l'architecture Web soit respectée (choix des polices, des couleurs, des images etc.).
Photoshop d'Adobe
Corel Draw
Paint Pro Shop de Corel
Ce type de logiciels nécessite un ordinateur très performant car ils utilisent beaucoup de mémoire.
Les deux compagnies offrent des éditions d'essai gratuit de 30 jours pour les trois logiciels. Profitez-en pour créer et enmagasiner des petites merveilles artistiques que vous pourrez enregistrer dans vos fichiers et utiliser pour vos projets de sites Web présents ou futurs.
Le protocole File Transfert Protocol (FTP) sert à télécharcher les fichiers créés par l'éditeur HTML vers le serveur d'hébergement.
Leech FTP (Mac)
FileZilla
Autres logiciels FTP
Interface du logiciel FTP WS_FTP
Entrer les renseignements demandés dans le profil de session (Session Profile) comme dans l'image ci-dessus; le nom du site que vous voulez créer (Profile Name), le nom de votre serveur (Host Name),
l'identité de l'usager (User ID) et le mot de passe. Le type d'hôte est généralement déjà inscrit, sinon, utiliser la barre d'espacement. Cliquer sur O.K. et un carré à deux écrans va apparaître.
Pour transférer un fichier de votre ordinateur vers le serveur, sélectionnez-le dans système local de l'écran et cliquez sur la flêche pointant vers la droite. Pour transférer un fichier du système distant vers le système local, cliquez sur la flêche pointant vers la gauche.
Interface du logiciel FTP FileZilla
Pour configurer votre client, vous aurez besoin du nom d'hôte du serveur ftp (fourni par votre fournisseur ou hébergeur), de votre login et mot de passe. La prise en main reste ensuite très intuitive : sur une fenêtre, les fichiers sur votre ordinateur, dans une autre, l'arborescence de vos pages sur le serveur distant (votre site en ligne). Le transfert d'une fenêtre à l'autre se faisant par double clic sur le fichier que l'on veut transférer ou par double clic. » -- Tutoriels.com
Organisation des fichiers
public_html : Ce répertoire est pour tous les documents que vous allez mettre sur le Web.
index.html : Ceci est le nom du fichier de votre page d'entrée. Elle ne possède pas son propre répertoire. »--Programme Rescol (Sask.)
Lorsque que vous envoyez les fichiers, faites attention au nom qu'ils ont sur le serveur. Les majuscules et les minuscules ont de l'importance i.e. « index.html », « Index.html » ou « INDEX.HTML » sont reconnus comme trois fichiers différents.
Le fichier de la « La page d'accueil » généralement nommé « index.html » est celui qui doit être transféré en premier pour avoir un apercu de votre site sur le Web.
« Après que vous avez terminé une page, ou plusieurs, il est important de télécharger les fichiers pour vérifier que tout le contenu de votre page Web fonctionne correctement. N'attendez pas d'avoir terminé tout votre site pour télécharger et tester. Il est facile d'avoir une fausse impression de sécurité, parce qu'on voit sa page Web sur l'écran.
Vérifier tous les hyperliens, ce sont souvent des erreurs toutes simples qui causent des problèmes d'accès et des liens rompus. Vérifier qu'ils renvoient bien où vous voulez.
Vérifier pour vous assurer que l'on voit tous les médias (graphiques, images et autres) que vous avez téléchargés se trouvent bien sur votre page. »--Programme Rescol (Sask).
Ces adresses se terminent par : .com, .net, .org, ... .
Ex. d'une adresse de domaine : http://www. monentreprise.com
Pour avoir ce genre d'adresse vous devez vous inscrire dans la base de donnée internationale Internic,
organisme international régissant les nom de domaines. La gestion de ces millions
de noms est attribuée à des « Registrar » qui ont la responsabilité de voir a l'inscription et au renouvellement des noms de domaine.
Les « Registrar » fournissent à l'usager un accès à l'administration de son nom de domaine qui peut rediriger ce nom vers l'hébergement de son choix. Toutefois, il est souvent plus efficace et moins coûteux de faire l'acquisition d'un nom de domaine et de l'hébergement au même endroit. Un nom de domaine est obligatoire pour utiliser un espace d'hébergement, sauf si celui-ci est gratuit.
Le tarif de ce service (sans l'hébergement) est d'environ 35$ US par année.
Les adresses des sites non inscrit dans Internic porte le nom de l'hébergeur payant ou gratuit du site : Ex. d'une adresse non enregistrée : http://pages.videotron/motchoisi
Liste des extensions à caractère général : Webmsaster.hub
Extension
Signification
Portée
.aero
Aéronautique
industrie du transport aérien
.biz
Business
Activité commerciale
.com
Commercial
Activité commerciale
.coop
Coopératives
associations et coopératives
.edu
Education
institutions scolaires supérieures
américaines
.info
Information
Information
.int
International
organisation internationales reconnues
.net
Networks
Réseau internet
.org
Organisations
Organisation
.mil
Militaire
défense américaine
.museum
Museum
musée
.name
Personal
aucune
.pro
Professional
activités professionnelles
.gov
Government
gouvernement américain
Pour vérifier si le nom de domaine que vous vouler utiliser est déjà enregistré ou pour obtenir des informations sur un nom de domaine en particulier, utiliser le service Whois Search.
Entrer dans la boîte de recherche le nom de domaine précédé de www.
Ex. : www.google.com, www.commentcamarche.net, www.davignon.qc.ca, etc.
Si vous faites la recherche de : www.commentcamarche.net, vous obtiendrez les renseignements suivants
commentcamarche.net
domain: COMMENTCAMARCHE.NET
owner-name: Commentcamarche
owner-address: Jean-Francois Pillou 20, rue de l'armorique
owner-address: 75015
owner-address: Paris
owner-address: France
admin-c: JFP18-GANDI
tech-c: JFP18-GANDI
bill-c: JFP18-GANDI
nserver: didier.commentcamarche.org 62.23.221.104
nserver: nestor.commentcamarche.org 193.19.219.211
nserver: ns6.gandi.net
reg_created: 1999-12-10 13:13:18
expires: 2006-12-10 13:13:18
created: 2003-03-02 03:56:14
changed: 2006-04-11 21:22:01
person: Jean-Fran?s Pillou
nic-hdl: JFP18-GANDI
address: QUIDEA SARL
address: 18 avenue des Champs Elys?
address: 75008
address: PARIS
address: France
phone: +33.612345678
e-mail: 91bcf69f5f3f89c3ba76afef04278977-jfp18@contact.gandi.net
lastupdated: 2006-07-03 12:04:01
Registration information: http://www.gandi.net
|
ColbaNet : 10 Mo Cogeco : 10 Mo GlobbeTrotter : 5 Mo MegaQuébec : 10 Mo |
|
1 Méga-octet (Mo) = 1 Mega-Byte (Mb) = 220 octets = 1024 ko = 1 048 576 octets.
Hébergement gratuit sans abonnement Internet avec publicité
Certains serveurs vous offre aussi de l'hébergement gratuit en échange de de publicité. Cette publicité peut aller d'une simple bannière à des barres de menu horizontal ou vertical (avec ou sans pops-ups) prenant le tiers de votre espace Web gratuit.
Parmi ceux-ci, offrant un service en français; un seul représentant québécois CyberQuébec : 10 Mo et plusieurs serveurs européens parmi lesquels Voila : 100 Mo, iFrance : 100 Mo, Lycos (France) : 50 Mo,
et Francité : 2 Mo
.
Hébergement gratuit sans abonnement Internet et sans publicité
Ces types d'hébergement sont assez rares; en voici trois. Il n'y pas de publicité
mais les possibilités de codage sont très limitées
Freazer : 25 Mo, site en français, FTP intégré.
f2g.net : 15 Mo, site en anglais, choix de FTP intégré ou de d'un logiciel FTP personnel.
Google Page Creator : sur invitation seulement
© Rédaction et conception graphique :
Nicole Davignon
Québec, Québec, 2005
Dernière mise à jour : 16 juin 2007