Voir la source de Site-web

{{Projet
|status=Concept
|status_pub=Publié
|image=a3c-hd.png
|description=Site web A3C Presqu'île
|license=CC-by-sa-3.0 - Creative Commons Attribution CC-by-sa-3.0 France
|contributeurs=LERUSTE REGIS,
|inspiration=Vitrine
|ingrédients=Matière grise,
|url=http://fablabo.net/wiki/SCAO
}}
==Site web==
Ce projet traite de la création de '''A''' à '''Z''' d'un site web.
Avis aux amateurs ! un peu de patience et de persévérance et ça marche.
Il suffit de cliquer [http://a3cp.org a3cp.org].
===Objet===
L'objet du [https://fr.wikipedia.org/wiki/Site_web site web] est de constituer une vitrine qui permette la promotion et la communication de l'association [http://fablabo.net/wiki/A3CP A3C Presqu'île] et du [http://fablabo.net/wiki/SCC SCC] qui lui est attaché.

===Contexte de travail===
* La [https://openclassrooms.com/courses/apprenez-a-creer-votre-site-web-avec-html5-et-css3 formation]
* Le [https://github.com/AIREL46/SCAO/blob/master/wiki/site-web-1.odt support de cours].

===Organisation et réalisation du projet===
L'[https://fr.wikipedia.org/wiki/Site_web#Organisation_d'un_projet_web organisation d'un projet web] repose sur les différentes étapes de conduite du projet, lancement, conception, '''réalisation''', production et exploitation.

La '''réalisation''' consiste à :
* choisir un [https://fr.wikipedia.org/wiki/H%C3%A9bergeur_web hébergeur web] dont les prestations sont :
** la réservation et gestion d'un [https://fr.wikipedia.org/wiki/Nom_de_domaine nom de domaine]
** la mise en œuvre d'une infrastructure d'hébergement
* communiquer avec l'hébergeur
* développer l'interface utilisateur (frontend), la partie visible dans le navigateur
* développer l'arrière plan (backend), la partie qui fonctionne côté serveur
* publier le site.
====Choix de l'hébergeur web====
L'[https://www.icann.org/ ICANN] est une organisation à but non lucratif et reconnue d'utilité publique rassemblant des participants du monde entier qui œuvrent à la préservation de la sécurité, la stabilité et l'interopérabilité de l'Internet.

The  [https://www.internic.net/regist.html companies list] have been accredited by ICANN to act as registrars in one or more TLDs.

Mon choix s'est orienté sur [https://registrar.1and1.info/domains_raa/home 1&1]

Le site [http://www.top10hebergeurs.com/categorie/hebergement-linux.html Top 10 Hébergeurs] donne une "liste hébergeur linux" dont 1&1 fait partie.

J'ai réalisé un devis, en date du 3 janvier 2018, à partir des données recueillies sur le site [https://www.1and1.fr/hebergement-web?ac=OM.FR.FR575K03696T2847a&ref=374121 1&1] :
* 1ère année :
** 1&1 Starter pour 23,88 € HT
** Quiet-cook.com ([https://fr.wikipedia.org/wiki/Nom_de_domaine nom de domaine]) offert
** '''Soit un total de 23,88 € HT'''
* 2ème année et suivante :
** 1&1 Starter pour 35,88 € HT
** Quiet-cook.com pour 9,99 € HT
** '''Soit un total de 45,87 € HT'''
A cette même date, j'ai notifié ce devis.

====Communication avec l'hébergeur====
La communication avec l'hébergeur s'établit avec un outil de gestion de fichier adapté au '''protocole''' de communication [https://fr.wikipedia.org/wiki/File_Transfer_Protocol '''FTP''' (File Transfert Protocol)] ou [https://fr.wikipedia.org/wiki/SSH_File_Transfer_Protocol '''SFTP''' (Secure File Transfert Protocol)]. Il se concrétise avec le logiciel [https://en.wikipedia.org/wiki/FileZilla FileZilla]. Deux sites Filezilla coexistent :
* un site français non officiel [http://filezilla.fr/ filezilla.fr]
* un site anglophone officiel [https://filezilla-project.org/ filezilla-project.org]
Pour Ubuntu, le site français met à disposition un [http://filezilla.fr/tutoriel-filezilla-pour-ubuntu/ tutoriel] qui préconise l'installation du logiciel via :
* les dépôts officiels
* l'archive du site filezilla
* un PPA.
J'ai utilisé la ligne de commande :

<code>sudo apt-get install filezilla</code>

====Développement de l'interface utilisateur (frontend)====
Le développement de l'interface utilisateur est réalisé à partir :
* l'édition du html et du css avec l'éditeur [https://doc.ubuntu-fr.org/gedit gedit] en tapant dans un '''premier''' terminal :
**gedit SCAO/wiki/tp_quiet-cook/index.html SCAO/wiki/tp_quiet-cook/style.css
* l'affichage du rendu à l'écran à l'aide du [https://www.mozilla.org/fr/firefox/ navigateur firefox] en tapant dans un '''deuxième''' terminal :
**firefox  SCAO/wiki/tp_quiet-cook/index.html
Les fichiers du répertoire tp_quit-cook sont disponibles sur le site [https://github.com/AIREL46/SCAO/tree/master/wiki/tp_quiet-cook Github]

Pour déclarer [https://www.w3.org/International/questions/qa-html-language-declarations.fr la langue] dans le fichier html.

====Développer l'arrière plan (backend)====
====Publication du site====
La publication du site se réalise à l'aide de filezilla en relation avec le site de l'hébergeur.
=====Données de connexion=====
Les données de connexion sont copiées sur le site de l'hébergeur puis collées dans filezilla : 
* consulter le site de l'hébergeur [https://www.1and1.fr/ 1&1] - '''Espace client''' (identifiant + mot de passe), puis accès '''FTP sécurisé''', pour '''copier''' successivement les données de connexion
* lancer filezilla :
** puis cliquer successivement sur Fichier - Gestionnaire de sites - Quiet cook - Connexion
** ou '''coller''' successivement les données de connexion comme indiquées dans le tableau :
{| class="wikitable alternance centre"
 |+ Données de connexion :
 |-
 |
 ! scope="col" | <center>Site de l'hébergeur 1&1</center>
 ! scope="col" | <center>Filezilla</center>
 |-
 ! scope="row" | 1
 | <center>Serveur : home717469283.1and1-data.host</center>
 | <center>Hôte (*) : home717469283.1and1-data.host</center>
 |-
 ! scope="row" | 2
 | <center>Identifiant : u91894517</center>
 | <center>Nom utilisateur : u91894517</center>
 |-
 ! scope="row" | 3
 | <center></center>
 | <center>Mot de passe : ........</center>
 |-
 ! scope="row" | 4
 | <center>Port : 22</center>
 | <center>Port : 22</center>
 |}

=====Transfert des fichiers de l'ordinateur vers l'hébergeur=====
* sélectionner les fichiers à tranférer
* faire un clic droit sur la sélection, sur la fenêtre qui s'ouvre cliquer sur '''"Envoyer"'''.
=====Test de l'accès au site web=====
* firefox http://a3cp.org.

=====Mémorisation des données de connexion=====
Avant de quitter filezilla :
* Fichier - Gestionnaire de sites - Donner un nom - Valider.
===Référencement du site ou SEO===
[https://fr.wikipedia.org/wiki/Optimisation_pour_les_moteurs_de_recherche SEO] est l'acronyme de Search Engine Optimization. En français, optimisation pour les moteurs de recherche. Il inclut l'ensemble des techniques qui visent à améliorer le positionnement d'un site, Cette technique est maîtrisée par le [https://fr.wikipedia.org/wiki/Community_manager Community manager].

Prévoir d'ajouter une annonce sur la plateforme [https://www.benevolt.fr/dashboard Benevolt] :
* J'ai besoin de faire connaître mon projet d'invention qui consiste en un Système de Cuisson Intelligente...

===Changement du nom de domaine===
Tout d'abord un rappel chronologique :
* le site [http://quiet-cook.com Quiet cook] a été créé le 03/01/2018, il est remplacé en 2021 par le site [http://a3cp.org a3cp.org]
* l'association [https://fablabo.net/wiki/A3CP A3C Presqu'île] a été créée le 02/04/2019.