Google


Idees per a la composició (layout)
Un arxiu gràfic: un recurs imprescindible.
Solucionar problemes amb ell text.
Utilitzar plantilles i estils
Reticles i guies.

Normes bàsiques per al text dels documents.
El fascinant però difícil món del color.

 

Figura 1: Una sola columna amb molt d'espai blanc.

Figura 2: Dissenys amb columnes simètriques.

Figura 3. Disseny amb columnes asimètriques. La columna esquerra conté elements gràfics, resums, elements de navegació o indexació.

Un exemple d'aplicació del sistema de columnes asimètriques (reconeixeu la pàgina?)

 

La composició del text ha de tenir en compte criteris estètics (visuals) i funcionals. Des d'un punt de vista funcional, el text ha de ser el més legible possible, per facilitar la comprensió.

Un text ben estructurat i amb una tipografia correcta ajuda molt a la comprensió. Cal separar clarament les seccions i subseccions; afegir elements que orientin al lector; donar èmfasi on calgui, utilitzant cursives o negretes. Es poden incloure resums que destaquin les parts més significatives; peus de foto o comentaris de les il.lustracions que aclareixin el seu significat.

Els estudis sobre legibilitat mostren que aquesta depèn de dos factors principals: el tipus de lletra i la composició del text, essencialment la longitud de les línies i el seu espaiat. Òbviament, convé que tinguem en compte aquests principis per facilitar al màxim la lectura dels nostres textos. Existeixen uns valors òptims per a la longitud del text: amb independència del tamany del text, el que facilita la lectura és el poder llegir trams de les frases d'un sol cop. Si les línies són massa curtes, la vista ha de buscar contínuament el principi de la següent línia i resulta cansat; però si la línia és massa llarga, també resulta fatigós.

La longitud òptima del text està en torn dels 60-70 caràcters, unes 12 paraules d'aquest mateix paràgraf. Per a un full típic A4 amb els marges habituals d'uns 2 o 2,5 cm i amb una única columna de text al tamany estàndard de 10 a 12 punts, l'amplària de les línies resulta ser massa gran. Si el paper és d'un format major, com a un diari, l'exageració de les longituts seria encara més palesa.

Per millorar la legibilitat del text podem fer una cosa simple: eixamplar els marges (figura 1), de manera que la columna s'estreny proporcionalment, fins tenir una amplària més comfortable per a la lectura. A més, aconseguim un aspecte més net, més clar - i en certa manera, més luxós, amb l'abundant espai blanc que obtenim.

Com a alternativa, podem distribuir el text en dues o més columnes simètriques, com es mostra a la figura 2.(per decidir el nombre de columnes, podem seguir el criteri mateix de nombre de caràcters per línia.) Cal tenir esment del tamany dels tipus: com més estretes siguin les columnes, més petits han de ser els caràcters. Si tenim caràcters grossos dins d'una columna molt estreta, tindrem problemes tant d'aspecte com de legibilitat.

Disseny amb columnes asimètriques

Aquest és un model de pàgina que funciona. I quan una cosa funciona, es sol emprar per tot arreu. Moltíssimes pàgines web, inclosa aquesta mateixa i bona part de les de Vigital, es basen en una estructura com la del gràfic adjunt (figura 3).

Per què aquest model, que és força simple, s'ha imposat tan clarament a les moltíssimes opcions existents? Els motius són múltiples:

Aquesta manera de distribuir els components de la pàgina resulta òptima respecte de diferents criteris.

Legibilitat. Tenir la major part del text col.locat dins d'un requadre, amb una amplària d'unes 10 o 12 paraules, és molt més fàcil de llegir que una sola columna de text de banda a banda, o que múltiples columnetes massa estretes.

Claredat. Amb aquest model, el visitant identifica clarament on està i quines són les seccions a les que pot accedir (amb l'encapçalament o el gràfic de la part superior); on està el cos del text on es detalla la informació (el bloc de la dreta). La petita columna de l'esquerra serveix, en funció del web, per allotjar diferents informacions: les seccions relacionades, novetats, resum de parts del text i il.lustracions, etc.

Familiaritat. Essent un model amplament utilitzat, els lectors saben instantàniament on cercar la informació i pistes sobre els continguts.

Simplicitat. Resulta fàcil elaborar una plantilla basada en aquest disseny i fer-la servir.

Tot i que aquest model resulta ideal per a les pàgines que han de presentar informació, amb un volum de text més o menys gran, existeixen altres alternatives que s'han de considerar a l'hora de dissenyar el Web. De les opcions existents, d'allò que poguem planejar sobre el paper, no tot serà possible traslladar-lo a la nostra pàgina web. Algunes idees són idònies per plasmar-les en paper, mentre que altres van millor en format d'hipertext. Per exemple, per una pàgina índex pot ser més recomanable un enfocament més visual, basat en petites imatges i curts blocs de text per ampliar la informació.

Recordem que a diferents recursos de consulta disponibles al Web i que adjuntam a les seccions d'enllaços, trobem clarament explicats tot allò relacionat amb l'organització de la informació i el disseny de pàgines. La pàgina del Manual of Style de la Yale University discuteix amb detall i claredat tots els aspectes que s'han de tenir en compte a l'hora de dissenyar i construir un web.


       [ Vigital ] [ Contactar ] [ Manual de diseño en castellano ] galeria PDF Il.lustració digital Maneig de les imatges programes Què fer i com
pàgina inicial