Cómo elegir la mejor tipografía para tu diseño


Cómo elegir la mejor tipografía para tu diseño
diseño
la mejor
paginas web
tipografía
como elegir
Cómo elegir la mejor tipografía para tu diseño

1- Informacion

2- ¿Pequeña o grande?

3- ¿Fina o ancha?

4- ¿Colores claros u oscuros?

5- ¿Estilo elegante o desenfadado?

6- ¿Sans serif o serif?

7- ¿Aplico text-shadow, degradados…?

8- Conclusión

9- Top 10 de las mejores tipografias



diseño

la mejor
paginas web
tipografía


1- Informacion

Existen una lista interminable de tipografías, pero sólo unas cuantas encajarán con el estilo que tenemos en el sitio web. Desde aquí os mostraré algunos puntos que os pueden resultar útiles para distinguir entre una tipografía aceptable y otra que no es buena para nuestro sitio.
En las tipografías para títulos, se podrían seguir estos criterios:


como elegir

2- ¿Pequeña o grande?

Los títulos son algo que deben verse rápidamente, sin esforzarse mucho, así que es altamente recomendable que sean lo suficientemente grandes como para que el lector no tenga que fijarse mucho en ellos para verlos. Eso sí, los extremos también son malos, yo recomiendo establecer un mínimo de 17 píxeles a la tipografía de los títulos.

Cómo elegir la mejor tipografía para tu diseño

diseño

3- ¿Fina o ancha?

Normalmente, las tipografías finas se utilizan para sitios con una combinación de tonos claros, debido a la ligereza que supone. Los sitios oscuros tienden a utilizar estilos de tipografías más anchas.

la mejor

paginas web

tipografía

4- ¿Colores claros u oscuros?

En los sitios con combinaciones de colores oscuros, se usa mayoritariamente tipografías claras, debido a que destacan más. Las tipografías oscuras se deberían utilizar en sitios con combinación de colores claros, por el mismo motivo que el anterior.

como elegir

Cómo elegir la mejor tipografía para tu diseño

diseño

5- ¿Estilo elegante o desenfadado?

Esto ya puede depender de cada persona, aunque personalmente concuerdo con que en sitios claros se utilicen tipografías más firmes, mientras que en sitios con colores oscuros se apliquen tipografías más divertidas y amigables, aunque, como digo, depende de cada persona.

la mejor

paginas web

tipografía

6- ¿Sans serif o serif?

Sans serif significa sin serifa, o terminación en las letras, como queramos llamarlo. En sitios con temáticas actuales, como diseño web, nuevas tecnologías, recomiendo usar fuentes sans-serif. En sitios con temas como viajes, museos, podría ser una buena opción utilizar fuentes serif.

como elegir

Cómo elegir la mejor tipografía para tu diseño

7- ¿Aplico text-shadow, degradados…?

Generalmente las propiedades CSS3 todavía no han sido aplicadas en todos los navegadores web. Si la temática que estamos tratando es sobre desarrollo web, diseño, el uso de propiedades CSS3 puede estar aceptado (hablando en la actualidad, ya que la mayoría de los navegadores no han conseguido todavía la compatibilidad con todas las propiedades CSS3). En otros sitios con temáticas como viajes, hoteles, restaurantes, deportes, todavía no encaja mucho aplicar este tipo de propiedades, según mis criterios.
Consejos de fuentes para los parrafos:
No utilices tipografías demasiado finas, dificultará su lectura. Tampoco muy pequeñas, como mínimo 10 píxeles de tamaño.
Intenta seguir el mismo estilo que en los encabezados, aunque varíe un poco. No cambies a otra tipografía totalmente distinta, intenta usar la misma.
La tipografía debe verse bien por sí misma, no puedes usar efectos como text-shadow u otros para que se visualice bien. Debe mostrarse correctamente sin usar estos efectos. Esto se puede aplicar a las tipografías en los títulos también.
Utiliza distintos tamaños de tipografía, dependiendo que sea un párrafo de contenido, bloque en la barra lateral o título. Debe diferenciarse. Generalmente el tamaño más grande lo tiene el título, seguido por el título en los bloques laterales y el texto en los párrafos.
Debes distinguir los enlaces de texto en los párrafos. Generalmente se aplica otro color al enlace (por ejemplo, azul, frente al negro del texto) o una decoración subrayado, especialmente).


diseño

8- Conclusión

Si sigues estos consejos darás una estructura más organizada a tu sitio, a la vez que ayudarás al lector a que se sienta bien leyendo tus artículos o lo que muestres. Todo depende de cada uno, así que si estás en desacuerdo con alguno de estos puntos, no lo sigas, quizás tengas otra idea mejor. Pero ante todo, recuerda, el contenido es el rey. Si deseas aplicar a tu página tipografías que no tengan los usuarios, utiliza la propiedad CSS3 @font-face. Ya sabes que tienes una lista de recursos muy útiles en este blog para desarrollar inspiración u obtener tipografías, texturas y fondos.

la mejor

9- Top 10 de las mejores tipografias


1- HELVETICA| Para muchos la Nº1

paginas web

tipografía

2- DIN | Muy manida pero efectiva

como elegir

Cómo elegir la mejor tipografía para tu diseño

3- AVENIR | Clara, sencilla y natural

diseño

la mejor

4- BODONI | Glamour por los 4 costados

paginas web

tipografía

5- FRANKLIN GOTHIC | Sobria, seria y sencilla

como elegir

Cómo elegir la mejor tipografía para tu diseño

6- FRUTIGER| Legible y reconocible

diseño

la mejor

7- GILL SANS

paginas web

tipografía

8- UNIT (FF UNIT) | Efectiva y moderna

como elegir

Cómo elegir la mejor tipografía para tu diseño

9- GOTHAM | Neoyorkina, facilona y la preferida de Obama

diseño

la mejor

10- BREE | Corporativa, divertida y guay

paginas web


tipografía

como elegir
Cómo elegir la mejor tipografía para tu diseño
diseño



la mejorpaginas webtipografía

Fuentes de Información - Cómo elegir la mejor tipografía para tu diseño

El contenido del post es de mi autoría, y/o, es un recopilación de distintas fuentes.

Dar puntos
1.933 Puntos
Votos: 236 - T!score: 8.5/10
  • 13 Seguidores
  • 5.038 Visitas
  • 335 Favoritos

88 comentarios - Cómo elegir la mejor tipografía para tu diseño

@sebastianarts Hace más de 1 año +2
Genial, muy útil!
@RodryInter777 Hace más de 1 año +1
gracias!
@Indio_Moulinex Hace más de 1 año +1
@RodryInter777 Hace más de 1 año
gracias!
@Tu_daddy Hace más de 1 año +2
+10
@RodryInter777 Hace más de 1 año +2
gracias!
@izac77 Hace más de 1 año +1
Muy bueno gracias +Pts y Reco!
@RodryInter777 Hace más de 1 año +2
gracias!
@francisco0327 Hace más de 1 año +1
Buen Aporte Rodry
@RodryInter777 Hace más de 1 año +1
gracias!
@DenLiz Hace más de 1 año +3
como elegir Excelente post amigo +10 Favs y Reco
@RodryInter777 Hace más de 1 año +1
muchas gracias!
@NicoMF17 Hace más de 1 año +2
Muy bueno Rodry, +10
@RodryInter777 Hace más de 1 año +1
gracias amigo!
@growanks Hace más de 1 año +2

Me viene muy bien
Recomendado y a favorito
@RodryInter777 Hace más de 1 año +2
gracias!
@DarkWolf884 Hace más de 1 año +1
Recomendado+10+Favoritos.
@RodryInter777 Hace más de 1 año +2
gracias!
@miv_97 Hace más de 1 año +1
buenisimo loco! reco!
@RodryInter777 Hace más de 1 año +2
gracias!
@Nightcold Hace más de 1 año +1
Graciassss, a fav y ptos!
@choc1 Hace más de 1 año +1
recomendado
@RodryInter777 Hace más de 1 año +1
gracias amigo!
@Krieg- Hace más de 1 año +1
Muy bueno, a la noche paso con pts!!
@RodryInter777 Hace más de 1 año +1
gracias amigo!
@_Behringer_ Hace más de 1 año +1
muy buen aporte, mañana me paso con tus +10, salu2
@RodryInter777 Hace más de 1 año
gracias amigo! no me dejes puntos
@Squall70 Hace más de 1 año +1
Genial amigo! Muchas gracias!
@RodryInter777 Hace más de 1 año +1
gracias a vos amigo!
@cofler1 Hace más de 1 año +1
muy buen post Bro!

reco y a favoritos!

luego paso con los merecidos puntines
@RodryInter777 Hace más de 1 año +1
gracias amigo!
@cofler1 Hace más de 1 año +1
volvi Bro! con los merecidos +10

saludos!
@RodryInter777 Hace más de 1 año +1
@cofler1 muchas gracias amigo!
@Capaspi Hace más de 1 año +1
buen aporte che Cómo elegir la mejor tipografía para tu diseño
@RodryInter777 Hace más de 1 año +1
gracias amigo!
@francocalafiore Hace más de 1 año +1
De mucha utilidad genio!

Van 10 y reco!
@RodryInter777 Hace más de 1 año
gracias amigo!
@danigolosina Hace más de 1 año +1
Muy util amigo! Me lo llevo pa la saca y mañana regresare con regalitos!!
@RodryInter777 Hace más de 1 año +1
gracias amigo!
@danigolosina Hace más de 1 año
Se me olvido pero regrese
@felix_vi Hace más de 1 año +1
+10 a favoritos
@RodryInter777 Hace más de 1 año
gracias amigo!
@GUMAS Hace más de 1 año +1
diseño



+ 10 Y RECO
@RodryInter777 Hace más de 1 año
gracias amigo!
@jhon_morsillon4 Hace más de 1 año
la mejor Na mentira
@RodryInter777 Hace más de 1 año
jaajjaa gracias amigo!
@lu_PR Hace más de 1 año +1


reco... a la noche te dejo +10 Besis!
@RodryInter777 Hace más de 1 año
gracias amiga!
@Distolo Hace más de 1 año +1
Muy bueno, seguramente algo me va a servir. +10
@RodryInter777 Hace más de 1 año
gracias amigo!
@Sephiroth_77 Hace más de 1 año +1
Gracias por este buen post

+10 y reco!!
@RodryInter777 Hace más de 1 año
gracias a vos amigo!
@Grafico_al_100 Hace más de 1 año +1
demasiado útil +10 y reco
@RodryInter777 Hace más de 1 año
muchas gracias!
@mpkos Hace más de 1 año +1
Buen aporte che!! te dejo Reco y +10pts a mucha gente le sera util!
@RodryInter777 Hace más de 1 año
muchas gracias amigo!
@marck0de0z Hace más de 1 año +1
Esta bueno
@RodryInter777 Hace más de 1 año
muchas gracias amigo!
@fullstone Hace más de 1 año +1
Excelente post!

Reco+10!
@RodryInter777 Hace más de 1 año +1
muchas gracias amigo!
@scars121 Hace más de 1 año +1
buscare como aplicar esto en algo paginas web
tipografía
@RodryInter777 Hace más de 1 año +1
muchas gracias amigo!
@victor93_taringa Hace más de 1 año +1
Exelente post Rodry !!

+10 y fvs
@RodryInter777 Hace más de 1 año
muchas gracias amigo!
@juliodavidkpo15 Hace más de 1 año +1
Recomendado! Exelente post amigo! +8 que me queda como elegir
@RodryInter777 Hace más de 1 año +1
muchas gracias amigo!
@YellowLimon Hace más de 1 año +1
buenisimo ! Gracias!
@RodryInter777 Hace más de 1 año +1
muchas gracias a vos amiga!
@hundra55 Hace más de 1 año +1
Mi favorita es la "Monotype Corsiva"

Cómo elegir la mejor tipografía para tu diseño
@RodryInter777 Hace más de 1 año +1
muchas gracias amiga!
@NoticiaM Hace más de 1 año +1
Excelente
@RodryInter777 Hace más de 1 año
muchas gracias amigo!
@luckyskywaker Hace más de 1 año +1
Hola!
@jhon_morsillon4 Hace más de 1 año +1
Hola! XD
@luckyskywaker Hace más de 1 año +1
@RodryInter777 Hace más de 1 año
muchas gracias amigo!
@Mishino Hace más de 1 año +1
Muy bueno loco! Lástima que me quedé sin puntos! A la noche regreso
diseño la mejor
@RodryInter777 Hace más de 1 año +1
muchas gracias amigo!
@ragironaj Hace más de 1 año +1
Buen aporte amigo!

reco +10
@RodryInter777 Hace más de 1 año
muchas gracias amigo!
@FerenczyV Hace más de 1 año +1
Reco a fav y +10!!
@RodryInter777 Hace más de 1 año
muchas gracias amigo!
@nole93092 Hace más de 1 año +1


Hermoso paginas web
@RodryInter777 Hace más de 1 año +1
muchas gracias amiga!
@djmaster777 Hace más de 1 año
Excelente aporte, +10 y recomendado.
@RodryInter777 Hace más de 1 año +1
muchas gracias amigo!
@bolita1975 Hace más de 1 año
+8 rodri!
@RodryInter777 Hace más de 1 año
muchas gracias amigo!
@WAN067 Hace más de 1 año
Excelente post!! y muy buena info!! +10 y reco!!
@RodryInter777 Hace más de 1 año +1
muchas gracias amiga!
@Ek_22 Hace más de 1 año +1
Buen post! recomendado
@RodryInter777 Hace más de 1 año
muchas gracias amiga!
@Valeryc Hace más de 1 año +1
Muy buena la información!
@RodryInter777 Hace más de 1 año +1
muchas gracias amiga!
@Benedicto66666 Hace más de 1 año +1
perros
@RodryInter777 Hace más de 1 año +1
muchas gracias amigo!
@JohnesMaster Hace más de 1 año +1
Como instalar juegos gratis en iPhone, iPad y iPod
@RodryInter777 Hace más de 1 año +1
muchas gracias amigo!
@baterius Hace más de 1 año +1
buenisimo! es lo que necesitaba, un empujoncito! puntines!
@RodryInter777 Hace más de 1 año
Muchas gracias!
@RodryInter777 Hace más de 1 año
muchas gracias amigo!
@TigerLand Hace más de 1 año +1
Muy bueno! +10 y reco
@RodryInter777 Hace más de 1 año
muchas gracias amigo!