Crear WebSlice para Internet Explorer 8 con un feed RSS



Categorías: Internet

Crear WebSlice para Internet Explorer 8 con un feed RSS. Ya se acerca uno de los acontecimientos en Internet que oiremos en muchos medios como es la salida de un navegador. En pocas semanas saldrá el Microsoft Internet Explorer 8. ¿Esta preparado tu web o blog?

Desde Frikipandi hemos querido poner nuestro grano de arena y ya hemos programado un Web slice. El web slice es una porción de código html en tu página web y una de las caracteristicas más interesantes del I.E 8.

Desde la última beta de Internet Explorer 8 que entre muchas mejoras incluye dos características muy interesantes para publicar contenido en Web: las Activities y los WebSlices. Ambas funcionalidades son pequeñas aplicaciones basadas en microformatos (micro porque son pequeños, no porque sean de Microsoft).

Hay varios ejemplos que vale la pena ver, pero especialmente recomiendo el de los webslices para vigilar artículos en eBay, o el que sirve para estar al día sobre las actualizaciones de tus amigos en Facebook.

Vamos explicar brevemente cómo crear un WebSlice para I.E 8, que hemos programado para www.frikipandi.com . Para verlo es necesario que instales el Internet Explorer 8 beta. Si no lo has hecho puedes descargarlo desde el sitio de Internet Explorer 8.

¿Qué es un WebSlice para Internet Explorer 8?

Un Webslice (o rebanada web) es un segmento de una página Web escrita con un formato particular dentro del contexto de XHTML. Este formato se apega a estándares Web pero permite que IE8 pueda detectarlo para agregarlo como un marcador vivo, de forma que se pueda tener un fragmento de una página Web como marcador que incluso refleja los cambios que puedan tener los datos del webslice.

Se pueden tener tantos webslices en un sitio como se necesiten, y aunque no es posible incorporar funcionalidad con lenguajes de scripting como JavaScript, si es posible generar datos dinámicos desde el servidor con un lenguaje activo como ASP, PHP, JSP o ASP.NET. Un webslice puede ser la previsión del tiempo, tráfico o el más simple de las últimas noticias que es el que hemos creado:

¿Cómo se hacen? Es lo más simple del mundo:

Programar un WebSlice

Un webslice es una capa que puede estar oculta en nuestro código  o un módulo con información útil que queremos que los usuarios lo tengan:

Game System – $66.00

 

Auction ends: 6 hours

<div class=»hslice»>
<div class=»hslice» id=»1″>
<div class=»entry-content»>
<div class=»hslice» id=»1″>
<pre class=»libCScode» id=»ctl00_rs1_mainContentContainer_ctl04″ style=»WORD-BREAK: break-all; WORD-WRAP: break-word» space=»preserve»><div class=»hslice» id=»1″>
<p class=»entry-title»>Game System – $66.00</p>
<div class=»entry-content»>
<img src=»game.jpg»>
<p>Auction ends: <abbr class=»endtime» title=»2008-02-28T12:00:00-05:00″>6 hours</abbr></p>
</div>
<a rel=»feedurl» href=»http://www.ebay.com/game.xml»>Subscribe to Feed</a>
<p>This item updates every <span class=»ttl»>15</span> minutes.</p>
</div><br /></pre>
</div>
</div>
</div>
</div>

Subscribe to Feed

This item updates every 15 minutes.

El que hemos creado usando este microformato es usando el lector de RSS que te da el navegador usando la propiedad feedurl.

Ultimas noticias ABC.es
http://feeds2.feedburner.com/frikipandi»>>

Las noticias se actualizan cada 15 minutos.

La clase hslice es obligatoria, pero es posible aplicarle formato desde una hoja de estilo (como siempre, |es mejor usar estilos externos que estilos embebidos) y el valor de id puede variar para diferentes webslices en la misma página. La clase entrytitle define el texto que se publica como título en el webslice.

En la clase entry-content se define el contenido del webslice. Como mencionaba antes, el contenido válido puede ser HTML o XHTML válido, pero no código JavaScript o VBScript, y puede ser tan largo como se desee, aunque el contenido corto funciona mejor en este caso.

 

Agregando WebSlices

Para agregar el webslice en un sitio simplemente hay que colocar el código dentro de los tags de la página. IE8 los detecta automáticamente y se puede agregar a la barra de marcadores dando clic en el ícono sobre el webslice o en el mismo ícono del navegador para ver todos los webslices en una página. Prueba el webslice de Frikipandi.com

Lo mejor de todo: un webslice es compatible con estándares y no rompe la validación de XHTML si está correctamente implementado.

Hay un documento técnico en MSDN que explica a más detalle las opciones y características del microformato para webslices en IE8.

La clase es obligatoria, pero es posible aplicarle formato desde una hoja de estilo () y el valor de id puede variar para diferentes webslices en la misma página. La clase define el texto que se publica como título en el webslice.

Espero que os sirve y que pronto creemos estos códigos en nuestros blogs. Por cierto ya existe un plugin en Firefox para leer estos códigos. Webchunks es el plugin de Webslice para Firefox (https://addons.mozilla.org/es-ES/firefox/addon/8494). IE8 Activities for Firefox 0.7.3 es el plugin para poner los aceleradores o activities como se llaman en ingles en Firefox. (https://addons.mozilla.org/es-ES/firefox/addon/6777)

Creando WebSlices en Internet Explorer 8

Más información para crear Webslices.

http://msdn.microsoft.com/en-us/library/cc304073(VS.85).aspx

. Leer artículo completo en Frikipandi Crear WebSlice para Internet Explorer 8 con un feed RSS.
Salir de la versión móvil