Principios de diseño para el diseño de sitios web de periódicos

3

Hoy vamos a hablar de estilos en el diseño de sitios web, y el acento que hacemos es el estilo periódico. En esta publicación, descubrirá las características más distintivas de este diseño y obtendrá algunos consejos útiles a seguir para obtener mejores resultados con su proyecto.

El estilo es una combinación total de cómo diseñas tu sitio web. El estilo también es una forma de comunicación entre usted y su audiencia. Cada estilo de diseño web tiene su conjunto específico de componentes.

Los principales estilos en el diseño web son:

  • limpio;
  • sucio;
  • antiguo/retro;
  • ilustración;
  • periódico revista.

El estilo de periódico se utilizó principalmente para periódicos y revistas en línea, ya que sus versiones impresas tienen esta estructura. Hoy en día, este diseño es apropiado para cualquier sitio web, especialmente si debe tener mucho contenido. El sitio web hecho en un estilo de periódico es fácil de reconocer entre muchos otros por un diseño rico en contenido, estructura de varias columnas, colores simples y contrastantes.

Diseño del sitio web del periódico: características

1 negro sobre blanco

El periódico impreso tradicional es blanco o gris y el texto es negro. Esta combinación de colores es perfecta para nuestros ojos. El contraste de colores facilita la legibilidad y es por eso que este esquema de color es el más adecuado para sitios web estilo periódico, que suelen estar repletos de mucho contenido. Puedes apartarte de esta combinación de colores clásica, pero siempre debes tener en cuenta que el contraste es imprescindible. Puede dar la vuelta a la elección de color normal haciendo que el fondo sea negro y la tipografía blanca. Pero nunca use amarillo sobre negro, verde sobre azul, rosa sobre azul, etc. Trate de leer el sitio web usted mismo, si sus ojos se sienten bien después, puede adoptar los colores elegidos en su proyecto web.

La luz neutra y la oscuridad son colores básicos, pero se pueden usar más colores de acento. Por ejemplo, el azul es bueno para los títulos, el rojo sería perfecto para los botones. Las pestañas del menú de navegación se pueden decorar con un tono más claro o más oscuro del color primario, o con el mismo color que los detalles de acento. Por lo tanto, el menú se destacará en el lienzo y brindará una experiencia visual perfecta a los usuarios.

2 gráficos mínimos

El sitio web con diseño de periódico es limpio, informativo, estructural y tiene elementos gráficos diseñados con precisión y de forma minimalista. Los elementos gráficos son:

  • líneas
  • formas
  • colores
  • tipografía
  • texturas

Como ya mencionamos, la paleta de colores siempre es simple en dichos sitios web. Las texturas rara vez se utilizan en los diseños web de periódicos, porque una pared de texto con imágenes en una textura de madera o grunge distraerá a sus visitantes y empeorará la legibilidad del contenido. Sin embargo, la textura del papel va directo al grano aquí. Puede ser una textura de fondo, una textura de botones o usarse solo para áreas de encabezado o pie de página.

El diseño regular basado en cuadrículas o el diseño de varias columnas reduce el uso de formas y líneas, porque de todos modos hay suficientes. Habría demasiada geometría si diseñas tu sitio web de forma correcta con un conjunto adicional de figuras.

3 Diseño basado en cuadrícula o diseño de varias columnas

El diseño del sitio web del periódico es el que tiene una estructura perfectamente organizada. Estos son sitios web ricos en contenido que generalmente tienen este tipo de diseño, por lo que la estructura viene a ser la primera. Las cuadrículas o las columnas son los tipos de disposición de contenido más útiles. Es cierto que “los sistemas de cuadrícula bien diseñados pueden hacer que sus diseños no solo sean más hermosos y legibles, sino también más utilizables" (Mark Boulton). El diseño basado en cuadrícula le permite dividir el contenido en bloques integrales; por lo tanto, involucre a los usuarios para que lean su sitio web, no lo hojeen.

Similar pero no igual es el diseño de varias columnas. Deben ser unas pocas columnas de la altura correcta, pero no necesariamente del mismo ancho. Cuanto más anchas sean las columnas, más legible será el texto. Dos columnas pueden hacer una gran apariencia, aunque tres o más son definitivamente mejores. Las columnas, a modo de cuadrícula, ayudan a diferenciar el contenido, facilitan a los usuarios encontrar una sección de interés. Si bien, al optar por este estilo de diseño, no debe olvidarse del espacio entre columnas. El sitio web será extremadamente difícil de leer si las columnas están demasiado apretadas entre sí.

4 Titulares y Extractos

¿Quieres abrir cada post y leerlo cuando entras en una web o blog con muchos textos? Los titulares nos ayudan a diferenciar el artículo interesante del secundario. Por lo tanto, cada bloque de contenido debe tener derecho. Ya sea una pequeña sección en una cuadrícula o una columna de altura completa, debe tener un título. El título debe ser de una fuente más grande, escrito en negrita o resaltado con un color diferente. Este punto es claro, sugiero.

Los extractos son breves descripciones de los artículos de texto. Estos siempre se hacen para aumentar el interés de los lectores y darles una comprensión de un texto largo en unas pocas oraciones. Este elemento es útil si tiene un blog, una publicación periódica en línea, un sitio web de noticias, etc.

5 Contenido primario y secundario

Dibuja un límite entre las partes de tu contenido. Define qué es lo más importante y qué textos pueden esperar a ser leídos. Por ejemplo, puede diseñar su página principal con una gran sección de encabezado para publicaciones nuevas (una o dos). Esta es un área destacada con imágenes y gráficos grandes. El otro contenido será más pequeño y se basará en fracciones de cuadrícula. Esto hace un fuerte enfoque en la última llegada y ayuda a obtener más acciones sociales.

6 Navegación intuitiva y consistente

El diseño del sitio web del periódico está diseñado para el contenido y este contenido debe ser fácil de navegar. En consecuencia, el menú de navegación se caracteriza por su sencillez y correcta ubicación.

La mejor posición es un área de la parte superior de la página, porque esta zona es la primera que se menciona y siempre está en el mismo lugar; simplemente desplácese hacia arriba si está en la parte inferior. En caso de que le guste la navegación vertical y no pueda dejar de amarla, haga que su menú esté orientado verticalmente pero hágalo a la izquierda. Leemos de izquierda a derecha y no al revés, por lo que los elementos de la izquierda se ven antes que los de la derecha.

Los sitios web de estilo periódico comparten toneladas de textos y deben ser accesibles para los usuarios.

7 Categorización

El mejor uso de las categorías está disponible en el diseño del sitio web del periódico. Se refiere a los blogs en particular, y también a cualquier otro sitio web. La mayoría de los sitios fallan porque tienen contenido puramente organizado. Las categorías son necesarias si publica con frecuencia y sobre diversos temas (por ejemplo, sitios web de noticias).

Divide tu contenido en categorías y muéstralo en una barra lateral o en la barra del menú de navegación.

8 Espacio para Publicidad

¿Cómo vas a ganar dinero antes de que tu sitio web se vuelva popular? La publicidad es cómo muchos propietarios de sitios web obtienen grandes ganancias. Los banners publicitarios deben colocarse no solo en algún lugar, sino que esta posición debe definirse exactamente. Los lugares correctos son la barra lateral, tanto a la izquierda como a la derecha, encabezado o pie de página. Los banners de promoción a menudo se ven justo en el medio de los artículos de texto, pero este punto es controvertido: es bueno para ti como persona que toma dinero por esto, pero estos elementos también pueden irritar a tus lectores.

9 Barra lateral funcional

La barra lateral puede presentar no solo anuncios, sino también categorías de contenido, contenido reciente, cuadro de búsqueda, barra de boletines por correo electrónico, navegación, botones para compartir en redes sociales, descuentos/ofertas especiales, etc. El diseño del sitio web del periódico es excelente para implementar la barra lateral, porque sería solo otro columna en la fila.

Hay un par de ingredientes para un diseño de barra lateral exitoso:

  • tamaño (altura y peso);
  • colores;
  • fuentes;
  • colocación.

Una barra lateral debe ser más pequeña o igual que la columna normal en su diseño, de ninguna manera más grande. Debe mantenerse en colores neutros, pero con tipografía visible. La colocación puede ser tanto a la izquierda como a la derecha, pero como ya dijimos, todo lo que está a la izquierda se ve de inmediato.

10 Maximización de espacios en blanco

En la medida en que estamos creando un sitio web multifuncional con un diseño impresionante, no podemos dejar de recordar los espacios en blanco. Este es un componente esencial incluso para un diseño estilo periódico. Que sea espacio entre columnas, secciones vacías de los lados o en la parte inferior. Los usuarios deberían tener la oportunidad de desviar la vista del muro de texto y reflexionar.

En general, el espacio en blanco se considera una sección en la que no se escribe nada. Hay un significado más limitado: el espacio en blanco se encuentra entre las líneas de texto y las letras, alrededor de los elementos de contenido. Es todo lo que hace que su sitio web sea más legible y simple, aunque esté lleno de una cantidad excesiva de elementos de contenido.

11 actualizaciones de contenido frecuentes

El diseño del sitio web del periódico lo obliga a trabajar en su proyecto constantemente. El sitio web con muchas columnas y secciones de cuadrícula vacías se verá incómodo. Debe llenar el sitio web a fondo y mantener la tendencia de actualizar el contenido regularmente, hacer que sus publicaciones sean frecuentes y cambiar el contenido destacado en el encabezado (o donde lo haga).

El contenido y la frecuencia son una pareja, como el rey y la reina. Además de la apariencia del sitio web, el contenido frecuente afecta sus resultados en los motores de búsqueda. Las personas visitan su sitio web rara vez, si está desactualizado y Google lo ve. Por lo tanto, su contenido obtiene peores puntajes en los resultados de búsqueda.

12 Se fomenta el intercambio social

Los blogs y los sitios de noticias son los más comunes para usar el estilo de los periódicos, y estos sitios web no pueden existir sin la integración de las redes sociales. Es la época del intercambio masivo, y las redes sociales son donde la gente pasa gran parte de su tiempo. Debes usar botones geniales para seguir y compartir para cada red: Twitter, Facebook, Google+, Pinterest, LinkedIn, etc. La única precaución: no uses las cuentas que abandonaste, usa solo aquellas en las que publicas con frecuencia. Cree estos botones los más visibles en el sitio web para asegurarse una mejor exposición visual en las plataformas de medios.

Una cosa más que nos gustaría mencionar acerca de las peculiaridades del diseño del sitio web de un periódico es la capacidad de respuesta. Este diseño nunca será el mismo en los dispositivos móviles, y no hay forma de hacer una versión móvil manteniendo el estilo de un periódico. El sitio web móvil no debe tener una disposición de contenido de varias columnas, y esto es imprescindible para el diseño web de un periódico. Un sitio web móvil no puede tener barras laterales. Y es mejor reconsiderar la navegación, porque es más útil hacer que su sitio móvil se pueda desplazar en lugar de hacer clic.

Ejemplos del diseño del diseño del sitio web del periódico

Milo Blog

Organización Internacional de Defensa Civil

Publicidad Salud

moda

Mis derechos

caja negra

Calidad comprobada

el boston globo

Motonoticias

La breve

Revista de Nueva York

giro muerto

El periodico de Wall Street

MenteCuerpoVerde

Blog de TED

soy un blog de comida

Noticias de negocios de Long Island

Expresar

Tribuna

Fuente de grabación: instantshift.com

This website uses cookies to improve your experience. We'll assume you're ok with this, but you can opt-out if you wish. Accept Read More