1. Introduction

La musique est dans la vie de tout le monde. Chaque chanson, chaque morceau de la musique représente quelque chose pour une personne. Ça peut être un bon moment avec la famille, ou une voyage à une ville mais la musique nous fait réfléchir par une façon ou autre. Pour moi, chaque chanson me fait imaginer une image, une photo. Avoir une connexion entre une image et une chanson fait probablement référence aux pochettes des albums pour les artistes qui font la musique. En revanche pour moi c'est quelque chose de plus personnel. Ce qu'une chanson présente pour moi, dépend sur mon état d’esprit sur le moment, et dans quelle situation je me trouve; donc ce n'est pas la même chose que l’artiste. Je voulais faire une proposition d'image que moi j'imagine pour une chanson. Le lien de la chanson et l'image que moi je choisis pour la chanson, se trouvent sur mon blog. Avec cette méthode je peux montrer mon imagination avec des autres gens et apprendre aussi comment travailler avec le html, css et le php.

2. Matériel et méthodes

2.1 Matériel

  • 1 x ordinateur
  • 1 x serveur web avec MySQL installé

Pour ce projet il n'y a pas besoin de beaucoup de matériels; sauf l'imagination, un ordinateur et l'internet.

2.2 Méthodes

2.2.1 Trouver une chanson et l'image correspondante

Cette partie de projet est faite par moi et mon goût musical. La chanson est choisit par moi et l'image qui l'aide à être définit est choisit par moi aussi.

2.2.2 Mettre en place la chanson

Le lien YouTube de la chanson est sur le blog qui permet au visiteur de l’écouter. Avec la commande "href" je mets en place le lien qui envoie le visiteur vers la chanson. Par exemple pour la chanson Day 3 de Marilyn Manson la code est présentée par cette façon dans le "body" de html: <p>YouTube Link : <a href="https://www.youtube.com/watch?v=5kmlOS9_bK4"> Listen here </a>.</p>

2.2.3 Mettre en place l'image

Avec une description brève de la scénario de la situation dans laquelle l'image se trouve, je mets l'image sur le blog avec la commande "img" qui demande la source de l'image est une titre pour l'image. Dans l’exemple de Day 3, le code est affiché comme ça: <p><img src="http://wac.450f.edgecastcdn.net/80450F/975kgkl.com/files/2014/11/Silhouette-Of-Cowboy-With-Guitar-from-Julie-Weiss-300x204.jpg" alt="Basic Picture"/></p>

2.2.3 Mettre en place le rating

En introduisant le rating, je pourrais avoir une idée de ce que les autres gens pensent de ma proposition. J’introduis les cases pour faire une rating de 0 jusqu’à 5 avec ce code: <div class="stars">

   <form action="">

<input class="star star-5" id="star-5" type="radio" name="star"/> <input class="star star-4" id="star-4" type="radio" name="star"/> <input class="star star-3" id="star-3" type="radio" name="star"/> <input class="star star-2" id="star-2" type="radio" name="star"/> <input class="star star-1" id="star-1" type="radio" name="star"/> </form>

 </div> 

2.2.3 Mettre en place le php

En proposant deux chansons avec deux images, j'arrive à remarquer les choses qui restent les mêmes sur mon blog et les choses qui changent. La table de MySQL sur le phpMyAdmin est construite de 6 parties: le id, l’artiste, le tire, le lien, la description et la source. Ils sont les paramétrés qui changent. Toutes ces paramétrés définissent le blog.

2.2.4 Mettre en place le css

Le css rend le blog plus jolie pour les visiteurs. Il aide aussi à déterminer les bonnes paramètres et tailles pour les images et le texte. Le codage css que j'utilise, se trouve dans ce lien: https://dev.gyre.ch/amirhossein.asadizanjani/test.css Il faut mettre aussi en lien le html et le css au debut de codage pour le blog.

3. Résultats

Les blogs https://dev.gyre.ch/amirhossein.asadizanjani/test.html et https://dev.gyre.ch/amirhossein.asadizanjani/test2.html représentent les deux exemples de la proposition que je voulais faire. L’idée de la base qui était de mettre en vue une lien pour la chanson et une image pour présenter la chanson, est réalisée.

4. Discussion

Le sujet de rating n'a pas été faite avec de réussite mais ça c’était juste une supplément pour l’idée de la base mais sans cette progamme, le blog fonctionne toujours.

5. Conclusion

Mes connaissances sur, comment gérer une blog qui est fait de css et html, ont 100% augmenté. Mon vue sur les sites internet sont changées et maintenant je vois l'effort qui est derrière une petite touche sur l’internet.