Como posicionar bien una web

Como posicionar bien una web

Hay muchísimos factores que pueden afectar en el buen y mal posicionamiento de una web tanto en google como en otros indexadores como bing y yahoo.

La mayoría de tutoriales se centra en el posicionamiento SEO y/o en el posicionamiento SEM de una web, de los cuales encontrarás miles de tutoriales por internet. Yo voy a intentar enseñaros algunos factores muy importantes que no se contemplan tanto pero que a la larga es posible que os afecten y mucho.

  1. Escoger un buen servidor de hosting
  2. Servidor dedicado o compartido
  3. Si tu servidor es compartido con quién lo compartes y si te puede afectar
  4. Lenguaje de programación
  5. Metatags de idioma
  6. Velocidad de carga de una web

Escoger un buen servidor de hosting

A la hora de hospedar una web es muy importante comprobar el ping que te da con ese servidor de hosting. Para hacer esto puedes ver alguna web que este hospedada en ese servidor y hacerle un ping, ¿como?

Si estás en Windows aprieta la tecla Win+R (Ejecutar) y escribe cmd.

En linux o Osx lo puedes hacer desde el terminal o shell.

Se te abrirá una ventanita negra (Consola) y teclea: ping sitioweb

ping bing.com

 

Un buen ping se considera el que está por debajo de 60ms, lo normal son 40ms y si es menos pues fantástico. A esto lo tienes que sumar lo que tarde tu servidor en procesar, cargar y mostrar tu web (Velocidad de carga de una web).

 

Servidor dedicado o compartido

La mayoría de webs y portales de internet están compartiendo servidor, casi todos lo hacen/hacéis por el echo que un servidor dedicado es más caro y te lo tienes que administrar tú. Problemas que te puedes encontrar a la hora de compartir servidor son muchos, entre los que podemos destacar la seguridad del servidor y la penalización por IP.

Que te penalicen a ti por hacer mal alguna cosa tanto en programación como por desconocimiento es malo, ahora, que te penalicen porque tu vecino es un (…) te puede causar muchos problemas. Supongamos que tu vecino tiene una web para adultos y tu una web infantil, y resulta que vuestro servidor os ha otorgado la misma IP. El se dedica ha hacer Spam a través de email y publicidad en webs de poca relevancia por así decirlo, san google lo detecta y hace un banneo por IP. Él desaparece del mapa, ahora tu también.

 

Si tu servidor es compartido con quién lo compartes y si te puede afectar

Para saber quienes son tus vecinos la manera más rápida y eficaz es usar bing, si bing.com, google no te permite ver la IP de las webs.

Lo primero que debes hacer es un ping a tu web como te he mostrado más arriba, apúntate el número que te muestra después de “Respuesta desde …”, abres bing.com y en buscar escribes: IP:y-el-numero-con-puntos-aquí (Ejemplo:  IP:123.123.123.123)

En los resultados verás todas las webs que comparten esa misma IP, mira que todas las que ves sean “legales” y si es así tendrás suerte.

 

Lenguaje de programación

El lenguaje que escojas en si no es muy importante, lo importante es el interprete del mismo, por ejemplo: Digamos que usas php, un lenguaje de fácil comprensión y gratuito, pero si lo ejecutas en un windows con Internet Information Server + Xamp, este para ser ejecutado tardará más que si lo ejecutas en un linux o windows con apache. No es lo mismo un lenguaje como html que un lenguaje como php o asp (los lenguajes de servidor para ser mostrados luego se transforman en html para el navegador). Piensa que la velocidad cada vez es más importante para el posicionamiento y google analiza el tiempo de carga de una web en milisegundos.

 

Metatags de idioma

El metatag languaje es importante para el posicionamiento ya que últimamente google muestra o da preferencia a las búsquedas locales que a las globales. Supongamos que tienes una web muy geolocalizada (Madrid), primaría un meta geolocator que el meta languaje, pero haría una codificación ISO-8859-1 en vez de un UTF-8.

Velocidad de carga de una web

Bienvenidos al siglo XXI donde los móviles, tablets, 3G/4G… se han hecho los dueños de internet. Pensando que tú no esperas ni 5 segundos a que una web cargue, pregúntate ¿Por qué otros esperarán a que cargue la tuya?

Fijaos que flash, flex, java y otros lenguajes han desaparecido del mapa web. Todo lo pesado y de carga lenta a pasado a la historia.

¿Como se mide la velocidad de carga de una web? La velocidad de carga se calcula desde que un usuario ha hecho clic en un enlace o ha escrito tu web en la URL y esta se muestra.

Ping a tu servidor, interpretación del código en el caso que el código sea de servidor (php, asp…) , ping a tu base de datos (en el caso que esté en una IP diferente a la de la web y o haya BD), respuesta de tu BD con todos los datos, importar archivos vinculados (.js, .css, fotos, videos), construir el html y devolverlo al navegador para que tu lo veas y google lo indexe.

Se que hay otros archivos y maneras, pero es un esquema “normal” de una web “normal”.

He pasado por encima el importar archivos vinculados, pero fijaos que casi todos los tutoriales de velocidad de carga de una web solo hacen referencia a este punto. Actualmente google se ha puesto paranoico con los archivos externos de una web y pide en la medida de lo posible que los incrustes dentro del lenguaje html, por ese motivo hemos pasado la mayoría de web de tener el código bien puesto y tabulado a mezclar estilos y javascript con el html. Google intenta que tu no importes archivos, tarda más en cargar un archivo externo, aunque este esté en el mismo servidor, que cargar ese mismo archivo html pesando mucho más. Cuantas menos conexiones haga tu archivo html más rápido se cargará este, y eso señores y señoras es lo que a google le gusta más, por encima de muchas otras cosas ahora google busca velocidad y optimización.

Sitemap Dinamico

Sitemap Dinamico

Como crear un sitemap dinámico, un feed dinámico, un javascript dinámico e incluso un css dinámico, que funcione y que sea aceptado por los navegadores y buscadores es muy fácil.

 

Antes de empezar a aprender como se hace un sitemap dinámico te recomiendes que visites el mejor tutorial/ejemplo en sitemaps que te puedes encontrar en la red http://www.google.es/sitemap.xml.

Fíjate bien, antes de llegar aquí seguro que has visto otros tutoriales incluso el de google que explica como hacer un buen sitemap, pero el tuyo contiene miles de páginas y se añaden diariamente más.

Y claro, poner una a una a mano es casi imposible, pero un sitemap tiene que pesar poco y el de google pesa muy poquito.

¿Donde están las siguientes etiquetas de sitemap en el de google?
<lastmod></lastmod>
<changefreq></changefreq>

Como puedes ver, hasta ellos optimizan en el sitemap, pues tu igual. Solo necesitas el loc y el priority, además fíjate que el priority va en decimales (miles).

Dicho esto vamos ha hacer un sitemap dinámico y con extensión xml para que así todos los bots nos los indexen. (Al 100% no te lo indexarán nunca, y eso no depende de como hagas el sitemap, sino de la diferencia entre el contenido, peso de la página, tiempo de carga, etc…)

  1. Estructura de un sitemap:

    Todo sitemap debe empezar con las siguientes etiquetas:
    <?xml version=”1.0″ encoding=”UTF-8″?>
    <urlset xmlns=”http://www.sitemaps.org/schemas/sitemap/0.9″>
    y ser cerrado con
    </urlset>Entre la apertura del urlset y su cierre debes insertar las etiquetas loc y priority.

  2. Rellenar sitemap:

    Voy a usar una sentencia sql y asp ya que es con el código de programación que mejor me defiendo, pero es una simple consulta a una bds y un bucle while que imprime los resultados.
    Supongamos que tienes un apartado de ficha de clientes con una url parecida a /clientes-5.htm. Pongo htm en vez de asp ya que antes en .htacces habrás modificado la extensión del archivo para que parezca un htm, sino luego explicaré como hacerlo.
    <%set rs=SiteMap_STRING.Execute("Select id_cliente From clientes")
    do while not rs.EOF
    rs.movenext()
    response.write "<url>"
    response.write "<loc>http://www.tuweb/carpeta-si-existiera/clientes-"&rs("id_cliente")&".html"</loc>"
    response.write "<priority>Yo aquí uso una funcion random() para que no todos tengan la misma prioridad, pero también puedes ponerlo en si pagan a 0.800 y si no en 0.500, (No recomiendo que todo esté en 1.000)</priority>"
    response.write "</url>"
    Loop
    rs.close()
    set rs=Nothing%>

    Este archivo se llamará sitemap.asp y así lo subirás a tu servidor.
    ¡No se me ha olvidado! Ya se que dije un xml dinámico y no un sitemap.asp.

  3. Modificar extensión:
    Pues a abrir el .htacces. Si no tienes ninguna Rule creada, infórmate de como se hace en apache (si es tu caso) o en IIS.
    Yo uso el ISAPI REWRITE para mi servidor ya que es Xindows.
    Vamos a ello, ejemplo de un .htacces en IIS:
    # Helicon ISAPI_Rewrite configuration file
    # Version 3.1.0.50
    RewriteEngine on
    RewriteRule ^rss.xml? rss.asp [NC,LP,QSA]
    RewriteRule ^sitemap.xml? sitemap.asp [NC,LP,QSA] <-- Esta es la línea que os interesa
    RewriteRule ^javascript.js? javascript.asp [NC,LP,QSA]
    RewriteRule ^(estilos-i([^/]*).css? estilos.asp?id=$1 [NC,LP,QSA]
    RewriteRule ^estilos.css? estilos.asp [NC,LP,QSA]

He puesto otras líneas para que veáis diferentes ejemplos y así crear archivos en asp o php que se ahorren la cache y poder ponerlos en un subdominio sin el maldito cookieless.
Ahora accede a www.tuweb.com/sitemap.xml y verás que todo está bien.

Si te da algún error de parse, piensa que es codificación UTF-8 y que ni acentos ni ñ ni simbolitos se aceptan.
Piénsalo antes de crear una url que no será bien recibida por los bots.

Salu2.

Optimizar Web para Buscadores

Optimizar Web para Buscadores

Actualmente existe una herramienta llamada Page Speed que os puede ayudar mucho en este trabajo, pero antes de llevar un Ferrari debes aprender a conducir.


Espero, en un futuro breve, poder tener tiempo de hacer un buen tutorial de Page Speed, pero ahora creo que los más importante es olvidarse de todo lo que uno sabe de técnicas de posicionamiento y trucos, y empezar bién un proyecto / sobre todo simplificarlo.

Pequeño tutorial de como optimizar webs para buscadores

  1. Meta Tags:Como todos bién sabéis los 2 metas más conocidos son el description y el keywords. Todo el mundo le da el 80% del trabajo de diseñar una web a encontrar que narices poner en la descripción y que palabras clave usar en los metas.
    Pues señores, les informo que estamos en el 2010 y Google, MSN y Yahoo, están hasta las narices del mal uso que se le han dado a estas etiquetas y literalmente pasan de ellas.
    ¡Uy! Es verdad que las usan para el Snippet.
    “Snippet texto descriptivo que acompaña al titulo y la url en los resultados de un buscador”

    ¿Has visto alguna vez una página en google que no tenga descripción?
    ¿Lo que pones en la meta descripción es lo que enseña google?
    Si en las 2 preguntas respondes que si, te ha tocao una chochona, ya que actualmente los buscadores indexan todo el contenido de las páginas y de ese contenido extraen las partes más relevantes y las keywords las extran de la densidad de palabras exceptuando (de, para, el, la) enfin artículos y preposiciones.

  2. El título.La etiqueta Title debe contener máximo 66 caracteres, de los cuales no puede haber repetida la palabra clave más de 2 veces. ¿Por qué 66 caracteres? Por que quién manda es google y es el que almacena menos caracteres de los 3 buscadores más importantes.
    Nunca se debe dejar una página sin título. Aunque sea una página secundaria, de pruebas, o que la hiciste por tu sabrás que. Si hay un link, se indexa y hace mucho daño una web mal hecha.
  3. Como estructurar una web.Coge papel, lápiz y goma de borrar (nuevas tecnologías). Hazte un croquis de como irá la web y piensa… ¿Que directorios tendrá la web?
    Muchos al consultar en google os habéis encontrado que debajo de la descripción, aparecen los directorios más relevantes de la web. A Google de momento no le puedes indicar que directorios son importates para ti, pero puedes bloquear los que no quieres que salgan a través de las herramientas de webmaster de google.
    ¿Como escoge google los directorios?

    1.- Subdominios
    2.- Primer menú que aparece en el código fuente. (Eso no significa que sea el primer menú de la página. Ahora me explico.)
    3.- Links repetidos durante todo el site.

    Respuesta 1: Para que google no te tome un Subdominio como directorio y te acabe apareciendo: Artículos España, Artículos Portugal, Artículos Estados Unidos en vez de Sofas – Muebles Cocina – Muebles Baño, lo único que debes hacer es ponerle un NOFOLLOW en el link y crearte sitempas individuales por cada subdominio. Así Google pasará al siguiente punto (2).
    Respuesta 2: Muchas veces encuentras resultados de ( Usuarios registrados – Accede a tu panel – Salir ), esto es lo primero que ve google al visitar muchas webs y lo acaba cogiendo como menú principal. Para evitar esto, pon los menús inútiles al final del código fuente y con css lo posicionas en absoluto (position:absolute; Top:15px;). Además los que vayan a paneles de control, a añadir usuario, etc… ¡pon un NOFOLLOW!
    Respuesta 3: Esta es jodida de arreglar, ejemplo: (Home – Volver – Cerrar sesión), Modifica los home por una palabra clave, volver y cerrar sesion en nofollow, pero no siempre te interesa, a eso viene el siguiente punto 4.

  4. Etiquetas.

    Toda web bién estructurada debería tener almenos:
    1 etiqueta h1 o h2.
    1 o 2 etiquetas h2 o h3.
    Usar las etiquetas strong y em para las palabras clave.

  5. Código Fuente o código de la web.

    Ahora es cuando me tiráis la caballería por encima. (Eso si alguien lee mi web, de momento yo y…. yo)

    1.- La primera línea de código que debe haber en tu web ha de ser:
    <!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.1//EN” “http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd”>
    (Estamos en el 2010, si lo lees en el 2020 no critiques y busca los nuevos Doctype, eso si aun existe internet)
    Estamos hablando de hacer bién una web, no de hacerla sencilla, práctica y rápida. Para eso tienes Flash o Flex que quedan más chulas y modernas.
    El Doctype XHTML 1.1 actualmente es el más nuevo, compatible con todo lo que existe referente a ordenadores sobremesa, portatiles, móviles, iphones, ipads, ipods, y todos los ip que existen.
    Este Doctype es díficil de usar, pero si lo que estás haciendo es una nueva web, úsalo desde un principio, sino te tocará cambiar todo el código fuente en menos de 2 años. (Y eso jode mucho).

    2.- ¡Tengo una página que he hecho y tiene más de mil lineas de código fuente!
    – ¿Y la has publicado?
    – Si claro.
    – Pues la has cagado.

    Visita Google.com .es .jp .china o como sea. Google solo tiene una línea de código fuente. Pues tu ha hacer lo mismo.
    – ¿Es que trabajo con templates en Dreamweaver y quedan espacios?
    – Pues te creas una nueva carpeta fuera del site y le llamas site 2. Abres una página del site 1 en dreamweaver y les das a Modify/Templates/Export without Markup… Una vez lo hagas, te pedirá que indiques una carpeta y ¡OJO! Le indicas la de Site 2.
    Esto lo que hace es crearte una cópia de tu site enterito sin las molestas etiquetas de <!– instance, coges todos los archivos y los publicas en tu web, pero antes le das a Control + F o COMMAND + F y remplazas todos los intros por espacio y todos los dobles espacios por espacio simple. Y a publicar en la web.
    Se me olvidaba, debes trabajar siempre en site 1 y publicar en site 2. Simpre debes clicar en Export Without Markup…, jode pero es lo que hay.

    3.- Javascript. El javascript debe estar en un archivo aparte y al final de la página, antes del </body>
    Ejemplo:
    <script type=”text/javascript” src=”http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/jquery-ui.min.js”></script></body>
    En el archivo en javascript, todas las funciones deben estar bién cerradas, todas las líneas que no sean función acabadas en punto y coma (;), y todo en una sola línea.

    4.- CSS. El css también debe estar en un archivo aparte. Si usas asp o php continúa leyendo, sino pasa al punto 6.
    Hay un truco en asp (supongo que en php también) para evitar el error de caché del css en page Speed.
    Creas un archivo estilos.asp, copias todo tu css dentro y en la primera línea pones:
    <%Response.Expires = 5184000
    Response.ContentType=”text/css”%>
    Además haciéndolo dinámico lo puedes fraccionar dentro del mismo archivo, con variables querystring informar de que mostrar y con .htacces arreglar el .asp?var=XXX en estilosXXX.css.
    ¿Qué? ¿Comorrrrr? Esto es Redkram (o sea yo), de cosecha propia y si alguien lo copia sin poner la fuente que le jodan por la oreja.
    .htacces en php lo puedes modificar directamente ya que apache te lo permite. En asp necesitas un programa llamado ISAPI REWRITE.

  6. Olvídate de Flash, Flex y cualquier aplicación que necesite un pluguin para ejecutarse.
  7. Las imágenes.

    Tan o más importantes que las keywords.
    Si hos fijais algún día en las fuentes de entradas de google analytics os encontraréis alguna que ponga google/images. Eso significa que te han entrado a través de una fotografía bién posicionada. Si tu foto se llama muebles-baño.jpg, en alt le has puesto muebles de baño, está en el tamaño correcto con el que la enseñas y encima pesa poco, puede ser que como muebles de baño en la búsqueda convencional ni aparezcas o aparezcas en la página 6 pero en cambio seas el primero en google/images.
    Para hacer buén uso de las fotos debes ponerles un nombre, nada de IMG0001.jpg (cúrratelo un poco), no las guardes en JPG, en photoshop las tienes que exportar a JPG no guardarlas en JPG (es diferente, pesan menos y dan buena calidad), google te lo agradecerá.

  8. URL y nombre de archivos.

    Si has comprado un mal nombre de dominio lo tienes chungo, pero ¿que significa google?. Todo es posible.
    No uses guiones bajos en los nombres de archivo _ usa el guión medio –
    No dejes espacios en blanco.
    No uses acentos ni en archivos ni en imágenes.
    Pon todo en minúsculas.
    Y que una palabra clave este en el nombre del archivo. Ejemplo: www.chopinpon.com/muebles-de-bano.htm (no pongas ñ)

  9. Palabras clave.

    Antes de romperte la cabeza piensa que tu eres seguramente un profesional de tu sector y sabes como se llama todo, pero yo soy un cateto que me quiero comprar un maldito mueble de baño y no tengo porque saber lo que es el maldito silestone ( Imitación marmol ).
    Visita las webs dela competencia usando google (no directamente) y mira como están posicionadas, hazte una tabla en excel y apunta palabra o palabras clave y posición. Entra en su código fuente y averigua sus palabras clave, sus h1, sus strong y todo lo que ellos le den importancia. Con 2 o 3 webs bastará, y solo un par de páginas por web.
    Luego coges a un menor de 20 años y le dices que busque en google. Mostrándole una foto de lo que quieres. No le digas silestone ni marmol falso y sorpréndete de lo diferentes que somos todos.
    Cuando salgas de tu asombro te vas a visitar http://www.google.es/trends y pones 5 palabras clave, o frases o sinónimos y miras cuantas veces se a buscado en google esa información. Hazlo con muchas palabras clave y sinónimos.
    La nueva versión de google trends la encontraréis en www.google.com/insights/search/ , pero aún no funcionan todas las aplicaciones en españa.

  10. Div o table.

    Por supuesto div. Una tabla tarda 3 veces más que un div en ser mostrado, primero se mira la estructura, luego la composición y finalmente el contenido. Esto no te interesa si quieres optimizar al máximo una web.

  11. Busca otros manuales de Optimización web.