Aller au contenu

HTML⚓︎

Un gabarit minimaliste⚓︎

Parce qu’il faut bien copier-coller une source pour démarrer .

template.html
<!doctype html><!-- (1) -->
<html lang="fr"><!-- (2) -->
<head>
  <meta charset="utf-8"><!-- (3) -->
  <!-- (4) -->
  <meta name="viewport"
        content="width=device-width,initial-scale=1"><!-- (5) -->
  <meta name="referrer" content="origin-when-cross-origin"><!-- (6) -->
  <title>Title</title><!-- (1) -->
  <link rel="icon" href="data:;base64,iVBORw0KGgo="><!-- (7) -->
  <link rel="stylesheet" href="style.css" />
  <style></style>
</head>
<body>
  <header>
    <h1>Title</h1>
  </header>
  <main>
  </main>
  <script type="module"></script>
</body>
  1. Pour en faire un document valide HTML5.
  2. Pour les lecteurs d’écran, le référencement, les extensions, etc.
  3. Doit être dans les premiers 1024 bytes, plutôt à mettre avant le <title>, référence à ce sujet.
  4. Pourquoi pas de balise meta avec une valeur X-UA-Compatible ? Voir cette réponse sur StackOverflow.
  5. Beaucoup de monde dans la balise meta relative au viewport, et nous sommes responsables de cela…
  6. Avec cette valeur, le site lié ne saura pas de quelle page provient le lien qui a été cliqué mais aura uniquement l’information du domaine. Cela me semble être un bon compromis pour préserver l’intimité des personnes.
  7. Gif transparent le plus petit qui soit, évite une requête inutile vers le serveur (et une erreur dans la console).

🤳 Capturer une image/vidéo de la webcam depuis le navigateur⚓︎

Exploration de Austin Gil.

C’est uniquement possible sur certains navigateurs mobiles mais c’est bon à savoir.

capture.html
<input type="file" accept="image/*" capture="environment">

Dernière mise à jour: 2022-09-09