Consejos para reducir el peso de una Página Web y mejorar la Experiencia del Usuario (UX)

El peso de una página web, es un factor muy importante que los Desarrolladores deben considerar cuando están desarrollando una, los motores de búsqueda posicionan mejor a las páginas ligeras y los usuarios se llevan una mejor experiencia de una página web que carga rápido, en este Post te compartiré algunos consejos para bajar el peso de tu sitio web y tus usuarios se sientan felices.

Antes de continuar con este Post, te invito a leer los siguientes artículos:

• Que es UX y otros Detalles
• 5 Principios Fundamentales del UX Design
• 5 Tips para Mejorar la UX (Experiencia del usuario) de un menú Web creado con Bootstrap 4
• Aplicando Buenas Prácticas a un Sitio Web usando WebHint en Firefox DevTools
• Como afecta la Propiedad CSS ‘display: none’ en imágenes a la experiencia del Usuario en un Sitio Web
• Puedes leer más en la categoría UX

Antes de continuar te invito a escuchar el Podcast: “Dominio del trabajo con Varios Lenguajes de Programación”:

Spotify	SoundCloud

Bien ahora continuemos con el Post: Consejos para reducir el peso de una Página Web y mejorar la Experiencia del Usuario (UX).

No uses la misma Hoja de estilos CSS en todas las Páginas

Una página web siempre debe contar con estilos CSS, es fundamental para mostrar un diseño agradable haciendo usos de fuentes bonitas, colores agradables, menús dinámicos, etc.

Pero hay estilos que son innecesarios usarlos en otras páginas de un sitio web, por ejemplo si en la página principal del sitio web, tienes un video de presentación al cual le has aplicado determinados estilos CSS y en la página de contacto este video no es usado, pues estamos cargando estilos del video en una página en donde no los necesitamos, estamos cargando una hoja de estilos muy pesada.

Para solucionar esto, podemos crear diferentes hojas de estilos CSS y usarlas cada una en su página respectiva, por ejemplo los archivos podemos nombrarlos como home.css, servicios.css, blog.css, galeria.css, contacto.css, etc. Recuerda que los estilos para el logo, header, menú, footer y algún otro elemento que deseas incluir en todas las páginas se deben mantener siempre. De esta forma al no incluir todos los estilos en las demás páginas, pues tu web será menos pesada y cargará un poco más rápido.

No uses los mismos códigos JavaScript en todas las Páginas

Al igual que CSS, los archivos JavaScript son muy utilizados en sitios webs dinámicos, JavaScript hace que las páginas webs sean más dinámicas, permiten validar formularios, crear animaciones, gestionar fechas y horas, etc.

Procura crear un archivo JavaScript para cada página, por ejemplo los archivos puedes nombrarlos como home.js, servicios.js, blog.js, galeria.js, contacto.js, etc. y luego llama el archivo a la página correspondiente, así evitarás cargar código JavaScript que no se usará y la página cargará más rápido.

Crea una versión para Cada tipo de Dispositivo

Un dispositivo Desktop como una PC o Laptop puede soportar páginas pesadas, que porsupuesto no es recomendable hacer, pero vayamos a los dispositivos móviles como Tablets, celulares, iPads, iPhones, etc. Los dispositivos móviles suelen tener menos capacidad de Hardware y si un usuario abre tu página web en su dispositivo móvil verá que el sitio carga más lento de lo normal por la falta de recursos de Hardware como el procesador.

Para solucionar esto puedes crear 2 versiones de un sitio web, una para dispositivos de escritorio o Desktop como las PCs y otra versión para los dispositivos móviles como celulares, tablets, iPads, iPhones, etc. Puedes optar por crear una página AMP de Google, para los dispositivos móviles, así los visitantes que ingresen a tu web desde su dispositivo notarán que tu web es super rápida y se llevarán un buena experiencia.

Usa servidores con buenos Recursos de Hardware

En algunas ocasiones podemos apreciar que hay sitios webs que tiene mucho contenido y uno se pregunta, porque estas páginas cargan rápido, pues en muchos casos se debe al uso de servidores potentes que cuentan con grandes recursos.

Puedes optar por contratar un servidor VPS (Virtual Private Server), este tipo de servidores suele contar con recursos de Hardware muy potentes, los procesadores suelen tener muchos núcleos, la memoria de este tipo de servidores están por encima que las de un servidor común, asimismo cuentan con basto espacio para almacenar los archivos y carpetas del proyecto, entre otras buenas características que harán que tu proyecto sea una bala y cargue muy rápido.

Usa librerías de lado del cliente (Front)

En estos tiempos modernos, existen muchas librerías y herramientas que te permiten acelerar la carga de un sitio web, estas librerías están desarrolladas en su mayoría con el Lenguaje de Programación JavaScript que es un Lenguaje muy usado en el Desarrollo Web.

Puedes optar por usar Angular, React JS y Vue JS, estas 3 herramientas hacen que la carga de tu sitio web sea rápida, por ejemplo Angular es usado en la popular plataforma de videos YouTube y React JS es usado por la empresa Facebook en su popular red social y otros productos o servicios, si estas empresas lo usan, esto nos da la seguridad que estas herramientas son buenas y la carga del contenido de tu sitio web será más rápido.

Si conoces otros consejos, puedes compartirlo en los comentarios de este Post.

Conclusión

En este Post te he compartido algunos consejos que si los implementas, lograrás disminuir el peso de tu sitio web y por ende vas a generar una buena experiencia en los usuarios. Existen otros consejos que podríamos mencionar, pero si no has implementado ninguno de los que menciono en la lista, pues puedes comenzar ya mismo a implementarlos. 

Nota(s)

• No olvides que debemos usar la Tecnología para hacer cosas Buenas por el Mundo. 

Síguenos en nuestras Redes Sociales para que no te pierdas nuestros próximos contenidos.