Com escrivim a la web?

La forma d'escriure s'ha d'adaptar al mitjà que estem utilitzant. A la web no llegim de manera ordenada com quan llegim en un paper, sinó que escanegem el contingut tot cercant el més important. Cal que l'usuari trobi la informació útil de la manera més ràpida i que tingui una idea del contingut sense haver de llegir-ho tot. Tingues en compte que la web ha de ser accessible i no tothom la consulta de la mateixa manera ni en les mateixes circumstàncies. 

 

Els titulars

Per fer més entenedor el text i facilitar la lectura, divideix-lo en diferents parts i dona'ls un títol o encapçalament:

 

  • Els títols han de ser curts i clars i han de contenir les paraules clau del text que segueix.
  • Cal respectar sempre la jerarquia dels títols i subtítols aplicant els estils corresponents:
    • el primer nivell de títols o Heading 1 està reservat per al títol de la pàgina i no s'ha de fer servir en el text
    • dins del text, comença amb Heading 2 per al primer nivell de títols i, per a la resta de nivells, els estils successius (Heading 3, Heading 4)
    • no es pot començar directament amb un Heading 4 o un Heading 5 saltant-se el nivell anterior
Si coneixes HTML, sabràs que aquests estils de títols corresponen als tags <h2>...</h2>, <h3>...</h3>, etc.

 

  • Els titulars dominants atrauen l’atenció de qui llegeix i faciliten l'accés directe als lectors de pantalla.
  • Les paraules clau i els estils correctament aplicats permeten als cercadors trobar i posicionar millor la pàgina.
  • Les dues primeres paraules del títol han de ser significatives, ja que en una pantalla tendim a llegir només una tercera part del títol i hi dediquem aproximadament 1 segon.
  • No modifiquis la mida i el color del text per simular un títol.
  • No utilitzis els títols per fer enllaços.

 

Quan visitem una pàgina web, el que fem és escanejar el text per trobar ràpidament la informació que necessitem. Un text escrit per a la web hauria de ser un 50% més curt del que ho seria per a una pàgina impresa. Cal estructurar molt bé el text:

Textos

  • Els paràgrafs han de ser curts.
  • Cada paràgraf ha de desenvolupar una sola idea principal.
  • El primer paràgraf ha d'atraure l'atenció de qui llegeix.
  • Dins del paràgraf, les primeres paraules o les primeres frases són les més importants.
  • Les frases han de ser curtes i senzilles: subjecte + verb + complement. Cal evitar les oracions subordinades.

 

Alguns recursos al nostre abast:

  • Utilitzem un llenguatge que entengui l'usuari. Si fem servir paraules tècniques, han d'estar ben explicades.
  • Ens adrecem a l'usuari amb el tractament i el to adients (tu, vostè, vós, vosaltres...)
  • El llenguatge ha de ser igualitari.
  • Podem utilitzar hams visuals com a punts de referència per atraure l'atenció i facilitar la lectura:
    • títols i subtítols (encapçalaments h2, h3, h4, h5)
    • destacats en negreta o altres recursos
    • llistes
    • icones
    • botons d'enllaç

Podem reforçar el text amb diferents recursos, però correctament i amb mesura per tal que no perdin efectivitat.

  • Negreta. Per destacar una paraula o una frase curta; no per a paràgrafs sencers.
  • Cursiva. Per destacar una paraula o un fragment del text, per a títols d'obres, etc.
  • Utilitzem els estils predefinits per destacar text (Info Message, Alert Message, Error Message).
  • El text s'alinea sempre a l'esquerra, per facilitar la lectura en tots els dispositius.
  • Subratllat. No s'utiliza perquè es pot confondre amb un enllaç.
  • No s'han de modificar ni el color de la lletra, ni la mida, ni el color de fons.
  • Les MAJÚSCULES no es fan servir perquè dificulten la lectura i fan la impressió que "estem cridant".
  • No justifiquem mai el text a dreta i esquerra.

No es poden utilitzar taules per maquetar text ni per a una funció estètica. Per això hi ha tipus de continguts predefinits.

Les taules dificulten la lectura per a les persones amb visibilitat reduïda, especialment quan utilitzen navegadors accessibles, conversió Braille o un sistema d'audició. Així mateix, les taules es fan difícils de llegir en els dispositius mòbils.

Només farem servir taules per tabular dades, és a dir, per presentar sèries que s'hagin de llegir de forma lògica (dates i valors, per exemple). Cal identificar sempre les capçaleres de cada columna i de cada fila. Exemple:

Curs Aprovats Suspesos
2019-20 513 23
2020-21 612 29
2021-22 628 30

 

  • Per marcar les capçaleres utilitzem els estils propis de la taula
  • No modifiquem mai el color de fons de les cel·les

 

El text dels enllaços ha de ser clar i curt, i tenir sentit quan es llegeix fora de context. Si un usuari llegeix només el text de l'enllaç ha de saber què trobarà quan hi faci clic.

  • Els enllaços han de ser rellevants i pertinents per a l'usuari, i relacionats amb el contingut que estem presentant: "un enllaç és una promesa".
  • La paraula o frase que enllacem ha de descriure la pàgina de destí: "Formulari d'inscripció", "Services description".
  • Utilitza sempre un text significatiu per posar l'enllaç: "Fes un CAU a Biblioteca i Informàtica".
  • Si vols ampliar la informació, descriu on es troba: "Més informació a la guia de l'estudiant".
  • Tots els enllaços s'han d'obrir a la mateixa pestanya o finestra del navegador. (Si l'usuari vol obrir-los en una finestra nova, ja ho farà).
  • No ho enllacis tot! Cal evitar dispersar l'usuari amb enllaços irrellevants.
  • No facis servir fórmules com: "Fes clic aquí per inscriure't", "Descriptions of these Services can be found here: Link".
  • No utilitzis mai URL obertes: "Fes un CAU a https://cau.upf.edu/biblioteca-informatica".
  • Evita tant com puguis "Més informació".
  • Els enllaços a finestra nova dificulten l'accessibilitat i condicionen la navegació.

 

Cal revisar regularment els enllaços, per garantir l'accés a la informació.

Els documents que publiquem a la web es recomana que estiguin en format PDF. 

Han de tenir un títol i una capçalera per donar context, ja que l'usuari hi pot arribar des d'una cerca a la xarxa i es pot trobar desubicat. 

Per exemple no podem posar com a títol "Horaris del 3r trimestre" sinó que cal especificar de quin curs acadèmic, de quins estudis, i fins i tot identificar la universitat amb el logo corresponent. 

Com que acostumen a ocupar molt d'espai, per reduir-los de mida pots fer servir l'eina ilovepdf. (Tingues en compte que si el PDF està signat electrònicament, en manipular-lo desapareix la signatura, per tant, optimitza'l abans de ser signat.)

Cal procurar que tota la web tingui un to homogeni. Haurem de decidir, per exemple:

  • com ens adrecem a l'usuari (tu, vostè, vos, vosaltres)?
  • adoptem un to formal o informal?
  • si reclamem una acció de l'usuari, ho fem en imperatiu o en condicional?

Les faltes d'ortografia o de gramàtica resten credibilitat a la informació i una sintaxi incorrecta pot comportar confusions. Un text escrit correctament transmet que hem posat interès per elaborar els nostres continguts. Et recomanem utilitzar un corrector de textos:

  • LanguageTool: corrector en línia que inclou 20 llengües. És molt senzill i efectiu, i té extensions per a diversos navegadors i sistemes operatius (Firefox, Chrome, GoogleDocs, LibreOffice, OpenOffice i escriptori).

Cal tenir cura del llenguatge encara que utilitzem un to informal.

A la web de la UPF, en la majoria de casos, el més adequat és fer servir un to directe, adreçar-nos a l'usuari de tu i de forma comprensible, sense abusar del llenguatge administratiu o excessivament tècnic.

Tens a la teva disposició els recursos següents: