Optimizar Tiempos de Carga Comprimiendo

La velocidad de tu página web cada vez obtiene más y más importancia en factores de venta. ¡OJO! El tener una página lenta tal vez no es un factor muy importante para tu posición en los buscadores (SEO) pero este influye en algunos otros con mayor importancia.

Entre estos factores importantes se encuentra la tasa de rebote (Bounce Rate) ya que cuando la gente le da click a tu web y no carga lo suficientemente rápido, salen de tu página y por lo tanto Google detecta que se mantuvo poco tiempo en tu página y puede poner tu contenido como de baja calidad.

Además de afectar ese porcentaje, también puede afectar a tus campañas de pago por click (PPC) y en la conversión de los usuarios en clientes potenciales (lead). Se dice que el 60% sale de tu web si se tarda más de 2 segundos…cuántos clientes crees que puedas estar perdiendo?

Comprimir Imágenes

¡Comprimir imágenes es lo primero que debes hacer! Muchas veces queremos la mejor calidad en la web y ponemos archivos png pero esto es un error! Puedes poner imágenes png en los sliders pero si llenas tu página de estas fotos, cargará demasiado tu web.

Para esto es mejor elegir imágenes jpg. En algunos navegadores también se aceptan imágenes en webp. Este tipo de imágenes mantienen la mejor calidad y son muy pero muy ligeras.

Además de fijarte en el archivo de web, debes fijarte en el tamaño de imagen que estás ocupando. Hace poco como programador descubrí que puedes realizar un pequeño código para que dependiendo el dispositivo de donde provenga el usuario, carga una imagen de tamaño diferente.

Quiero aclarar que soy un poco nuevo en programación, pero día a día voy aprendiendo algo nuevo y con el tiempo podré realizar más artículos sobre programación.

Comprimir Archivos Css y Js

Las hojas de estilos o más conocidos por css (Cascading Style Sheets) como su nombre lo dice, es un lenguaje de programación utilizado a la hora de programar para realizar el front-end de una página web. Estos estilos le dan el aspecto que tu quieras a tu diseño.

Una página web sin estilos sería simplemente una hoja en blanco con letras, pero con ellos es posible crear un sidebar, que los títulos h1 tengan un aspecto mientras que los h2 tengan otro, etc.

¿Por qué comprimir los Css?

Como ya mencionamos antes, la carga de la página debe ser lo más rápida posible y es por esto que debemos comprimir todo archivo que sea posible.

Muchas veces hay templates (plantillas) que tienen los estilos muy sobrecargados y alentan la página de forma innecesaria ya que muchas veces ni si quiera se ocupan todos los css o la misma página llama a demasiadas hojas de estilos.

Para esto hay algunas recomendaciones que me gustaría brindarte:

• Deja de utilizar los estilos dentro del HTML. Si no sabes a que me refiero, muchas veces las personas tienden a agregar los estilos directamente en la página web con la etiqueta <style>.

  Este tipo de inserción de código es únicamente utilizada para páginas muy pequeñas que no requieren de muchos estilos, pero cuando es un proyecto más grande es mejor crear un archivo llamado styles.css y dentro de este generar todos los estilos que necesites.

• Dentro de tu código css debes utilizar abreviaciones. Con esto me refiero a que mucha gente escribe padding-left:20px; padding:right:20px, en lugar de esto escribe padding: 0 20px; con el primer 0 das a entender que el top y el bottom tienen un padding de 0 y ambos lados de 20px.
• Muchas veces el problema con estos archivos es que se dejan muchas líneas en blanco e innecesarias. Es cierto que el código puede dejar de interpretarse con facilidad, pero será leído más rápido por el navegador. 

  Esto recomiendo hacerlo ya que no vayas a realizar cambios diarios porque la lectura del código ya comprimido es muy difícil. Existen página que realizan este trabajo por ti. Una de ellas es: https://cssminifier.com/

¿Por Qué Comprimir Archivos Js?

Al igual que con los Css, el comprimir los Javascript hará que tu código sea más limpio y te ayudará a limpiar líneas de código, caracteres y espacios en blanco que sean innecesarios.

La siguiente herramienta es online y te ayudará a poder comprimir los js. https://javascript-minifier.com/

Esto hará que tu página web vaya un poco más rápido. En mi opinión y experiencia, me he podido percatar que la opción de optimizar las imágenes y su tamaño es la que más resultados te dará.

Pero no está de más realizar lo mismo con las hojas de estilo y los javascripts.

Si hay alguna otra sugerencia puedes mandarnos un mail y con mucho gusto añadiremos la información para que todos tengamos mayor aprendizaje y un mejor contenido.

Si te sirvió el contenido, te invitamos a que nos des like aquí abajo y le compartas el artículo a alguien que podría ayudarle.

¡Muchas gracias por leernos, ojalá hayas aprendido y salgas del blog con un conocimiento mayor que con el que entraste!