---
# System prepended metadata

title: Welcome on Instagram correction
tags: [' html', ' css', evaluation]

---

---
title: Welcome on Instagram correction
tags: evaluation, html, css
robots: noindex, nofollow
author: Julien Noyer
---

# Correction Welcome on Instagram

Vous devez réaliser la page de connexion du site Instagram au format HTML, CSS et Javascript. L’intégration doit être faite par étapes, chacune d’entre elles doit bien être validée avant de passer à l’étape suivante. Ce document de présentation à pour but de vous décrire la totalité des tâches que vous devrez réaliser pour mener à bien votre évaluation, prenez le temps de lire ce document avant de commencer à travailler.

![](https://i.imgur.com/xpIZVx4.jpg)

# Correction

## HTML

```htmlmixed=
<!DOCTYPE html>
<html lang="fr">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <meta http-equiv="X-UA-Compatible" content="ie=edge">
        <title>Welcome to Instagram</title>
    </head>
    <body>
        
        <!-- Ouverture -->
        <header>
            <p>Réalisation d'une copie de la page de connexion du site Instagram</p>
        </header>

        <!-- Contenu principal -->
        <main>
            <section>
                <img src="./img/backPhone.png" alt="Présentation dee Instagram">
            </section>

            <section>
                <article>
                    <img src="./img/logo_instagram.svg" alt="Logo Instagram">

                    <form action="#">
                        <input type="email" name="email" minlength="5" required placeholder="Adresse email">
                        <input type="password" name="password" minlength="5" required placeholder="Mot de passe">

                        <button type="submit">Se connecter</button>
                    </form>

                    <ul>
                        <li>Ou</li>
                        <li><a href="#">Se connecter avec Facebook</a></li>
                        <li><a href="#">Mot de passe oublié</a></li>
                    </ul>
                </article>

                <article>
                    <p>Vous n'avez pas de compte ? <a href="#">Inscrivez-vous</a></p>
                </article>

                <article>
                    <p>Télécharger l'application</p>
                    <ul>
                        <li><a href="#"><img src="./img/appleStore.png" alt="Logo AppleStore"></a></li>
                        <li><a href="#"><img src="./img/googlePlay.png" alt="Logo GooglePlay"></a></li>
                    </ul>
                </article>
            </section>
        </main>

        <!-- Fermeture -->
        <footer>
            <ul>
                <li><a href="#">À propos de nous</a></li>
                <li><a href="#">Support</a></li>
                <li><a href="#">Blog</a></li>
                <li><a href="#">Presse</a></li>
                <li><a href="#">API</a></li>
                <li><a href="#">Emplois</a></li>
                <li><a href="#">Confidentialité</a></li>
                <li><a href="#">Condition</a></li>
                <li><a href="#">Répertoire</a></li>
                <li><a href="#">Langue</a></li>
                <li><a href="#">© 2017 Instagram</a></li>
            </ul>
        </footer>
    </body>
</html>
```