CONNEXION
  • RetourJeux
    • Sorties
    • Hit Parade
    • Les + populaires
    • Les + attendus
    • Soluces
    • Tous les Jeux
    • Gaming
  • RetourActu Gaming
    • News
    • Astuces
    • Tests
    • Previews
    • Toute l'actu gaming
  • RetourBons plans
    • Bons plans
    • Bons plans Smartphone
    • Bons plans Hardware
    • Bons plans Image et Son
    • Bons plans Amazon
    • Bons plans Cdiscount
    • Bons plans Decathlon
    • Bons plans Fnac
    • Tous les Bons plans
  • RetourJVTech
    • Actus High-Tech
    • Intelligence Artificielle
    • Smartphones
    • Mobilité urbaine
    • Hardware
    • Image et son
    • Tutoriels
    • Tests produits High-Tech
    • Guides d'achat High-Tech
    • JVTech
  • RetourCulture
    • Actus Culture
    • Culture
  • RetourVidéos
    • A la une
    • Gaming Live
    • Vidéos Tests
    • Vidéos Previews
    • Gameplay
    • Trailers
    • Chroniques
    • Replay Web TV
    • Toutes les vidéos
  • RetourForums
    • Hardware PC
    • PS5
    • Switch 2
    • Xbox Series
    • Switch
    • Pokemon pocket
    • FC 25 Ultimate Team
    • League of Legends
    • Tous les Forums
  • PC
  • PS5
  • Xbox Series
  • Switch 2
  • PS4
  • One
  • Switch
  • iOS
  • Android
  • MMO
  • RPG
  • FPS
En ce moment Genshin Impact Valhalla Breath of the wild Animal Crossing GTA 5 Red dead 2
Forum
  • Accueil
  • Actus
  • Tests
  • Vidéos
  • Images
  • Soluces
  • Forum
Liste des sujets

Aide pour faire un site perso...

Donnie-Darko
Donnie-Darko
Niveau 10
07 février 2006 à 20:04:56

je vois souvent des personnes qui se demandent comment faire leur site perso alors voila:

Franchement, y a rien de compliqué la-dedans !! Vous verrez !
C´est comme une recette de cuisine : c´est inratable !

Tout d´abord, il vous faut un minimum d´ingrédients. Voici ceux que je vais utiliser :

Un éditeur de pages html : Frontpage (vous le trouverez dans le pack office de Microsoft)
Un logiciel de retouche photo et images : Paint Shop Pro
Un traitement de texte : Word (vous le trouverez aussi dans le pack office de Microsoft)
Un "client FTP" pour mettre votre site en ligne : Cute FTP

Pour vous procurer ces logiciels, allez sur la page des Favoris et téléchargez une version d´évaluation.

Coté savoir-faire, on va dire que vous avez déjà des bases : organiser des dossiers et fichiers, les commandes de bases des logiciels, surfer sur internet.... et un minimum de créativité !

1ère étape : Réfléchir
au contenu du site ! Suffit pas d´avoir une belle page colorée si c´est pour rien dire !! Éventuellement coucher une esquisse sur le papier. Genre titres et rapide sommaire (mais moi ça me sopotte alors...).

2ème étape : Préparer le terrain
Créer un dossier "mon site web" sur votre disque dur, par exemple dans Mes documents.

3ème étape : A l´attaque !
Faire la page d´accueil du site.
Ouvrez Frontpage (FP), Fichier/Ouvrir un site web ; Sélectionnez votre dossier "mon site web", accepter les ajouts de FP. Votre dossier est maintenant un site web.

Fichier/Nouveau/Page/Page normale
Fichier/Enregistrer sous....
IMPERATIF : donner comme nom à votre page "index.htm" ou "index.html" , et ne pas l´enregistrer dans un sous dossier.

Clic droit sur la page/Propriétés de la page : Donner un titre a votre page. Comme il s´agit de la page d´accueil, choisir un titre générique d´accueil pour votre site (ex : Bienvenue chez Babylone !)

ATTENTION : Pour tout nom de page ou dossier ou autre document destiné à votre site : PAS DE MAJUSCULE, PAS D´ESPACE, PAS D´ACCENT NI PONCTUATION. A la rigueur, vous pouvez utiliser un "_" en guise d´espace.

Cette page est destinée à accueillir vos visiteur et à leur présenter le contenu de votre site.

Choisir un thème général
Format / Thème : Sélectionner "Toutes les pages" et choisir un thème pour votre site. Cela inclut un fond, des polices, une bannière de titre, des boutons, etc...

Créer un modèle de mise en page
Un tableau vous permet de mettre en page rapidement les différentes rubriques de vos pages : une cellule pour la navigation, une autre pour le titre, et une pour le contenu : Voilà le minimum !

Tableau / Insérer / Tableau : choisir 2 lignes et 2 colonnes.

Sélectionner la 1ère ligne (donc 2 cellules) puis Tableau / Fusionner les cellules : Ce sera la "case" pour le titre

Il vous reste en dessous 2 cellules : celle de gauche pour la navigation, celle de droite pour le contenu !

Faire un titre
2 solutions :

Bannière de thème
Se placer dans la cellule adéquate (en haut)
Insertion / Bannière de page. Reprend le titre de la page.

Wordart
Dans FP, clic droit sur la page/Propriété de la page/Arrière plan : Sélectionnez une couleur de fond pour votre page. Dans "autre couleur", notez les valeurs héxadécimales de votre couleur (Ex : FFCCFF pour la couleur de fond de cette page)

Ouvrir WORD, Insertion/Images/Wordart
Tapez votre texte et modifiez l´apparence du futur titre (couleur, taille, orientation, ombre, etc...)
Edition/Copier (ctrl+C)

Ouvrir Paint Shop Pro (PSP), Edition/Coller comme nouvelle image (ctrl+V)
Choisir une taille d´environ 600 X 100 pixels
Vérifiez que la case "garder la proportion d´origine" est bien cochée.
Clic sur la couleur de votre pinceau (case de droite) et sélectionnez la couleur de votre page, éventuellement notez les valeurs notées précédemment dans la case "code html" (ex : #FFCCFF)
Sélectionnez l´outil "pot de peinture" et remplir le fond de la couleur de votre page
Fichier/Enregistrer sous.../ :
- type GIF
- options : mode entrelacé
Bien vérifier que le titre est enregistré dans le dossier "mon site web".

Dans FP, cliquez en haut de la page, sélectionner un alignement centré, insérez votre titre (Insertion/Images/A partir du fichier ; clic sur l´icône du bas à droite pour parcourir vos dossiers.
Clic droit sur le titre inséré, Propriété de l´image, dans la ligne texte, mettre le même titre : c´est au survol du titre que le texte s´affichera ou encore si le titre ne s´affiche pas correctement.

Il ne vous reste plus qu´à inciter les visiteurs à découvrir plus en détail votre site.

Faire un sommaire
2 solutions :

En barre de navigation
Se placer dans la cellule adéquate (à gauche)
Insertion / Barre de navigation. On peut choisir horizontale ou verticale.
Reprend les pages du site insérées en mode Navigation (Voir Organiser ses pages)

Les liens sont automatiques.

En images
Dans FP, sur une nouvelle ligne, insérer un tableau (Tableau/Insérer/Tableau : indiquez le nombre de lignes et de colonnes, mettre une valeur de 0 dans "taille de la bordure")
Cherchez des Gif animés qui représentent chaque page de votre site (voir ma photothèque), les enregistrer dans votre dossier de site perso.
Insérer une image dans chaque case du tableau, en laissant une ligne entre chaque pour la description.
Ne pas oublier la description texte pour chaque image.

4ème étape : les autres pages et les liens
Soyons logiques : nous allons partir du sommaire et faire chaque page une à une afin de ne pas se perdre. Donc, vous sélectionnez la 1ere image de votre sommaire, puis Insertion/Lien hypertexte.
Comme votre page n´est pas encore créée, vous cliquez sur l´icône en forme de page blanche en bas à droite.

ATTENTION : Pour faire un lien vers une page existante, la sélectionner dans la liste du haut : TOUTE PAGE LIÉE DOIT APPARTENIR AU SITE et donc se trouver dans le dossier du site. Si vous liez vers une page hors du site, lorsque vos visiteurs cliqueront dessus ils n´auront rien ! Ou alors, cela signifie que vous avez lier vers une page qui est déjà sur le web, à ce moment, c´est un lien externe au site : mais c´est possible !
DE PLUS : Si vous voulez insérer une image qui ne se trouve pas dans le dossier du site, FP lors de l´enregistrement de votre page vous demande d´enregistrer l´image. Sélectionnez l´endroit et acceptez !

Une nouvelle page apparaît. A vous d´y mettre un titre, une couleur de fond, du texte.
Enfin, vous l´enregistrez.
CONSEIL : Vous pouvez mettre votre page dans un nouveau dossier de votre site web, ainsi vous pouvez créer un dossier supplémentaire par chapitre, qui contiendra toutes vos nouvelles pages et vos images.
Votre 1er lien a été créé, répétez l´opération pour toutes les images de votre sommaire.

5ème étape : Organiser ses pages
Vous voici maintenant avec quelques pages html. Pour vous y retrouver facilement, vous allez les organiser dans le mode Navigation de FP. Cliquez sur Navigation dans le menu de gauche. Vous y voyez votre page d´accueil avec une icône de petite maison.
Grâce à la liste de vos dossiers et fichiers qui se trouve à coté (sinon : Affichage/Liste des dossiers), vous faites glisser chaque nouvelle page html sur la liste de droite. Un organigramme hiérarchique est alors créé peu à peu.
Pensez à modifier le titre de vos pages en sélectionnant la page puis clic droit/Renommer. Les titres de pages sont importants car ils sont affichés dans la barre des taches !
ATTENTION : Cet organigramme n´accepte que les pages html, il n´est pas utile d´y mettre les images. Cela doit juste vous montrer à quel niveau se trouve telle ou telle page dans votre site web. Par ailleurs, cette organisation est indispensable si vous avez utilisé une bannière ou une barre de navigation.

Vous savez à présent :
- Créer une page d´accueil
- Faire un titre
- Insérer une image dans FP + lui donner un texte au survol
- Créer un lien sur une image
- Insérer un tableau dans FP
- Organiser vos pages web en mode navigation
- Lier vers une page web
- Utiliser les thèmes FP
- Insérer un tableau et s´en servir pour agencer sa page

C´est déjà pas mal : avec un peu d´imagination on peut faire un site assez sympa ! Mais on va améliorer ça encore un peu avant de le publier.

6ème étape : Ajouter des compteurs
Est-ce que votre site perso est une star sur le web ??
Pour savoir, il faut installer des compteurs de visite.
Voici le site ou je suis abonnée : Swisstools.net (avoir déjà une adresse de site pour s´inscrire)
Mais vous pouvez aussi profiter du tout en 1 des hébergeurs de site. Ainsi, Lycos vous permet aussi d´avoir des compteurs. Grosso modo le système est le même : vous vous inscrivez, vous donnez un nom à votre / vos compteurs et vous récupérez un code spécial à insérer dans vos pages en complément d´un code de pub pour le service.

Donc, pour vous : allez sur Lycos.fr ou encore chez l´hébergeur de votre choix (m´en fiche moi après tout !) et inscrivez vous.
Vous aurez ainsi votre adresse de site web allouée (ex : http://www.membres.lycos.fr/babylonechat/ )
Et ensuite, vous pouvez choisir le service de compteur de votre choix.
On vous donne 2 codes par compteur en général : 1 pour le compteur, 1 pour la pub. Vous faites un copier-coller dans un document texte et voila le travail. N´oubliez pas de noter quels codes correspond a quel compteur !!
ATTENTION : J ai bien dit vers un document texte (clic droit sur le bureau par exemple Nouveau/Document texte) et pas vers Word ! Sinon, vous allez pourrir votre code !!

Une fois les codes récupérés, que faire ?? On va trifouiller dans le code pour la 1ere fois, vous verrez c est pas si dur si on sait copier-coller !!
Bref, vous voici avec vos précieux codes, vous copiez le 1er code, celui du compteur1.
Ouvrez la page correspondant à votre 1er compteur.
En bas, vous insérez 2 tableaux (séparés par 2 lignes vides) de 1 ligne 1 colonne chacun.
Vous mettez votre curseur dans le 1er tableau et vous cliquez sur l´onglet HTML qui se trouve en bas. Normalement vous retrouvez votre curseur clignotant (ne pas cliquer dans la page avant, sinon c´est perdu !)
Et hop : vous collez le code !
Revenez dans l´onglet Normal, et mettez votre curseur dans le 2eme tableau. Vous copiez le code Pub1 et le collez dans le mode HTML.
De retour dans le mode normal, vous devez apercevoir 2 carrés blancs qui deviendront votre compteur et votre pub associée.
Répétez pour tous les compteurs sur toutes les pages ! Courage !

7ème étape : Mettre en ligne le site
Comme FP ne le fait pas correctement, on a inventé Cute FTP (CFTP). Ce logiciel d´aspect barbare va balancer vos pages sur l´ordinateur de votre hébergeur de site.
Pour cela, il vous faut les mots de passe de votre hébergeur :
- l´adresse d´hôte FTP est un truc du genre : ftp.multimania.com
- votre code d´utilisateur est votre nom d´inscription : babylonechat
- votre mot de passe perso
Une fois que vous avez tout ça, vous vous connectez, vous ouvrez CFTP et dans la fenêtre paramètre de site, vous créez un nom de site, et vous renseignez les codes ci-dessus. Le type de connexion est : Normal.
Vous faites : connecter et vous attendez le message de bienvenue du site.
A gauche vous avez vos dossier, a droite ceux de votre site sur le net.
Vous sélectionnez tous les fichiers et vous faites un glisser-déplacer vers la droite.
Vous voyez vos pages se mettre en ligne 1 à 1.
Répétez jusqu´à ce que tout soit bien en ligne.
ATTENTION : Toute hiérarchie doit être identique à droite comme à gauche !! ! Sinon, vos liens seront perdus !!
Une fois tout en ligne, vous fermez tout, et vous allez sur votre site web comme 1er visiteur ! Vérifiez chaque lien et chaque compteur !! Et vérifiez que les pages ne mettent pas trop de temps à s´afficher.

8ème étape : Avoir un nom de site convivial
Vous trouvez votre adresse de site trop longue ?
Ce site va vous être très utile : ulimit.com
Vous pourrez choisir un nom de site avec une extension bizarre, mais bien moins longue ! Courez-y, en plus, c´est gratuit ! Et ça, ben c´est carrément extraordinaire !

9ème étape : Faire répertorier son site
Pour que votre site soit visité, il faut que les gens sachent qu´il existe ! Et pour cela, ils font comme vous : ils cherchent sur les moteurs de recherche, par mot clef !
Pour que ces moteurs vous répertorient dans leurs adresses de site, il faut leur envoyer un "faire part de naissance" de votre site.
Certains sites permettent de se faire répertorier simultanément chez plusieurs moteurs, c´est quand même moins long !

Pour trouver les adresses allez sur ma page Favoris

Vous voilà Webmaster !! ! Félicitation !

-kane
-kane
Niveau 10
07 février 2006 à 20:26:18

C´est comme une recette de cuisine : c´est inratable ! :rire:
-------------------
Non sérieusement c´est bien quand on se soucie des autres :ok:

Donnie-Darko
Donnie-Darko
Niveau 10
07 février 2006 à 20:41:45

ouais cette vanne a 2 balles n´est pas de moi. moi j´aurai parlé de cul. voila. sinon ben ouais c pas svt que j´aide en plus ^^

rvdandmarcoom
rvdandmarcoom
Niveau 10
07 février 2006 à 20:49:25

ptet mais quand tu veux aider, ty va pa avec le dos de la cuillere ^^

Cptn_ALPHA45
Cptn_ALPHA45
Niveau 10
07 février 2006 à 20:54:02

Bonne initiative Doubitchou :ok:

Donnie-Darko
Donnie-Darko
Niveau 10
07 février 2006 à 21:21:01

plusieurs personnes demandaient comment faire alors qd je suis tombé par hasard sur explication je me suis dis "tiens je vais le mettre sur le forum". j´espere que ca servira au moins. sinon on pourra tjs diriger les demandes vers ce topic.

keyser[niak]
keyser[niak]
Niveau 4
08 février 2006 à 08:48:47

:ouch: :ouch: :ouch:
Euuuuuuuuuuuuuhh.................
Grand puissant? Vous pourriez nous montrer la gueule que ca a a la fin? :ouch: :ouch: :ouch:

mi-mich
mi-mich
Niveau 8
08 février 2006 à 13:33:22

la bible de l´appentissage : http://www.siteduzero.com/ :-)))

cours : (x)html / css / php / c(++) / mapping
+ des annexes (w3c, publication du site par ex), des forums, rubriques tutos des internautes...

La vidéo du moment