es es es es it es en zh es pt es de es es en en ja ar ar es es nl es fr es fr es es es es es es es nl es es es es es es es es nl fr es es es es es es nl es es es es es es es nl en es es es es es es nl en es es es es es es nl es es es es es es es nl es es es es es es nl es es es en es es es es es es en nl fr es es es es es es en nl es es es es es es es es nl cs es gl es es es es es es es es es nl es es es ru es es es es es es gl nl es en es es es en es es es es gl nl es en es en es es gl en es en es es es es es es nl es es es es es es es es es es pt es es kn es es es es es en es es es es es es es es es es es en cs es es es cs es es es es es es es es cs es es es es es es es es cs es es es es it es es es es it es es pl es es es es it es es es es es es es es es en en es es gl es es es pl es es cs es es it pl es es es es es es es es es es es es es es es es es es
Actualmente es abusivo el uso de elementos DIV para estructurar una web en bloques. El HTML5 nos brinda varios elementos que perfeccionan esta estructuración estableciendo qué es cada sección, eliminando así DIV innecesarios. Este cambio en la semántica hace que la estructura de la web sea más coherente y fácil de entender por otras personas y los navegadores podrán darle más importancia a según qué secciones de la web facilitándole además la tarea a los buscadores, así como cualquier otra aplicación que interprete sitios web. Las webs se dividirán en los siguientes elementos:
Se utiliza para representar una sección “general” dentro de un documento o aplicación, como un capítulo de un libro. Puede contener subsecciones y si lo acompañamos de h1-h6 podemos estructurar mejor toda la página creando jerarquías del contenido, algo mu favorable para el buen posicionamiento web.
El elemento de artículo representa un componente de una página que consiste en una composición autónoma en un documento, página, aplicación, o sitio web con la intención de que pueda ser reutilizado y repetido. Podría utilizarse en los artículos de los foros, una revista o el artículo de periódico, una entrada de un blog, un comentario escrito por un usuario, un widget interactivo o gadget, o cualquier otro artículo independiente de contenido.
Cuando los elementos de   son anidados, los elementos de   interiores representan los artículos que en principio son relacionados con el contenido del artículo externo. Por ejemplo, un artículo de un blog que permite comentarios de usuario, dichos comentarios se podrían representar con  .
Publicado por Unknown en 12:32 No hay comentarios:
Enviar por correo electrónicoEscribe un blogCompartir con TwitterCompartir con FacebookCompartir en Pinterest
Etiquetas: Manual de HTML5 en español
viernes, 30 de agosto de 2013
El HTML5 (HyperText Markup Language, versión 5) es la quinta revisión del lenguaje de programación “básico” de la World Wide Web, el HTML. Esta nueva versión pretende reemplazar al actual (X)HTML, corrigiendo problemas con los que los desarrolladores web se encuentran, así como rediseñar el código actualizandolo a nuevas necesidades que demanda la web de hoy en día.
Debido a que estos cambios afectaran la forma de desarrollar la web en un futuro inmediato, desde The Process, plantearemos una serie de artículos donde desvelaremos los cambios más importantes. Actualmente el HTML5 está en un estado BETA, aunque ya algunas empresas están desarrollando sus sitios webs en esta versión del lenguaje.
A diferencia de otras versiones de HTML, los cambios en HTML5 comienzan añadiendo semántica y accesibilidad implícitas, especificando cada detalle y borrando cualquier ambigüedad. Se tiene en cuenta el dinamismo de muchos sitios webs (facebook, twenti, etc), donde su aspecto y funcionalidad son más semejantes a aplicaciones webs que a documentos.
Publicado por Unknown en 12:19 No hay comentarios:
Enviar por correo electrónicoEscribe un blogCompartir con TwitterCompartir con FacebookCompartir en Pinterest
Etiquetas: Manual de HTML5 en español
jueves, 29 de agosto de 2013
HTML5 en acción - V
El diseño de Tía Xime sería infernal de implementar si no fuera por CSS3. Que se joda la gente que usa IE6.
Publicado por Unknown en 12:17 No hay comentarios:
Enviar por correo electrónicoEscribe un blogCompartir con TwitterCompartir con FacebookCompartir en Pinterest
miércoles, 28 de agosto de 2013
HTML5 en acción - IV
Las versiones móviles y desktop de Facebook hacen un uso intensivo de CSS3 para diseño y animaciones, así como de Web Sockets (o Pubsubhubbub) para las notificaciones de actividad y el chat. Muchas apps de Facebook usan otras capacidades.
Publicado por Unknown en 6:53 No hay comentarios:
Enviar por correo electrónicoEscribe un blogCompartir con TwitterCompartir con FacebookCompartir en Pinterest
martes, 27 de agosto de 2013
HTML5 en acción - III
Scribd es un servicio que convierte cualquier PDF, PPT o PSD en HTML plano, con texto seleccionable y rendereado en el navegador, gracias en especial a @font-face y SVG.
Publicado por Unknown en 12:12 1 comentario:
Enviar por correo electrónicoEscribe un blogCompartir con TwitterCompartir con FacebookCompartir en Pinterest
domingo, 11 de agosto de 2013
HTML5 en acción - II
Gmail usa Web Storage para guardar en el disco del usuario los más recientes correos. Así puedes acceder a ellos temporalmente si se cae la conexión. También usa Drag and Drop para arrastrar y soltar archivos adjuntos, entre otras habilidades de CSS3 para diseño.
Publicado por Unknown en 12:20 No hay comentarios:
Enviar por correo electrónicoEscribe un blogCompartir con TwitterCompartir con FacebookCompartir en Pinterest
sábado, 10 de agosto de 2013
HTML5 en acción - I
Sitios de uso general que ya están utilizando HTML5 Una lista corta de sitios que ahora mismo, en producción usan HTML5. Twitter1 y m.twitter.com2
Casi todo el diseño de las versiones desktop y móvil de Twitter usan intensivamente CSS3. En especial por los bordes redondeados. En la versión móvil de Twitter se usa geolocalización sumado a Google Geolocation Services para geolocalizar los tweets.
Publicado por Unknown en 12:15 No hay comentarios:
Enviar por correo electrónicoEscribe un blogCompartir con TwitterCompartir con FacebookCompartir en Pinterest
viernes, 9 de agosto de 2013
Entendiste HTML5Boilerplate? Vamos a ponernos en acción con Inializr!
Y ahora que entiendes como funciona HTML5Boilerplate, genera tu propia plantilla para tu proyecto con Initalizr, un hijo educado de este proyecto que te permite determinar ciertas propiedades para arrancar con tu desarrollo. Te venden que en 15 segundos vas a estar funcionando, así que las cosas cada vez se ponen más fácil. Como en los viejos tiempos cuando le dabas new html en frontpage o dreamweaver. http://initializr.com/
Publicado por Unknown en 12:13 No hay comentarios:
Enviar por correo electrónicoEscribe un blogCompartir con TwitterCompartir con FacebookCompartir en Pinterest
jueves, 8 de agosto de 2013
Como arrancar con HTML5 en diez minutos
No se puede entender HTML5 como una sola tecnología, sino recordemos que es una estrategia de marketing para promover una serie de tecnologías complementarias.
Asimilar todas las posibilidades e introducirte requiere tiempo, aunque por suerto existe un atajo.Uno de los proyectos más maravillosos que debe ser comprendido por cualquier entusiasta del HTML5 es Boilerplate. Es una colección de una plantilla en html, una hoja de estilos, algunas librerías .js y plantillas de base .txt y un .htaccess. Básicamente la navaja suiza de hoy para empezar a realizar cualquier sitio web cuidandose de la compatibilidad de navegadores.
El proyecto con 220 commits y más de 102 colaboradores, actualizado al 21 de marzo del 2011 es la mejor colección existente y en múltiples idiomas que combina el uso correcto de los nuevos tags HTML5 con hacks CSS más relevantes de los últimos años, hasta las buenas prácticas a incluir para optimizar para móviles, optimizar para motores de búsqueda y más importante, optimizar para seres humanos. Si conoces de GIT, apunta tu terminal a esta dirección y haz un clon local:
Adicionalmente, en el sitio oficial encontrarás toda la documentación, videos detallados de su uso y toda una comunidad que nace en busca de comprender a fondo el HTML5. Independientemente de si nuestra guía te ha sido de utilidad, que sigas los enlaces a este recurso si aún no lo conoces es el mejor aporte que podemos darte en este tema.
Dato importante adicional, todo el proyecto de HTML5Boilerplate nace de la iniciativa de Mickael Daniel. Desde que lo conocimos nuestro servidor de desarrollo en mlw.io se llama Mickael en su honor, muy merecido lo tenía.
Publicado por Unknown en 12:08 No hay comentarios:
Enviar por correo electrónicoEscribe un blogCompartir con TwitterCompartir con FacebookCompartir en Pinterest
miércoles, 7 de agosto de 2013
Otra de las propuestas, con un player para   y   que además tiene versiones compatibles con un flash player para navegadores viejos. Es de esos que te permiten aprender basasnte mientras juegas con su código.
Importante con el tema del video entender que HTML lo ha reconocido como una de las bases más importantes de la web del presente y su mundo de posibilidades es increible. Imagina un sitio web cuyo fondo es un video mientras que las acciones reproducen otro video que se anima junto a efectos en CSS 3 genera una experiencia completa en tu navegador. Más adelante verás ejemplos concretos.
Publicado por Unknown en 12:00 No hay comentarios:
Enviar por correo electrónicoEscribe un blogCompartir con TwitterCompartir con FacebookCompartir en Pinterest
martes, 6 de agosto de 2013
Finalmente, hay un inciso más en el mundo de  . Cuando escribía esta guía me daba cuenta que si lo explicamos todo con detalle podemos hacer una Guía exclusiva del mundo del Video en HTML5 y seguramente sería más grandota que esta. Lo ponemos en la lista de pendientes.
La opción de “controls” en el tag video abre un mundo de posibilidades para que te pongas a generar un reproductor visible al usuario personalizado. Y los hackers del mundo han visto opción para poner su talento artístico a disposición de los demás. Hay muchas opciones de players de video que puedes utilizar e incluir en tus páginas HTML5. La mejor opción para conocer esta ensalada es:
Las opciones son muchas y hay demasiados grupos de desarrolladores asegurando generar buenas alternativas al estandar definido en cada navegador.
Publicado por Unknown en 11:52 No hay comentarios:
Enviar por correo electrónicoEscribe un blogCompartir con TwitterCompartir con FacebookCompartir en Pinterest
lunes, 5 de agosto de 2013
¿Qué formatos podemos incluir? - II
Google compró hace unos años a una empresa llamada On2 por una millonada descabellada porque tenían avances con desarrollos de codecs de videos. Y unos años después ponen a disposición del mundo el VP8. Es todo lo bueno que puedas pedir en este tipo de enrollos legales ya que lo liberaron gratis, sin pagar derechos ni nada raro a quien lo quiera usar. Es un regalito de Google para el mundo. Pero Microsoft y Apple no quieren regalos de nadie, así que ya entenderás cuál es el problema de este formato.
No tiene dramas de patentes, es royalty free, funciona en Linux y es seguramente el que viene en archivos Ogg. De hecho, se basa en desarrollos de On2 (la empresa que eventualmente fue adquirida por  Google) y llevó esto por otro camino que es muy libre, transparente, bueno, lindo, pero menos popular.
Puedes instalar decodificadores en windows, en mac. Hoy lo soporta Chrome (junto a VP8) y suena maravilloso pero como todo lo gratis y open source, pareciera que le hace falta alguien de marketing que lo popularice un poco más. Google es amigo de este formato.
Resumen ejecutivo de estos formatos, tienes que usar al menos h.264 y Theora o VP8 para que la web te vea. No puedes usar solo uno, toca elegir dos.
Y por cierto, solo hemos hablado de codecs de video. El drama con codecs de audio también nos trae opciones y complicaciones que te recomendaría investigar.
Publicado por Unknown en 11:50 No hay comentarios:
Enviar por correo electrónicoEscribe un blogCompartir con TwitterCompartir con FacebookCompartir en Pinterest
domingo, 4 de agosto de 2013
¿Qué formatos podemos incluir? - I
Aquí es super importante entender una diferencia entre los tipos de archivo y los codex con que el video ha sido procesado. Un .avi, .mp4 (o .m4v), un .flv (flash video) y un .ogv simplemente contienen un video, pero cada formato puede tener diferente forma de codificarlo.
Los navegadores y las compañias que los producen han elegido soportar únicamente a algunos codecs y lamentablemente no existe una alternativa definitiva y universal. En serio, no existe, tenemos tag   y el drama ha quedado por aquí, en que tienes que codificar tus videos al menos en algunos formatos para asegurarte que funcione en todos lados. ¿Ven por qué Youtube sigue siendo una opción maravillosa?
Hablemos entonces de Codecs. Hay 3 que importan hoy en día: H.264, VP8 y Theora.
Conocido como MPEG-4 Advanced Video Codiging, es el más popular hoy en día, lo usa youtube cuando
muestra videos desde el flash player (el flash player lo soporta sin problema). Es el que le da vida a los videos en un iPhone, en tu iPad. Incluso muchos reproductores de Blue-ray lo soportan. Es genial, es asombroso, pero tiene algunos temas legales detrás que complica su existencia. Hay un grupo, el MPEG LA group que tiene patente sobre este formato y le quiere cobrar a todos los que decodifiquen su formato. Google no es muy amigo de este formato. Chrome ya tiene el 20% del mercado y Android sigue creciendo. En enero le dijeron adiós1.
Publicado por Unknown en 11:46 No hay comentarios:
Enviar por correo electrónicoEscribe un blogCompartir con TwitterCompartir con FacebookCompartir en Pinterest
sábado, 3 de agosto de 2013
Uso del tag y el soporte de formatos en diferentes navegadores - II
autoplay = dará play al video en cuanto cargue la página sin acción del usuario sobre los controles.
controls = invoca a incluirse los controles (play, pausa, volumen, etc.) en el player del video. Estos
controles están predefinidos en cada navegador y como veremos más adelante en algunos players
opciones pueden ser modificados con javascript + css3.
Publicado por Unknown en 11:45 No hay comentarios:
Enviar por correo electrónicoEscribe un blogCompartir con TwitterCompartir con FacebookCompartir en Pinterest
viernes, 2 de agosto de 2013
Uso del tag video y el soporte de formatos en diferentes navegadores - I
Si hablamos de navegadores, recuerda que hay una versión donde el video empezó a existir. Antes, simplemente no va a mostrar contenido y detectarlo para mostrar un player alternativo (en flash) es  recomendado:
IE 9+, Firefox 3.5+, Chrome 3.0+, Safari 3.0+, Opera 10.5+, Android Browser 2.0+, Safari Mobile 1.0+
Para incluir un video con HTML5 usas el siguiente formato:
Adicionalmente al ancho y alto, hay atributos adicionales que puede usar:
ÐÐ preload = que empezará a precargar el video independientemente de las acciones del usuario
Recomendamos utilizarlo si la función de la página es mostrar un video. Si por el contrario, el video únicamente ayudará a complementar la información (un post que tiene múltiples videos o referencias, no lo recomendamos)
Y el anterior que le dirá explicitamente que no tiene que precargar el video.
Publicado por Unknown en 11:42 No hay comentarios:
Enviar por correo electrónicoEscribe un blogCompartir con TwitterCompartir con FacebookCompartir en Pinterest
jueves, 1 de agosto de 2013
¿Con dejamos de usar video en flash?
El debate sobre Flash y HTML5 da para los programas más entretenidos de mejorandolaweb.
Adobe tiene tecnología sólida y es de los reproductores que mejor entiende de codecs y licencias. Es una solución práctica para que no tengamos que lidear con esos problemas y sigue siendo la base de Youtube. Youtube sigue siendo la solución práctica para que vos y yo compartamos en segundos un vídeo, le generemos difusión y hagamos además social media.
Pero incluso Youtube está haciendo esfuerzos importantes en miras de HTML5, resolviendo otros dramas que incluye este tag. Revisa youtube.com/html5 con un navegador moderno y conoce más de sus experimentos.
No dejamos de usar flash, es más, es uno de los planes de contingencia más seguros para que muchas
personas y navegadores viejos puedan ver tus contenidos en vídeo.
Publicado por Unknown en 11:39 No hay comentarios:
Enviar por correo electrónicoEscribe un blogCompartir con TwitterCompartir con FacebookCompartir en Pinterest
Entradas más recientes Entradas antiguas Inicio
Suscribirse a: Entradas (Atom)
Java dispone del operador incremento (++) y decremento (--). El operador (++) incrementa en una unidad la variable a la que se aplica, mien...
Los Wrappers (envoltorios) son clases diseñadas para ser un complemento de los tipos primitivos. En efecto, los tipos primitivos son los ún...
Redefinición de métodos heredados
Una clase puede redefinir (volver a definir) cualquiera de los métodos heredados de su super-clase que 110 sean final. El nuevo método sust...
La localización mas adecuada para una nueva unidad productiva debe orientarse hacia los mismos objetivos que el tamaño óptimo, es decir haci...
Maps y SortedMaps - Part 1
Un Map es una estructura de datos agrupados en parejas clave/valor. Pueden ser considerados como una tabla de dos columnas. La clave debe ...
Técnicas para Recopilación de Antecedentes
Para obtener antecedentes como las que acabamos de mencionar se han desarrollado técnicas de distinto grado de complejidad. Estas técnicas...
Clases TextArea y TextField
Ambas componentes heredan de la clase TextComponent y muestran texto seleccionable y editable. La diferencia principal es que TextField sól...
LECTURA DE UN ARCHIVO EN UN SERVIDOR DE INTERNET
Teniendo la dilección de Internet de un archivo, la librería de Java permite leer este archivo utilizando 1111 stream. Es una aplicación mu...
Insertar un manejador de evento a la etiqueta A (enlace) que hay en la página
Ahora que ya sabemos cómo y cuando debemos ejecutar las acciones de jQuery que alteren la funcionalidad, contenidos o aspecto de la página,...
Recordemos cómo será la creación de una base de datos con SQL:
1) En primer lugar, tendremos que dar nombre a la base de datos, con la sentencia CREATE DATABASE, si la hay, o con CREATE SCHEMA. 2) A con...
Mejor estructura - I
Manual de HTML5 en español,
HTML5 en acción - V
HTML5 en acción - IV
HTML5 en acción - III
HTML5 en acción - II
HTML5 en acción - I
Entendiste HTML5Boilerplate? Vamos a ponernos en a...
Como arrancar con HTML5 en diez minutos
¿Qué formatos podemos incluir? - II
¿Qué formatos podemos incluir? - I
Uso del tag y el soporte de formatos en diferente...
Uso del tag video y el soporte de formatos en dife...
¿Con dejamos de usar video en flash?
Acerca de Este Blog
Mi lista de blogs
NOTICIAS DE TECNOLOGIA Y TELECOMUNICACIONES
Honor Las ventajas de comprar un smartphone con servicio técnico y garantía en Bolivia - HONOR se apega a los estándares de calidad más exigentes de la industria global. Además, brinda un sistema de asistencia personalizado para entregar la ...
Rata de bombeo y eficiencia - Calculo de eficiencia de las bombas - Bomba Triplex - Volumen del cilindro = π.r².L Pi, conversión de radio a diámetro, unidades de conversión y el numero de cámaras son todas calculadas por la siguientes e...
LO QUE SE DE BLOGS
Video CONFIGURA TU ROUTER TP-LINK WR940N COMO REPETIDOR SIN CABLES 100% Inhalambrico -
Telefonos Moviles y Aplicaciones
Video Desayuno de Samsung para los Periodistas, los Galaxy S20 -
Lentes inteligentes que cambian su graduación - Cuando se alcanza cierta edad, la vista comienza a fallar. Muchas personas también sufren problemas de visión de nacimiento, o por una lesión. Si ves mal d...