Bienvenue sur mon site
MenuAccueilMémoire dans la peauLa Mort dans la peauLa vengeance dans la peauLes acteursLa conception du site
  

La Conception du site

Sommaire de la page:


• Ce que la création de ce site m'a apporté:

J'ai commencé à m'intéresser à la création de site à l'âge de 13 ans lorsque j'ai eu Internet. J'ai commencé avec des logiciels comme Frontpage (aujourd'hui nommé "Expression") puis plus élaborés comme Dreamweaver. Bien que ayant des bases sur le code HTML, je ne me suis jamais vraiment intéressé à celui-ci puisque les logiciels font tout pour nous aujourd'hui. Cependant j'ai pu voir que connaître le code html d'une page permet une élaboration du site bien plus sophistiqué. Je pense tout d'abord au CSS que je ne connaissais pas du coup car les logiciels comme FrontPage l'inclus directement dans les pages sous les noms de "style" juste après la balise "< / head >".
J'ai donc appris qu'en faisant un fichier .css incluant tous les styles et autres, le changement du design du site devient très souple puisqu'il n'y a plus qu'à éditer le fichier CSS et non plus page par page.
J'ai pu aussi me "mettre à la page" avec les nouvelles balises comme "span" ou "div" alors que j'utilisais encore des balises comme "b", "u","center". J'ai découvert beaucoup d'autres balises comme "p" ou encore la série des "H1", "H2" etc. très pratique pour donner un style rapidement au texte sans avoir à rajouter des styles à la balise qui contient le texte.

  • Les difficultés rencontrées

Ayant l'habitude d'utiliser les logiciels, la conception d'un site par le bloc note m'a paru assez difficile dans certaines occasions.
Au départ, on est un peu "aveugle", on ne sait pas vraiment ce que l'on fait alors que sur un logiciel on peut visualiser instantanément le résultat de notre création. Je ne connaissais pas vraiment le code html, et surtout les styles à appliquer pour que tel tableau, tel phrase soit comme je le veux. J'ai donc dû m'aider  d'exemples que j'ai pu trouver sur internet en visualisant leurs codes sources. Je me suis donc aidé d'autres sites pour trouver les bons styles, les bonnes balises à appliquer, mais j'ai trouvé beaucoup d'aides aussi sur les forums en cherchant dans Google, qui est une véritable mine d'or.
Une autre difficulté qui m'a beaucoup gêné, c'est que le code html est au final assez brouillon dans le bloc note, on n'arrive pas à trouver la ligne que l'on cherche parfois. Donc certes, il faut organiser son code, mais les logiciels avec leurs interfaces html en couleur est une bénédiction même si au final, on arrive à connaître à peu près par coeur l'organisation html de sa page.
Une difficulté que j'ai rencontré que je n'avais jamais eu avec les logiciels est l'incompatibilité de certains éléments avec IE ou Firefox. J'ai parfois du faire plusieurs tests et faire des recherches dans les forums pour découvrir pourquoi tel élément marche avec IE et pas avec Firefox et inversement. Au final, je pense avoir quand même avoir rendu mon site totalement compatible entre les deux navigateurs Web les plus utilisés.

  • Les à priori:

Je dois avouer que avant de commencer ce site, je m'étais toujours dis que puisque les logiciels permettent de créer des sites facilement, je ne voyais pas l'intérêt de connaitre le code html. Pourtant même si l'écriture du html est fastidieuse, longue et compliquée, elle permet de créer un site plus souple selon nos désirs, et évite les longues lignes de codes inutiles que rajoutent les logiciels et qui alourdissent la page.

• Ce que j'ai essayé de faire:

Pour la création de ce site, j'ai essayé d'appliquer mon expérience déjà acquise grâce à la création de mes précédents sites, tout en appliquant les nouvelles choses que j'ai pu apprendre avec celui-ci.
Par rapport à mes connaissances déjà acquise, c'est surtout concernant le design du site, la création de tableau pour organiser le site, les liens et beaucoup d'autres choses :) Cependant j'ai pu aussi mettre à jour certaines de mes connaissances par des plus pratiques que j'ai découvert en cours ou sur les forums, comme les styles, le CSS. J'ai aussi tenté d'utiliser des balises vu en cours que je ne connaissais pas du tout comme la balise DIV que j'ai essayé d'utiliser dans la page "Les acteurs" au lieu de la balise "TABLE" que j'ai toujours utilisé auparavant.

• Les logiciels et temps utilisés:

J'ai utilisé plusieurs logiciels pour la création de ce site:

  • Bloc note:

Qui m'a bien sûr servi à taper le code source des pages.

  • Paint Shop Pro:

Ce logiciel m'a été très utile depuis que je crée des sites. J'ai une version assez ancienne mais que j'arrive bien à maitriser donc je la garde. Je l'ai utilisé pour connaitre le code html des couleurs, pour diminuer les images (celles des miniatures), pour la transformation des images etc.

  • Photoshop:

J'ai utilisé ce logiciel en combinaison avec Paint shop pro pour le design du site, c'est à dire les boutons, la bannière du haut. C'est un logiciel que je trouve extrêmement puissant même en ne connaissant que les bases, on peut appliquer de magnifiques effets à une image.

  • Le temps utilisé:

Pour le design j'ai passé 3h à faire les images puis 4 autres heures à finaliser le design final comprenant le code html de ma page. Pour le reste des pages j'ai passé environ 10h. Pour un total que j'estime de 17heures. Je ne compte bien sur pas les heures de recherches sur internet sur les codes html et le contenu.

• Les étapes de la création:

  • 1ère étape: le sujet

J'ai tout d'abord cherché un sujet de site. Etant allé voir "la vengeance dans la peau" quelques jours auparavant j'ai décidé que ça serait mon sujet. J'ai ensuite décidé les différentes parties que je mettrai dans mon site car une fois le menu fait, il est difficile de rajouter ou supprimer des parties.

  • 2nde étape: le design

J'ai ensuite crée le design de mon site, ma partie préférée je dois l'avouer même si je ne maîtrise pas vraiment bien les logiciels de dessin. J'ai décidé alors de faire un design assez simple, rapide et surtout facile à mettre en place car je n'avais plus les outils, que proposent les logiciels de création de site, en main.

  • 3ème étape: la page modèle

J'ai ensuite encodé la page qui sera un modèle pour les 5 autres de mon site, il faut donc éviter les erreurs et les mauvaises mises en formes pour éviter d'avoir à modifier les 5 autres pages par la suite. La page contient donc le design, la mise en page, le signet "retour en haut de page" mais est vierge de contenu.

  • 4ème étape: les recherches

Les recherches comprennent aussi bien celles du code html (les styles, les balises etc.) que celles du contenu du site (les films, synopsis etc.)

  • 5ème étape: Le contenu

Certainement la plus longue étape, il faut maintenant remplir la page du contenu, que ca soit du design, l'organisation de la page, que du contenu à propos des films.

  • 6ème étape: Finalisation

La dernière étape, c'est à dire purger le code source d'éventuelles erreurs, le corriger au besoin, vérifier tous les liens etc.

  • Etape intermédiaire: les vérifications

Il faut toujours vérifier son code lors de la création du site, pour vérifier ainsi si il n'y pas d'erreurs mais aussi vérifier la compatibilité avec IE et Firefox.

• Les sources:

  • les codes html utilisé dans mon site

J'ai noté quelques adresses importantes qui m'ont aidé à comprendre et à utiliser certaines balises:
http://www.laurent-bernat.com/html-balises.php3?quoi=recap_balises ( toutes les balises existantes )
http://papynet.mvps.org/CSS/CSS-01.htm ( concernant les liens )
( Utilisation des balises DIV )
Mais j'ai surtout trouvé mes sources sur les forums de discussion, qui permet d'avoir une vision plus globale du code à utiliser puisque les gens débattent sur le meilleur à utiliser.
J'ai voulu aussi utiliser un menu déroulant à base de JavaScript à titre personnel car j'aime beaucoup utiliser ce genre de menu et j'ai donc voulu voir de quoi le code html était composé. Je l'ai trouvé à ICI.

  • Les sources concernant les films

J'ai beaucoup utilisé allocine.fr pour trouver les images pour le design, mais aussi pour les images de présentations de chaque film. J'ai redirigé les bandes annonces vers ce site puisqu'il est impossible de télécharger les vidéos pour les mettre sur son propre serveur.
J'ai utilisé aussi le site http://www.commeaucinema.com pour les synopsis et quelques images et les informations sur les acteurs.

• Conclusion

Ce site m'a donné envie de recommencer la création d'un site amateur afin d'approfondir mes connaissances et peut être de pouvoir les utiliser dans un futur métier. J'ai toujours aimé l'informatique et particulièrement la création de sites sur lesquels j'ai passé d'innombrables heures à les peaufiner. Ce cours m'a donc permis d'évoluer positivement et d'acquérir des connaissances que je n'aurais sans doute jamais pu avoir en continuant comme j'avais commencé la création de site.
Finalement si je recommence un site je pense utiliser beaucoup plus souvent le html mais en combinaison avec un logiciel comme Dreamweaver ou Expression afin de pouvoir visualiser ce que je fais immédiatement au lieu de devoir lancer Firefox ou Internet Explorer à chaque fois.