El disseny web sempre ha pres els principis i definicions del món del disseny gràfic i d'impressió. Això és especialment cert quan es tracta de la tipografia web i la forma en què obtenim formularis de lletres a les nostres pàgines web. Aquests paral·lels no sempre són d'1 a 1 traduccions, però segurament podeu veure on una disciplina ha influït l'altra. Això és especialment evident quan es considera la relació entre el terme de tipografia tradicional "líder" i la propietat CSS coneguda com a "alçada de línia".
L'objectiu del lideratge
Quan la gent solia utilitzar manualment lletres de metall o de fusta per crear la tipografia d'una pàgina impresa, es col·locaven peces de plom primes entre línies horitzontals de text per crear espaiat entre aquestes línies. Si volíeu un espai més gran, introduïu peces de plom més grans. Així es va encunyar el terme "líder". Si heu cercat el terme "líder" en un llibre sobre el disseny tipogràfic i els directors, llegirí alguna cosa a l'efecte de: "la distància entre les línies de base de les línies successives del tipus".
Liderant en Disseny Web
En el disseny digital, el terme principal encara s'utilitza per referir-se a l'espaiat entre línies de text. Molts programes utilitzen aquest terme exacte, tot i que, òbviament, no es fa servir el lideratge real en aquests programes. És un gran exemple de noves formes de disseny que prenen idees de les tradicionals, tot i que la implantació exacta d'aquest principi ha canviat.
Quan es tracta de disseny web, no hi ha cap propietat CSS per "liderar". En canvi, la propietat CSS que manegi aquesta visualització visual de text s'anomena alçada de línia. Si voleu que el vostre text tingui espai addicional entre línies horitzontals de text, usareu aquesta propietat. Per exemple, diuen que voleu augmentar l'alçada de la línia per a tots els paràgrafs a l'interior de la principal p { alçada de la línia: 1,5;}
Això seria ara 1,5 vegades l'alçada normal de la línia, en funció de la mida de font predeterminada de la pàgina (que normalment és de 16 px). Tal com s'ha detallat anteriorment, l'alçada de la línia és apropiada per utilitzar per espaciar les línies de text en paràgrafs o en altres blocs de text. Si hi ha molt poc espai entre línies, el text pot convertir-se en confús i difícil de llegir per als espectadors del vostre lloc. De la mateixa manera, si les línies estan separades massa a la pàgina, el flux normal de lectura s'interromprà i els lectors tindran problemes amb el vostre text per aquest motiu. Per aquest motiu, voleu trobar la quantitat adequada d'espaiat entre línies i alçades que calgui fer servir. També podeu provar el vostre disseny amb els usuaris reals per obtenir els vostres comentaris sobre la llegibilitat de la pàgina. No confongui l'alçada de la línia amb el farciment o els marges que usareu per afegir espais en blanc al disseny de la pàgina, inclosos sota l'encapçalament o els paràgrafs. Aquest espaiat no és líder, i per tant no es tracta d'una alçada de línia. Si voleu afegir espai en determinats elements de text, usaríeu marges o farcit. Tornant a l'anterior exemple de CSS que hem utilitzat, podríem afegir això: principal p { alçada de la línia: 1,5; marge inferior: 24 px;}
Això encara tindria l'alçada de 1,5 línies entre línies de text per al paràgraf de la nostra pàgina (les que hi ha a l'interior principal p { alçada de la línia: 1,5; padding-bottom: 24px;} En gairebé tots els casos, això es mostraria com el CSS anterior. Digueu que voleu afegir espais per sota dels ítems de llista que estaven dins d'una llista amb una classe de "menú de serveis", usaria marges o farcit per fer-ho, NO alçada de línia. Així que això seria adequat. .services-menu li {< fons de farciment: 30px;} Només usaríeu l'alçada de la línia aquí si voleu establir l'espaiat del text dins dels ítems de la llista, assumint que tenien execucions de text llargues que podrien executar-se a diverses línies per a cada punt de bala. Quan s'utilitza l'alçada de la línia
Quan no s'utilitzi l'alçada de la línia