html

El archivo htaccess y las rutas relativas

por

Hoy en día, la necesidad de optimizar nuestras páginas para los buscadores hace que sea casi obligatorio programar nuestros sitios web de forma que se pueda acceder a ellos mediante URLS amigables. ¿Y que es eso de las URL amigables? Pues bien, para explicarlo vamos a poner dos ejemplos de URLs, una normal y otra amigable:

http://www.tusitio.com/index.php?seccion=libros&articulo=10

http://www.tusitio.com/libros/10/

En los dos ejemplos de URLs anteriores, el navegador nos debería redirigir a la misma página, pero sin duda es mucho más clara la segunda URL que la primera. Esta segunda URL es la que se llama amigable y es la que los buscadores prefieren, de ahí su importancia.

¿Pues bien, como conseguimos esto en nuestro sitio web? Para ello, el método más utilizado es mediante el archivo .htaccess el cual nos permite establecer las RewriteRule, que no son sino reglas que convertirían una URL amigable en una URL interna y que es la que nosotros manejaremos en nuestra programación. Esta práctica esta muy extendida hoy en día, pero conviene tener en cuenta un detalle y es por el cual escribimos esta entrada.

Y es que al realizar esta reescritura de URL, estamos haciendo que el servidor interprete cual es la página que debe mostrar, pero hay un pequeño «handicap» y no es otro que el concerniente a las URLs relativas. Si en la programación haces uso de URLs relativas te encontrarás con que los contenidos de dichos elementos no se muestran correctamente. Y es que la reescritura se hace en el interprete a nivel de servidor, pero la parte de las URLs se interpreta en el navegador, por lo que no coinciden. Así si por ejemplo en el caso anterior tenemos en el directorio raiz además del archivo index.php una carpeta imagenes donde tenemos un archivo para mostrar, si usamos una URL relativa de la siguiente forma <img src=»imagenes/10.jpg»> cuando accedemos a la web mediante la URL amigable, nos encontraremos con que dentro del supuesto directorio «libros» deberíamos encontrar otro llamado «10» y dentro de este otro llamado «imagenes» que no existe. Por lo que la imagen no se mostraría correctamente. Para ello tenemos dos soluciones:

  • Usar una URL absoluta, en nuestro caso incluiríamos un código como este <img src=»http://www.tusitio.com/imagenes/10.jpg»>
  • Utilizar el elemento HTML BASE dentro de la cabecera de nuestra página, para definir la URL báse de todo el documento y luego podríamos usar urls relativas. La forma de usar este elemento HTML sería algo así: <BASE href=»http://www.tusitio.com»>

Liffect, añadir transiciones a una lista de imágenes con jQuery

por

Liffect es una interesante forma de añadir transiciones mediante jQuery a nuestra página web de una forma realmente sencilla. Simplemente tenemos que acceder a la web y tras seleccionar las correspondientes opciones (como son el tipo de efecto, la duración de este, el retraso y si queremos que se muestren las imágenes en orden aleatorio o no) solo tenemos que darle al botón para generar el código HTML necesario que luego procederemos a copiar y pegar en nuestro proyecto web.

Validar el código de tu web de forma rápida y sencilla

por

Para aquellos desarrolladores que quieran verificar el código de las páginas de su sitio web de una forma rápida y sencilla, simplytestable.com se convertirá sin lugar a dudas en un aliado indispensable. Con este servicio, tras insertar la url de nuestro sitio web,  no hará un test de validación del HTML siguiendo los estándares del W3c y devolviendo el correspondiente informe de errores. Además, el informe indicará posibles enlaces rotos, la presencia o no del archivo robots.txt, la detección de la inclusión de un favicon y además nos dará consejos para solucionar los citados errores. Para el correcto funcionamiento, nuestro sitio web necesita disponer de un sitemap o de un rss al cual pueda conectarse el servicio.

HTML5 o App Nativa ¿cual es la mejor opción?

por

Muchos desarrolladores cuando se plantean crear una aplicación para dispositivos móviles se hacen una pregunta ¿hacer una aplicación nativa o en HTML5? Cada una de estas opciones tiene sus puntos fuertes y sus puntos débiles. Desarrollar una aplicación nativa, tiene por un lado la ventaja de contar con una mejor integración con el sistema operativo, el poder gozar de un rendimiento mucho más fluido y de esa forma así aprovechar todas las prestaciones que ofrezca la plataforma correspondiente. Por contra, el desarrollo de una aplicación nativa hace que la migración a una nueva plataforma sea un proceso más complejo, ya que se requiere de conocimientos en cada una de las plataformas y normalmente es necesario realizar un desarrollo para cada una de estas. HTML5 ofrece no obstante una mayor versatilidad, ya que al tratarse de algo estandarizado, debería ser fácilmente migrado de una plataforma a otra con cambios menores. En su contra tiene que no tiene un acceso tan sencillo a las funciones más avanzadas del sistema, el que no todos los navegadores implementen «exactamente» igual el estándar HTML5 y que su rendimiento no es el mismo que el ofrecido por una app nativa. Estamos claramente ante un dilema que quizás solo con el tiempo se resolverá. Muy posiblemente las aplicaciones en HTML5 mantengan su hueco en muchos casos, mientras que las aplicaciones nativas tendrán una mayor presencia en aquellos casos en los que el rendimiento sea un aspecto muy importante (como por ejemplo los juegos).

Thimble, el editor de la fundación Mozilla

por

Mozilla desde hace unos días nos ofrece una nueva herramienta enfocada esta vez a los desarrolladores web. Su nombre es Thimble y se trata de un editor HTML que nos permite realizar proyectos basados en HTML y CSS directamente desde nuestro navegador. Si queréis iniciar la prueba, podéis hacerlo desde la web del proyecto Thimble sin necesidad siquiera de crear una nueva cuenta. Con esta herramienta podremos crear páginas web con suma facilidad desde el navegador recibiendo además ayudas desde el editor.

Firebug 1.8.2

por

Si hablamos de Firebug seguro que cualquier desarrollador y programador web ha oido al menos hablar de este paquete de utilidades. Se creo con el fin de analizar, editar y depurar el codigo fuente, CSS, Html y Javascript de una página web de forma rápida y sencilla.

Así pues desde la primera vez que se lanzase hasta ahora ha pasado algún tiempo y ahora el equipo de desarrollo ofrece la versión 1.8.2. Esta versión de mantenimiento, además de corregir diferentes incidencias detectadas nos ofrece una nueva API que permite establecer marcas de tiempo en el código de JavaScript, se mejora la visualización de la localización de los scripts, muestra nuevas opciones en el panel DOM, posibilidad de mostrar direcciones IP en el panel de Red y compatibilidad con Firefox 5, 6 y 7 beta.

Si queréis más información sobre la herramienta podréis encontrarla en el blog de firebug.

 

 

Facebook sustituira el FBML por HTML en iFrames

por

Quien haya creado contenido para una página de Facebook sabrá de que hablamos cuando decimos FBML. Se trata de un lenguaje de etiquetas creado expresamente para crear aplicaciones dentro de las páginas de Facebook y así aportar cierta funcionalidad a estas. Hasta la fecha, el lenguaje creado por los programadores de Facebook (y que se asemejaba bastante a HTML) era la única forma de aportar dicha funcionalidad a las páginas de Facebook. No obstante desde ahora, se va a cambiar el sistema y se permitirá el uso de HTML embebido a través de iFrames. De esta forma se gana homogeneidad a la hora de crear aplicaciones para Facebook ya que no hay que usar un lenguaje distinto. Sin duda una gran noticia, aunque cuidado, porque habrá que estar atentos a posibles agujeros de seguridad que este nuevo sistema pueda ocasionar.