Al vostre web disposeu dels següents tipus de títols:
És molt importat que useu els títols en ordre jeràrquic, a mesura que necessiteu introduir subapartats, per tal de mantenir uns mínims criteris d'estil entre tots els ususaris que mantenim aquest web.
Exemple de paràgraf amb pic decoratiu. És un bon costum donar aquest format al primer paràgraf introductori de la plana per aconseguir un efecte ornamental que contribueix a la millora del aspecte general del nostre web.
Això que esteu llegint és un exemple de paràgraf amb cos de text normal, que és el tipus de text usat a tot el web quan no s'hi aplica cap format. Això que esteu llegint és un exemple de paràgraf amb cos de text normal, que és el tipus de text usat a tot el web quan no s'hi aplica cap format.
Per ressaltar certs textos els estils us permeten seleccionar un paràgraf i donar el format de paràgraf de text destacat, la qual cosa en el vostre web produeix l'efecte que esteu llegint
Aquest és un exemple de paràgraf amb imatge a l'esquerra. Quan vulgueu introduir una imatge enmig del text, col·loqueu en primer lloc el ratolí al primer caracter del paràgraf. Aleshores feu clic a la icona d'inserir imatge de l'editor visual. Houdini mostra una nova pantalla de tria d'imatge. Feu clic a l'opció de veure servidor i navegueu per l'explorador per tal de trobar la imatge desitjada. En cas que hàgiu de pujar vosaltres la imatge, aneu a l'opció d'Utilitats al menú superior de Houdini i aleshores seleccioneu l'eina de gestió d'arxius.
De vegades, quan heu utilitzat una foto al paràgraf us adonareu que el text següent no queda ben aliniat. Pot ser que la imatge sigui massa llarga, o bé que la línia quedi massa a tocar de la foto. En aquests casos podeu formatejar el text inferior com a Paràgraf de continuació d'imatge esquerra. Aquest format alinia el text amb el paràgraf superior i corregeix aquest defecte que ha provocat la inclusió de la imatge.
Aquest és un exemple de paràgraf amb imatge a la dreta. Quan vulgueu introduir una imatge enmig del text, col·loqueu en primer lloc el ratolí al primer caracter del paràgraf. Aleshores feu clic a la icona d'inserir imatge de l'editor visual. Houdini mostra una nova pantalla de tria d'imatge. Feu clic a l'opció de veure servidor i navegueu per l'explorador per tal de trobar la imatge desitjada. En cas que hàgiu de pujar vosaltres la imatge, aneu a l'opció d'Utilitats al menú superior de Houdini i aleshores seleccioneu l'eina de gestió d'arxius.
De vegades, quan heu utilitzat una foto al paràgraf us adonareu que el text següent no queda ben aliniat. Pot ser que la imatge sigui massa llarga, o bé que la línia quedi massa a tocar de la foto. En aquests casos podeu formatejar el text inferior com a Paràgraf de continuació d'imatge dreta. Aquest format alinia el text amb el paràgraf superior i corregeix aquest defecte que ha provocat la inclusió de la imatge.
Finalment, per acabar un apartat, podeu escollir donar al text el format de paràgraf amb separador inferior. Aquest format introdueix automàticament una línia que fa la funció de separador visual entre elements.
L'ús de llistes enriqueix formalment i visualment el vostre web. Si no useu cap format, les llistes apareixen de la manera següent:
Si useu els formats, les llistes us poden ajudar a maquetar diversos continguts del web de forma força atractiva:
Aquests llista disposa els elements en dues columnes principals.
Cal marcar amb negreta el titular:
It solmen va esser necessi 
Li lingues differe solmen in li grammatica
On refusa continuar payar custosi traductores. It solmen va esser necessi far uniform grammatica, pronunciation e plu sommun paroles.
Li lingues differe solmen in li grammaticaLi pronunciation e li plu commun vocabules. Omnicos directe al desirabilit? de un nov lingua franca
Les llistes amb fons de color us poden servir per presentar continguts d'índex d'apartats, de vincles i de diversos altres elements:
Llista amb fons de color sense separació:
Un altra manera de donar format als vostres llistats és introduir aquest tipus de llista amb separadors:
La llista amb format de caixa us dóna l'opció de llistar elements breus, com ara vincles destacats o bé vincles d'accés ràpid en un lateral del web:
A la dreta, acompanyant aquest paràgraf podeu veure un exemple de lllista amb format de caixa, molt útil per destacar en un lateral alguns elements breus, com ara vincles d'accés ràpid o bé vincles d'interès.
A més a més podeu donar format al primer element de la llista posant-vos a sobre amb el ratolí i triant l'opció de donar fomat. A continuació seleccioneu l'opció de títol de llista amb format de caixa. L'efecte que obtindreu és el que visualitzeu a la dreta d'aquest paràgraf.
És una convenció destacar el text que va acompanyat d'un vincle. Si marqueu amb un vincle normal un text a l'editor visual, aquest apareix destacat d'aquesta manera.
A més a més, és una bona pràctica indicar que es tracta d'un vincle extern i que si hom el selecciona abandonarà el nostre web. Apareix aleshores una imatge a la vora del vincle que indica aquest fet. Això s'aconsegueix seleccionant la pestanya "Avançat" a la finestra de vincles que obre Houdini i introduint la instrucció "external" al camp "Rel".
Quan la plana és molt llarga és una bona convenció col·locar un petit indicador que permet accedir ràpidament a la part superior, on s'hi troba habitualment la navegació.
Quan manteniu el web, podeu triar de col·locar aquest codi o de no fer-ho, segons quina sigui la llargada. Si el voleu introduir, seleccioneu el botó de Houdini a l'editor visual i trieu l'opció de Pujar. Amb aquesta acció Houdini introdueix automàticament un codi com el que veieu a continuació:
© Institut Hospital del Mar
d'Investigacions MèdiquesAvís Legal i Política de Privacitat | Política de cookies | Mapa web | Accessibilitat | Adreça / Accessos | Contacte
