/ Forside / Teknologi / Udvikling / HTML / Nyhedsindlæg
Login
Glemt dit kodeord?
Brugernavn

Kodeord


Reklame
Top 10 brugere
HTML
#NavnPoint
molokyle 11184
Klaudi 5506
bentjuul 3377
severino 2040
smorch 1950
strarup 1525
natmaden 1396
scootergr.. 1320
e.c 1150
10  miritdk 1110
HTML5 opdeling
Fra : Rune Jensen


Dato : 12-05-10 13:12

Hvordan opdeles en standardside med HTML5?

Jeg tænker på header, menu, hovedindhold, en sidebar med indhold, som
ikke er direkte relateret til hovedindholdet, og så en footer.

Så vidt jeg forstår, så er én af nyhederne i HTML5, bortset fra flere
tags, at H-tags får mere generel anvendelse end hidtil.

Jeg har lavet et forsøg her:

<body>
<header>
   <h1>Logo/navn</h1>
   <nav>
      <h1>Hovedmenu</h1>
      <ul>
         <li>Menupunkt1</li>
         <li>Menupunkt2</li>
      </ul>
   </nav>
</header>
<section>
   <h1>Hovedartikel</h1>
   <p>Indholdstekst</p>
   <aside>
      <h1>Overskrift</h1>
      <p>Ikke direkte indholdsrelateret til hovedartikel</p>
   </aside>
</section>

<section>
   <p>Footer-tekst</p>
</section>
</body>


Er det korrekt?


MVH
Rune Jensen

 
 
Jørgen Farum Jensen (12-05-2010)
Kommentar
Fra : Jørgen Farum Jensen


Dato : 12-05-10 16:50

Rune Jensen skrev:
> Hvordan opdeles en standardside med HTML5?
>
> Jeg tænker på header, menu, hovedindhold, en sidebar med indhold, som
> ikke er direkte relateret til hovedindholdet, og så en footer.
>
> Så vidt jeg forstår, så er én af nyhederne i HTML5, bortset fra flere
> tags, at H-tags får mere generel anvendelse end hidtil.
>
> Jeg har lavet et forsøg her:
>
> <body>
> <header>
> <h1>Logo/navn</h1>
> <nav>
> <h1>Hovedmenu</h1>
> <ul>
> <li>Menupunkt1</li>
> <li>Menupunkt2</li>
> </ul>
> </nav>
> </header>
> <section>
> <h1>Hovedartikel</h1>
> <p>Indholdstekst</p>
> <aside>
> <h1>Overskrift</h1>
> <p>Ikke direkte indholdsrelateret til hovedartikel</p>
> </aside>
> </section>
>
> <section>
> <p>Footer-tekst</p>
> </section>
> </body>

Bare for sjov søgte jeg lige på HTML 5 tutorials og fandt
følgende:
1. <!doctype html>
2. <html>
3. <head>
4. <title>Page title</title>
5. </head>
6. <body>
7. <header>
8. <h1>Page title</h1>
9. </header>
10. <nav>
11. <!-- Navigation -->
12. </nav>
13. <section id="intro">
14. <!-- Introduction -->
15. </section>
16. <section>
17. <!-- Main content area -->
18. </section>
19. <aside>
20. <!-- Sidebar -->
21. </aside>
22. <footer>
23. <!-- Footer -->
24. </footer>
25.
26. </body>
27. </html>

(http://tinyurl.com/2vmt26k)

Det ligner meget det du forsøger. Spørgsmålet er
jo hvordan det vises i en browser.

Nu har du ruineret min aften
--
Jørgen Farum Jensen
http://webdesign101.dk
..

Philip Nunnegaard (12-05-2010)
Kommentar
Fra : Philip Nunnegaard


Dato : 12-05-10 18:28

Den 12-05-2010 17:49, Jørgen Farum Jensen skrev:

> Det ligner meget det du forsøger. Spørgsmålet er
> jo hvordan det vises i en browser.

Jeg har ikke tid til at prøve det nu, men jeg forestiller mig at en
browser der ikke forstår HTML 5, vil læse de ukendte tags som <div>
eller <span>.

I så fald er det vel bare at style dem i CSS'en.

> Nu har du ruineret min aften

Lyder som om du kan vende tilbage med noget i morgen.

--
Philip - http://www.chartbase.dk | http://www.hitsurf.dk

Birger Sørensen (12-05-2010)
Kommentar
Fra : Birger Sørensen


Dato : 12-05-10 18:40

Philip Nunnegaard:
8X
> ... men jeg forestiller mig at en browser
> der ikke forstår HTML 5, vil læse de ukendte tags som <div> eller <span>.
8X

... fordi det gør browserne, hvis du bruger et tag de ikke kender -
staver div forkert f.eks. <dvi> - ... ?

Eksemplet vises sådan:
http://nettuts.s3.amazonaws.com/373_html5/final/index.html

Birger

--
http://varmeretter.dk - billig, sund og hurtig mad
http://bbsorensen.dk



Birger Sørensen (12-05-2010)
Kommentar
Fra : Birger Sørensen


Dato : 12-05-10 18:58

Birger Sørensen forklarede:
> Philip Nunnegaard:
> 8X
>> ... men jeg forestiller mig at en browser der ikke forstår HTML 5, vil læse
>> de ukendte tags som <div> eller <span>.
> 8X
>
> .. fordi det gør browserne, hvis du bruger et tag de ikke kender - staver div
> forkert f.eks. <dvi> - ... ?
>
> Eksemplet vises sådan:
> http://nettuts.s3.amazonaws.com/373_html5/final/index.html
>
> Birger

Prøvede lige...
IE viser tingene temmelig tilfældigt, men det ser ud somom al teksten
er der, hvis man leder efter den. Formatteringen temmelig tilfældig.
De rigtige browsere: Opera viser ikke de runde hjørner, mens FF, Google
og Safari ser ud til at få rigtigt fat i tingene.

Google vil gerne oversætte denne side, der iflg. Chrome er på engelsk!
Man undres. Er det fordi overskrifterne eller menuen bruger engelske
ord, og det så ikke betyder noget at resten er teksten ikke er engelsk?
Hvor mange ord på en side kan i så fald være engelske, uden man skal
belemres med de ting Google tror de kan? Eller er det <html lang="en">
der trigger denne uønskede indblanding i brugerens browsen?


Birger

--
http://varmeretter.dk - billig, sund og hurtig mad
http://bbsorensen.dk



Jens Peter Karlsen (12-05-2010)
Kommentar
Fra : Jens Peter Karlsen


Dato : 12-05-10 23:38

IE9 preview viser den rigtigt med undtagelse af de runde hjørner.

Regards Jens Peter Karlsen.

On Wed, 12 May 2010 19:58:23 +0200, Birger Sørensen
<sdc@bbsorensen.com> wrote:

>Prøvede lige...
>IE viser tingene temmelig tilfældigt, men det ser ud somom al teksten
>er der, hvis man leder efter den. Formatteringen temmelig tilfældig.
>De rigtige browsere: Opera viser ikke de runde hjørner, mens FF, Google
>og Safari ser ud til at få rigtigt fat i tingene.

Rune Jensen (12-05-2010)
Kommentar
Fra : Rune Jensen


Dato : 12-05-10 19:55

Den 12-05-2010 17:49, Jørgen Farum Jensen skrev:

> (http://tinyurl.com/2vmt26k)
>
> Det ligner meget det du forsøger. Spørgsmålet er
> jo hvordan det vises i en browser.

OK, der fik du/i mig. For det her forstår jeg ikke. Godt nok ser det
nogenlunde ud, hvis jeg tager en dokumentresumé af siden, men er det
ikke meningen, at hver sektion skal have en H1 som start? Det er jo
overskriften til sektionen...

Men H-tags følger måske hele siden, ikke hver sektion?

Det synes jeg ikke lige var hvad de lovede, da de indførte <section>,
for det var noget med, så behøvede man ikke selv tænke over H-hieraki.

Med mindre nogen lige kan forklare H-ordenen i HTML5, så synes jeg ikke
det umiddelbart virker nemmere end med XHTML...

> Nu har du ruineret min aften

Så håber jeg bare det er det værd...

;)


MVH
Rune Jensen

Rune Jensen (12-05-2010)
Kommentar
Fra : Rune Jensen


Dato : 12-05-10 20:08

Den 12-05-2010 20:54, Rune Jensen skrev:

> Det synes jeg ikke lige var hvad de lovede, da de indførte <section>,
> for det var noget med, så behøvede man ikke selv tænke over H-hieraki.

Problemet kan ses sådan her:

Lad os sige, jeg har en artikel på min Blog, hvor jeg ikke ved, hvor den
ender i H-tagget. I og for sig, så kan den jo ende i H6.

Når så der skal kommentarer på, og hvis det samme hieraki skal følges
fra hele siden, så vil det være tilfældigt, hvor man skal fortsætte i
H-tagsne...?

Det synes jeg ikke lyder struktureret.

Det mest naturlige må være, at hovedindhold indhegnes af en sektion, som
har et internt H-hieraki, og at kommentarerne også har et internt
H-hieraki, ligesom sidebaren har et internt H-hieraki.

Ved at hver "del" har internt hieraki, så kan man være ligeglad med,
hvor de hører til som sådan ifht. H-tagsne, så er det mere hvad deres
parent er. F.eks. vil en <section> i en <section> ligge i et lavere
hieraki end kun én <section>, men de vil stadig have en <h1> som overskrift.


Hvis ellers jeg har gjort mig forståelig... Og det var sådan jeg
opfattede, de ville gøre det med <section> og <article>, at man ikke
skulle bekymre sig om andet end lige det interne hieraki.


MVH
Rune Jensen

Jørgen Farum Jensen (14-05-2010)
Kommentar
Fra : Jørgen Farum Jensen


Dato : 14-05-10 20:00

Rune Jensen skrev:
> Hvordan opdeles en standardside med HTML5?
>
> Jeg tænker på header, menu, hovedindhold, en sidebar med indhold, som
> ikke er direkte relateret til hovedindholdet, og så en footer.
>
> Så vidt jeg forstår, så er én af nyhederne i HTML5, bortset fra flere
> tags, at H-tags får mere generel anvendelse end hidtil.
>
> Jeg har lavet et forsøg her:
>
> <body>
> <header>
> <h1>Logo/navn</h1>
> <nav>
> <h1>Hovedmenu</h1>
> <ul>
> <li>Menupunkt1</li>
> <li>Menupunkt2</li>
> </ul>
> </nav>
> </header>
> <section>
> <h1>Hovedartikel</h1>
> <p>Indholdstekst</p>
> <aside>
> <h1>Overskrift</h1>
> <p>Ikke direkte indholdsrelateret til hovedartikel</p>
> </aside>
> </section>
>
> <section>
> <p>Footer-tekst</p>
> </section>
> </body>
>
>
> Er det korrekt?

Nej.
Læs http://dev.w3.org/html5/spec/sections.html#the-section-element

--
Jørgen Farum Jensen
http://webdesign101.dk
..

Rune Jensen (15-05-2010)
Kommentar
Fra : Rune Jensen


Dato : 15-05-10 02:54

On 14 Maj, 21:00, Jørgen Farum Jensen <jfjen...@yahoo.dk> wrote:

> Nej.
> Læshttp://dev.w3.org/html5/spec/sections.html#the-section-element

Hbis ikke man kan svare, skal man måske helt lade være

Jørgen Farum Jensen (15-05-2010)
Kommentar
Fra : Jørgen Farum Jensen


Dato : 15-05-10 13:10

Rune Jensen skrev:
> On 14 Maj, 21:00, Jørgen Farum Jensen <jfjen...@yahoo.dk> wrote:
>
>> Nej.
>> Læshttp://dev.w3.org/html5/spec/sections.html#the-section-element
>
> Hbis ikke man kan svare, skal man måske helt lade være

Det må du altså undskylde, Rune. Men jeg mener
fortsat at det pågældende afsnit adresserer den
problemstilling du ridser op.


--

Med venlig hilsen
Jørgen Farum Jensen
Håndbog i webdesign: http://webdesign101.dk/wwwbog/udgave2/
Webdesign med stylesheets: http://webdesign101.dk/cssbog/
..

Rune Jensen (17-05-2010)
Kommentar
Fra : Rune Jensen


Dato : 17-05-10 19:04

Den 15-05-2010 14:09, Jørgen Farum Jensen skrev:
> Rune Jensen skrev:
>> On 14 Maj, 21:00, Jørgen Farum Jensen <jfjen...@yahoo.dk> wrote:
>>
>>> Nej.
>>> Læshttp://dev.w3.org/html5/spec/sections.html#the-section-element
>>
>> Hbis ikke man kan svare, skal man måske helt lade være
>
> Det må du altså undskylde, Rune. Men jeg mener
> fortsat at det pågældende afsnit adresserer den
> problemstilling du ridser op.

Beklager jeg var for hurtig, Jørgen.

Jeg skulle ikke have sendt den.


MVH
Rune Jensen

Jørgen Farum Jensen (17-05-2010)
Kommentar
Fra : Jørgen Farum Jensen


Dato : 17-05-10 23:10

Rune Jensen skrev:
> Den 15-05-2010 14:09, Jørgen Farum Jensen skrev:
>> Rune Jensen skrev:
>>> On 14 Maj, 21:00, Jørgen Farum Jensen <jfjen...@yahoo.dk> wrote:
>>>
>>>> Nej.
>>>> Læshttp://dev.w3.org/html5/spec/sections.html#the-section-element
>>>
>>> Hbis ikke man kan svare, skal man måske helt lade være
>>
>> Det må du altså undskylde, Rune. Men jeg mener
>> fortsat at det pågældende afsnit adresserer den
>> problemstilling du ridser op.
>
> Beklager jeg var for hurtig, Jørgen.
>
> Jeg skulle ikke have sendt den.

Ja, vi kan jo alle være lidt for hurtige på aftrækkeren
en gang imellem.

Grunden til min korte besked var at jeg fandt W3C's
information om HTML5 vigtig, men for omfangsrig til
at jeg hurtigt kunne sætte mig ind i det og det
tankesæt, der ligger bag.

Jeg har et par andre projekter i gang, så HTML5
må jeg skyde lidt foran mig. En første hurdle er
at kende de nye markørers semantik, den næste er
at indse at de ikke per se er blokmarkører.

Den del jeg trods alt ar kigget på ligger ganske
tæt op af min måde at lave statiske websider på
i XHTML. Men der må jo mere siden sindene er hidset
lidt op. Men w3c siger jo ikke noget om browser-
kapabilitte - det mi selv lille og rode med.
--

Med venlig hilsen
Jørgen Farum Jensen
Håndbog i webdesign: http://webdesign101.dk/wwwbog/udgave2/
Webdesign med stylesheets: http://webdesign101.dk/cssbog/
..

Karl Erik Christense~ (16-05-2010)
Kommentar
Fra : Karl Erik Christense~


Dato : 16-05-10 17:34

Den Wed, 12 May 2010 14:12:01 +0200 skrev Rune Jensen:

> Hvordan opdeles en standardside med HTML5?

> MVH
> Rune Jensen

Hvis du bor i nærheden af IT Universitetet (?) - eller vil rejse efter
det:

AJAX og HTML5 er meget mere end bare buzzwords. De og lignende teknikker
giver designere og udviklere nye relevante værktøjer, og brugere får nye
oplevelser og funktionaliteter.

Kan vi få alle brugere med, så ingen bliver udeladt? Ja, det kan vi!

Charles vil demonstrere hvordan og vise eksempler på brug af HTML5, så
resultatet bliver lige så tilgængeligt som din (x)html.

Charles McCathieNevile har arbejdet for W3C/WAI, før han kom til Opera.
Han er stadig aktiv i en række W3C-arbejdsgrupper – altid med et stort
engagement i tilgængelighed.

http://www.itst.dk/nyheder/nyhedsarkiv/2010/web-2-og-3-0-for-alle-2013-se-
og-hor-hvordan

--
Karl Erik.

Søg
Reklame
Statistik
Spørgsmål : 177577
Tips : 31968
Nyheder : 719565
Indlæg : 6409068
Brugere : 218888

Månedens bedste
Årets bedste
Sidste års bedste