1) Optimizar imágenes
Las imágenes son uno de los cerdos de ancho de banda más comunes en la web.
La primera forma de optimizar sus imágenes es escalarlas adecuadamente .
- Tengo un sitio web pero no sé nada sobre SEO 🙁 ¿Me pueden aconsejar?
- ¿Por qué sigo viendo estos molestos anuncios debajo de mis imágenes en mi cartera de sitios web de WordPress?
- Cómo desarrollar un sitio web solo desde cero hasta la implementación
- ¿El SEO del sitio web se realiza por geografía?
- ¿Se pueden alojar sitios web en una red de torrents y vincularlos a un nombre de dominio?
Muchos webmasters usan imágenes enormes y luego las reducen con CSS. De lo que no se dan cuenta es que su navegador todavía los carga al tamaño de imagen completo.
Por ejemplo, si tiene una imagen de 1000 x 1000 píxeles, pero la ha reducido a 100 x 100 píxeles, su navegador debe cargar diez veces más de lo necesario.
Escale sus imágenes antes de subirlas a su sitio, de modo que no pida más a sus visitantes de lo que debería.
Eche un vistazo a la diferencia de tamaño cuando redujimos una de nuestras imágenes:
La segunda forma de optimizar sus imágenes es comprimirlas.
Existen varias herramientas gratuitas en línea para la compresión de imágenes, como tinypng.com, que pueden reducir drásticamente los tamaños de las imágenes sin perder calidad. ¡Puedes ver reducciones de tamaño en cualquier lugar del 25% al 80%!
2) almacenamiento en caché del navegador
¿Por qué hacer que los visitantes descarguen las mismas cosas cada vez que cargan una página?
Habilitar el almacenamiento en caché del navegador le permite almacenar temporalmente algunos datos en la computadora de los visitantes, para que no tengan que esperar a que se cargue cada vez que visiten su página.
El tiempo durante el que almacena los datos depende de la configuración de su navegador y de la configuración de caché del lado del servidor.
Para configurar el almacenamiento en caché del navegador en su servidor, consulte los recursos a continuación o comuníquese con su empresa de alojamiento:
- Apache Caching
- Almacenamiento en caché de IIS
- Almacenamiento en caché de Nginx
3) compresión
Habilitar la compresión es como poner su sitio web en un archivo zip.
La compresión puede reducir drásticamente el tamaño de su página y, por lo tanto, aumentar su velocidad. Según varvy, ¡la compresión puede eliminar 50 – 70% de sus archivos HTML y CSS! Esa es una tonelada de datos que su visitante no tendrá que descargar.
La compresión es una configuración del servidor, por lo que la forma en que la implemente dependerá de su servidor web y su configuración. A continuación se presentan algunos recursos para los servidores web más comunes. Si no ve el suyo, comuníquese con su empresa de alojamiento para ver qué pueden hacer.
- apache
- IIS
- Nginx
4) Optimiza tu CSS
Su CSS se carga antes de que la gente vea su sitio. Cuanto más tarden en descargar su CSS, más esperarán.
CSS optimizado significa que sus archivos se descargarán más rápido, dando a sus visitantes un acceso más rápido a sus páginas.
Comience preguntándose, “¿uso todo mi CSS?” Si no, elimine el código superfluo en sus archivos. Cada pequeña cantidad de datos desperdiciados puede acumularse hasta que la velocidad de su sitio web ahuyente a sus visitantes.
A continuación, debe minimizar sus archivos CSS. Los espacios adicionales en sus hojas de estilo aumentan el tamaño del archivo. La minimización de CSS elimina esos espacios adicionales de su código para garantizar que su archivo tenga el tamaño más pequeño.
Entonces, ¿cómo minimizas tus archivos CSS?
Primero, vea si su CMS ya minimiza su CSS o si hay una opción para ello. HubSpot, por ejemplo, ya minimiza su CSS por defecto, mientras que WordPress o Joomla no lo hacen.
Si su CMS no tiene una opción de minimizar CSS, puede usar un servicio gratuito en línea como csscompressor.com para minimizar sus archivos. Simplemente pegue su CSS y presione “Comprimir” para ver su nueva hoja de estilo minimizada.
Minimizar sus archivos de recursos es una excelente manera de eliminar algo de tamaño de sus archivos. Confía en mí, esos pequeños espacios se suman rápidamente.
5) Mantenga sus guiones debajo del doblez
Los archivos Javascript pueden cargarse después del resto de su página, pero si los coloca todos antes de su contenido, como hacen muchos sitios, se cargarán antes que su contenido.
Esto significa que sus visitantes deben esperar hasta que sus archivos Javascript se carguen antes de ver su página, y sabemos cuánto les gusta esperar.
La solución más simple es colocar sus archivos Javascript externos en la parte inferior de su página, justo antes del cierre de la etiqueta de su cuerpo. Ahora puede cargar más de su sitio antes de sus scripts.
Otro método que permite un control aún mayor es utilizar los atributos diferidos o asíncronos al colocar archivos .js externos en su sitio.
Tanto diferir como asíncrono son muy útiles, pero asegúrese de comprender la diferencia antes de usarlos:
- Las etiquetas asíncronas cargan los scripts mientras se carga el resto de la página, pero esto significa que los scripts se pueden cargar fuera de servicio. Básicamente, los archivos más ligeros se cargan primero. Esto podría estar bien para algunos scripts, pero puede ser desastroso para otros.
- El atributo de aplazamiento carga sus scripts una vez que su contenido ha terminado de cargarse. También ejecuta los scripts en orden. Solo asegúrese de que sus scripts se ejecuten tan tarde sin romper su sitio.
Todo lo que necesita hacer es agregar una palabra simple en sus etiquetas .
Por ejemplo, puedes tomar tu guión original
Y agregue el pequeño código para asegurarse de que se cargue cuando lo desee.
<script type = ”text / javascript” src = ”/ path / filename.js” aplazar >
<script type = ”text / javascript” src = ”/ path / filename.js” async >
La importancia de sus scripts determinará si obtienen un atributo y en qué atributo se agrega. Las secuencias de comandos más esenciales probablemente deberían tener el atributo asíncrono para que puedan cargarse lo antes posible sin retener el resto de su contenido. Sin embargo, los no esenciales deben esperar hasta el final para garantizar que los visitantes vean su página más rápido.