Css hysteri

[zapotek]

Heisann!

Tenkte jeg skulle lufte et spørsmål på noe jeg ser på som css hysteri. Ta et eksempel. Du skal lage en enkel horisontal meny med tekst.

Det virker på meg som enkelte (selvoppnevnte?) webguruer omtrent gjør korsets tegn om du gjøre det på følgende måte:


<a href="index.htm">Forside</a><br>
<a href="Omoss.htm">Om Oss</a><br>
<a href="kart.htm">Kart</a><br>
<a href="lenker.htm">Lenker</a>

istedenfor å bruke denne metoden:

<ul>
<li><a href="index.htm">Forside</a></li>
<li><a href="Omoss.htm">Om Oss</a></li>
<li><a href="kart.htm">Kart</a></li>
<li><a href="lenker.htm">Lenker</a></li>
</ul>


Hvorfor???? Den første kodestubben er jo tilogmed kortere.

Gud forby, skulle du i tilegg bruke tabeller på designet, så er det omtrent frem med hvitløken og sølvkulene. Jeg skjønner at det blir mer kode med tabeller, men for guds skyld, noen fler linjer med kode tar da ikke livet av noen. Det er da uansett overdreven bruke av bilder osv som gjør at en nettside laster tregt. Jeg syns ( i motsetning til mange ) at tabeller har sine fordeler. I tilegg så funker det jo i alle nettlesere, og gir meg veldig få problemer.

Diskuter!

 

[webpiken]

Dette har vel lite med CSS å gjøre?

Er jo snarerer div vs tabeller du tenker på tror jeg?

Og der er jeg enig med deg. Tabeller kan funke helt fint mange steder. Jeg har ikke sluttet å bruke det der jeg synes det er greiest, og kommer ikke til å gjøre det heller.

 

[zapotek]

Ja, du har selvsagt rett. Det første hadde ikke direkte med css å gjøre, men mange hyler høyt om du lager en meny ved hjelp av metode 1. (Jeg bruker en liten <div> i begge menyene uansett).

 

[Keanu]

Grunnen til at jeg iallefall bruker unordered list (ul) for menyer, er at de kan konfigureres gjennom CSS når man skal designe utseendet på menyen. Hvis du vil lage mouseover-farge, "knapper" eller noe lignende, blir det fort lite pent om man ikke bruker liste.

Tabeller er lagd for å uttrykke data som skal vises frem i en tabell, ikke for design. Design som er adskilt fra selve informasjonen (design i CSS, informasjon i html) er vel hovedargumentet for å bruke divs istedet for tabeller for design. Personlig synes jeg det også er langt enklere å bruke divs enn tables, men det kan sikkert virke enklere om man bruker wysiwyg-editorer for å designe sider.
Et annet argument for divs er at søkemotorer og maskin-agenter (screenreader etc) generelt liker divs bedre enn tables, siden det er enklere å lese siden og de bryr seg ikke om design.

Tables is the new frames.

 

[vidarlo]

Stikkordet er vel gjerne at HTML er eit semantisk markup-språk. Istadenfor å sei at du vil ha feit skrift, seier du at du har et viktig poeng, gjennom ein em. Så er det opp til css (og klienten) å formatere det.

Ved å gjere ting semantisk korrekt gjer du det lettare for google (som lett kan skilje mellom overskrift og brødtekst, sidan overskrift er <h?>), ein gjer det lett for skjermlesarar som skal lese opp tekst for blinde og svaksynte, ein gjer det lett å automatisk parse HTML.

Så fordelane ved å halde ting semantisk korrekt er gigantiske, samanlikna med den minimale overheaden en har med det.

 

[Tonny Kluften]

Velkommen til webforumet zapotek. Fint at du disker opp med slike nyttige diskusjoner

 

[zapotek]

Jeg syns faktisk det er enklere å kode designet for hånd med tabeller enn med css. Er jo rålett å lage designet med css i de fleste wysiwyg-editorer idag. Ihvertfall min mening.

 

[Tonny Kluften]

Hva mener du? Det er rålett å lage designet med css, men enklere å kode designet for hånd med tabeller?

 

[zapotek]

hehe, det jeg mente var at i en wysiwyg-editor (f.eks. Dreamweaver) er det veldig lett å bruke verktøyene der til å lage hele sida med css. Du bare trekker opp hvor du skal ha de forksjellige elemtene (Insert Layout Objects -> Layer. Dette kan enhver som aldri har laga et nettsted før få til. Dreamweaver lager all koden.

Tabeller er lett og, men jeg har brukt dem så lenge så jeg skriver dem som oftest inn for hånd.

 

[Magne Thyrhaug]

Som vidarlo skriver, det er semantikken som gjelder. Hvorvidt det er spesielt relevant eller ikke er nok situasjonsavhengig, men f.eks. hva gjelder navigasjonsmenyer vil det nok sjeldent spille noen direkte rolle om man gjør det med lister, div-elementer eller å kun bruke <a..>tekst</a><br />. Det jeg ser på som den store forskjellen er at man ved bruk av div-elementer eller lister lett kan endre utseende på listen (f.eks. til å være horisontal i stedet for vertikal). Men dette er nok ikke spesielt relevant det heller. Man endrer tross alt ikke design spesielt ofte

For min del blir det viktigste å lage noe som er semantisk /riktig/ og bygger på standarder. Jeg tror nok dette gjelder for mange andre også. Man vil jo gjerne være litt stolt over det man har laget.

Forøvrig, hva gjelder semantikk. I HTML5-speccen (som vel ikke er offisiell enda) kommer det et nav-element som markerer navigasjon.

--
Magne Thyrhaug

 

[TorsteinO]

Å lage designet i wysiwyg-editor er bare å gjøre det klønete for deg selv, hvis du vet sånn halvveis hva du driver med er det milevis enklere å skrive det for hånd. En kjempefordel til med å bruke css og <ul> til menyer er jo det samme som "alt" annet med css-basert design, det er mye mye mye enklere å kontrollere, endre osv siden utseendet er helt separert fra innholdet. Endre fra en horisontal meny til en vertikal? Ok, noen få linjer i stilarket, ikke massevis av tabelltull som må endres, osv.

For all del, tabeller har fremdeles sine bruksområder, og korrekt brukt er det veldig kjekt, men det meste er rett og slett mer praktisk å bruke css til, bare man lærer seg det ordentlig.

 

[vidarlo]

Bakdelen med tabeller er jo at det er et helvete å velikeholde, og om du vil flytte menyen fra venstre sida til toppen, så må du skrive om alt. Med css er det to linjer som må endrast.

Utover det med semantikken, så er hovedargumentet mot tabeller til layout at det er et helvete å velikeholde, og enda større helvete å endre layout. Som eksempel kan en jo nevne css zen garden. Ei html-fil, forskjellige stilark. Prøv å endre layout så radikalt uten å endre html, i ei tabellsuppe...

Forøvrig så har eg sett at tabellsupper *UTEN UNNTAK* er 10 ganger større enn dei hadde vore om det hadde vore semantisk korrekt HTML...

 

[picxx]

Semantikk er flott, og her er en flott, liten innføring jeg fant når jeg søkte på 'hva betyr semantikk' http://hebedesign.com/blogg/archives/2006/07/semantisk_kode.php

Når det er sagt er det ikke alltid riktig å bruke div's vs. tabeller.
Om man er vant til tabeller, og har en mengde sider oppsatt i tabeller kan det fort også bli 'en skog' av kode om man bare skifter ut tabellene med div's uten å lære dette skikkelig. Et eksempel jeg var borti for ikke lenge siden hadde 14 nestede div's på siden(husker ikke url), noe som er et prakteksempel på hvordan en side (kode) blir seende ut om man ikke kan det, men skal høre på alle andre.