Qu es HTML5 y CSS3?

Diseo de Pginas Web con Dreamweaver

Valeria Romn Vargas

0114640353

15/02/15

2. Introduccin

Este trabajo consistir en los lenguajes HTML5 y CSS3. En qu consisten estos lenguajes y cul es la historia de su aparicin as como las novedades que brindaron en comparacin con el lenguaje HTML. Primero, se definir brevemente qu es HTML y CSS puesto que el HTML5 es una revisin del HTML y el CSS3 es sucesor del CSS; por lo cual es importante dejar claros estos antecedentes. Segundo, se dar una breve introduccin a los conceptos de HTML5 seguido por la del CSS3. Tercero, se hablar acerca de las caractersticas y novedades del HTML5 y CSS3. Por ltimo se harn una conclusiones con respecto al tema.

3. Contenido

a. HTML Y CSS

HTMLLas siglas son de Lenguaje de marcas de hipertexto en ingls. Es un lenguaje de marcas- el ms importante- que se utiliza para la creacin de pgina web. El lenguaje de marcas se utiliza para codificar un documento que contiene etiquetas con nueva informacin. El lenguaje HTML tiene una estructura propia y un cdigo propio que permite definir todo el contenido de una pgina y su estructuracin.

Es un lenguaje muy simple y general que sirve para definir otros lenguajes que tienen que ver con el formato de los documentos. El texto en l se crea a partir de etiquetas, tambin llamadas tags, que permiten interconectar diversos conceptos y formatos (Annimo, web)

CSSSon las siglas para Hojas de Estilo en Cascada en ingls. CSS es un lenguaje que nos permite definir las reglas y estilos de un documento escrito en HTML. son las que nos ofrecen la posibilidad de definir las reglas y estilos de representacin en diferentes dispositivos, ya sean pantallas de equipos de escritorio, porttiles, mviles, impresoras u otros dispositivos capaces de mostrar contenidos web (Damin, web)Por otro lado, Luis Miguel Delgado dice que el lenguaje CSS consisten en la informacin que define como va a ser la presentacin de una web. Cuando me refiero a presentacin, me refiero a negritas, colores, efectos, tipos de letra que escogemos () de tal manera que se independiza del HTML que es el lenguaje donde se estructura toda la informacin que se manda a nuestro ordenador para que el navegador nos presente esa bonita pgina web. (Delgado, web)b. Introduccin a HTML5 y CSS3

HTML5

HTML5 es la quinta revisin importante (Wikipedia, web) del lenguaje HTML- publicada en el 2014- en la cual se desarroll en paralelo dos variantes de sintaxis: la HTML5 y la XHTML. Esta versin le sigue a la HTML4 que se declar como lenguaje de la web en el 2000, o sea, aproximadamente 14 aos despus aparece la versin HTML5. Se trata de un sistema para formatear el layout de nuestras pginas, as como hacer algunos ajustes a su aspecto. Con HTML5, los navegadores como Firefox, Chrome, Explorer, Safari y ms pueden saber cmo mostrar una determinada pgina web, saber dnde estn los elementos, dnde poner las imgenes, dnde ubicar el texto. En este sentido, el HTML5 no se diferencia demasiado de su predecesor (...) La diferencia principal, sin embargo, es el nivel de sofisticacin del cdigo que podremos construir usando HTML5. (barbarapvn, web)CSS3En 1996 se publica la primera versin de CSS y la versin CSS3 se empez a definir en el 2005, como sucesora de la la versin 2.1. Esta tercera versin sigue teniendo la misma funcin sin embargo una serie de mejoras y novedades. c. Caractersiticas y novedades HTML5Segn barbarapvn muchas de las novedades de esta nueva versin se relacionan con las formas actuales de crear o contruir pginas web. Una de las ms importantes novedades est relacionada con la insercin de multimedia en los sitios web, que ahora contarn con etiquetas HTML especiales para poder ser incluidos. Por otro lado, algunos aspectos de diseo tambin son incluidos en el lenguaje, as como tambin algunos detalles de navegacin (barbarapvn, web)Novedades: reduccin de la dependencia de los plug-ins Se puede accederla a pginas web sin estar conectado a internet. Drag and Drop La edicin On-line La geolocalizacinOtra novedad de HTML5 es que incluye nueva etiquetas; estas etiquetas nos ahorran el uso de otros productos que se usaban para complementar y hacer cosas que con el simple HTML no se podan hacer. HTML5 fue creado para hacer que el proceso de escribir el cdigo sea ms simple y ms lgico, por decirlo de una forma (barbarapvn, web)Esto sirve para poder acceder y ver el contenido multimedia en diversos dispositivos que antes no poda abrirlos y adems sin la necesidad de instalar nada adicionalmente. barbarapvn (web) indica algunas de las etiquetas ms importantes por su innovacin: article: esta etiqueta sirve para definir un artculo, un comentario de usuario o una publicacin independiente dentro del sitio. header, footer: estas etiquetas individuales ahorran tener que insertar IDs para cada uno, como se sola hacer anteriormente. Adems, se pueden insertar headers y footers para cada seccin, en lugar de tener que hacerlo nicamente en general. nav: la negacin puede ser insertada directamente en el markup, entre estas etiquetas, que nos permitirn hacer que nuestras listas oficien de navegacin. section: con esta etiqueta, una de las ms importantes de las novedades, se puede definir todo tipo de secciones dentro de un documento. Por ponerlo de forma sencilla, funciona de una forma similar a la etiqueta div que nos separa tambin diferentes secciones. audio y video: estas son las dos ms importantes etiquetas de HTML5, dado que nos permiten acceder de forma ms simple a contenido multimedia que puede ser reproducido por casi todo tipo de dispositivos; marcan el tipo de contenido que estar en su interior. embed: con esta etiqueta se puede marcar la presencia de un contenido interactivo o aplicacin externa. canvas: finalmente, esta etiqueta nos permite introducir un lienzo dentro de un documento, para poder dibujar grficos por vectores; ser necesario el uso de JavaScript (barbarapvn, web)Dos ejemplos de pginas web desarrolladas en HTML5 son http://hardudetideg.no/test/en.html y http://www.asicsamerica.com/#!/intro que consiste en realizar una especie de test de habilidad. Considero que incluye componentes tales como la facilidad de acceder a materiales multimedia, la reduccin de los plug-ins pues estas pginas no lo requieren y las mltiples secciones. CSS3La CSS3 se diferencia de CSS2 porque est dividida en mdulos, o sea, en varios ducumentos por separado. Cada mdulo aade nuevas funcionalidades a las definidas en CSS2, de manera que se preservan las anteriores para mantener la compatibilidad (Wikipedia, web)Segn EL Gran Artista (web) estas son las novedades ms importantes: Bordes (borde-color, borde-image, borde-radius, box- shadow), Fondos (background-origin & background-clip, Background-size, Multiple backgrounds), Color (colores HSL, colores HSLA, colores RGBA, Opacidad), Texto (text-shadow, Text-overflow, Text-Wrap), Interfaz (box-sizing, Resize, Outline, nav-top, nav-right, nav-bottom, nav-left), Selectores (selectores por atributos) , Modelo de caja bsico (overflow-x, overflow-y), media queries, multi-column layout, Web fonts, Speech. 4. Conclusiones Tanto el HTML5 y CSS3 son nuevas versiones de sus antecesores. Estas versiones incluyen una serie de novedades y cambios que le facilita las cosas tanto a los usuarios como a los diseadores web. Adems, estas nuevas novedades ampla las opciones a la hora de crear pginas web. 5. Bibliografa Annimo. Manual de CSS3, Desarrolloweb.com. Tomado de: http://www.desarrolloweb.com/manuales/css3.htmlAnnimo (2010) 5 novedades de CSS3, Taringa. Tomado de: http://www.taringa.net/posts/hazlo-tu-mismo/14115553/5-Novedades-de-CSS3-Recomendado.htmlAnnimo (2015) HTML5, Wikipedia. Tomado de: http://es.wikipedia.org/wiki/HTML5Annimo (2015) HTML, Wikipedia. Tomado de: http://es.wikipedia.org/wiki/HTMLAnnimo (2015) Definicin de HTML, DefinicinDe. Tomado de: http://definicion.de/html/Annimo (2015) Hojas de Estilos de Cascada, Wikipedia. Tomado de: http://es.wikipedia.org/wiki/Hoja_de_estilos_en_cascada

BarbaraPVN (2013) Entendiendo HTML5: Gua para principiantes, Hipertextual.com. Tomado de: http://hipertextual.com/archivo/2013/05/entendiendo-html5-guia-para-principiantes/Damin (2010) Qu es CSS3?, Dwebapps.com. Tomado de: http://html5.dwebapps.com/que-es-css3/Delgado, Luis Miguel (2014) Qu es CSS? Y Qu me importa a mi?, Tu Negocio en la Nube. Tomado de: http://tunegocioenlanube.net/que-es-css3-y-que-importa-mi/El Gran Artista (2009) Las Novedades del CSS3, El gran artista universal. Tomado de: https://elgranartista.wordpress.com/2009/09/03/las-novedades-del-css3/