Cercar

Els beneficis dels Estàndards Web pels teus visitants, pels teus clients i per tu!

(0 vots)

Promou-me:

autor Xavier Arnaus

dimarts, 01 febrer de 2005

[Xavier Arnaus]: He trobat aquesta petita guia per a programadors/disenyadors web, que crec pot ser útil per a tenir unes guies a l'hora de crear llocs nous a internet. Encara que els que usin Editors de Contingut (Mambo, per exemple) no els necessiten ja que es fa automàtic, no està de més adquirir unes pautes genèriques.

Els beneficis dels Estàndards Web pels teus visitants, pels teus clients i per tu!

Document original: The benefits of Web Standards to your visitors, your clients and you

Traducció al Bulgar per Boby Dimitrov
Traducció a l'Alemany per Stefan Walter
Traducció a l'Espanyol per Xoan Sampaiño
Traducció al Polonès per Bhang
Traducció al Finès per Kalamuki
Traducció al Portuguès per Ken Awamura

1. Els Estàndards Web

"Els Estàndards Web estàn pensats per ser una base comú... un fonament per la world wide web de manera que els navegadors i la resta de software entenguin el mateix vocabulari bàsic". Eric Meyer

El W3C (World Wide Web Consortium) i altres organitzacions estàndard han establert tecnologies per crear i interpretar el contingut web. Els estàndards actuals són:

Llenguatges estructurals: Extensible Hypertext Markup Language (XHTML) 1.0; XHTML 1.1; Extensible Markup Language (XML) 1.0
Llenguatges de Presentació: Cascading Style Sheets (CSS) Nivell 1; CSS Nivell 2; CSS Nivell 3
Model d'Objectes: Document Object Model (DOM) Nivell 1 (Nucli); DOM Nivell 2
Llenguatges de Scripting: ECMAScript 262 (versió estàndard de JavaScript)
Llenguatges Addicionals de Presentació (Format del document): Mathematical Markup Language (MathML) 1.01; MathML 2.0; Scalable Vector Graphics (SVG) 1.0

2. Sobre què tracten els Estàndards Web?

Aquests 'Estàndards Web' estan dissenyats per:

proporcionar els beneficis més grans a la majoria dels usuaris web
assegurar la viabilitat a llarg termini de qualsevol document web
simplificar el codi i reduir el cost de la producció
proporcionar llocs accessibles a més gent i més tipus de dispositius web
continuar funcionant correctament encara que els navegadors evolucionin, i encara que nous dispositius apareguin en el mercat

Per els dissenyadors i desenvolupadors web, els Estàndards Web tracten sobre fer servir estàndards (Llenguatges Estructurals, de Presentació, d'Objectes i de Scripting) i les millors pràctiques (codi vàlid, semàntic i accessible) per beneficiar els teus usuaris, els teus clientes i a tu mateix.

3. Un canvi de mentalitat

Lloc web tradicional

Un desenvolupament d'un lloc web tradicional es una extensió del mitjà imprès - dissenyat per fer que el lloc web es vegi perfectament en els 5 o 6 navegadors més importants. Les seves característiques comuns inclouen:

Disposició del contingut basta en taules
Presentació dins del contingut (elements font)
Codi no vàlid
Codi no accessible
Codi semànticament incorrecte

Lloc web Estàndard

Els Estàndards web tracten sobre acceptar la web com una amplia eina de comunicació que pot ser accedida per una amplia varietat d'usuaris i una gran varietat de dispositius. Les característiques comuns inclouen:

4. Format del document semànticament correcte

Un format del document semànticament correcte fa servir elements html per el propòsit per el que van ser fets. Un HTML ben estructurat té significat semàntic per un gran ventall d'agents d'usuari (navegadors sense fulls d'estil, navegadors de mode text, PDAs, motors de cerca, etc.)

Has d'utilitzar elements HTML estàndard per donar format al teu document i evitar donar estil a elements HTML per què semblin altres elements HTML. En termes simples, això vol dir que:

per els encapçalaments, fer servir un element d'encapçalament començant per H1
per paràgrafs de text, fer servir un element de paràgraf
per llistes, fer servir elements de llistes

5. Què es un codi vàlid?

La validació es un procés amb el que comprovar els teus documents contra un estàndard formal, com els publicats per el W3C. Un document que ha estat comprovat i ha passat el test és considerat vàlid.

Per què fer servir codi vàlid?

Un codi vàlid s'interpretarà més ràpid que un codi amb errors
Un codi vàlid s'interpretarà millor que un codi no vàlid
Els navegadors compleixen cada cop més amb els estàndards, pel que creix la necessitat d'escriure HTML vàlid i que compleixi aquest estàndard

Com comprovar si el teu codi es vàlid

Servei de Validació de W3C
Servei de Validació del CSS de W3C
Validador HTML del WDG
Validador CSS de Stylesheets.com
Molts productes de software porten ja incorporades eines de validació

Com pots fer el teu codi vàlid?

Comença amb el doctype correcte
Atenció amb els modes del doctype (standards compliant, quirks mode, etc)
Utilitza un joc de caràcters
Tanca tots els elements HTML
Fes servir l'atribut alt per les imatges
Evita fer servir hacks HTML
Fes servir validadors HTML regularment
Corregeix qualsevol error que trobis abans de posar la web on-line
Fes que la validació sigui una part més del teu procés habitual de treball

6. Per què utilitzar codi accessible?

Permet al teu lloc web ser accedit per una audiència més gran (visió reduïda, discapacitat física, discapacitat mental)
Permet al teu lloc web ser accedit per un ampli rang de dispositius (agendes electròniques, lectors de pantalles, navegadors de text, motors de cerca)
Es un requesit per llocs web Federals i Governamentals

Com fer el codi accessible?

Proporciona text equivalent pels elements que no siguin de text
Fes servir taules de dades accessibles (identifica les capçaleres de fila i columna)
Fes servir formularis accessibles (amb elements com label, id, fieldset, legend)
Fes servir etiquetes en lloc d'imatges per transportar informació.
Proporciona menús esquivables
Proporciona tecles d'accés
Fes servir fulls d'estil amb unitats relatives per controlar la disposició i la presentació
Assegura't que els teus documents poden ser llegits correctament sense fulls d'estil
Proporciona metadata per afegir informació semàntica

7. Per què fer servir CSS per separar el contingut de la presentació?

L'objectiu pels desenvolupadors web es treure tota la presentació del codi html, deixant-lo net i semànticament correcte.

Més accessible per una amplia varietat de dispositius
Facilitat per fer canvis al lloc web - un sol arxiu css en comptes de totes les pàgines
Arxius més petits / descàrrega més ràpida - menys codi en la pàgina
Menys codi en la pàgina - més fàcil de codificar
Permet els usuaris personalitzar ell lloc segons les seves pròpies necessitats - canviador d'estils
Més control sobre el codi - es pot proporcionar el codi en l'ordre preferit pels lectors de pantalla

8. Un lloc web basat en CSS en acció

Un dels aspectes més poderosos d'un CSS es que el contingut pot ser re-dissenyat per cobrir les teves necessitats - sense canviar ni una línia del codi html.

9. Com es beneficien els teus VISITANTS dels Estàndards Web?

Els arxius es descarregaran més ràpid (menys codi, sense taules globals, codi vàlid)
El contingut es accessible per un ampli espectre d' usuaris (usuaris normals, usuaris cecs, usuaris amb deficiències visuals, usuaris dislèxics, usuaris amb deficiències en l'habilitat motriu, etc)
El contingut es accessible a un ampli espectre de dispositius (lectors de pantalla, navegadors, navegadors de text, agendes electròniques, motors de cerca, impressores, neveres, etc)
Permet als usuaris personalitzar l'aparença del lloc web (canviadors d'estil)
Proporciona versions fàcilment imprimibles per totes les pàgines

10. Com es beneficien els teus CLIENTS dels Estàndards Web?

Facilitat de manteniment (menys codi, codi modular)
Menys despeses d'allotjament web (menys codi)
Millor posicionament en els cercadors
El contingut pot ser re-dissenyat fàcilment sense canviar codi
Proporciona als usuaris personalització
Proporciona versions imprimibles sense replicar el contingut
Millora l'accessibilitat (essencial pels clients Governamentals)

11. Com et beneficies TU dels Estàndards Web?

Facilitat de codificació (codi modular)
Facilitat de manteniment (menys codi, codi modular)
Codi menys dependent del dispositiu (estable sobre una varietat més amplia de dispositius)
Proporciona una major competitivitat a mesura que la gent comença a fer servir els Estàndards Web.

12. Quines son les contrapartides

Corba d'aprenentatge accentuada
Problemes amb la compatibilitat dels navegadors
Alguns dissenys poden crear-se més fàcilment fent servir taules en comptes de CSS

13. Com s'aconsegueixen els Estàndards Web?

Els Estàndard web no son negre o blanc. Tots els desenvolupadors han de tenir l'objectiu de moure's gradualment cap a llocs web Estàndards.

El canvi de desenvolupar pàgines tradicionals a Estàndards porta temps i pràctica. Més que fer-hi un salt i frustrar-se ràpidament, fixa't unes fites assolibles i gradualment mou-te als Estàndards Web. Per exemple:

Canvis bàsics

Afegeix un doctype correcte en totes les pàgines
Afegeix text alternatiu a totes les imatges
Afegeix títols a les webs que siguin esclaridors

Canvis intermedis

Codi vàlid
Codi semànticament correcte
Re-emplaçar les etiquetes font i de color dins del codi html per CSS
Formularis accessibles, taules només per a les dades i menús esquivables

Canvis avançats

Posicionament bàsic amb CSS (sangries, marges, etc) fent servir taules globals per a la disposició del contingut
Posicionament total amb CSS - no fer servir taules per la disposició del contingut