Archive for July, 2008

SEO-friendly URLs con Seam II

Vamos a ampliar la información del post anterior con conceptos más avanzados.
Partimos de la base de que tenemos configurado y funcionando el módulo UrlRewrite.

El primer problema con el que me topé es que mi aplicación usaba identificadores numéricos, tipo .../product.seam?idProduct=123. Por lo tanto necesitaba traducir el identificador numerico a una palabra descriptiva del producto, como .../product/silla o .../product/mesa.

Afortunadamente con Seam eso no presenta mucha dificultad y puede emplearse una EL Expression tipo #{rewriter.fromNameToId('silla')}.
Por desgracia, en el archivo urlrewrite.xml no pueden incluirse EL Expressions.

Para solucionarlo, creé una 'página virtual' en el pages.xml que recogía los parámetros como String de la url y mediante una llamada a un componente de Seam los traducía en el correspondiente identificador numérico, aprovechando que en el archivo pages.xml sí que se pueden usar EL Expressions.

  • Fichero urlrewrite.xml
    1. <urlrewrite>
    2.    <rule>
    3.      <from>^/pruduct/([A-Za-z]*)$</from>
    4.      <to last="true">/virtual_product.seam?name=$1</to>
    5.    </rule>
    6.  </urlrewrite>

  • Fichero pages.xml
    1. .....
    2. <page view-id="/virtual_product.xhtml" action="#{product.init}">
    3.     <param name="name"/>
    4.     <navigation>
    5.         <redirect view-id="/product.seam">   
    6.             <param name="idProduct" value="#{urlRewriter.idProductFromName(name)}"/>
    7.         </redirect>
    8.     </navigation>
    9. </page>
    10. .....

  • Componente rewrite
    1. public int idProductFromName(String name) {
    2.     // Consulta en la bbdd para halar
    3.     // el id del producto a partir del nombre
    4. }

Leave a Comment

SEO-friendly URLs con Seam

Hoy en día están muy de moda las aplicaciones web y blogs con URLs amigables, tipo http://seamcity.madeinxpain.com/archives/category/seam.

Estas URLs además de ser más intuitivas y agradables a la vista, también son más agradables para buscadores de internet como google (o podríamos decir más agradables para EL BUSCADOR de internet).Esta es una de las técnicas seo más simples, destinadas a mejorar tu posicionamiento en buscadores.

En Seam podemos obtener estas URLs sencillas a través del filtro URLrewrite. Este filtro básicamente se encarga de traducir URLs, y es muy muy fácil de usar.
Una de las principales ventajas es que es una capa independiente que se coloca por encima de la aplicación. No es necesario modificar ni una línea de código ya existente, simplemente definir cómo se van a traducir las direcciones.

  1. Añadir el archivo urlrewrite.jar que viene incluido en la distribución de Seam en la carpeta WEB-INF/lib del proyecto. La mejor forma de hacerlo es mediante el archivo de ant que crea el seam-gen
  2. Configurar el filtro UrlRewrite en el web.xml tal y como se indica aqui
  3. Crear el fichero urlrewrite.xml que contiene las reglas de traduccion de urls en la carpeta WEB-INF. Aqui pongo el fichero del ejemplo seambay, pero lo mejor es mirar la documentacion oficial
    1. <!DOCTYPE urlrewrite
    2.     PUBLIC "-//tuckey.org//DTD UrlRewrite 3.0//EN"
    3.     "http://tuckey.org/res/dtds/urlrewrite3.0.dtd">
    4.  
    5. <urlrewrite>
    6.  
    7.    <rule>
    8.      <from>^/feedback/([A-Za-z0-9]*)$</from>
    9.      <to last="true">/feedback.seam?member=$1</to>
    10.    </rule>
    11.    
    12.    <rule>
    13.      <from>^/itemdetail/([0-9]*)$</from>
    14.      <to last="true">/auction.seam?id=$1</to>
    15.    </rule>
    16.    
    17.    <rule>
    18.      <from>^/bidhistory/([0-9]*)$</from>
    19.      <to last="true">/bidhistory.seam?id=$1</to>
    20.    </rule>
    21.  
    22. </urlrewrite>

En otro post esplicaré con más detalle las posibilidades del fichero urlrewrite.xml, cómo usar parámetros, cómo traducir de nombres a identificadores numéricos, y cómo conseguir que las urls amigables las pueda generar nuestra aplicación tras el envío de formularios o acciones.

Leave a Comment

Marcas de Google Maps con menu contextual

En un post anterior hablaba de como añadir un tooltip personalizado a nuestras marcas de google maps, que permitia mostrar cualquier objeto DOM como si fuese un tooltip de la marca.

Siguiendo la misma idea, podemos hacer un menu contextual para las marcas, que se active al hacer click sobre ellas, y contenga acciones a ejecutar sobre la marca en cuestion.

Para ello seguiremos los siguientes pasos:

  1. Crear el menu y sus acciones
  2. Asignar el menu a la marca, y una referencia de la marca al menu para poder ejecutar acciones sobre ella
  3. Mostrar el menu con el evento onclick y ocultarlo al seleccionar una opción

ver ejemplo

Leave a Comment