For the whole quest, the principle is to iterate over your code: when you finish an exercise, copy-paste your code to use it in the next one.
Naming of the files:
- for the HTML files: `name-of-the-exercise.html`
- for the CSS files: when you have to link one, you can manage it as you prefer, but for clarity we suggest you to create a CSS file for each HTML file, named like so: `name-of-the-exercise.css`
- for the JS files, when you have to link one, you can manage it as you prefer, but for clarity we suggest you to create a JS file for each HTML file, named like so: `name-of-the-exercise.js`
To create any project, some things need to be declared in the HTML file - those are not visible elements in your page, but things cannot work without them.
Set your page with [`<html>`](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/html) & [`<head>`](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/head) tags, and also put a [`<title>`](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/title) to name the entity you're going to create.
Now you have to define the skeleton of your future creation.
Remember this as a general rule for any further project you will start: a good way of setting up a project is to think about all the elements needed, organize and divide them in blocks.
Let's define the first level of elements that your entity will be made of ; we're going to split it into 3 main chunks: the face, the upper body, and the lower body.
Inside the `<body>` tag of your HTML file, create 3 divisions using `<section>` tags, putting the following text content inside for each: `face`, `upper-body`, `lower-body`.