Introducción a HTML 5 y Etiquetas
Anuncio
CURSO HTML5
JORGE HOYOS
INGENIERO DE SISTEMAS
UNIVERSIDAD TECNOLÓGICA DE PEREIRA
QUE ES HTML
• HTML, siglas de HyperText Markup
Language («lenguaje de marcas de hipertexto»),
hace referencia al lenguaje de marcado para la
elaboración de páginas web. Es un estándar que
sirve de referencia para la elaboración de páginas
web en sus diferentes versiones, define una
estructura básica y un código (denominado
código HTML) para la definición de contenido de
una página web, como texto, imágenes, etc. Es un
estándar a cargo de la W3C.
W3C
• The World Wide Web Consortium (W3C) is the main
international standards organization for the World
Wide Web (abbreviated WWW or W3).
WEB 2.0
• Un sitio Web 2.0 permite a los usuarios interactuar y
colaborar entre sí como creadores de contenido
generado por usuarios en una comunidad virtual, a
diferencia de sitios web estáticos donde los usuarios
se limitan a la observación pasiva de los contenidos
que se han creado para ellos.
XHTML
• HTML5 (HyperText Markup Language, versión 5) es la
quinta revisión importante del lenguaje básico de
la World Wide Web, HTML. HTML5 especifica dos
variantes de sintaxis para HTML: un «clásico» HTML
(text/html), la variante conocida como HTML5 y una
variante XHTML conocida como sintaxis XHTML5 que
deberá ser servida como XML). Esta es la primera vez
que HTML y XHTML se han desarrollado en paralelo.
• Todavía se encuentra en modo experimental, lo cual
indica la misma W3C; aunque ya es usado por múltiples
desarrolladores web por sus avances, mejoras y
ventajas.
HTML5
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN""http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<title>Head First Lounge</title>
<link type="text/css" rel="stylesheet" href="lounge.css">
<script type="text/javascript" src="lounge.js"></script>
</head>
<body>
<h1>Welcome to Head First Lounge</h1>
<p>
<img src="drinks.gif" alt="Drinks">
</p>
<p>
Join us any evening for refreshing <a href="elixirs.html">elixirs</a>,
conversation and maybe a game or two of Tap Tap Revolution.
Wireless access is always provided; BYOWS (Bring Your Own Web Server).
</p>
</body>
</html>
COMO TRABAJA HTML5
HTML
HEAD
TITLE
SCRIPT
BODY
HTML
HTML
HTML
RESPONSABILIDADES
• CSS: Stilos, formas y colores
• JavaScript (js): Programación de acciones, eventos
y disparadores.
• HTML: Esquema y maquetación de contenido.
JAVA SCRIPT
<script>
var walksLike = "duck";
var soundsLike = document.getElementById("soundslike");
if (walksLike == "dog") {
soundsLike.innerHTML = "Woof! Woof!";
} else if (walksLike == "duck") {
soundsLike.innerHTML = "Quack, Quack";
} else {
soundsLike.innerHTML = "Crickets...";
}
</script>
QUÉ PERMITE EL JS
• Crear imágenes en 2d
• Utilizar geo-location.
• Cache local
QUÉ ES EL DOM
• Document Object Model (DOM).
• Los objetos en el árbol del DOM deben ser
manipulados usando métodos en los objetos.
• Contiene todos los elementos de la página.
MÁS JS
•
•
•
•
•
•
getElementById
getElementByTagName
innerHTML
Window.onload();
Arrays
Diccionarios
