index.html

<!DOCTYPE html>
<html lang="fr">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="css/style.css">
    <title>La Capsule CDR</title>
    <script type="text/javascript">window.$crisp=[];window.CRISP_WEBSITE_ID="cdd2c786-b5e8-4f3e-ba30-65822da6b355";(function(){d=document;s=d.createElement("script");s.src="https://client.crisp.chat/l.js";s.async=1;d.getElementsByTagName("head")[0].appendChild(s);})();</script>
</head>
<body ontouchstart="">
    <header>
        <menu>
            <a href="#" onclick="document.getElementById('search').focus()"><img id="searchbar" src="media/assets/search.png" alt="Recherche" title="Recherche"></a>
            <form action id="searchform">
            <input type="search" name="search" id="search" role="search" enterkeyhint="search">
            </form>
        </menu>
        <menu>
            <a href="index.html"><img id="link" src="media/assets/home.png" alt="Accueil" title="Accueil"></a>
        </menu>
    </header>
    <main>
    <aside>
    <a href="#" id="ben" onclick="this.focus()">Je suis bénéficiaire</a>
    <section id="ben" onclick="this.focus()">
        <a href="#"><article onclick="this.focus()">
            <h1>Linux</h1>
            <h2>Installer Linux</h2>
            <img src="media/img/linux-penguin-security-100694867-large.webp" alt="">
            <h3>Comment installer Linux sur son PC</h3>
        </article></a>
    </section>
    <section id="ben" onclick="this.focus()">
        <a href="#"><article onclick="this.focus()">
            <h1>Windows</h1>
            <h2>Désinstaller Windows</h2>
            <img src="media/img/rip-windows-seven-featured.jpg" alt="">
            <h3>Comment désinstaller Windows de son PC</h3>
        </article></a>
    </section>
</aside>
<aside>
    <a href="#" id="pro" onclick="this.focus()">Je suis professionnel</a>
    <section id="pro">
        <a href="#"><article>
            <h1>Linux</h1>
            <h2>Installer Linux</h2>
            <img src="media/img/linux-penguin-security-100694867-large.webp" alt="">
            <h3>Comment installer Linux sur son PC</h3>
        </article></a>
    </section>
</aside>
</main>
    <footer>
        <menu class="footer">
            <a href="html/contact.html"><img class="link" src="media/assets/mail.png" alt="Contact" title="Contact"></a>
            <a href="html/user.html"><img class="link" src="media/assets/user.png" alt="Profil" title="Profil"></a>
            <a href="html/settings.html"><img class="link" src="media/assets/settings.png" alt="Paramètres" title="Paramètres"></a>
            <a href="#"><img class="link" src="media/assets/lock.png" alt="Se deconnecter" title="Se deconnecter"></a>
        </menu>
    </footer>
</body>
</html>