Efecto Loading mientras carga nuestra pagina web

Crear un efecto de “cargar página” o “loading” en JQuery mientras se van cargando todos los elementos de la página web es realmente sencillo (aunque cuando me toco por primera vez hacerlo, no me lo parecía xD) gracias a la función load() de jQuery.

Ahora un ejemplo sencillo y básico que puedes customizar con css de mil formas.

  • Insertamos un div con id “cargando” al principio o final de la etiqueta body de nuestra página web:

 

Y desde aquí ya va todo el contenido (divs, imágenes, etc…) de tu pagina …

  • Un poco de CSS al div que aparecerá primero por encima del resto de los elementos (con posición absoluta obviamente) hasta que se carguen todos los elementos del documento, que es cuando este div desaparecerá.
  • Escribimos un pequeño script dentro del “head” de nuestro documento, generalmente:
Este es un ejemplo sencillo de como hacer un cargador usando jquery, pero con un poco de imaginación y destreza con CSS puedes hacer un cargador de página mucho más original (Puedes crear diferentes imágenes de loading en http://www.ajaxload.info/).

Importante: La parte crucial de este sencillo loading es el uso de $(window).load() en lugar del clasico $(Document).ready()

para que lo tengan mas claro pueden crear un documento html con imágenes y ver como se comportan ambas.

Descargar ejemplo completo:

[download id="602"]

Como saber cuando google bot visita nuestro sitio web

Sí deseas saber el momento exacto y por cuales páginas ha pasado el robot de google (Googlebot) en su o sus sitios web. Solo debes utilizar el siguiente código en el header del sitio y cuando el bot de google aparesca recibiran un email con la IP, navegador y url destino de la araña o robot de google.

Deben cambiar la dirección de email por la suya (obvio), si no les funciona puede ser que su hosting o servidor tengan la funcion mail de php truncada, en ese caso pueden usar la libreria phpmailer ampliamente documentada en internet:

y el correo que recibiremos sera parecido a la siguiente captura:

Paso de Googlebot