Como Insertar una nube de etiquetas html5 Efecto giratorio.

Nos vamos a Diseño> Edición HTML> y busca el siguiente código, que hay debajo:

<b:section class='sidebar' id='sidebar' preferred='yes'>

Una vez encontrado, añades el siguiente código justo debajo del mismo código:

<b:widget id='Label99' locked='false' title='Nube de etiquetas' type='Label'>

<b:includable id='main'>

<b:if cond='data:title'>

<h2><data:title/></h2>

</b:if>

<div class='widget-content'>

&lt;object type="application/x-shockwave-flash" data="http://ciudadblogger.hostzi.com/tagcloud.swf" width="190"height="200" allowscriptaccess="always" &gt;

&lt;param name="movie" value="http://ciudadblogger.hostzi.com/tagcloud.swf" /&gt;

&lt;param name="bgcolor" value="#ffffff" /&gt;

&lt;param name="flashvars" value="tcolor=0x000000&amp;mode=tags&amp;distr=true&amp;tspeed=100&amp;tagcloud=&lt;tags&gt;

<b:loop values='data:labels' var='label'>

<a expr:dir='data:blog.languageDirection' expr:href='data:label.url' style='12'><data:label.name/></a>

</b:loop>

&lt;/tags&gt;" /&gt;

&lt;p&gt;Blogumulus by &lt;a href='http://www.roytanck.com/'&gt;Roy Tanck&lt;/a&gt; and &lt;a href='http://www.bloggerbuster.com'&gt;Amanda Fazani&lt;/a&gt;&lt;/p&gt;

&lt;/object&gt;

</div>

<b:include name='quickedit'/>

</b:includable>

</b:widget>

Ahora hay algunas configuraciones que debéis cambiar si deseáis o quereis, y que verás en el código anterior. Esto es para que se adecue mejor a vuestro estilo.

• Nube de etiquetas: es el nombre del gadget.
• width 190: es el ancho.
• height 200: es el alto.
• #ffffff: es el color de fondo, así como está por default en blanco, pero cámbialo por el que te guste o más se adecue a tu diseño de la plantilla.
• x000000: es el color de la letra.
• style='12': es el tamaño de la letra  o font size de la fuente de la letra.
• "tspeed", "100": es la velocidad con la que se mueven las etiquetas.
• Una vez configurado todos estos detalles guarda y listo, ahora veremos que en Elementos de página el gadget se posiciona por defecto arriba del todo, arrástralo donde desees en tu sidebar y guarda y listo. Disfrutar.

Crea apps para iOS y Android con HTML5, CSS y Javascript

En verdad esto me parece algo muy util porque te brinda la ayuda necesaria para crear la app que tu desees y no las que esten disponibles.

Asi que en mi busqueda por nuevas cosas que se pueden realizar con HTML5 me encontre con esta pagina que mas o menos te va guiando y te explica el concepto de su proposito.

Últimamente el trabajo me está llevando a encaminar mis esfuerzos en documentarme e investigar algo más sobre el desarrollo de páginas web para dispositivos móviles. Ya sea mediante diseño adaptativo, o aplicaciones nativas para las distintas plataformas, es evidente que la movilidad ocupará un porcentaje importante del tiempo de desarrollo de los diseñadores de páginas web.

Aunque estoy convencido de que el diseño adaptativo y la tecnología HTML5 eclipsarán el boom de las aplicaciones móviles nativas, en algunos casos los límites de las tecnologías web hacen que tengamos que recurrir a ellas si queremos usar intensivamente los recursos de los dispositivos móviles.

En otros casos, la creación de aplicaciones nativas es una cuestión meramente estratégica. Presencia, prestigio o ciertas ventajas a la hora de la comercialización de una aplicación como producto son algunos de los motivos que justifican el uso de las plataformas oficiales que nos bridan los distintos sistemas, la App Store o Google Play. Lo cierto es que existen recursos que nos permiten seguir desarrollando aplicaciones con estándares web, HTML5, CSS, etc. y tener presencia en las tiendas sin obligarnos a enfrentarnos a un nuevo proyecto.

aqui la pagina por si algunas dudas surgen: 

http://ivanprego.com/diseno-web/css/desarrollar-aplicaciones-para-ios-y-android-con-html5-css-y-javascript/

Creacion de sitios HTML5 con Adobe Muse

CREACION DE SITIOS WEB SIN NCESIDAD DE LINEA DE CODIGO MEDIANTE ADOBE MOUSE

Con Muse puedes crear sitios completos sin saber HTML/CSS. Es ideal para diseñadores editoriales que quieren adentrarse al web debido a su gran parecido con la interfase de InDesign.

Los temas que veremos son:

• Como planear tu sitio
• Crear páginas maestras
• Editar y optimizar imágenes
• Utilizar estilos
• Crear menús
• Crear slideshows
• Utilizar ligthboxes
• Publicar tu sitio

Y todo sin ver una sola línea de código.

La cita es en el TelmexHub este sábado 28 de enero del 2012 a las 16 hrs.

La entrada es gratuita, pero como siempre se les pide a los asistentes que se preregistren en el sitio de TelmexHub ya que es necesario para que puedan entrar al lugar.

CONSTRUCTOR DE HTML5 (BUILDER)

HTML5 Builder es la solución de Embarcadero para el desarrollo de aplicaciones web y móviles que permite a los desarrolladores corporativos y de proveedores de software independientes diseñar y crear visualmente aplicaciones para web, iOS, Android, BlackBerry y Windows Phone usando un único código base HTML5, CSS3, PHP y JavaScript.

Interfaz de usuario optimizada para flujo de trabajo

Se ha optimizado HTML5 Builder para que sea más fácil de usar. Los flujos de trabajo basados en contexto solo muestran herramientas y menús que corresponden a la acción actual del usuario, haciendo que el desarrollo de aplicaciones sea más sencillo y rápido que antes.

Componentes HTML5

Paisaje(CANVAS)

Dibuje y presente formas e imágenes 2D y 3D de forma dinámica con JavaScript. Dibuje formas básicas, cree dibujos y gráficos fluidos, agregue efectos a las fotografías e incluso aplique animaciones y efectos a los videos.

Audio & Video

Los clips de audio y video se presentan directamente en el explorador y muestran los controles de medios nativos del explorador. Reproduzca películas o pistas de audio en su sitio web con facilidad. También puede desarrollar su propio reproductor de medios avanzado con máscaras personalizadas o combinarlo con el componente de lienzos para aplicar asombrosos efectos visuales a sus videos. Las posibilidades son infinitas.

Geolocation

Muestre en un mapa la ubicación actual del usuario, presente información específica de la ubicación para sus clientes y más. Úselo en aplicaciones web móviles para mostrar eventos cercanos o en su sitio web para obtener detalles sobre la ubicación actual de su cliente, velocidad de conexión y más.

Local Storage

Incluido como parte de HTML5, el API de almacenamiento local le permite desarrollar aplicaciones web móviles y sitios web que aprovechan la capacidad de almacenamiento del explorador en lugar de depender de bases de datos de terceros. Almacene datos en el explorador web de los dispositivos del cliente y acceda a ellos incluso después de haber cerrado el explorador.

Desarrollo móvil de varias plataformas

Ahora puede crear aplicaciones móviles para Windows Phone, iOS, Android y BlackBerry usando un único código base HTML5, JavaScript, PHP y CSS3.

Compile sus aplicaciones móviles usando PhoneGap y los SDK nativos del teléfono en su máquina. O bien, compile en la nube usando el sistema integrado PhoneGap Build sin necesidad de instalar ningún SDK en su máquina.

Estilo y animaciones CSS3

Con la compatibilidad de CSS3 en HTML5 Builder, usted puede configurar y personalizar las propiedades CSS3 para cada elemento de la interfaz de usuario. HTML5 Builder también ofrece una interfaz intuitiva para crear animaciones en CSS3 y genera código CSS3 que se puede visualizar y editar en el editor de código.

Temas de la interfaz de usuario móvil jQuery

Cree nuevas combinaciones de colores para sus aplicaciones móviles arrastrando y soltando colores en sus controles de interfaz de usuario. Los archivos CSS se generan automáticamente para que usted los use para definir un estilo que desee para un control o para toda una aplicación móvil.

Vista previa dinámica

Escriba su propio código HTML y JS o utilice una plantilla existente. Vea los cambios de código en forma dinámica y obtenga una vista previa dinámica de su proyecto. Diseñe y personalice componentes existentes de la interfaz de usuario de HTML5 Builder mediante los editores de animación y propiedades de CSS3 e insértelos en su página cliente con Vista previa dinámica.

Code Insight de HTML5 y JavaScript

El componente Code Insight de HTML y JavaScript ofrece a los desarrolladores acceso instantáneo a la información a medida que codifican su aplicación. Mientras usted escribe, Code Insight permite completar el código mediante la presentación de ayudas con elementos pertinentes y le muestra pistas para las expresiones y los símbolos.

Gráficos sorprendentes con TeeChart Lite

TeeChart Lite para HTML5 Builder le permite generar gráficos en todos los navegadores compatibles mediante JavaScript nativo, utilizando el elemento Canvas de HTML5. Los gráficos se pueden añadir en tiempo de diseño a páginas web para móviles, páginas de cliente, y páginas de servidor, y puede programarlos utilizando PHP y/o JavaScript.

Con Teechart Lite podrá realizar en tiempo de ejecución funciones como zoom, scroll, tooltips y animaciones, así como tener control sobre los eventos del ratón, importar datos de diversas maneras y son sensibles al tacto en dispositivos móviles. Incluye los siguientes estilos de gráficos: Línea, Barra, Área, Circular, XY (Dispersión), Barra Horizontal, Área Horizontal y Anillos.

Lo que cambio de HTML5

En este artículo voy a hablar de las novedades, mejoras y cambios que trajo HTML en su última versión, HTML5.
Cambios muy importantes a tener en cuenta a la hora de aprender a programar.

Ha pasado tiempo desde que se empezó a trabajar con ella, pero no está de más recordarlo para aquellos que aún tengan pendientes cambios en su página web, así como para que aquellos que ahora mismo están aprendiendo sepan identificar un código obsoleto al verlo.

Fueron muchos los cambios y muchas las etiquetas que sufrieron cambios, ya sea modificándose para hacerlas más sencillas al uso o bien eliminándolas o cambiándolas por otras; además se han crearon de otras muchas nuevas.

A continuación veremos una lista con los cambios más importantes:

1. Novedades HTML5
   1. 1.- Nuevo Doctype
   2. 2.- Cambios en la llamada de elementos Script y Link
   3. 3.- Uso de comillas
   4. 4.- Nuevas etiquetas para la estructura
   5. 5.- Etiquetas de vídeo y audio
   6. 6.- Autofocus en formularios
   7. 7.- Placeholder en formularios
   8. 8.- strong>Validación de campos en formulario
   9. 9.- Contenido editable en formularios
   10. 10.- Más tipos de campos en formularios
   11. 11.- Canvas

Haz clic en Leer más para conocer detalladamente y con ejemplos dichos cambios.

1. Nuevo Doctype

Antes de la aparición del HTML, el funcionamiento del Doctype era muy complejo, veamos como era su declaración:

1 2	<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"     "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

Con HTML5 la declaración de este Doctype se ha simplificado muchísimo, haciéndonos posible memorizarla:

1	<!DOCTYPE html>

2. Cambios en la llamada de elementos Script y Link

En las etiquetas link y script ya no es necesario hacer uso del atributo type, haciendo más sencilla la llamada a archivos .css y .js; sí que es necesario el atributo rel en el caso de los archivos .css:

1 2	<link rel="stylesheet" href="estilo.css" /> <script src="funciones.js"></script>

3. Uso de comillas

Con la aparición del HTML5 no será necesario poner comillas dobles en el valor de los atributos:

1	<p id=id_parrafo</p>

El omitir las comillas no es una norma, si no una posibilidad.

4. Nuevas etiquetas para la estructura

Hasta la aparición del HTML5 la estructura de nuestra página web era diseñada haciendo uso de capas o DIVs, al menos por norma general, de la siguiente manera:

1 2 3 4

<div id="cabecera"></div> <div id="menu"></div> <div id="contenido"></div> <div id="pie"></div>

Ahora nos es posible hacer uso de etiquetas estándar para montar la estructura de nuestra página web, haciéndonos el trabajo más fácil; aún y así navegadores anteriores a los actuales, como Internet Explorer 6, 7 y 8 no lo soportan:

1 2 3 4 5 6 7

<header></header> <nav></nav> <article>     <section></section> </article> <aside></aside> <footer></footer>

5. Etiquetas de vídeo y audio

En HTML5 encontramos estandarizado el uso de audio y vídeo, con 2 nuevas etiquetas.

Funcionamiento de la etiqueta vídeo:

1 2 3 4 5

<video width="320" height="240" controls>     <source src="movie.mp4" type="video/mp4">     <source src="movie.mp4" type="video/ogg">     Tu navegador no soporta la etiqueta video. </video>

Puedes encontrar más información en W3Schools.

Funcionamiento de la etiqueta audio:

1 2 3 4 5

<audio controls>     <source src="rabbit.mp4" type="audio/ogg">     <source src="rabbit.mp4" type="audio/mpeg">     Tu navegador no soporta la etiqueta audio. </audio>

Puedes encontrar más información en W3Schools.

6. Autofocus en formularios

Otra característica importante es la creación del atributo autofocus para los formularios. Muy útil para nuestra página de contacto, por ejemplo. Veamos como funciona, muy sencilla:

1	<input name="campo-texto" type="text" autofocus />

7. Placeholder en formularios

Este atributo nos permitirá que, por defecto, aparezca un texto en nuestro campo de formulario, de modo que cuando nos hagamos clic sobre él y empecemos a escribir, éste desaparecerá sin necesidad de borrarlo previamente:

1	<input name="campo-nombre" type="text" placeholder="Introduce tu nombre" />

8. Validación de campos en formulario

Una gran mejora por parte de HTML en esta nueva versión, que nos permite validar el campo, de modo que será obligatorio introducir un valor en él. Nos facilita mucho las cosas haciendo que no sea necesario el uso de PHP para esta comprobación:

1	<input name="campo-texto" type="text" required />

9. Contenido editable en formularios

Cualquier contenido puede ser ahora editable, vemos el ejemplo de un párrafo, pero es también aplicable a títulos o listas, por ejemplo:

1	<p contenteditable="true">Párrafo con contenido editable</p>

10. Más tipos de campos en formularios

HTML5 nos ofrece nuevos campos para nuestros formularios, como son number, date, url, tel o email:

1 2 3 4 5 6 7

<form>     <input type="number" />     <input type="date" />     <input type="url" />     <input type="tel" />     <input type="email" /> </form>

11. Canvas

Éste es posiblemente el cambio más importante respecto a HTML4/xHTML.
Nos permite dibujar gráficos sobre un texto plano haciendo uso de JavaScript.

Puesto que su información y uso es muy extenso podemos conocer más información al respecto en W3Schools.

- See more at: http://www.yonoprogramo.com/novedades-de-html5/#sthash.7M7fq5E8.dpuf