Sortea2 Blog

  • Cómo se hizo el posicionamiento en buscadores en Sortea2

    Una de las cosas más importantes en la creación de una web es la parte del posicionamiento en buscadores, no en vano, al menos el 80% de las visitas serán procedentes de Google y el número de visitas dependerá de dónde nos encontremos en los resultados de las búsquedas.

    Conseguir los primeros resultados atrae muchas visitas

    En este artículo trataré de explicaros las técnicas que hemos utilizado para tratar de facilitarle el trabajo a Google:

    Estructura

    Crea un código simple y legible
    No es para nada recomendable el uso de multitud de tablas anidadas unas en otras ni la utilización de marcos o cosas por el estilo. Evita siempre complicar las cosas e intenta que todo el código esté bien estructurado.

    Relaciona unas páginas con otras
    Trata de enlazar páginas relacionadas entre sí, porque eso es algo favorable de cara a Google. Intenta crear secciones tales como «Temas relacionados» dentro de una página o cosas por el estilo.

    Enlaza a fuentes que amplien información
    Siempre que sea posible, enlaza a fuentes originales o a páginas que aclaren un determinado tema. Un ejemplo corriente puede ser el enlazar a algún artículo de la wikipedia que explique algún término que utilicemos.

    Uso correcto de etiquetas HTML

    Usa la etiqueta apropiada en el lugar apropiado
    Un ejemplo habitual puede ser el uso de las etiquetas strong en vez de b y las etiquetas em en vez de i. Estas etiquetas cumplen una de las funciones iniciales del HTML: ser descriptivas, mientras que cualquier elemento de una web puede estar en negrita (gracias a CSS), es necesario que se pueda especificar explícitamente que esa zona está resaltada por algo, no que están en negrita por ser una especie de encabezado ni nada. En resumen, intentar usar todas las etiquetas html posibles, cada una en su sitio; si hay que usar un h3 en vez de un span, mejor que mejor.

    Usar tablas lo menos posible
    Las tablas son un lío para Google, usarlas solamente en el caso de que sean imprescindibles.

    Contenido

    Haz a las imágenes descriptivas
    Las imágenes son muy buenas para el posicionamiento, pero si están bien usadas. Hay que tratar de ponerles un nombre descriptivo al archivo, incluirle un atributo alt y escribirles algo en el atributo title. Hay que tener en cuenta que el Googlebot tan solo podrá leer los textos y las etiquetas, no lo que ponga en la imagen.

    Añade etiquetas meta
    Una de las mejores maneras de posicionar la web es añadiendole meta-tags descriptivas. Estas etiquetas se añaden dentro del head y las hay de dos tipos:

    Etiqueta descripción:

    <meta name='description' content='Sortea2, la herramienta para sortear. Realice sorteos entre todos los participantes que desee, puede guardarlos, programarlos, comentar los sorteos, votarlos y mucho más.'/>

    Hay que escribir una descripción buena. Ojo con repetir mucho alguna palabra que eso no le gusta nada a Google.

    Etiqueta tags:

    <meta name='keywords' content='viaje,Estados Unidos,star wars,nocilla,marzo 2009, sorteos, sortear, to raffle, rifas, raffles, lotería, programar, participantes'/>

    Aquí debes escribir algunas palabras que estén relacionadas con una página en particular o de toda la página. Si la web es dinámica (como Sortea2), es altamente recomendable crear etiquetas variables. Por ejemplo, en las páginas de sorteos, una parte de las keywords de esta etiqueta meta son las propias tags del sorteo.

    Crea contenido propio
    Hay que tener en cuenta que si copias y pegas texto de otras webs, evidentemente la web que creó ese contenido antes es la que va a estar delante en las búsquedas, así que es mejor ni intentarlo. Hay que crear contenido escrito por uno mismo, y en caso de tener que copiar un fragmento de texto, indicar la fuente original.

    Consideraciones de compatibilidad

    Tratar de pasar el W3C Validator
    Una medida genial para posicionarse es hacer una web accesible a todos los navegadores. En Sortea2 ya escribimos un artículo sobre como pasar el W3C Validator.

    Conseguir links externos

    Conseguir links externos mejora el pagerank
    El pagerank es una de las medidas que utiliza Google para determinar los resultados. Este número depende del número de links que tenga nuestra página de otras páginas.

    Esta parte es la que más ayuda en el posicionamiento en buscadores, pero también es la que menos depende de uno mismo. Podemos tratar de colocar algunos links a nuestras páginas en algunos sitios, aunque en esta parte lo único que se debería hacer es crear contenido de calidad que haga que la gente te enlace por sí misma.

    El principal rival que tenemos en este tema es el no follow dentro del atributo rel de los links. Esto lo que hace es decirle a los buscadores que ese link no lo tengan en cuenta a la hora de valorar esa web enlazada. Se suele utilizar en los comentarios de los blogs para que la gente no haga spam.

  • Pasar el W3C Validator

    El servicio w3c validator tiene la utilidad de testear una web para encontrar las partes en las que esta puede ser incompatible con los estándares, las partes con errores y los posibles conflictos que se pueden dar.

    El W3C validator sirve para validar el código HTML

    Este servicio puede validar HTML indicando la URL de la web, subiendo un archivo .html o escribiendo el HTML directamente.

    Pasar correctamente estas validaciones y por consiguiente conseguir el logo de «W3C validator» es bastante complicado, sobre todo en el caso de intentar pasar este test una vez finalizada la parte de desarrollo en la página web; a nosotros nos sucedió ese problema: tratamos de solucionar la mayor parte de problemas de compatibilidad posibles, pero no fue posible en todos los casos.

    A priori puede parecer que, mientras la página funcione y se vea más o menos bien en la mayoría de los navegadores, es suficiente; pero no deberíamos conformarnos con esto porque el principal motivo para esforzarse en este tema es que Google indexa mejor páginas que sean W3C compatible, esto es debido a que para el robot de Google le es más fácil leer nuestra web, por lo que obtendríamos mejores resultados en las búsquedas de Google.

    A continuación voy a detallarle las cosas que suelen dar errores y que hay que tratar de evitar porque dan problemas con el validador de W3C:

    Dejarse etiquetas sin cerrar:
    Esto puede parecer obvio, pero no lo es tanto. A veces se nos puede olvidar cerrar un div, es normal, y este validador nos lo indicará.
    Pero hay casos en los que hay que cerrar las etiquetas aunque no haga falta, por ejemplo, en el caso de utilizar XHTML, las etiquetas img deben terminar con />, las etiquetas meta , link, input, etc. necesitan ser cerradas de manera explícita.
    Otro caso es el de las etiquetas que aparentemente no es necesario cerrar, sino que el navegador sobreentiende que ya han finalizado. Este es el caso, por ejemplo de las etiquetas <option> y <li> no son imprescindibles de cerrar, porque cuando empieza la siguiente etiqueta de este tipo ya se sobreentiende que se han cerrado. Esta práctica no cumple con los estándares, por lo que deberíamos evitarla.

    Uso excesivo de tablas
    Este es un problema dificil de diagnosticar, puesto que el validador nos mostrará un montón de errores cuando una página tiene muchas tablas. Para que las tablas sean compatibles, tienen que estar compuestas de la siguiente manera: <table><tbody><tr><td>, en caso de que el tbody se nos olvide o algo, ya nos dará error.
    El consejo sería evitar el uso de las tablas, aunque, como a veces es inevitable, se pueden o bien ignorar los errores, o tratar de usar todas las etiquetas necesarias.

    Elementos que están donde no deben
    Este problema es típico cuando se define unos estilos dentro del body o cuando se tratan de usar etiquetas meta dentro del body. También da error en caso de introducir una etiqueta que dibuje algo en la pantalla dentro del head.
    Estos errores son habitualmente fáciles de solucionar, aunque hay veces que hay problemas inevitables. Se trata de situar cada elemento en su sitio y ya está; si nos es imprescindible que un elemento esté fuera del sitio, tampoco nos tenemos que obsesionar.

    Atributos que una etiqueta no tiene
    Este tipo de errores se suele dar en páginas en las que se aplica Javascript, como nos es necesario acceder a los elementos de la página a través de atributos id, name, class, etc., a veces podemos tener el caso de que nos hagan falta más atributos o algo así.
    Un caso puede ser tener un elemento <td> en el que hemos aplicado un atributo id para ponerle estilo CSS, si este id se repite (más adelante veremos que esto también da problemas), entonces tenemos que tener otro atributo que se refiera a este elemento td. Una posible solución es usar un atributo name, esta práctica no es muy recomendable, puesto que da errores de compatibilidad; siempre hay que tratar de usar un atributo id y que sea único.
    El atributo name se debería utilizar solo para formularios y para anclas.

    Problemas con IDs
    Un ID es un identificador único, por lo tanto, se debe utilizar tan solo para una etiqueta hml. En caso de usarlo para aplicar un estilo CSS, se debe tener en cuenta que si ese estilo solo se va a usar en una etiqueta de la misma página, entonces si se puede usar un ID; en caso de tener que reutilizar el mismo estilo varias veces en el mismo documento, entonces hay que usar una class.
    Los IDs no pueden empezar por un número sino que deben empezar por una letra o un guión bajo o similar. Esto puede suponer un problema cuando, para aplicar Javascript nos es necesario aplicar un ID a un elemento que sea su número identificador; por ejemplo, en la pantalla de lista de sorteos cada sorteo tiene en el botón de borrar sorteo asignado un id que es el número de sorteo. En nuestro caso nos es imprescindible, puesto que así se facilitan mucho las operaciones internas; podríamos haber evitado esta práctica, aunque no lo hemos visto necesario.
    En resumen, que se evite empezar por un número, aunque tampoco tiene que ser algo que complique mucho la programación interna en Javascript o PHP.

    Resumen
    Concluyendo, hay que tratar de pasar el W3C validator aunque tampoco debe ser una obsesión que haga que pongamos todos nuestros recursos en pasar con éxito. Es más importante saber como evitar los errores que saber cómo arreglarlos; esto es debido a que a veces es tan avanzada la programación interna, que es muy complicado modificarla a posteriori para que se tomen en cuenta los cambios.

    En sortea2 hemos tratado de pasar el W3C validator, aunque en la mayoría de las páginas no nos ha sido posible. Lo importante es saber qué técnicas evitar a la hora de programar y es por eso por lo que os escribo este artículo.

    ¿crees que faltan errores de compatibilidad comunes? comunícanoslo a través de los comentarios.

  • Sorteos con notario

    Desde Sortea2 siempre tratamos de publicitar sorteos fiables. Ni estafas para ganar dinero por envíos de SMS, ni sorteos que quizás nunca se celebren. Principalmente mostramos sorteos que se realicen ante notario o sorteos modestos desde páginas web con premios pequeños.

    Mucha gente cree que porque un sorteo se celebre ante notario ya todo es perfecto. Y desde luego, no es así. El notario lo único que verifica, que no es poco, es que se cumplan las bases del sorteo.

    Pero al margen de las bases, la misión de que el reparto de los premios se realice de forma aleatoria, es algo que suele escapar a la labor de los notarios. E incluso a veces cometen errores en el sistema de sorteo. No errores malintencionados, sino simplemente despistes que convierten al sorteo en no aleatorio.

    Hace poco por ejemplo, ojeando las bases de uno de los sorteos, en que se sorteaban diez premios, mostraban el sistema de elección:

    Se hace una lista con todos los participantes, digamos 555, por orden de inscripción. Se quitan nueve (546) y de entre todos estos se elige un número al azar. Ese número será el ganador del primer premio. El siguiente, del segundo premio y así sucesivamente.

    Este sistema, que insisto era el de un sorteo ante notario (que no linko para evitar problemas) carece de toda aleatoriedad. Sin hacer muchas cuentas, es imposible que el número 555, la última persona que se apuntó al sorteo, pueda ganar el primer premio. A lo sumo saldrá el último número (546) y entonces esta persona se llevará el décimo premio.

    También las probabilidades de salir premiado de los diez primeros números están mermadas. El 10 tiene 10 posibilidades de salir premiado (que salgan en ese sorteo tanto el 1 – quedando 10º – como el 2,3,4,5…10) mientras que el número 1 sólo tiene una posibilidad de salir ganador (eso sí, con el primer premio).

    Este es un ejemplo cualquiera, pero hay muchos más. En general con premios complicados se suelen realizar simplificaciones para hacer el sorteo fácil para el sorteador, pero que en realidad limitan las posibilidades de algunos participantes.

    Otra cosa que no controlan los notarios, porque no es su trabajo, es que el sorteo sea justo. Es decir, si se sortea un coche y basta con apuntarse en una página para concursar, es un sorteo justo. Pero cuando hay que comprar papeletas y el monto total de esas papeletas es mayor que el precio del premio, estamos hablando de un negocio encubierto. Como este club de fútbol que sortea un Seat Ibiza: 99.999 papeletas a 3 euros cada una. Da para comprar varios Seat Ibiza ¡Y algún Mercedes!

    Por eso os recomendamos siempre que no fomentéis los negocios encubiertos. En un sorteo el que tiene que ganar es el concursante, no el que lo organiza.

  • Evitar problemas cuando Javascript no está habilitado en el navegador

    Cuando una página de nuestra web necesita obligatoriamente tener javascript habilitado en el navegador para poder mostrarse correctamente, pero no queremos que los usuarios que no lo tengan habilitado accedan automáticamente a otra página para que pueda llevar a cabo la tarea que quería utilizar, tenemos que idear un método que detecte si javascript está habilitado y, en caso negativo, redireccionar a otra página.

    Este problema lo tuvimos en la pantalla de sorteos simples, queríamos que los usuarios sin javascript pudieran explotar todas las posibilidades de nuestro sistema para sortear. Para ello, creamos una página alternativa a esta, la de sorteos simples sin javascript. Como vemos, visualmente es practicamente idéntica, pero a la hora de darle al botón de ¡sortear! el resultado necesita que la página se actualice.

    Bien, ya teníamos las dos páginas, pero ¿cómo hacer que la gente que no tenga javascript sepa facilmente que hay otra página que hace exactamente lo mismo y que sí le funciona?. La solución que pensamos que era la más fácil era usando la clásica etiqueta de <noscript></noscript>. Esta etiqueta lo que hace es ejecutar lo que haya dentro en el caso de no tener javascript. Entonces lo que había que hacer era que lo que hubiera dentro fuera una instrucción que redireccionara la página a otra.

    La instrucción es una etiqueta meta, la siguiente:

    <NOSCRIPT>
    <META HTTP-EQUIV=’Refresh’ CONTENT=’0;URL=$parametro’>
    </NOSCRIPT>

    Más tarde veremos por qué en el atributo URL ponemos una variable de javascript, pero si unicamente necesitas redireccionar una página, puedes poner directamente la página a la que quieres que se redireccione.

    Con este código ya podría funcionar todo correctamente, aunque nosotros tuvimos que ir más allá, porque hicimos una función que, entre otras cosas, miraba que página quería ser redireccionada y la redireccionaba donde debía.

    Un fragmento de la función sería este:

    $paginanojs = array(1 => “sorteos-simples”, 2 => “sorteos”, 3 => “registro”, 4 => “login”);

    for ($i = 1 ; $i <= count($paginanojs) ; $i++)
    {
    if ($noscript == $paginanojs[$i])
    {
    if ($noscript == "sorteos-simples")
    $parametro = "../sorteosnoscript";
    elseif ($noscript == "sorteos")
    $parametro = "../nojs?pag=sorteos_av";
    else
    $parametro = "../nojs?pag=".$paginanojs[$i];

    echo"<NOSCRIPT>".
    "<META HTTP-EQUIV=’Refresh’ CONTENT=’0;URL=$parametro’>".
    "</NOSCRIPT>;

    $noscript = 0;
    break;
    }
    }

    A esta función se la llama con el parámetro $noscript, y ya hace lo que predeterminadamente hemos programado.

    En nuestro caso, necesitábamos que las páginas de registro, de login y de sorteos avanzados fueran a una página auxiliar, porque no habíamos creado ninguna página que hiciera su misma función pero sin javascript, en estas páginas lo que se hace es informar al usuario de que no puede utilizar esas funciones. Puede que en el futuro habilitemos estas páginas para este tipo de usuarios.

  • Organizar un amigo invisible tan solo con enviar un correo-electrónico

    Hemos creado un sistema totalmente nuevo en Internet por el cual se pueden organizar Amigos Invisibles tan solo enviando un e-mail. Cuando Sortea2 reciba el correo, lo procesará, realizará el sorteo y se encargará de comunicarle a cada participante a quien debe regalarle algo.

    Para organizar un amigo invisible es necesario únicamente enviar un e-mail a esta dirección: amigoinvisible@sortea2.com y a cada participante del juego. En cuanto recibamos el correo, inmediatamente se le enviará al organizador un mensaje para que confirme la lista de participantes.

    Con la lista de participantes confirmada, ya se procede a realizar el sorteo. El sistema envía a cada uno de los participantes un mensaje en el que se comunica a quien debe regalar algo.

    Se recomienda leer las instrucciones detalladas para organizar el amigo invisible evitando así que se cometa algún error.

    Ya no será necesario el engorroso paso de realizar el sorteo para el amigo invisible

    Creemos que esta es la forma más sencilla posible para hacer este tipo de juegos desde Internet. No hace falta ningún tipo de conocimientos de informática para organizarlos, tan solo es necesario conocer el correo electrónico de cada participante, algo habitual cuando el sorteo de amigo invisible se suele realizar entre amigos o compañeros de trabajo.

    Hay otros sistemas en la red, bastante buenos todo sea dicho. Pero resulta un poco molesto rellenar toda la información que piden: a veces hay que empezar registrándose. Luego hay que rellenar un formulario que para casos pequeños es sencillo pero en un juego relativamente masivo es misión imposible. Además, rellenar un formulario es una continua fuente de errores. Con un correo electrónico, mediante nuestro sistema, un error en una dirección va a cantar rápidamente: recibiremos un aviso de correo de dirección no válida del destinatario equivocado.

    Enviar un correo. Recibir un correo. Pulsar en un link dentro de ese correo. Eso es todo lo que hace falta para realizar un juego de amigo invisible por correo. Y por supuesto, sin ningún tipo de uso fraudulento del correo electrónico. Conforme vayamos recibiendo solicitudes, iremos borrando las antiguas. Para nosotros es más fácil obtener un beneficio ofreciendo un buen servicio. Queremos que repitáis. Queremos que volváis.

    También hemos diseñado un apartado en el que se pueden recuperar fácilmente los Amigos Invisibles. Esta sección es útil para por ejemplo, el caso de que algún participante no haya recibido su mensaje. Para poder recuperar un amigo invisible hay que conocer la palabra clave privada y el e-mail del organizador.

    Ya podeis empezar a organizar los amigos invisibles con Sortea2 y comprobareis que es incluso más fácil que hacer el sorteo con las papeletas.

    Si creéis que se podría mejorar en algo nuestro sistema o si habéis encontrado alguna deficiencia, por favor, hacédnoslo saber a través del formulario de envio de errores o escribiendo algún comentario en esta entrada del blog.

    Y si lo que estáis buscando son ideas de regalos para el amigo invisible recordaros que ya escribimos bastante sobre el tema en una entrada anterior.