google tools: uso de las herramientas web de google · de texto para describir cada uno de los ......

1

Google Tools: Uso de las herramientas web de

Google

Guillermo Vigueras González

Curso de extensión universitariaCampus de Burjasot

Universidad de ValenciaFebrero 2011

Google tools – Curso de extensión universitaria – Febrero 20112

ÍndiceBuscador y page rank (Google trends)Historia de Google y aplicaciones ofrecidas (video)‏¿Cómo ha crecido tanto Google? (video) ‏Google transitGoogle ride finderGoogle Street viewGoogle MapsGoogle EarthGoogle Lively


BuscadorUna consulta al buscador

1. El servidor web envía la consulta a los servidores del índice. El contenido de éstos se parece al índice que se incluye al final de los libros: indica las páginas que contienen las palabras que concuerdan con la consulta.

2.La consulta se traslada a los servidores de documentos, que son los encargados de recuperar estos últimos. Se generan fragmentos de texto para describir cada uno de los resultados.

3. Los resultados se presentan al usuario en una fracción de segundo.


Page rankTecnología PageRank: PageRank realiza una valoración objetiva de la importancia de las páginas web resolviendo una ecuación de más de 500 millones de variables y 2.000 millones de términos. En lugar de contar los vínculos directos, PageRank interpreta un vínculo de la página A a la B como un voto para la página B por parte de la A. A continuación, valora la importancia de la página en cuestión contando la cantidad de votos recibidos.

Esta tecnología también tiene en cuenta la importancia de cada página que efectúa un voto, dado que los votos de algunas se consideran de mayor valor, con lo que incrementan el valor de la página con la que enlazan. Las páginas importantes reciben un PageRank más elevado y se sitúan entre los primeros resultados. La tecnología de Google utiliza la inteligencia colectiva de Internet para determinar la importancia de una página. Los resultados se determinan sin intervención ni manipulación humana. Éste es el motivo de la confianza de los usuarios, que consideran Google una fuente de información objetiva no tergiversada por motivos económicos.


Page rank (II)‏Ejemplo de grafo de webs

Google ordena los resultados de la búsqueda utilizando su propio algoritmo PageRank. A cada página web se le asigna un número en función del número de enlaces de otras páginas que la apuntan, el valor de esas páginas y otros criterios no públicos. Página C más importante que E a pesar de tener menos votos, porque el único voto es de B que es una página importante


Page rank (III)‏Antecedentes

PageRank ha tomado su modelo del Science Citation Index (SCI) elaborado por Eugene Garfield para el Instituto de información científica (ISI) en los Estados Unidos durante la década del 50. El Science Citation Indexpretende resolver la asignación objetiva de méritos cientificos suponiendo que los investigadores cuyo factor de impacto (número de publicaciones y/o referencias bibliográficas en otros trabajos cientificos) es más alto colaboran en mayor medida con el desarrollo de su área de investigación. El índice de citación es un elemento determinante para seleccionar que investigadores reciben becas y recursos de investigación.

http://es.wikipedia.org/wiki/%C3%8Dndice_de_citaci%C3%B3n




http://es.wikipedia.org/wiki/Factor_de_impacto




Google bot

¿Cómo determina Google los votos de las páginas para resolver el algoritmo de page rank? ->Google botUn robot (o bot) web es un programa autónomo (no manejado por un humano) que explora un sitio web y va a accediendo de forma recursiva a los documentos del sitio. Los documentos ‘recolectados’ por el bot, serán procesados por el motor de búsquedaLos lugares a los que puede acceder un bot, son definidos a través del fichero robots.txt


Google bot (II)‏Fichero robots.txt

Limita que recursos se pueden visitar (Disallow). Da permiso pordefectoEjemplo

# /robots.txt file for http://webcrawler.com/ # mail [email protected] for constructive criticismUser-agent: webcrawler

Disallow: # No limitimamos para ‘webcrawler’User-agent: lycra

Disallow: / # Limitamos todas las páginas para ‘lycra’User-agent: *

Disallow: /tmp # Resto de bots permitimos acceso a todoDisallow: /logs # excepto ‘/tmp’ y ‘/logs’

Simulador de bot (da una idea de lo que encuentra un bot en tu web)‏ Probar con ‘www.bbc.co.uk’

http://www.webconfs.com/search-engine-spider-simulator.php



Optimización en buscadores

• ¿Qué es?


Optimización en buscadores (II)

SEOPPC


Optimización en buscadores (III)Factores a tomar en cuenta para un buen posicionamiento

Palabras clave: ¿Cuáles son los conceptos descriptivos de nuestro negocio y en los cuales nos queremos posicionar?

Relevancia: La página webdebe tener texto relevante relacionado con las palabras clave

Indexabilidad: Las palabras clave se deben insertar de forma amigable para los robots de los buscadores

Popularidad: Nuestra web debe recibir enlaces de otras webs con palabras clave como las de la nuestra. Dichas web han de ser ‘importantes’ (tener un pagerank alto)


Palabras clave• ¿Qué son?

Palabras que usamos en nuestra web

Palabras que usan nuestros clientes para

buscarnos Palabras que usamos en nuestra web

Palabras que usan nuestros clientes para

buscarnos

Tráfico web en los buscadores


Palabras clave (II)

¿Cómo saber las palabras clave que usarán mis potenciales clientes en buscadores?

Análisis de la competenciaUso de herramientas de análisis de palabras clave (google trends, google keywords adwordstool)Conocimiento del propio mercado


Google trends

Google, siguiendo su idea de ser la fuente de información más importante del planeta, ideó Google trendsEsta herramienta puede tener varios usos, entre ellos para analizar cuáles son las búsquedas de los usuarios de todo el mundo en un determinado periodo de tiempo y ver cómo evolucionan los comportamientos sociales. Con Google Trends podemos ver gráficos de estas búsquedasLa base de datos de las búsquedas datan del año 2004 hasta hoy. También se puede buscar por paísEn la zona inferior de los resultados de cada término, se listanlas principales ciudades y regiones desde las cuales se busca eltérmino introducido. Estos datos se obtienen de la dirección IP


Google trends (II)‏Las palabras hay que introducirlas separadas por comas

http://www.google.com/trends

http://www.google.com/trends


Google trends (III)‏Aplicaciones

Google Trends es utilizada a menudo por profesionales del marketing y el posicionamiento. Por ejemplo, si queremos saber que palabra utiliza el usuario entre dos sinónimos no tenemos más que probar: 'gratis, gratuito'.

Otro uso en posicionamiento puede ser investigar cuando una determinada palabra es buscada con tilde o sin tilde. Así el contenido de nuestra web será más adecuado para que nuestra web obtenga una posición en una búsqueda de un usuario. Por ejemplo: 'pagina, página '

Otro ejemplo para el uso de Google Trends en marketing, es para temas estacionales, por ejemplo cuándo empiezan a buscar los usuarios viajes a Egipto o casas rurales. Con esta información los empresarios avispados podrán sacar sus ofertas en el momento justo.

http://www.google.com/trends?q=gratis%2C+gratuito&ctab=0&geo=ES&date=2006

http://www.google.com/trends?q=pagina%2C+p%C3%A1gina&ctab=0&geo=ES&date=2006


Google trends (IV)Ejercicios: determinar tendencias de la gente

Hacer una comparativa de las principales marcas de coches (separado por comas)Comparar: Google y Yahoo. ¿Por cuál de los dos ha pasado más trafico en Australia? ¿Y en Francia?Ebay o Amazon ¿Cuál de los dos tiene más volumen de tráfico? ¿En qué país es más utilizado Ebay? ¿Cuál de los dos se usa más en España?Imaginad que la empresa de aviones SAS, os pide que le traduzcáis su página web al hindú, porque cree que la empresa Norwegian (la competencia) ya lo ha hecho y está ganando clientes con ello. ¿Qué les contestaríais?


Google keywords adwords tool• https://adwords.google.es/select/KeywordToolExternal

– Utilizando la información de los servidores de google, nos propone palabras clave y nos indica la relevancia

– Ejercicio: ¿Qué 20 palabras clave seleccionaríais para una websobre ‘diseño web’? (o lo que queráis)

https://adwords.google.es/select/KeywordToolExternal


IndexabilidadUna web es indexable cuando

Puede ser encontrada por los buscadoresPuede ser rastreada correctamente. Es decir, todo su contenido puede ser leído por un robot webPuede ser clasificada en las categorías de búsqueda adecuadas y con un adecuado nivel de relevancia respecto a sus competidores


Indexabilidad (II)• ¿Cómo podemos saber cómo es vista nuestra web por otros?• Simulador de robot:

http://www.webconfs.com/search-engine-spider-simulator.php• ¿Qué sabe Google de nuestra web?

– site:www.miweb.es (analizar número de resultados y lo que sale en cada resultado)

• ¿Cómo ve Google nuestra web? La caché (nos muestra la última vez que obtuvo información de nuestra web) Probarlo…



Indexabilidad (III)• Obstáculos para el robot


Relevancia• Relevancia (ya dicho): La página web debe tener texto

relevante relacionado con las palabras clave• ¿Qué partes de la página web considera relevantes un buscador?

El título del artículo

El dominio

Palabras en negrita (con enlaces internos)

El título del artículo

El contenido de la página

El texto de las etiquetas de las imágenes


Popularidad• Conseguir enlaces de otras páginas y que

sean enlaces de calidad. ¿Cómo?• De forma activa: solicitud, intercambio o

compra de enlaces:– Directorios web– Portales de asociaciones– Redes sociales– …

• De forma pasiva: creando contenido de calidad, consiguiendo así que otros sitios nos enlacen


Buscador y Page Rank (conclusiones) ‏

En general es un aspecto importante a tener en cuenta en la estrategia de marketing de una empresa virtual o ‘real’, porque puede aumentar la ‘visibilidad’ de la empresaExisten métodos correctos para aumentar el Page Rank y métodos no tan correctos. Con los métodos poco éticos, uno se arriesga a que los buscadores lo detecten y dejen de indexar el sitio web


Historia de Google y aplicaciones ofrecidas1: Historia de Google. Parte 1.2: Historia de Google. Parte 2.3: Historia de Google. Parte 3.

http://www.youtube.com/watch?v=wsSo3WjuUPE

http://www.youtube.com/watch?v=FxPlZrUzTrc

http://www.youtube.com/watch?v=Hh8ikvelers


Crecimiento de GoogleDesde su creación Google ha crecido como empresa de una forma increíble. Esto es (como en cualquier empresa) gracias al equipo de trabajadores de GoogleGoogle ha tenido una gran idea para desarrollarse como lo ha hecho: buen ambiente de trabajoSi los trabajadores se encuentran cómodos, serán más productivos y creativosGoogle por dentro:

1: http://es.youtube.com/watch?v=QPUIOWSA8nY&NR=12: http://es.youtube.com/watch?v=MN8RekSE5r4&feature=related

http://es.youtube.com/watch?v=QPUIOWSA8nY&NR=1

http://es.youtube.com/watch?v=MN8RekSE5r4&feature=related

http://es.youtube.com/watch?v=MN8RekSE5r4&feature=related


Google transitLa idea es que una persona pueda calcular cuál es la mejor ruta para viajar de un destino a otro usando el transporte públicoPara ello se deben estandarizar los formatos de información que las distintas compañías publican en sus páginas web, para que este servicio de Google sea efectivoEn Google, se le permite a los empleados dedicar un 20% de su tiempo en proyectos personales. O sea, después de 1 mes de trabajo tienen 1 semana para hacer otros proyectos, o por lo menos un día a la semana. Tres ingenieros, de New York, San Francisco y Zurich, dieron vida a este proyecto, cuyo fin es reunir en un solo sitio web las rutas del transporte público con sus combinaciones, para poder planificar sus viajes dentro de la ciudadSólo disponible para algunas ciudades de ciertos países. No para España… aún


Google transit (II)‏Resultado mostrado


Google transit (III)‏

http://www.google.com/transitOrigen: University Way NE & NE 45th St, Seattle, WA 98105Destino: 720 Fourth Avenue kirkland, waProbar a cambiar la hora... Puede que cambie alguno de los autobuses utilizados dependiendo de si en ese momento pasa una línea u otra

http://www.google.com/transit


Google ride finderAplicación basada en la información de callejero que ofrece Google MapsPermite al usuario localizar un taxi, limusina, o transporte especial para llegar al aeropuerto más cercano, en una ciudadLos vehículos deben llevar un GPS que de su posición, y así Google ride finder podrá actualizar su posición en el mapaDe momento sólo funciona en pocas ciudades de estados unidos


Google Street ViewServicio lanzado por Google en la primera mitad del año 2007Permite hacer un recorrido virtual por una ciudad, viéndola a partir de imágenes que dan una perspectiva de 360ºEl usuario se mueve por la ciudad mediante el ratón (‘pichando y arrastrando’). Navegación a partir de la información de localización que da Google Earth. (Ver siguiente transparencia) ‏Limitaciones: sólo para aquellas ciudades de las que haya información


Plaza en avenida de los Campos Elíseos (París) ‏

Google Street View (II)‏


Google Street View (III)‏¿Cómo lo han hecho?

Subcontrata de infraestructura a la empresa ‘Inverse media’Coches con una cámara en la parte superior que captan la ciudad en 360º


Google maps. UsuarioPermite buscar:

Ciudad, puebloDireccionNegocio por sector y ciudad (pestaña superior ‘buscar negocios’) ‏Rutas: origen->destino (pestaña superior ‘Cómo llegar’) ‏

Distintas vistas: mapa, satélite o relievePermite configurar la información a mostrar en el mapa:

Fotografías (que haya subido gente) ‏Información de cada lugar de la Wikipedia

Crear mapas personalizados con marcadores, lineas, áreas, etc… (requiere cuenta de gmail)‏


Google maps. DesarrolladorVamos a usar para insertar nuestros mapas un página HTML básicaPara desarrollar con la API de Google hay que solicitar una claveEn esa página insertaremos código javascript de la API de Google

Mostrar código HTML…Instalar el editor Notepad++


Google maps. Primer mapaPrimer mapa (directorio: primer_mapa)‏

<html>…<div id="map" style="width: 600px; height: 400px"></div><script type="text/javascript">//<![CDATA]if (GBrowserIsCompatible()) {

var map = new GMap2(document.getElementById("map"));map.setCenter(new GLatLng(37.4419, -122.1419), 13);

}//]]></script>…</html>


Google maps. Separar código

Separamos el contenido del código, creando un fichero de javascript separadoDestacar

Linea en la que se incluye fichero .jsRelación entre elemento ‘map’ HTML y el de javascriptEvento window.onloadObjetos de la api de Google (GMap2 y GLatLng) ‏


Google maps. Modificaciones

Modificaciones del primer mapaObtener coordenadas con Google maps (http://maps.google.es) y modificarlas del mapa inicial

http://maps.google.es/


Google maps. Interacción

Interacción (directorio: interaccion)‏GLargeMapControl() Control ampliado del mapaGSmallMapControl() Control pequeño del mapaGScaleControl() Leyenda con el factor de escalaGSmallZoomControl() Adecuado en pop-ups donde hay poco espacioGMapTypeControl() Seleccionar el detalle del mapa (híbrido,satelite y mapa)‏

Probar a meter distintos tipos de controles


Google maps. Marcadores

Creación de marcadores (dir.: marcadores) ‏Añadimos al fichero javascript

var marker = new GMarker(location);map.addOverlay(marker);

Importante:Añadir el marcador después de establecer el centro, si no, el mapa fallaráProbarlo


Usamos el objeto infoWindowfunction handleMarkerClick() {

marker.openInfoWindowHtml('Descripcion');}

Google maps. infoWindow

El objeto infoWindow (dir.: infoWindow) ‏Primera aproximación (añadir al js en init() ) ‏

function handleMarkerClick() {alert("You clicked the marker!");

}GEvent.addListener(marker, 'click', handleMarkerClick);


Google maps. infoWindow

Se pueden insertar varias pestañas en un mismo infoWindowExplicar código (dir.: tabInfoWindow)Modificaciones

Añadir otra pestañaAñadir en el texto referencias a páginas web


Google maps. Varios marcad.Varios marcadores (dir.: variosMarcadores) ‏

Explicación fichero maps_functions.jsDefinimos la lista de marcadores

var markers = [{'latitude': 37.818361,'longitude': -122.478032,'name': 'Golden Gate Bridge'},{'latitude': 40.6897,'longitude': -74.0446,'name': 'Statue of Liberty'},{'latitude': 38.889166,'longitude': -77.035307,'name': 'Washington Monument'}];


Google maps. Varios marcad.

Añadimos en init() (dir.: variosMarcador)‏for(id in markers) {addMarker(markers[id].latitude, markers[id].longitude, markers[id].name);}

Probamos a visualizar varios marcadores¿Se ven? … ¿Motivo?Probar con el control de mapa a alejarnos


Google maps. Marcad. con clickCuando el usuario haga click en el mapa, se insertará un marcador (dir.: userInsertaMarcador) ‏Código

GEvent.addListener(map, "click", function(overlay, latlng) {var marker = new GMarker(latlng)‏map.addOverlay(marker);

});

Notar que el evento al ser de Google, recibe las coordenadas como un objeto ‘GLatLng’ de la Google APILos marcadores insertados, no se guardarán para futuras visitas de nuestra página. Para eso habría que enviar información al servidor y almacenarla (no lo vamos a ver)‏


Google maps. Guardar Marcad.

Explicar código (dir.: formInfoWindow) ‏Para quitar la infoWindow

En método init (al final)map.disableInfoWindow();

¿Qué código haría falta añadir para mostrar el marcador en las coordenadas del click del usuario?¿En que lugar habría que añadir ese código?


Google maps. Custom marker

Vamos a crear un marcador personalizado con la imagen que nosotros queramosExplicación código javascript (dir.: customMarker)‏Probar

Buscar alguna imagen en Google, guardarla e insertarla como imagen del marcadorProbar a cambiar tamaño


Google maps. Custom marker (II)‏Varios marcadores con imagen personalizada (dir.: customMarker) ‏

Lista marcadores (añadimos el atributo ‘image’)‏var markers = [{'latitude': 37.818361,'longitude': -122.478032,'description': mensaje,'image': URL de la image},{'latitude': 40.6897,'longitude': -74.0446,'description': mensaje,'image': URL de la image}];

Utilizar el bucle for que vimos antes para recorrer el array de marcadores


Google maps. Tool Tip

Tool tip asociado a un marcadorExplicar código (dir.: toolTip)Modificaciones

Modificar el texto del tool tip, para que muestre la latitud y longitudUtilizar el custom marker


Google maps.Ejercicios

Supongamos queremos poner una InfoWindow con varias pestañas en el futuro edificio de la ETSE. Una pestaña por departamento y cada pestaña con el enlace a la web de cada departamentoSupongamos que un amigo/a nos ha pedido le tracemos una ruta en el mapa de un viaje que queremos hacer, y en esa ruta añadimos marcadores con infowindows para destacar lugares a visitar o cosas interesantes que queramos resaltar (añadir URL). Podemos poner alguna imagen de los sitios a visitar como hacíamos en el ‘customMarker’.


Google maps. Controles extra

Se pueden añadir imágenes al mapa que funcionen como controles extra del mapaExplicación código (dir.: mapControl)Modificaciones

Probar a cambiar la imagen por la del perroProbar a poner una imagen de nuestra elección y que enlace a dónde nosotros queramos


Google maps. Delimitar area

Para ello usamos el objeto Gpolyline, que construye una linea, con unos puntos que se le pasan como parámetroLos puntos los obtenemos de los click de ratón que haga el usuarioExplicar código (dir.: delimitarArea)‏Importante: probar en iExplorerModificaciones:

Utilizar el custom marker


Google maps. Depuración

Existe la posibilidad de poder escribir información en la ventana de log para poder depurar errores del programaExplicar código (dir.: logMouse)


Google maps. Mapa Propio

Vamos a crear nuestro propio mapa a partir de una imagen que descargaremos de la página de la NASA:http://eoimages.gsfc.nasa.gov/ve//2431/land_ocean_ice_cloud_2048.tif

Guardarla en el directorio:C:\xampp\htdocs\cursoGoogle\ownMap\tiles

http://veimages.gsfc.nasa.gov/1438/land_ocean_ice_lights_2048.tif


Google maps. Mapa Propio (II)

• Hacemos ‘Tiling’ con el programa ‘ImageMagic’• Comando genérico:

convert filename.tif -resize widthxheight –crop 256x256directory/tile.zoomlevel.%d.png

• Comandos específicos• convert land_ocean_ice_lights_2048.tif -crop

256x256 land_ocean_ice_lights/tile.3.%d.png• convert land_ocean_ice_lights_2048.tif -

resize 1024x512 -crop 256x256 land_ocean_ice_lights/tile.2.%d.png

• convert land_ocean_ice_lights_2048.tif -resize 512x256 -crop 256x256 land_ocean_ice_lights/tile.1.%d.png

• convert land_ocean_ice_lights_2048.tif -resize 256x256 land_ocean_ice_lights/tile.0.%d.png


Google maps. Mapa Propio (III)• Conversión de la identificación de los tiles tal como

los pide Google a nuestro modo de identificación (bidimensional a unidimensional)x + y(2^zoom) = z

• Explicar en el códigoreturn 'tiles/image/tile.' + zoom + '.' + (tile.x +

tile.y*Math.pow(2,zoom))+ '.png';• Gprojection()• GCopyright()• GTileLayer()• GMapType() (pasar nuestro mapa como

parámetro al constructor de GoogleMap)


Google maps. Mapa Propio (IV)

Ejercicio. Crear nuestro propio mapa:http://eoimages.gsfc.nasa.gov/ve//2431/land_ocean_ice_cloud_8192.tif

6 niveles de zoom. Los tamaños van a ser:8192x4096 (original) – Nivel 54096x2048 – Nivel 42048x1024 – Nivel 31024x512 – Nivel 2512x256 – Nivel 1256x256 – Nivel 0

http://www.uv.es/guianvi/files/land_ocean_ice_cloud_8192.tif


Google Street View. Desarroll.

var streetViewLocation = new GLatLng(streetViewLat,streetViewLong);var streetViewPOV = {yaw:370.64659986187695,pitch:-10};panoramaOptions = { latlng:streetViewLocation,pov:streetViewPOV};var myPano = new GStreetviewPanorama(document.getElementById("streetViewPanorama"), panoramaOptions);

Google Street Viewtambién puede ser insertado mediante javaScript y una API.Directorio ‘streetView’Probar a cambiar coordenadas y el POV


Google Earth

Aplicación de escritorio (no web) que representa una reconstrucción de la Tierra en un superficie esféricaContiene también una base de datos con información sobre sitios a visitar, negocios, información del tiempo, etc…

59


Google Earth (II)‏Descargar Google EarthInstalarBuscar una localización, buscar negocio, ¿cómo llegar?Excursiones (darle al ‘play’->’pause’) ‏Podemos crear nuestra carpeta de excursionesPodemos superponer elementos al mapa de Google Earth (Carreteras, edificios 3D, tiempo, etc…)‏

60


Google Earth (III)‏

Opciones a probarVer

Cambiar cielo / tierraCuadrícula…

HerramientasOpciones ->comentar (afectan al rendimiento) ‏Regla (medir distancias)‏

61


Google Earth (III)‏

Menú lateral izquierdo: Capas->verComprobar, por ejemplo, seleccionar que muestre elementos como farmacias, etc… que conozcáis y ver si aparece en el mapaEdificios 3D


3dwarehouse

Google ofrece un sitio donde los desarrolladores de modelos 3D para Google Earth pueden colgar sus modelos 3DDichos modelos se pueden así visitar donde estén colocados en Google Earthhttp://sketchup.google.com/3dwarehouse/

http://sketchup.google.com/3dwarehouse/


Google SketchUp

Software de Google que permite crear modelos 3D para colgarlos en Google Earthhttp://www.google.com/sketchup/

http://www.google.com/sketchup/


Google Lively

El 9 de Julio de 2008 Google sacó su mundo virtual basado en la idea de metaverso (similar a Second Life)‏http://www.lively.comRequería descargarse un programa, que instala un cliente web para interacionar con el mundo virtualEl proyecto está cerrado desde 31 dic. 2008

http://www.lively.com/


Referencias

[1]http://www.google.com/support/webmasters/bin/answer.py?answer=35769[2]http://www.robotstxt.org/faq.html

http://www.google.com/support/webmasters/bin/answer.py?answer=35769

http://www.robotstxt.org/faq.html


Gracias por vuestra atenciónEspero os haya sido de interés

google tools: uso de las herramientas web de google · de texto para describir cada uno de los ......

Documents