Globedia.com

×
×

Error de autenticación

Ha habido un problema a la hora de conectarse a la red social. Por favor intentalo de nuevo

Si el problema persiste, nos lo puedes decir AQUÍ

×
cross

Suscribete para recibir las noticias más relevantes

×
Recibir alertas

¿Quieres recibir una notificación por email cada vez que Tutorialesdeinternet escriba una noticia?

Trucos para hacer tu página web más rápida

15/08/2018 04:20 1 Comentarios Lectura: ( palabras)

Es muy común cargar todas las reglas CSS aunque algunas de ellas sólo se utilicen en un 2% de nuestra página

AÑADE Y MINIMIZA EL CSS NECESARIO

Es muy común cargar todas las reglas CSS aunque algunas de ellas sólo se utilicen en un 2% de nuestra página. ¿Por qué hacemos esto? lo más lógico es que dividamos el CSS por uso y carguemos por cada página solo aquellas reglas que se van a utilizar, así evitamos saturar con archivos muy grandes todo el sitio.

Además de simplificar el fichero, podemos minimizar su tamaño con aplicaciones como YUI Compressor o cssmin.js que se encargarán de eliminar espacios, comentarios y duplicidades, generando un fichero mucho más ligero pero con la misma funcionalidad.

MINIMIZA Y OPTIMZA EL CÓDIGO JAVASCRIPT

Al igual que con los ficheros CSS, es necesario optimizar para reducir el tamaño de los ficheros Javascript, tendremos que reducir el número de peticiones y asegurarnos de que ejecutamos lo justo y necesario para nuestra página. También, al igual que en el caso anterior, tendremos que comprimir y reducir su tamaño y para ello deberemos utilizar aplicaciones como Closure CompilerJSMin o, nuevamente,  YUI Compressor.

Si utilizas Wordpress tienes plugins de optimzación que te ayudarán en proceso.

OPTIMIZA LAS IMÁGENES

Las imágenes suelen ser los elementos de mayor tamaño de una página web y si los optimizamos de forma correcta será la forma más rápida de ver una mejora en el tiempo de carga. Es recomendable evitar formatos como BMP, TIF o GIFs y centrarnos en utilizar PNG y JPGs ya que son más óptimos desde el punto de vista del tamaño.

Algunas consideraciones acerca de la optimización de las imágenes:

  1. Podemos utilizar programas como Gimp para eliminar comentarios, profundidad de color y otros extras que añaden peso adicional a las imágenes.
  2. Hay múltiples aplicaciones que automatizan la optimización de imágenes como jpegtran,  jpegoptimOptiPNG o PNGOUT.
  3. Debemos especificar las dimensiones de las imágenes dentro del código HTML, así los navegadores no tienen que esperar a que se descargue.
  4. Utiliza imágenes escalables. Si tienes una imagen de 60x60 pero la vas a mostrar de 50x50, escalala y genera una del tamaño concreto con el que se va a visualizar. 

MINIMIZA EL CÓDIGO HTML

Por último, el código global que mostraremos será un HTML que incluye imágenes, CSS y Javascript, ente otros ficheros. Este código también tendrá que ser optimizado y para ello deberemos de tener algunos puntos en cuenta:

  1. Eliminar comentarios
  2. Eliminar espacios en blanco

Al igual que en los casos anteriores, podemos utilizar herramientas como HTML Compressor que nos facilitarán la tarea.


Sobre esta noticia

Autor:
Tutorialesdeinternet (10 noticias)
Visitas:
2429
Tipo:
Tutorial
Licencia:
Distribución gratuita
¿Problemas con esta noticia?
×
Denunciar esta noticia por

Denunciar

Comentarios

×
¿Desea borrar este comentario?
Borrar
0
+ -
Responder

David (31/08/2020)

Sin duda, la optimización de la imagen y la compresión de sus activos web son realmente útiles para que su sitio web se cargue más rápido. Las herramientas que mencionaste aquí son realmente útiles. Pero echa un vistazo a esos enlaces
Para compresión HTML (url-decode.com/tool/minifyhtml) (minifyhtml.org)
Para la compresión CSS (url-decode.com/tool/css-minifier)