Project 03 · of 11
Online CV
The goal of this SAÉ, “Presenting yourself on the Internet”, is to learn how to present yourself and showcase your background on the web. In practice, it means building an online curriculum vitae: a main page summarising the profile, together with at least two other pages detailing education, qualifications and experience. All the pages share one single CSS stylesheet.
The site is built around a home page (index.html) and secondary pages (Education, Skills, Miscellaneous). The header shows a round profile photo, the name, a short profile summary and a navigation bar. The body of the main page is organised into sections: qualifications, education, work experience (an internship in the IT department of CMI France in 2023), skills and miscellaneous information (languages, sport, interests). A footer gathers the contact details, with a mailto link for the email address.
The layout relies on a single style.css stylesheet: a dark theme, a Flexbox header (photo + text on one side, navigation on the other), a two-column main area (CSS Grid), section cards with rounded corners and animated hover effects. The brief also introduces internal anchor navigation and smooth scrolling through the scroll-behavior: smooth property, as well as links from one page to an anchor on another.
Beyond the code, this SAÉ addresses “professional digital identity”: thinking about what you share about yourself online, the line between private and public life, and taking care of both substance (choice of information) and form (a readable, professional presentation).
Create an online CV to present yourself on the Internet: a main page with at least two detail pages (education, qualifications, experience), all laid out with a single CSS stylesheet.
- Analysis of the brief and of the required structure (main page + at least two detail pages).
- Writing the CV content: identity, summary, education (French general Baccalauréat in Maths/Computer Science, BUT R&T in Colmar), qualifications, experience (internship at CMI France), skills and miscellaneous information.
- Building the semantic HTML skeleton of each page (header, main, sections, footer), split across several files.
- Setting up navigation between pages and useful links (
mailto, address). - Writing a single shared stylesheet: theme, Flexbox header, two-column main area, section cards, transitions and hover effects.
- Discovering and applying internal anchors, back-to-top links and smooth scrolling (
scroll-behavior: smooth). - Testing the final result in the browser and organising the project (HTML files, shared CSS, images folder).
- Respecting the constraint of a single CSS stylesheet shared by every page while keeping a consistent layout.
- Handling links between local HTML files and anchors correctly (links point to another file in the project, not to an online URL).
- Taking care of visual consistency (theme, colours, spacing) for a readable, professional result.
- Taking digital identity into account: choosing which information to share and how to present it.
- AC13.01 — Use a computer system and its tools.
- AC13.04 — Know the architecture and technologies of a website.
- Multi-page CV website (HTML/CSS): index + Education, Skills and Miscellaneous pages.
- A single stylesheet shared by every page.
- Images folder (profile photo).
Documents & files