Consejos para el diseño de su página web con LivePages.

La popularidad y el éxito de tu página web dependen de diferentes factores. Un factor que se debe considerar es el diseño y la facilidad de uso de tu página web. Para ello es interesante tener en cuenta algunas ideas previas sobre el diseño y la estructura de menús antes de ponerse a crear la página web. Ten siempre en cuenta el sector de población al que querrás dirigirte con tu página e intentes también ponerte en el punto de vista del visitante.

Para el diseño de tu página web es recomendable ser consecuente. Antes de comenzar con el diseño de tu página, establece una línea de diseño (Styleguide). Esto significa, que por ejemplo definas qué tipo y tamaño de letra quieres utilizar y que lo apliques a todos los textos de tu página. Los siguientes puntos son únicamente consejos y recomendaciones, que no tienes por qué tomar al pie de la letra, el diseño de tu página es algo personal que debes decidir tú.

Texto

Como te indicamos anteriormente, es recomendable diseñar tu página web de manera consecuente. En referencia al texto de tu página, esto significa unificar el tipo, tamaño y color de letra en todas tus páginas y subpáginas. Limita el uso de diferentes tipos de letra a una o dos.

Utiliza los tipos de letra más comunes. La mayoría de ocasiones encuentras los tipos de letra Arial, Times New Roman y Verdana por internet, puesto que estos tipos de letra están instalados en la gran mayoría de los ordenadores del mundo y podrás garantizar que el tipo de letra de tu página se verá sin errores en cualquier lugar.

Igualmente tampoco se deberían utilizar tipos de letra excesivamente artísticos. Esto suele llevar a que el visitante de tu página no lea el texto hasta el final o que simplemente lo lea por encima.

Estos tipos de letra están a tu disposción en LivePages.

Tras la elección de un tipo de letra adecuado, es hora de pensar qué tamaño de letra queremos utilizar. En este apartado debemos evitar el uso de tamaños muy grandes así como de tamaños muy pequeños. La lectura de tipos de letra muy pequeños, resultará cansado para muchos visitantes de tu página web y de esta manera el contenido de tu página web será menos leido. Para el texto de tu página web deberías utilizar un tamaño de entre 12 y 16 puntos, y para encabezados entre 2 y 4 puntos mayor. En LivePages puedes modificar el tamaño de la letra en el menú de edición, el tamaño 12 corresponde al tamaño de 12 puntos.

Ejemplos de tamaños de letra con el tipo de letra Verdana.

La elección del color de la letra depende del color de fondo elegido, generalmente deberías prestar atención a que el texto se pueda leer fácilmente y a que el color de la letra combine bien con el color de fondo. Ten también en cuenta el punto "Elección de colores para tu página web".

La elección del color y tamaño de la letra puedes encontrarla en LivePages en el punto 4. Contenido. En el menú de edición econtrarás diferentes opciones.




Elección de colores para tu página web.

Elige los colores para tu página web prudentemente. Un visitante de tu página la valorará normalmente en los primeros segundos y decidirá si quiere seguir visitandola o no. Un conjunto de colores muy llamativo, puede llevar a captar la atención a corto plazo, pero casi nunca lleva a que el visitante de la página web permanezca a largo plazo ent tu página.

Por ello te recomendamos que no utilices colores demasiado claros o chillones, a casi ninguna persona le gusta visitar una página web con colores verde fosforito o rosa. Tras mucho tiempo en tu página tampoco debe resultar agobiante ningún color. Ten en cuenta el contraste entre el color de letra y el fondo. La letra tiene que poderse leer correctamente sobre el fondo elegido y debe destacar sobre él.

Ten también en cuenta que entre los visitantes de tu página web pueden encontrarse prsonas daltónicas. Por ello es recomendable prescindir de los contrastes rojo/verde.

Por lo tanto te recomendamos utilizar un color de fondo neutro, poco agobiante y que resulte agradable a lo largo del tiempo. Igualmente con la idea de mantener una imagen unificada, es recomendable utilizar el mismo esquema de color para todas las subpáginas. Intenta evitar poner fotografías como fondo, ya que a menudo, debido a los colores de la foto, lleva a que no se pueda leer correctamente el texto.



En LivePages tienes la posibilidad de ordenar los diferentes diseños según colores. En la elección de diseño, en el punto 2. Diseño seleccione la opción Por color con los botones siguiente y anterior puedes navegar por los diferentes diseños.



La elección del color de la letra, puedes llevarla a cabo en el punto 4. Contenido de LivePages, aquí tendrás el apartado color del texto a tu disposición.

La estructura de tu página web

Antes de comenzar con la creación de su página web, es bueno pensar en cómo querrás organizarla. Esto incluye al sistema de menús de tu página web. Decide qué apartados son importantes para tí, y en cuales podrás incluir contenido. Tiene más sentido trabajar con 10 apartados, los cuales tiene un contenido para los visitantes de tu página web, que no utilizar 50 apartados que sólo contengan un par de líneas cada uno. Una estructura de navegación bien organizada, ayuda a los visitantes de la página a encontrarse a gusto. Coloca los contenidos más importantes de tu página en los menús principales, y no los escondas en subpáginas.

Prescinde de páginas vacías. Esto lleva a que muchos visitantes desconfien y deja una impresión poco profesional. En el diseño de tu página con LivePages tienes la posibilidad de ocultar páginas que no estén completamente listas. Esto puedes hacerlo desde el menú "3. Estructura". Haz clic en la página deseada con el botón derecho del ratón y elige la opción "Ocultar página". Esta página no se seguirá mostrando en los menús. Una vez que hayas completado el contenido de esta página, podrás volver a mostrarla siguiendo los mismos pasos.

En caso de que una página contenga mucho texto, intenta acortarlo todo lo que puedas. Una página web que a primera vista sólo contenga un largo texto lleva a los visitantes a saltarlo. Los visitantes de páginas web, buscan información rápida y de manera comprimida, los textos largos se leen muy poco a menudo.

Puedes aligerar el texto utilizando fotos, párrafos o encabezados. Al espaciar un texto largo se disminuye el efecto abrumador para los visitantes, de manera que lo leerán más fácilmente que una página sólo de texto "en bruto". Utiliza encabezados llamativos para separar los párrafos y despertar la curiosidad de los visitantes para el texto que irá a continuación. Escribe el texto de manera sencilla, has de tener en cuenta que el lector posiblemente tenga menos conocimientos del tema que tú mismo. Evita por lo tanto las palabras técnicas o extranjeras que requieran de una explicación adicional y escribe en lugar de ellas palabras sencillas y entendibles.


Utilización de Fotos y Vídeos

Puedes utilizar fotos y vídeos tal y como te indicamos anteriormente para aligerar textos. A la hora de optimizar las fotos y los vídeos es recomentable tener en cuenta el tamaño y el formato del archivo en cuestión, y prepararlo de manera adecuada para las páginas web. Por ejemplo, las fotografías originales de cámaras digitales, debido a la resolución que poseen y el tamaño de los archivos, no son adecuadas para utilizarlas en páginas web. Una sóla foto puede tener un tamaño de varios Megabytes. Esto puede llevar a que tu página se cargue lentamente y que el visitante tenga que esperar hasta que se muestre por completo.

Comparación del tamaño de archivo de varias imágenes no optimizadas y una imagen optimizada.

Por ello tiene sentido optimizar las fotografías para la utilización en tu página web. Esto significa, que el tamaño de la imagen y el formato del archivo se adapten. En LivePages podrás utilizar los formatos .gif, .jpg y .png, junto con un tamaño de la imagen adecuado, es posible reducir el tamaño del archivo a unos pocos KB.

Algo similar ocurre con la optimización de videos. En este aspecto tiene poco sentido colocar un vídeo en alta calidad (HD) si éste se va a reproducir en un tamaño de píxeles reducido. En este caso también es recomendable optimizar el vídeo para reducir los tiempos de carga.

Puede ver el tamaño de las imágenees directamente en la MediaPool de LivePages.

Debes mantener un equilibrio entre la pérdida de calidad de las imágenes y el tamaño deseado. Muchos programas de edición de imágenes ofrecen fuciones automáticas para la optimización de fotografías para su uso en páginas web.

Con esta opción puedes crear imágenes optimizadas para páginas web mediante Adobe Photoshop / Adobe Photoshop Elements.

En la página de inicio, es decir, la página que se muestra cuando alguien accede a tu dominio, deberias prescindir de fotos o gráficos grandes. De esta manera consigues que esta página se muestre rápidamente. Largas esperas durante la carga de la página principal llevan a que la mayoría de los visitantes cierren la página antes de que se muestre.

En los siguientes artículos puede encontrar más información que le ayudará en sus primeros pasos con el creador de páginas web LivePages:

¿Cómo puedo crear mi propia imagen principal con LivePages?