Construire son site Web
Building his web site

Logiciels - softwares Boutons  micropaiement  
Réalisation d'un formulaire de contact - making a contact's form              Images - pictures     fond écran
     smileys - marques -
Video

Logiciels de base - basics sofwares

Pour commencer : Nvu (pour monter le site), FileZilla pour exporter chez l'ébergeur (les 2 sont des gratuiciels).
To start : Nvu (do make your web site), FileZilla to export (both of them are freewares)

Le but de lignes qui suivent est de vous aider dans vos premiers pas pour construire un site web (J'ai cherché à minimiser les coûts d'investissement en cherchant le maximum de gratuiciels). Cela s'adresse à des gens qui se lancent; le but est de faire simple et que cela marche. The aim of the following lines are to help you during your first step in building your web site (I did look for minimizing the costs by looking for a maximum of freewares.
N'hésitez pas (via le formulaire sur la page d'accueil) à me laisser des commentaires pour améliorer le site, que vous soyez débutant et que vous rencontriez des problèmes ou, que vous soyez aguerri et que vous ayez une critique constructive à faire. Do not hesitate (by the form on the welcome page) to let me comments in order to improve my site if you are beginner and you face problems or experienced  and that you have to formulate a constructive criticism.

La présentation se limite à ce que j'ai fait et utilisé. The presentation is limited on what I have done and used.

Je suis sous windows je ne pourrait donc pas vous dire si la démarche que j'ai suivie marche avec du Linux. I use windows and is not able to tell you if what I have done works with linux.

1ère étape : prendre un classeur (à préférer à un cahier car pour rajouter des pages ce n'est pas évident)
L'utilité du classeur est de noter les mots de passes, les login, les sites qui sont utiles pour avoir de l'aide ....
Bref capitaliser pour ne pas refaire les mêmes erreurs plusieures fois.
Classez avec ordre pour que vous retrouviez rapidement les informations dont vous pouvez avoir besoin.                                            
1st step :
take a file (prefer it to a notebook because with a notebook it is not obvious to add a new page between to writen pages) The use of the file is to note the pass words, the logins, the usefull sites to have help, what you have done ...                                          in short, to capitlize in order not to do the same mistakes many times.                                                                                                  Store with order in order to find quickly the informations you could need.        

Faite vous aussi un répertoire spécifique sur votre ordinateur du type avec les sous répertoires. Par exemple :
c:\
    site
        monsite
                fichier 1
                fichier 2
        logiciels pour site
        documentation pour site   

- dans mon site, vous mettez tout ce que vous voulez mettre en ligne avec les arboressances (fichier 1, fichier 2 ...)
- dans logiciels, vous mettez les logiciels que vous allez télécharger et qui vous servent pour faire fonctionner votre site.
- dans documentation pour site, vous mettez tous vos résultats de recherches sur internet pour vous aider dans la construction d'un site.

Nota : une précaution complémentaire peut être prise pour éviter de charger votre site chez votre hébergeur et de contôler plus facilement la taille des fichiers de votre site (votre hébergeur ne vous donne pas une place illimitée donc autant contrôler de temps en temps où vous en êtes par rapport à cette limite). Je vous conseille donc d'ouvrir un fichier miroir (ou fichier de travail) à l'identique de celui que vous mettez en ligne.

L'intérêt de cette approche est que, quand vous aurez fait vos premiers pas avec Nvu, et que vous serez à l'aise, la fièvre du web master vous gagnant, vous voudrez aller plus loin.

Pour ce faire, vous aller télécharger Filezilla (recherche sur google : "télécharger Filezilla") qui est un gratuiciel et qui vous permet de copier les fichier de votre ordinateur vers votre site juste en faisant un clic sur le fichier que vous voulez mettre sur votre site et en le 'lâchant" dans la fenettre de votre site.

Un bon moyen de visualiser, sur votre ordinateur, ce que donne votre site est de télécharger (c'est aussi un gratuiciel) EasyPHP. Une fois que vous avez le programme sur votre ordinateur, lancer le programme, vous verrez (du moins c'est comme cela que ça se passe sur mon ordinateur) en bas à droite un e noir avec un point rouge qui clignotte. Faire un clic droit sur ce "e" et cliquer "gauche sur "administration" lisez le doc pour savoir comment faire fonctionner ce logiciel. En rapide : sous "alias" vous trouver une touche "ajouter" : cliquer dessus et suivez les instructions. 

2ème étape : configuration requise
Marche sous Win 98. Ce qui peut suffir à faire ses premiers pas mais, vite on se retrouve bloquer (j'ai voulu créer un formulaire). Je suis donc passé sous Win XP.

3ème étape :
Investissement vital :
- Win 98 (si vous avez une version antérieure)
- Acheter un nom de domaine (15€ au 01/01/07 sur http://www.neodomaine.com)
 - Avoir un site hébergeur (j'ai pris l'hébergement gratuit sur http://www.hebergement-gratuit.com) => cela ne permet pas de faire de l'argent avec son site mais, cela permet de se lancer (ils ont aussi eu un problème au niveau des mails ce qui ne m'a pas permis de mettre en ligne mon formulaire => j'ai du prendre une formue payante.
bien noter les données que l'on va vous fournir car, il va falloir faire le lien entre ce site hébergeur et néodomaine et aussi pour pouvoir intervenir sur votre site
* les ns 1, 2 et 3 servirons pour la partie administration de neodomaine
* le login et mot de passe vous  servira pour publier les pages web de votre ordinateur vers votre site
-
Une fois que vous avez eu les données, allez sur neodomaine, puis cliquez sur neo gestion
- télécharger Nvu : sous google = mettre "télécharger Nvu" et lancer la recherche vous aller trouver un site vous permettant de le télécharger (c'est un gratuiciel)
Vous pouvez commencer à faire votre site.
=> pour publier une page vous cliquez sur la touche publier et vous complétez les cases avec les données que vous a fourni le site sur lequel vous avez pris l'hébergement (j'ai reçu les données par mail peut de temps après l'enregistrement - cela peut prendre quelques heures)
=> pour faire les liens entre les pages : surligner le ou les mots (pointer la fléche du curseur en début de mot, clic gauche sur la sourie et en maintenant le clic gauche appuyé, déplacer vers la droite la flèche pour surligner le mot ou les mots à surligner) puis, cliquer sur l'icone lien dans la barre d'outil en haut de l'écran. Le logiciel va vous demander avec quel fichier vous voulez faire le lien (= quand une personne va cliquer sur le texte que vous venez ce surligner vers quel autre page cela va l'envoyer).


Le formulaire

Le formulaire permet aux gens qui vistent votre site de vous envoyer des données, des commentaires. Cela sans que vous n'ayez à mettre votre adresse internet en ligne.

Que cela m'a posé de problèmes à moi débutant !...

Personnellement, j'ai ouvert une boite mail spécifique pour mon site. Je ne voulais pas de message venant de mon site vers ma boîte personnelle. Je dois aussi avouer que j'ai toujours une petite crainte sur du piratage d'adresse mail possible => si je dois fermer ma boite mail du à un piratage de mon site, je ne veux pas à avoir à prévenir tous mes proches ou contacts personnels de ce changement. Donc, j'ai pris une boite mail spécifique pour mon site.

Vous pouvez avoir des boites mail gratuites par exemple sur :
- www.caramail.lycos.fr
-
www.laposte.net

En final, ce à quoi je suis arrivé et comment j'y suis arrivé :

J'ai téléchargé conTEXT (sur google, lancer une recherche avec "télécharger conTEXT")
cela pour avoir des fichiers avec l'extention ".php" (un fichier text fait avec du word a une extension en ".doc"). Sinon, je n'y arrivait pas !

créez avec le logiciel conTEXT, en ouvrant une nouvelle feuille (icône en haut à gauche qui représente une feuille). Une fois cette nouvelle page ouverte,
y mettre le texte ci-dessous (attention à ne rien changer)
------------------------------------------------------------------------------------------------------
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>

  <div align="center">
  <form method="post" action="formmail.php">
    <input name="subject" value="formmail" type="hidden">
    <table>

      <tbody>
        <tr>
          <td>Votre Nom:</td>

          <td><input name="realname" size="30" type="text"></td>
        </tr>

        <tr>
          <td>Votre Email:</td>

          <td><input name="email" size="30" type="text"></td>
        </tr>

        <tr>
          <td>Sujet:</td>

          <td><input name="title" size="30" type="text"></td>
        </tr>

        <tr>
          <td colspan="2">Commentaires:<br>

          <textarea cols="50" rows="6" name="comments"></textarea>
          </td>
        </tr>

      </tbody>
    </table>

    <br>
 <input value="Envoyer" type="submit"> -
    <input value="Annuler" type="reset">
  </form>

  </div>

  <title>formulaire 3</title>
</head>
<body>
</body>
</html>
---------------------------------------------------------------------------------
une fois que la saisie est finie enregistrer sous le nom : formulaire
(sur votre page index, il faudra par exemple que vous mettiez en bas de page le mot "contact" et sur ce mot, vous allez créer un lien avec ce nouveau fichier que vous venez de créer)

Maintenant, vous avez un formulaire, mais, il n'est pas traité => il faut un autre fichier pour le traiter et vous envoyez les données dans la boite mail que vous avez choisie.
Vous ouvrez donc une nouvelle page avec le logiciel conTEXT et, vous y mettez le texte suivant :
--------------------------------------------------------------------------------------

<?php
$TO = "votre adresse@mail";

$h  = "From: " . "votre adress@mail";

$message = "";

while (list($key, $val) = each($HTTP_POST_VARS)) {
  $message .= "$key : $val\n";
}

mail("votre adresse@mail", $subject, $message, $h);

Header("Location: http://www.nom de domaine/index.html");

?>

----------------------------------------------------------------------
Dans le texte ci dessus, il faut mettre des données qui sont propres à votre site internet ou à l'adresse e-mail vers laquelle vous voulez que l'on vous envoie les messages (boite qui doit être active)
votre adress@mail : y mettre l'adresse de la boite mail vers laquelle vous voulez que les message soient envoyés

nom de domaine : y mettre le nom de votre site, ne pas oublier l'extension : ".com" ou, ".fr" ou, ".eu" ...

index : y mettre le nom de la page d'accueil, pour ma part le nom du fichier de ma page d'accueil est : index avec l'extension ".html".



Bouton
Pour faire des boutons à mettre sur votre site vous pouvez utiliser le gratuiciel Pixia. Pour plus de détails, cliquez sur le bouton.
To put button on your web site, vous can use the freeware Pixia. For more details, clic on the button.




Site pour renseignement :
www.salemioche.net


Video
Une des plus grosses galaires que j'ai connu au niveau du site. Beaucoup de tutoriels ou autres sut internet mais pas de choses simples ou alors incomplètes ?

1ère étape : télécharger le logiciel "free video to flash converter"

2ème étape : créer (sous votre racine qui contient votre site internet) un dossier "video" (sans accent), qui contiendra les vidéos que vous allez mettre.

3ème étape : lancer la manip de conversion et de mise en ligne :
Lancer le logiciel "free video to flash converter" -  cliquer sur "Browse" ou "Parcourir" pour aller chercher la vidéo à mettre en ligne, cliquer dessus et cliquer sur ouvrir.
Ensuite cliquer sur "Trim puis parcourir" ou directement sur "Parcourir" (en dessous de "dossier de sortie") - cela en fonction de la version que vous avez chargée et, mettre dandle dossier "video"  que vous avez créé.
Veillez à ce que le format "FLV" soit bien sélectionné ("format" en bas à gauche de l'écran). Cliquez ensuite sur "Présélection" ou "Modifier" et choisir "high band width cable/DSL .." mettre "audio" en mono et "audio bit rate" à 64 valider par "Ok".
Décochez ensuite la case "show an html example"  ou "Afficher un fichier HTML ...."  puis cliquer sur "lecteur" ou "convertir"
Si lecture de plusieurs vidéos à partir d'une même source : "multi" sinon "maxi"
Cliquer sur Ok pour finir cliquer sur convertir

A la fin de l'opération, taper sur Ok.

cliquer sur "out put folder ...." => vous avez les fichiers créés par le logiciel. Ou, aller directement "video" en fonction de votre version de logiciel "free video to flash converter"
ne pas renommer les fichiers qui ont été créés par le logiciel                                                                                                                                                     
Lancer le fichier htm (nomé "how to useflash example")
Descendez  et allez chercher le script proposé. Sélectionnez le et aller le copier dans la partie source du fichier dans lequel vous voulez voir apparaître la vidéo.

Ensuite, dans la partie source, il va falloir aller changer quelques lignes pour que cela fonctionne :

repérez la mention "data" & placez le curseur juste après les guillemets puis saisissez votre nom de domaine entier (
dans l'exemple ici : www.tutoriel-anime.com)suivi de "video/"
     cela doit donner : data="http://www.tutoriel-anime.com/video/player-flv..."
de même après "movie"
de même après "value=configxml"     

Ce qui est entre "no script" & "no script" peut être supprimé.

Ensuite il reste à mettre en ligne l'ensemble (via FileZilla par exemple) et c'est fini.


tutoriel en image qui m'a permis d'écrire ce résumé :
Mettre une vidéo : http://www.tutoriels-animes.com/mettre-video-sur-site-internet.html