Den stora tipstråden: Så använder du (X)HTML och CSS på bästa sätt

[K@llen]

Hej hopp,

Sådana här trådar brukar vara givande. Precis som rubriken antyder är tråden till för tips och trix som handlar om (X)HTML och CSS.

Om jag ska börja måste jag slå ett slag för validatorn på W3C.org:

HTML:
http://validator.w3.org/

CSS:
http://jigsaw.w3.org/css-validator/

På så vis hittar du missar som är svåra att hitta på annat sätt.

Välkommen med dina tips!

[OlleBoop]

1. Skriv semantiskt korrekt kod, kolla gärna på Dan Cederholms http://www.simplebits.com/bits/simplequiz/ för mer info.
När du validerar på K@llens länk här ovan, välj "Extended interface" och kryssa i "Show outline" så ser du sidan "semantiskt".

2. Skriv inte en massa div:ar i onödan
[kod]<h1 class="superrubrik">Arne summerar</h1>[/kod]
funkar lika bra som
[kod]<div class="superrubrik">
<h1>Arne summerar</h1>
</div>[/kod]

3. Listor går att använda till mycket mer än man tror!

[Web-Tor]

Följ WAI:

http://www.w3.org/WAI/

Svenska översättning av WAI:

http://www.w3c.se/resources/office/translations/

[Tinwëlint]

Ett bra tips för att kolla hur semantisk koden man skriver är (förutsatt att man använder css till all stil) är att slå av css-koden och titta på hur sidan ser ut då. Om den ser vettig ut då (t ex menyer är uppradade logiskt) så har man skrivit ganska semantiskt korrekt kod. Eftersom de flesta webbläsare när de inte får någon css-kod visar html-elementen efter deras riktiga betydelse. Detta är dock inget tvärsäkert sätt att säga om koden är semantiskt skriven.

[OlleBoop]

Mycket bra artikel i ämnet av Roger Johansson, http://www.456bereastreet.com/archiv...webbuteckling/

[jarvklo]

Passa på och läs http://www.456bereastreet.com/lab/de..._standards/sv/ också om ni ändå tittar förbi http://456bereastreet.com

[supreme]

Eftersom denna tråden kom in på WAI så tänkte jag att jag skulle tipsa om Section 508 som är ett amerikanskt initiativ inom samma område som WAI. Det som är trevligt är att det finns en validator för Section 508 som heter Cynthia says. Dock tycker jag att den inte verkar fungera helt korekt men har inte kollat på den speciellt, när jag körde vår sida så sa den N/A på i stort sett alla punkter men sidan blev iaf valid!

[martin]

Eftersom jag är stor vän av tillgänglighet kan jag ju faktiskt påstå (och starkt mena) att det är enklare att göra en sida tillgänglig för en blind än för en IE-användare.

Här är några bra länkar när man jobbar med "standards"-kod:

Lite basic och bra material samlat här
10 CSS-trick som kan vara bra att ha
Hur jobbar man bort IE-buggar?

[Sasch]

www.w3schools.org

Visserligen är sajten på engelska, men är man ute efter bra css inforamtion så varför inte. Utmärkt sida

[K@llen]

Skickar upp...

[LeonL]

Be någon moderator göra den här tråden "viktig".

[martin]

En massiv länksamling till css- tillgänglighets- och webstandards-sidor hittade jag: Holy CSS Zeldman

/ m a r t i n

[OlleBoop]

Dagens länktips från OlleBoop:
CSS Negotiation and a Sanity
Såg att jarvklo länkat till den från xhtml.nu också, två wF-medlemmar kan omöjligt ha fel!

[Prodhe]

För inspiration och insikt om vad man kan göra med stilmallar:

http://www.csszengarden.com/ - The Beauty In CSS Design

[kaxigt]

http://www.websitetips.com/xhtml/index.shtml

http://cssvault.com/

http://www.webreference.com/authoring/style/sheets/