Learning Design
Vous souhaitez réagir à ce message ? Créez un compte en quelques clics ou connectez-vous pour continuer.



 
Accueil  Dernières imagesDernières images  Rechercher  S'enregistrerS'enregistrer  Connexion  
Le Deal du moment :
Nike : Jusqu’à 50% sur les articles de ...
Voir le deal

 

 [Tutoriel] Les étapes de la création d'un site internet

Aller en bas 
2 participants
AuteurMessage
Maliang
Fondatrice
Maliang


Féminin
Nombre de messages : 2257
Age : 34
Logiciels : Photoshop et Photofiltre

[Tutoriel] Les étapes de la création d'un site internet Empty
MessageSujet: [Tutoriel] Les étapes de la création d'un site internet   [Tutoriel] Les étapes de la création d'un site internet EmptySam 31 Jan - 15:38

Les étapes de la création d'un site internet


Ce tuto a pour but de vous donnez un aperçu des différentes étapes necessaire pour créer un site de qualité. Vous n'êtes en rien obligé de les suivre au pied de a lettre mais elles peuvent être d'une grande aide pour ceux qui ne savent pas par où commencer.

Etape 1 : L'idée

1) Le plus important avant de commencer tout site est de savoir sur quoi vous souhaitez le faire,(je sais ca parait évident), mais aussi et surtout de savoir si vous avez assez de contenu à mettre dans sur ce site. En effet même avec un beau design un site sans contenu n'attirera pas grand monde.

2) Ensuite, il est primordiale de définir clairement les différentes parties qui figureront sur le site et de savoir ce qui figurera dans chaque parties, en résumé il faut faire un plan trés détaillé, voir même une arboresence. Ca vous permettra de savoir quelles pages vous devez créer par la suite.

Exemple
Pour un site d'acteur ou d'actrice le plus souvent le plan donne ça :
- Actrice/acteur : biographie / Filmographie / presse ...
- Photos
- Médias : vidéos / fond d'écrans
- Site / Web (partie pour le contact avec le webmaster, les partenaires ...)

Etape 2 : Les logiciels

Pour faire un site, il faut au minimum 2 logiciels : un pour faire le design et un pour faire le codage.

Le must au niveau des logiciels c'est photoshop, pour faire le design, et dreamweaver pour faire le codage. Mais qui dit must, dit logiciel trés cher. En plus même si c'est vrai que pour Photoshop on voit une nette différence au niveau du design, il ny en a aucune au niveau du codage avec Dreamweaver. Ce que je veux dire c'est que le seul avantage de ce logiciel c'est qu'on peut lui demander de faire certains codes lui même.
Si vous n'avez pas ces logiciels, c'est pas grave vous pouvez utilisez Photofiltre, logiciel de design gratuit, et un simple bloc note ou Notepad++ (que je recommande) pour le codage. Notepad++ a l'avantage de mettre les codes en couleur ce qui permet de mieux se repérer et il est lui aussi gratuit.
Une fois que vous avez les logiciels vous pouvez faire le design et commencer le codage

Etape 3 : Le codage

Je ne vais pas vous expliquer ici comment coder votre site, mais juste vous parler des différents codes qui existent et de leurs différences. D'autres tutos vous expliqueront comment coder votre site étape par étape.
Ils existent donc 4 principaux codes : le HTML, le CSS, le PHP et le Javascript.

1) Le HTML est le code de base, il est absolument indispensable pour faire un site car c'est grace à lui qu'on pourra mettre du texte, des liens, des images, ou encore faire des tableaux. C'est le code de base de tout site. Même s'il ne permet pas d'en faire des trés élaborés c'est déjà un bon début et il permet quand même de faire de trés beaux sites.

2) Le CSS (cascading style sheet) est un code qui se fait sur une seule page à part du site. Ce code permet d'attribuer à tout le site un même design, il fait en quelque sorte la "décoration" du site. Pour que ce design soit appliqué à toutes les pages du site il vous suffira de mettre sur chacunes d'entre elles un lien vers la page de votre code CSS.

3) Le PHP est un code qui vient en complément du HTML. On ne peut pas faire un site avait seulement du PHP même si certaines pages du sites ne sont codées qu'en PHP. L'interêt de mettre du PHP est qu'il permet d'avoir un site dynamique. J'entend par là qu'à chaque fois qu'un internaute demandera à voir une page, le PHP permettra à cette page de se "mettre à jour". Avec une simple page en HTML, l'internaute verrai la page telle que vous l'avez faite à l'origine, alors qu'en PHP certaines mises à jour peuvent se faire à chaque seconde. C'est le cas par exemple lorsque vous mettez une horloge sur votre site. Ca ne peut se faire qu'en PHP, pour que à chaque seconde la page affiche la bonne heure. Une horloge sur du HTML afficherait tout le temps la même heure. Mais ne vous inquiétez pas si tout cela vous semble flou, lorsque vous aurez commencé votre apprentissage du PHP ca vous paraitra plus clair (enfin peut etre pas tout de suite, tout de suite).

4) Enfin le javascript est un autre langage qui permet également de faire des sites dynamiques. Il apporte quelques fonctionnalités supplémentaires à PHP, mais sincérement pas besoin de le connaitre pour faire déjà un super site trés dynamique. Sur Learning Design il n'y aucun code en javascript.

Etape 4 : La mise en ligne

1) Pour mettre votre site en ligne il vous faut tout d'abord un hébergeur et un nom de domaine. Il en existe des payants qui sont trés bien et dont le prix n'est pas forcément trés élevé et aussi des gratuits qui ont l'inconvénient de vous fournir d'office un nom de domaine qui sera forcément consistué du nom de l'hébergeur. Exemple, vous prenez un compte sur Free, l'adresse de votre sera "votresite.free.fr" . Mais sincèrement ce n'est pas un gros inconvénient pour avoir un site gratuit.
- Parmis les hébergeurs payants les plus connu sont 1&1, OVH et Gandi
- Parmis les hébergeurs gratuit le must reste sans conteste Free, mais vous pouvez aussi vous inscrire sur Orange et bien d'autres encore.


2) Une fois l'hébergeur trouvé, il vous faut passer tous les fichiers composants votre site, de votre ordinateur à l'hébergeur. En effet tout le temps que le site est sur votre ordinateur qui peut le voir à part vous ? Personne. Alors pour que les internautes puissent le visiter, il va falloir envoyer tout les documents sur l'hébergeur, et cela se fait grace à un FTP. Je ne détaille pas plus la fonction du FTP ici car tout est expliqué dans un tuto que vous pouvez trouver ici

3) Dernière étape faire connaitre votre site ! Ben oui sinon qui viendra le voir ? Pour cela il n'y a pas de recette miracle. Le mieux est d'inscrire votre site sur Google, de passer des partenariats avec d'autres sites ou encore d'inscrire votre site sur des top-site ! Mais ne vous inquiétez pas je ferais également un tuto plus détaillé sur le sujet.

Objectif atteint !

Certe le première objectif de ce tuto n'était pas bien grand, mais si vous avez compris la démarche première à suivre lors que la création de votre site internet, alors oui on peut dire que le er objectif est atteint !
Bien sur il ne faut pas s'arrêter en si bon chemin ! Vous n'avez ici qu'un aperçu des différentes étapes et maintenant il faut les approfondir (en particulier la partie sur le codage) et les mettre en oeuvre. Je vous invite donc à le faire en suivant les prochains tuto de la création d'un site Web !

Tutoriel réalisé par Maliang
Revenir en haut Aller en bas
https://learning-design.actifforum.com
youssefsky
Petit nouveau



Nombre de messages : 1
Age : 35

[Tutoriel] Les étapes de la création d'un site internet Empty
MessageSujet: Re: [Tutoriel] Les étapes de la création d'un site internet   [Tutoriel] Les étapes de la création d'un site internet EmptyMer 9 Jan - 20:07

Merci pour cette mine d’or d’informations et de bonnes idées sur la conception de sites Internet.
Revenir en haut Aller en bas
http://aflamovie.com/
 
[Tutoriel] Les étapes de la création d'un site internet
Revenir en haut 
Page 1 sur 1
 Sujets similaires
-
» Commande Design site internet
» Creation svp pour mon site [Annule]
» [Tutoriel] Qu'est ce qu'un FTP ?
» [Tutoriel] Leech FTP
» [Tutoriel FTP] FileZilla - Utilisation

Permission de ce forum:Vous ne pouvez pas répondre aux sujets dans ce forum
Learning Design :: World wide web :: Les tutoriaux :: Autres-
Sauter vers:  
Ne ratez plus aucun deal !
Abonnez-vous pour recevoir par notification une sélection des meilleurs deals chaque jour.
IgnorerAutoriser