Ejemplos de paginas web que hacen uso de tipografía serif

0

La tipografía serif no es una que comúnmente se emplea en el campo del diseño web, a pesar de las diversas tecnologías que facilitan la visualización de cualquier tipografía sin importar las fuentes instaladas en sistema, claro nos referimos a las fuentes web de Google. Esta es una gran librería de fuentes que te permite darle ese aspecto único a tu sitio, sin necesidad de arriesgar la visualización de las fuentes.

Esta librería de más de 500 fuentes es un gran recurso para cualquier diseñador. A pesar de esto, la popularidad de las tipografías serif no es tan alta, pero sí que se emplea en ciertos sitios web. Si eres un gran fanático de las serifas, en este artículo te listamos algunos ejemplos de paginas web que hacen un gran uso de la tipografía serif.

Rokkan

Ejemplos de paginas web que hacen uso de tipografía serif: Rokkan

Este sitio emplea una tipografía serif bastante común, es decir, no presenta ninguna característica peculiar. Esta fuente en particular se ve algo elegante y más aún cuando se emplea el esquema de colores que el sitio ha elegido (blanco y negro). Asimismo, cabe destacar que esta tipografía serif sólo se emplea en los títulos y en el menú.

La elegancia del sitio se ve reforzada no sólo la tipografía y los colores empleados sino por el estilo minimalista de todo el sitio.

Tyler Copeland

Ejemplos de paginas web que hacen uso de tipografía serif: Tyler Copeland

Este sitio presenta tipografía serif sólo en el título principal, de ese modo se diferencia del resto de la página y el visitante puede saber con exactitud cuál es el contenido textual más importante. El resto de las fuentes son sans-serif y se emplea en menor puntaje que la tipografía serif del título.

Este portafolio online también presenta un diseño minimalista que ayuda a resaltar el elemento más importante del sitio: la muestra de los proyectos del diseñador.

Vesper Hotel Noordwijk

Ejemplos de paginas web que hacen uso de tipografía serif: Vesper Hotel Nooordwijk

Este sitio presenta tres tipos de fuentes sans-serif. La primera es visible en la página de inicio y es una tipografía de bastones delgados y bastante estilizada pues en ciertas partes el bastón es bastante delgado. La segunda la podemos apreciar en el título y es bastante parecida a la primera, a excepción de que presenta bastones más gruesos. Esta misma tipografía se emplea en los subtítulos de la página. Por último, en el menú también se emplea una tipografía serif aunque de menor puntaje y bastones más delgados. A pesar de que se usan tres tipografías, tienen similitudes y por ello no afectan la línea gráfica del sitio.

Este sitio también emplea un estilo minimalista y destacamos la alineación de su contenido, que en principio no parece que estuviera del todo alineado, pero se organiza de manera bastante interesante, de modo que es capta la atención del usuario.

Solo

Ejemplos de paginas web que hacen uso de tipografía serif: Solo

Este sitio emplea tipografía serif en su título principal que es visible en la página de inicio. También emplea la misma fuente y estilo en frases que indican por qué se debe usar el producto como en testimonios. Para destacar las características se emplea una fuente sans serif en menor tamaño.

Todo el sitio es de color naranja, una selección algo arriesgada. Es un color llamativo, pero al ser vibrante podría ser demasiado para el usuario. Sin embargo, hay que aceptar que en este fondo el color blanco de las tipografías y los botones resalta bastante.

Studio MPLS

Ejemplos de paginas web que hacen uso de tipografía serif: Studio MPLS

Este sitio emplea la tipografía serif en el slider de imágenes que vemos al inicio de la página, ubicado tras el menú. Ya que cada imagen corresponde a un proyecto distinto el mensaje cambia, aunque se sigue usando la misma tipografía. Este efecto sencillo hace que el sitio sea más interactivo. También podemos ver esta tipografía al ver la lista de proyectos de este estudio así como la breve reseña de la empresa en la página de inicio.

Se emplea, además, en el texto de apoyo de ciertas partes y también para destacar la información de contacto en el pie de página. En general es un sitio sencillo y pequeño, pero con un buen diseño y organización de la información, tanto en estructura como a nivel visual.

Essence

Ejemplos de paginas web que hacen uso de tipografía serif: Essence

Este sitio presenta tiene un logo tipográfico que hace uso de una fuente serif. Posee un slider en la página de inicio que se mantiene estático al menos que pinchemos en las flechas que se encuentran en los lados de la pantalla. Cada imagen tiene un mensaje distinto, pero todos ellos usan la misma tipografía serif e incluso se destacan palabras por tamaño.

La página tiene parallax scrolling y cada vez que bajamos vemos una sección de texto en tipografía negra sobre fondo blanco, seguida de una fotografía que ocupa todo el ancho de la pantalla. Cada sección tiene un título y un breve texto, en donde se emplean itálicas para resaltar ciertas palabras.

Rook

Ejemplos de paginas web que hacen uso de tipografía serif: Rook

Este sitio emplea tipografía serif en su barra de menú (que es mas ancha de lo usual). También lo utiliza para los títulos del slider que vemos a continuación, justo debajo del menú. Pero no sólo lo utiliza en los títulos sino también los subtítulos y hasta en los mensajes para los botones de llamada a la acción.

El sitio es pequeño, emplea grandes imágenes, incluso para la vista en miniatura de los proyectos más recientes. Posee parallax scrolling, aunque sólo se hace notorio en ciertas secciones de la página de inicio, también hace uso de animaciones sencillas.

PRPL

Ejemplos de paginas web que hacen uso de tipografía serif: PRPL

Este sitio emplea tipografía serif en los elementos de menú, así como en el título de la página. En el título en particular se ha colocado la frase en la parte superior derecha y se la ha dado formato de itálicas a una palabra para destacarla. En la parte inferior vemos también una frase en tipografía serif.

Al desplazarnos hacia abajo vemos que se emplea prácticamente en todos los textos que vemos en la página y a cada uno se le da un formato distinto. Unos posee negritas, otros itálicas e incluso poseen gradientes como relleno en vez de colores planos.

Este sitio tiene parallax scrolling y presenta un corto video sin sonido en la página de inicio. También presenta video en otra sección donde recomienda un estudio de caso, sin duda alguna una interesante manera de captar la atención de su audiencia.

Webstock

ejemplos-de-paginas-web-uso-tipografia-serif-webstock

Todo este sitio tiene un aspecto de un periódico por eso emplea tipografías serif en todo su contenidos, desde el logo de la página hasta el cuerpo de texto. Como es de esperarse, para ofrecer una mayor variedad y que la página no se vea monótona se juega con el puntaje, el color y el formato de la tipografía.

El sitio web es organizado, pero debido a los diferentes pesos de la tipografía, así como el filtro de color que se le aplica a las imágenes, tenemos como resultado un sitio que tiene bastante personalidad y un estilo único.

Aria Studio

Ejemplos de paginas web que hacen uso de tipografía serif: Aria Studio

Este sitio presenta gran tipografía serif en su menú, el cual es el primero que vemos en la pantalla de inicio. Como fondo se emplean videos sin sonido, lo interesante es que el paisaje de fondo interactúa con el menú y oculta parte de las letras. Éstas son totalmente visibles una vez que posamos el cursor sobre una de ellas.

Es un sitio bastante pequeño y podemos navegar en cada sección mediante los círculos que se ubican en la parte lateral derecha, un modo interesante y único de navegar sin necesidad de una barra.

Kin HR

Ejemplos de paginas web que hacen uso de tipografía serif: Kin HR

Este sitio emplea tipografía serif sólo en el mensaje principal de la página. La tipografía, como es de esperarse, es de bastones gruesos y se encuentra alineada a la izquierda. Es una tipografía que no se ve demasiado seria y tiene un toque de personalidad (no es neutra).

El sitio en general es bastante llamativo por los colores que emplea y las animaciones que posee cada sección en donde se destacan los beneficios del servicio.

Future Father

Ejemplos de paginas web que hacen uso de tipografía serif: Future Father

Este sitio emplea tipografía serif en su logo también, aunque tiene ciertos detalles más decorativos. Todo el texto del sitio se encuentra en tipografía serif, desde los títulos hasta el cuerpo de texto. Se usa la misma tipografía sólo que en diferente puntaje para indicar la jerarquía. Sólo se usa otra tipografía en los mensajes de los botones de llamada a la acción.

El sitio emplea una buena combinación de colores entre el fondo y la tipografía que es un tono de amarillo pastel. El fondo también contrasta con los botones de color coral.

Generation Press

Ejemplos de paginas web que hacen uso de tipografía serif: Generation Press

Este sitio emplea una tipografía serif bastante peculiar donde el trazo luce recortado en ciertas partes de las letras. Emplea un slider en la página de inicio y el mensaje del sitio cambia cada dos imágenes. También vemos esta misma tipografía en gran tamaño en la sección donde se listan los servicios, así que básicamente se usa cuando se quiere captar la atención (y lo logra).

Lo más resaltante de este sitio es que usa un menú lateral en todo sentido, es decir, los elementos del menú también se encuentra en sentido lateral. Sin embargo, debido a que son pocas palabras se puede leer sin problemas.

Comparte este post.
Artículos Recomendados Para Tí:

Escribe tu comentario