SAÉ 14 — Semestre 1

Se présenter sur Internet

Concevoir, développer et héberger ce portfolio en HTML/CSS — du code source à la mise en ligne.

Contexte et objectifs

L'objectif de cette SAÉ était double : apprendre les bases du développement web (HTML5, CSS3) et comprendre la chaîne complète de publication d'un site internet (hébergement, DNS, FTP). Le livrable est ce portfolio lui-même, que vous consultez en ce moment. C'est une SAÉ individuelle, ce qui m'a obligé à prendre en charge chaque décision de bout en bout.

La compétence visée était RT3 (Créer des outils et applications informatiques), niveau 1 : s'intégrer dans un service informatique.

Apprentissages Critiques mobilisés

AC13.01 — RT3
Utiliser un système informatique et ses outils
Utilisation de VS Code comme éditeur, du terminal pour le déploiement FTP (FileZilla), des outils de développement du navigateur (inspecteur, console) pour déboguer le CSS.
AC13.04 — RT3
Connaître l'architecture et les technologies d'un site Web
Compréhension du rôle du serveur HTTP, du DNS (résolution d'un nom de domaine vers une IP), de l'hébergement mutualisé, et de la structure HTML/CSS d'un site multi-pages avec feuille de style partagée.

Tâches réalisées

  • Conception de l'arborescence du site (index.html + une page par SAÉ + pages présentation et bilan)
  • Développement de la feuille de style CSS commune (variables, header, hero, cards, pages de détail)
  • Développement de chaque page HTML en respectant la sémantique HTML5
  • Tests de compatibilité sur Chrome et Firefox
  • Déploiement sur le serveur de l'IUT via FTP et vérification de la mise en ligne
  • Configuration de la résolution DNS et vérification avec nslookup

Traces et preuves

Trace 1 — Ce site lui-même

Le portfolio que vous consultez est le livrable direct de cette SAÉ. Il comporte 7 pages HTML liées par une feuille CSS commune, hébergé sur le serveur de l'IUT. L'ensemble du code source est disponible sur mon GitHub. C'est la trace la plus concrète possible pour AC13.04 : la preuve que je maîtrise l'architecture d'un site web fonctionnel.

Trace 2 — Capture de la résolution DNS

Capture d'écran de la commande nslookup mon-portfolio.iut-ville.fr renvoyant l'IP du serveur, réalisée après la mise en ligne. Montre la compréhension concrète du mécanisme DNS (AC13.04) et l'utilisation des outils système (AC13.01).

Autoévaluation

Ce que j'ai réussi

Le site est en ligne, navigation fonctionnelle, design cohérent sur toutes les pages. La feuille CSS partagée m'a évité de répéter le même code.

Difficultés rencontrées

Le positionnement CSS (flexbox, grid) m'a demandé beaucoup d'essais-erreurs. J'ai aussi mis du temps à comprendre que les chemins relatifs des fichiers CSS changent selon l'emplacement des pages.

Ce que j'aurais fait autrement

J'aurais utilisé Git dès le début pour versionner mon code plutôt que de tout uploader à la fin. J'aurais évité de perdre une version intermédiaire.

Adaptation possible

Ces compétences sont transférables à la création de tout site statique, mais aussi à la compréhension des interfaces web dans les outils d'administration réseau (Grafana, pfSense, etc.).

✏️ Ce que cette SAÉ m'a appris au-delà du HTML/CSS : publier quelque chose sur internet oblige à tout assumer. Il n'y a plus d'enseignant qui corrige en privé — le résultat est visible par tout le monde. Ça m'a rendu plus rigoureux et plus attentif aux détails.
Niveau de maîtrise estimé — AC visés de la SAÉ 14
DébutantEn cours d'acquisitionMaîtrisé
← Retour aux projets