Terug

Getting started

Om gebruik te maken van Uno moet je rekening houden met een aantal regels en standaarden svoor het opbouwen van een pagina.

Installatie

  1. Installeer nodejs.
  2. Voer het commando npm install uno --save uit in je terminal om uno te installeren.

Documentstructuur

Onderstaande snippet bevat de minimale inhoud van een uno-pagina:

<!DOCTYPE html>
    <html lang="nl">
    <head>
    <link rel="stylesheet" href="/node_modules/uno/dist/core/uno.css" media="screen" />
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta http-equiv="x-ua-compatible" content="ie=edge">
    </head>
    <body>

    HIER KOMT DE INHOUD VAN JE PAGINA

    <script src="/node_modules/when/es6-shim/Promise.min.js"></script>
    <script src="/node_modules/systemjs/dist/system.js"></script>
    <script>
    System.config({
      packages: {
        '/': {
          defaultExtension: 'js'
        }
      }
    });

    System.import('/uno/core/a11y.js').then(function (module) {
      new module.A11y();
    });
    </script>
    </body>
    </html>
  • Uno bevat HTML5 elementen. Begin daarom altijd met de !DOCTYPE html declaratie.
  • Uno is mobile-first. Om de juiste weergave en touch zooming te garanderen voeg je de viewport meta tag toe aan de head
  • Voor oudere versies van internet explorer voegen we de meta tag x-ua-compatible toe aan de head, zodat deze zich altijd als de laatst beschikbare versie gedraagt.
  • Het script in a11y.js zorgt voor duidelijke focus voor toetsenbord-gebruikers en is verplicht met het oog op toegankelijkheid.