La velocidad de carga de una web es muy importante, tanto para la experiencia del usuario como para la indexación en los buscadores (Google la tiene en cuenta). Con cada vez más dispositivos móviles usando conexiones lentas a internet, es fundamental incluir algunas técnicas de optimización de la carga. Un gran aliado para poder evaluar si nuestra página está optimizada es PageSpeed Insights de Google, una extensión gratuita para Chrome que analizará nuestra web y nos dará un listado de propuestas para mejorar la carga. Casi todos los puntos a tener en cuenta para aligerar la carga de una página están incluidos en esta extensión. Otro punto importante son las imágenes de nuestra página. Una web con imágenes sin optimizar supondrá una carga lenta. Para que las imágenes pesen lo mínimo posible y que sigan viéndose con calidad, se pueden usar las opciones de Photoshop, de GIMP o de alguna herramienta similar. Sin embargo, hay otro método, y es dejar que PageSpeed las optimice por nosotros. Cuando analicemos nuestra página con la extensión, uno de los checkpoints es “Optimizar imágenes”. Al entrar en esta opción, veremos que nos dice cuántos Kb nos ahorraríamos al comprimir algunas imágenes, y además nos da un link para ver las imágenes optimizadas. Sólo tenemos que abrir ese link y grabar las imágenes que la extensión ha comprimido por nosotros. Siguiendo con los gráficos, si hay iconos en nuestra web podemos usar sprites o icon fonts, con esto conseguiremos reducir el número de imágenes que se cargarán. Y recuerda no redimensionar las imágenes mediante HTML o CSS, obligarás al usuario a cargar más información de la que necesita. Otro factor que influye es cómo distribuimos la carga del código JavaScript. Un par de técnicas útiles es usar algún CDN cuando carguemos scripts desarrollados por otros, y sobre todo posponer la carga de scripts al final de nuestro HTML siempre que sea posible. Una vez que tengas todos estos puntos controlados, llega el momento de decirle al servidor que comprima los archivos de la web: para esto se usa Gzip o Deflate. Y para acabar, también le indicaremos al servidor que use cabeceras Expire para poder aprovechar el caché de los navegadores. Estos dos puntos sólo nos requerirán incluir unas líneas en el archivo .htaccess, que probablemente ya habremos creado. Cuando hayamos aplicado estas técnicas, llega el momento de usar una herramienta online como GTmetrix, que nos otorgará una puntuación según el grado de optimización que hayamos alcanzado, y también nos mostrará el listado de todos los factores que tiene en cuenta, como también nos hace Page Speed. Con estas técnicas conseguiremos acelerar los tiempos de carga, y por tanto, más usuarios que se quedarán en nuestra página. Y vosotros, ¿usáis alguna otra técnica? ¿creéis que hay que dedicarle tiempo a estos factores?
Cómo optimizar la carga de tu página
Pubblicato il - Ultima modifica il
Articoli correlati
Freelance Your Way to Success: The Ultimate Guide to Landing Your First Job on Freelancer.com
di Saleh B. -
This article provides a comprehensive guide on how to land your first job on Freelancer.com, including tips on how to land a project on Freelancer.com
Winning Your First Freelance Job: Overcoming the Challenges
di VideoCreatorMH -
The literature and reality of a new freelancer.
Navigating the Freelancer's Mind: Understanding Mental Health Conditions
di Russell John -
Exploring different mental health conditions that can affect freelancers working from home and insights on how to address and manage these challenges.
The Freelancer.com Bid Ranking Guide
di deHaaas -
Find out which factors affect your Freelancer.com ranking, and learn how to improve your visibility.
Freelancer Scams: 10 Red Flags and Warning Signs
Occasionally a fraudulent client or scammer will post a project, causing trouble for freelancers. Find out how you can spot the early warning signs.
A Freelancer’s Guide to Freelancer.com: Introduction to Freelancer.com
di ProductKnowledge -
Learn how Freelancer.com works, how to be a successful freelancer, and how to behave within the marketplace.
Prossimo Articolo
Herramientas online para desarrolladores frontend
da David Sanz Frías