Archivo de la etiqueta: google

Obtener el tiempo de carga de una página web

Pingdom toolsSi estás optimizando tus páginas web para mejorar el posicionamiento en buscadores y la usabilidad de tus usuarios, y necesitas saber el tiempo de ejecución (medir el tiempo de carga) para comparar tus scripts y ver si tus cambios son mejores, puedes usar las siguientes herramientas:

  • Pingdom Tools: Load Time Analiza el sitio web completo revisando el peso y la carga de cada uno de los elementos que componen el sitio web, generando un reporte en forma de cascada con colores distintos para diferenciar cada elemento y ver objeto es el que tarda más en cargar.
  • Google: PageSpeed Insights Se trata de una herramienta de análisis que Google ofrece para optimizar sitios web. Lo único que tienes que hacer es introducir la url y esperar a que genere un reporte personalizado con una lista de sugerencias para mejorar el tiempo de carga en dispositivos móviles y navegadores de escritorio.
  • GTMetrix Esta herramienta te muestra de manera porcentual el impacto de cada error de tu página web on una posible solución detallada para que puedas corregirlo fácilmente. Además, en GTMetrix puedes medir la velocidad de tu sitio web y ver el comportamiento de cada elemento como: Javascript, CSS, Solicitudes HTTP, Búsquedas de DNS, Ajax,…
  • Load Impact
  • WooRank

 

También podéis usar la función microtime() en PHP para sacar el tiempo de ejecución de un bloque de código, el tiempo calculado es en microsegundos.

Un ejemplo de código que podríais usar:

<?php
//Crear la variable inicio al principio de la ejecución
$inicio = microtime(true);

// Código del que quieres medir el tiempo

// Volvemos a calcular el tiempo
$final = microtime(true);

// Haciendo la diferencia entre el tiempo de inicio y el tiempo final, sabemos el total
$total = $final – $inicio;
echo ‘Tiempo en ejecutar el script: ‘.$total.’ microsegundos';
?>

Hacer que un sitio web cargue rápido es todo un reto para los diseñadores y programadores. Esperamos que este artículo os haya sido de ayuda.

Anuncios Adsense en sitios web Responsive Design

Últimamente recibo mensajes de Herramientas del Webmaster de Google diciendo que mis sitios no són optimizados para dispositivos móviles, y cuando voy a ver qué es lo que falla me aparecen las rutas de los anuncios de Adsense, que son 728×90 en lugar de 300×250. ¿Cómo puedo solucionarlo?

Al principio pensé en cambiar el formato del anuncio directamente, pero entonces en el escritorio no se veía bien ya que quedaba mucho espacio alrededor del anuncio en blanco. Buscando por la red encontré que Google había anunciado hacía un tiempo unos bloques de anuncio adaptables, justamente para los administradores de blogs con diseños responsive.

¿Cómo crear un bloque de anuncios Adaptable de Adsense?

Pulsas sobre el botón Nuevo bloque de anuncios y a continuación se elige en la sección Tamaño del anuncio -> Otro – Adaptable

Cuando pulses Guardar y Obtener Código, en la ventana siguiente tienes que clicar en Modo -> Avanzado (Modificación de código obligatoria).

El código será más o menos el siguiente:

<style>
.nombre-de-bloque { width: 300px; height: 250px; }
@media(min-width: 500px) { .nombre-de-bloque { width: 336px; height: 280px; } }
@media(min-width: 800px) { .nombre-de-bloque { width: 728px; height: 90px; } }
</style>
<script async src=”//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js”></script>
<!– nombre-de-bloque –>
<ins class=”adsbygoogle nombre-de-bloque”
style=”display:inline-block”
data-ad-client=”ca-pub-XXXXXXXXXX”
data-ad-slot=”XXXXXXX”></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>

Dentro de las etiquetas <style></style> está el código que debemos o podemos modificar. En las líneas que empiezan con el indicador @media se puede poner un tamaño de bloque de anuncio según el tamaño mínimo de pantalla que tenga el visitante. Yo, por ejemplo, he puesto que si el tamaño de pantalla de un usuario es de 500px se muestre el anuncio de 336×280 px en lugar de un 468x60px.

Nota: No puedes poner cualquier tamaño, debe ser uno de los tamaños de los anuncios que te proporciona Google Adsense.

Espero que os haya sido de ayuda. Saludos y hasta la próxima!