Panelen Inställningar på en layout
När du högerklickar på en layout/grid/gridrad/gridspalt kan du längst ned välja att gå till layoutens egenskaper. Under panelen Inställningar visas följande information:
Typ
Här ser du vald typ - radvis eller kolumnvis layout - på den layout du har markerat. Det går också att byta typ här om du egentligen ville ha kolumnvis layout. Välj typ i listan.
Vertikal justering
Här anger du hur du vill att innehållet i layouten ska placeras på raden. Alternativen som du kan välja är:
- top
- middle
- bottom
Horisontell justering
Här anger du hur du vill att innehållet i layouten ska placeras i kolumnen. Alternativen är:
- left
- center
- right
Elementtyp (HTML5)
Semantisk html innebär att man ska använda rätt element för rätt innehåll. Det vill säga att för en lista ska man använda sig av html-elementen <ul>, <ol>, <li>, för rubriker så ska elementen <h[1-6]> användas osv. HTML5 inkluderar en mängd nya semantiska taggar som:
- div - en del av ett dokument.
- header - den översta delen av webbsidan. Kan till exempel innehålla <h1>-<h6>, logotyp, sökfält med mera.
- footer - den nedre delen av webbsidan.
- main - specificerar huvudinnehållet i dokumentet.
- nav - för navigationen på en sida, till exempel en meny.
- section- exempelvis ett kapitel. En hemsida kan struktureras upp i olika sektioner så som nyheter, introduktion och kontaktinformation.
- article - anger oberoende , fristående innehåll.
- aside - används för att skilja delar av innehållet från det som är det viktiga. Till exempel kan <aside> användas för citatblock, reklam, navigation el dyl i en <article>.
- hgroup - representerar en heading av en sektion. Elementet är till för att gruppera ett flertal <h1>-<h6> i en section. Användbart när det kan finnas flera nivåer av headings.
- time - för att presentera ett datum eller en tid.
- mark - för att markera text för till exempel referenser.
Läs mer om semantisk html5: http://www.w3schools.com/htmL/html5_semantic_elements.asp
Länk till annan webbplats, öppnas i nytt fönster.
http://www.vanseodesign.com/web-design/html5-semantic-elements/ Länk till annan webbplats, öppnas i nytt fönster.http://html5doctor.com/element-index/ Länk till annan webbplats, öppnas i nytt fönster.
ARIA-roll
Använd WAI-ARIA landmärkesroller, som main, navigation, banner, contentinfo, complementary och så vidare. Det gör att användare med exempelvis skärmläsare på ett standardiserat sätt kan navigera mellan sidans olika delar.
Nästla inte roller av samma typ. Landmärkes roller måste ha en etikett (h1,h2) om det finns fler än en roll av samma typ på en sida. ARIA roller har högre prioritet än elementtyp, definiera inte om ordinarie HTML element.
Det finns 9 olika standardalternativ:
- banner
- complementary (exempelvis en sidospalt)
- contentinfo(metadata om en sida exempelvis copyright)
- main (the main content of the page)
- form
- navigation
- note
- region
- search
Du kan välja bland de förvalda alternativen i listan eller skriva dit ett eget alternativ.
Då alla webbläsare och hjälpmedel inte kan översätta HTML 5 elementtyper ännu så förordar vi att man använder ARIA landmärkesroller parallellt med HTML 5 elementtyper.
Skriv ut sida
