logo   <div> varianter.




Først var der:
tabeller.
De blev erstattet af:
div.
Div har senerehen fået en del 'identiske' varianter:
div
article
aside
footer
header
main
nav
section.
og mangler stadig:
wrapper / container?
sidebar?
foot?
..?


Fælles for 'article' etc. er at de alle er 'kopier' af 'div' og erstatter brugen af 'div'.


Formålet med de nytilkomne tags er primært:
- at gøre det nemmere for 'blindeprogrammer' at læse en side.
Derudover kan de også under kodning gøre det lettere:
- at læse og finde rundt i koden.
- at etablere målrettede css-selektorer.




<div> og varianter


Følgende tags er de mest relevante i forbindelse med opbygningen af sidestruktur i 'body'-delen af HTML-sider.




div


The div element has no special meaning at all. It represents its children. It can be used with the class, lang, and title attributes to mark up semantics common to a group of consecutive elements.


Til 'div' er hverken knyttet bindinger eller forudsætninger. Den kan bruges alle steder, hvor der er brug for 'at pakke noget ind' hvadenten det er som 'wrapper' / 'container' eller inde i et 'td'-tag.




article


The article element represents a complete, or self-contained, composition in a document, page, application, or site and that is, in principle, independently distributable or reusable, e.g. in syndication. This could be a forum post, a magazine or newspaper article, a blog entry, a user-submitted comment, an interactive widget or gadget, or any other independent item of content.


'article' indeholder samtlige data, der vises på skærm / printes fra 'brødteksten'. Den udgør således en delmængde af 'main'.




aside


The aside element represents a section of a page that consists of content that is tangentially related to the content around the aside element, and which could be considered separate from that content. Such sections are often represented as sidebars in printed typography.


Definitionen af 'aside' kan opfattes som en tvetydighed med hensyn til anvendelse:
- data der knytter sig til sidens content.
- en 'sidebar' udenfor brødteksten.


Tendensen synes at være at være at anvende 'aside' som en sidebar udenfor main.




footer


The footer element represents a footer for its nearest ancestor sectioning content or sectioning root element. A footer typically contains information about its section such as who wrote it, links to related documents, copyright data, and the like.


Definitionen af en footer er snævert knyttet til 'article' som værende en tidsskriftartikel el.lign. Der synes dog at være praktisk belæg for at anvende den som sidens nederste blok-element til adressedata etc.




header


The header element represents a group of introductory or navigational aids.


Header anvendes til alle de data der typisk går igen på tværs af sitet i sidernes øverste del.


På 'index'-siden kan der være inglagt en ekstra 'header' til til visning af banner. - Eller banneret kan være placeret i en div-boks.




main


The main element can be used as a container for the dominant contents of another element. It represents its children.


Anvendes omkring den del af dataene på en side der er specifikke for netop den side - incl. evt. links til 'includes', lokalt indlejrede javaScripts, CSS-data etc.


'Main' svarer derved ganske nøje til det der i mange år har gået under kaldenavnet 'brødtekst'. 'Main' erstatter den 'div'-boks', der ellers ville indeholde sidens brødtekst.


Main vil ofte(st) være en inline-blok med en sidebar (aside) placeret på den ene eller begge sider.




nav


The nav element represents a section of a page that links to other pages or to parts within the page: a section with navigation links.


Vil typisk indeholde sidens menu(er). Den kan være etableret som et horisontalt blok-element eller et vertikalt inline-element - eller begge.




section


The section element represents a generic section of a document or application. A section, in this context, is a thematic grouping of content, typically with a heading.


En 'sescion' er et større eller mindre sammenhængende afsnit indenfor en 'article'. En 'section' er typisk ikke så lille, at den ikke har nogen overskrift.




Manglende varianter


For at kunne lave en traditionel sidestruktur alene med varianter mangler der endnu et par stykker. I mellemtiden må 'div' klare ærterne.


Om de nogensinde kommer - og hvad deres endelige navne bliver får stå hen.




wrapper / container


Den ydre box (indeni 'body') hvori (næsten) alle sidens øvrige strukturdata placeres.




foot


Blok-element under 'footer' til placering af indlæsning af især javaScript programmer. Derved aflastes 'head'-delen og siden loades hurtigere.





















x
x