diumenge, 26 de juliol del 2009

Pautes per millorar la llegibilitat d’un lloc web

Us presento unes petites pautes per millorar la llegibilitat d'un lloc web. No es tracta només de fer bons continguts, també cal que estiguin ben presentats.

Tipografia
Millor si fem anar un tipus de lletra “sans serif” com arial, verdana tahoma
No combinar més de dos tipus de lletra en un mateix web, una solució força elegant és fer anar un tipus de lletra pels títols i una altra pels textos.
Fer anar una mida de lletra raonable, ni massa gran ni massa petita. És aconsellable que la lletra estigui en mides relatives (percentatge, ems) per a poder canviar-la amb el navegador a gust de l’usuari.
Evitar l’ús de fonts no de sistema, o donar altres alternatives.

Estil visual
Assegurar-nos de que existeix suficient contrast entre el color de fons i el color de la lletra
Utilitzar les negretes i els subratllats per destacar paraules clau en els continguts.
Utilitzar la cursiva per destacar paraules en altres idiomes o per donar èmfasi; evitar-la quan només és purament un tema estètic.
Dividir els continguts en paràgrafs més petits i usar títols i subtítols per introduir conceptes i paràgrafs.
Les llistes són una bona opció a l’hora de maquetar continguts i conceptes, però no cal abusar, tampoc.
És preferible que els textos no estiguin justificats a la dreta, així ajudarem al salt de la vista cap a la línia següent.
Si optem per maquetar els textos en columnes, cal que donem espai suficient entre elles.

Llenguatge i redacció
Atenció amb la ortografia i la gramàtica
Usar un llenguatge planer i directe.
Evitar, en el possible, l’ús d’un llenguatge massa especialitzat
Evitar l’ús d’expressions malsonants o grolleres.
Brevetat i concisió en els conceptes.

Articles relacionats:
Eines per millorar la llegibilitat d'un lloc web Vol. 1
Eines per millorar la llegibilitat d'un lloc web Vol. 2
Read more ...

dilluns, 20 de juliol del 2009

Eines per a mesurar la llegibilitat d’un lloc web: Vol. 2

Eines per a mesurar la llegibilitat d’un lloc web. Segona part

Readability Test és una eina online amb la que podem avaluar la llegibilitat d’un lloc web. L’aplicació usa tres algoritmes matemàtics per mostrar-nos els resultats. Aquests algoritmes calculen:
  • La mitjana de paraules que es fan servir per frase
  • El percentatge de paraules difícils de la mostra (paraules amb 3 o més síl·labes)
  • La mitjana de síl·labes per paraula
Cadascuna d’aquestes dades es tractada de forma matemàtica pels tres algoritmes que empra l’eina. Els resultats dels càlculs ens indicarà l’índex de llegibilitat del lloc web.

Taula de resultats
Reading Level Results
Summary Value
Total sentences 88
Total words 391
Average words per Sentence 4.44
Words with 1 Syllable 190
Words with 2 Syllables 76
Words with 3 Syllables 58
Words with 4 or more Syllables 67
Percentage of word with three or more syllables 31.97%
Average Syllables per Word 2.01
Gunning Fog Index 14.56
Flesch Reading Ease 32.69
Flesch-Kincaid Grade 9.80


Articles relacionats
Eines per mesurar la llegibilitat d'un lloc web
Read more ...

dissabte, 18 de juliol del 2009

HTML 5

El futur de la web
Al cinquena revisió del llenguatge bàsic de la web ens presenta una serie de nous elements i atributs que reflexen com és avui en dia el web.
HTML 5 ens apropa molt més a la web semàntica, en la idea marcar/designar les seccions mitjantçant els nous tags descriptius.



Una molt interessant sèrie d'articles sobre les novetats de l'HTML 5 en castellà
Novetats de l'HTML 5 1era. part
Novetats de l'HTML 5 2ona. part
Novetats de l'HTML 5 3era. part
Novetats de l'HTML 5 4rta. part

Altres:
Validador d'HTML 5
HTML 5 Cheat Sheet en pdf
Especificacions W3C sobre HTML 5
Galeria HTML 5
Read more ...

dijous, 16 de juliol del 2009

Anàlisi Web

Anàlisi patrocinat via Zync.
Anàlisi del web http://www.obesitymedicalcenter.com

Elements gràfics i visuals i continguts
Marca, logotip, anagrama, lema. El logotip està col·locat en la zona superior dreta i és un enllaç a la pàgina d’inici.
Es pot comprovar que s’ha donat un especial importància a l’estil tant visual com de continguts donant un enfocament clarament sobri i professional. Al tractar-se d’un web d’una clínica especialista en problemes d’obesitat i tractaments de l’obesitat, tant les imatges com els textos estan enfocats de manera informativa i amb un to de confiança i serietat en les tasques i el desenvolupament professional.
En quan a disseny visual el web és auster en colors, usant només els colors corporatius de la marca i logotip. S’utilitzen fonts de sistema en els continguts en un mida adequada que en facilita la lectura.

Estructura

Es presenta una estructura molt clara i neta tant en la portada com en les pàgines interiors. En la majoria d eles pàgines hi ha molt poc scroll vertical, que beneficia la presentació de la informació.

Continguts: presentació i maquetació
La pàgina portada ens presenta d’una manera molt visual les línies d’actuació de l’organització amb un llenguatge planer i entenedor.
Un dels punts forts de la portada són les animacions flash que reforcen el missatge que vol donar l’empresa.
La pàgina portada també ens ofereix accessos directes a continguts que estan en un segon o tercer nivell de navegació, i no per això són menys importants.
Es destaca les animacions flash que fan de reforç i explicació del continguts especialment en les seccions de tractaments i també en la secció de càlcul de l’Índex de Massa Corporal.

Usabilitat i accessibilitat:
Lamentablement el web no passa cap validador d’accessibilitat ni de codi CSS i HTML
Tampoc les pàgines internes de contingut estàtic.


Visualització amb diferents navegadors
La visualització ha estat satisfactòria amb els següents navegadors:
  • Internet Explorer 7 i 8
  • Firefox 3.5
  • Google Chrome
  • Safari
En un entorn Windows XP SP3

Velocitat de descàrrega
Amb una eina de validació automàtica de descàrrega, podem comprovar que el web triga 2,1 segons en descarregar-se.


Cercador: El cercador cerca qualsevol paraula i ens mostra els resultats en forma de llistat de manera similar a com ho fa Google, oferint-nos els resultats que més s’aproximen en les primeres posicions i a més l’enllaç del web on es troba el continguts que s’ha cercat.

El web mostra d'una forma professional i clara els objectius i produtes de la empresa, la navegació en resulta senzilla i les animacions flash donen una imatge moderna i professional.
Es recomana: adequar els codi als estàndards web en matèria de CSS i HTML, oferir una versió accessible del web sense animacions flash.

Read more ...

dijous, 9 de juliol del 2009

Eines per a mesurar la llegibilitat d’un lloc web

Per llegibilitat entenem 'facilitat de lectura' (readability en anglès). És un terme que s’usa per investigar sobre l’habilitat de lectura i escriptura. Fa referència a la facilitat amb que un text és comprès pels lectors.
Una de les recomanacions de la usabilitat és l’ús correcte i pla del llenguatge; cal pensar que els textos a Internet arriben potencialment a milions de persones, també que els continguts escrits en web no s’acostumen a llegir, simplement s’escanegen en la cerca de conceptes o paraules clau que facin referència a allò que l’usuari cerca.

TxReadability és una eina online que ens permet avaluar la llegibilitat d’un lloc web. Aquesta avaluació la fa en base a uns estàndards internacionals de classificació d’educació, que trobem en la taula següent: Taula Huerta Reading Ease

Facilitat de lectura i les WCAG 2.0
La qualificació del nivell de grau obtinguda també ajuda a determinar si el contingut analitzat satisfà el criteri d’èxit relacionat amb la facilitat de lectura en les Normes d’Accessibilitat de Contingut Web (Web Content Accessibility Guidelines 2.0 - WCAG 2.0).
Nivell de lectura en les WCAG 2.0
Read more ...

dimecres, 8 de juliol del 2009

Notícies

El sistema Operatiu de Google
Un sistema operatiu lleuger i de codi obert. A finals d'aquest any s'alliberarà el seu codi font.
El sistema operatiu Google Chrome està centrat en mini-portàtils o netbooks. Es preveu que apareguin els primers netbooks amb el SO de Google durant la segona meitat del 2010.

Gmail ja no és beta
Per què gmail sempre ha estat Beta? curiositats del que es pot considerar com el millor gestor de correu web.

Firefox 3.5
Algunes novetats i característiques interessants:
  • Mode de navegació privada
  • Execució més ràpida de Javascript
  • Vídeo i audio sense plugins: Gràcies a les noves etiquetes d’HTML 5 "video i audio"
  • Geolocalització
  • Web workers i JSON nadiu
  • "font-face": Per fi podem usar en els nostres dissenys fonts que no tenen per què estar instal·lades en el nostre sistema.
Read more ...

Recursos Vol. 24: Inspiració!!

Read more ...