Tutoriel de conception Web

Un tutoriel de conception de sites Web est avant tout un tutoriel de HTML et de CSS; pour cette raison, ces outils seront le focus de ce document. Nous n'examinerons pas les autres outils tels que la conception graphique, Flash, la programmation JavaScript ou le script du côté serveur.

Le concept derrière chaque page Web est d'une simplicité trompeuse. Une page Web n’est pas plus qu’un fichier texte en cours de transfert sur l’Internet. Le navigateur local a la responsabilité d’afficher la page en fonction de la mise en page définie dans le fichier HTML. Ce fichier peut référer à d'autres ressources médias enrichis comme des images, des vidéos et des modules d'extension Flash que le navigateur local sollicitera également à partir du serveur Web distant.

Pour ce tutoriel, créez 3 fichiers et enregistrez-les dans un dossier.

  1. Index.html
    Ceci est le texte principal de la page Web. Commencez avec un fichier texte vide créé en bloc-notes.
  2. Styles.css
    Ce fichier texte contient tous les styles pour la page Web. Pour commencer, ce fichier peut être vide.
  3. Picture.jpg
    Trouver un fichier image sur votre ordinateur et renommez-le.

Maintenant, ouvrez le fichier « index.html » dans votre navigateur. Continuez le tutoriel; appuyez sur la touche F5 à mesure que vous effectuez des modifications dans le fichier. Observez les résultats dans le navigateur.

Tutoriel HTML

HTML est synonyme de « langage de balisage hypertexte ». Les balises HTML sont les fondations derrière toutes les pages Web. Dans cette section, nous allons explorer le contenu d'une page web rudimentaire ainsi que quelques balises de base.

Tutoriel CSS

Alors que la conception Web devenait standardisée, les « feuilles de style en cascade » ont été introduites. Entre autres choses, ce changement a permis aux concepteurs Web de séparer le balisage du style.

Ce tutoriel se voulait un aperçu très bref de la conception Web. Maintenant que vous avez une compréhension de la façon qu’une page Web est bâtie, vous pourriez installer quelques logiciels de conception Web et examiner le code source de sites Web en ligne. (clic bouton droit sur cette page et sélectionnez « afficher la source de la page »).