"I've seen the FUTURE. It's in my BROWSER"
by jjpeleato.com | #CW17 #HTML5SEO
Mi nombre es José J. Peleato Pradel.
by jjpeleato.com | #CW17 #HTML5SEO
by jjpeleato.com | #CW17 #HTML5SEO
Un lenguaje de marcado o lenguaje de marcas es un método de codificar un documento, que junto al texto, incorpora etiquetas o marcas que contienen información adicional acerca de la estructura del texto o su presentación.
by jjpeleato.com | #CW17 #HTML5SEO
Los lenguajes de marcas NO son lenguajes de programación.
No tienen funciones aritméticas o variables, como si poseen los lenguajes de programación.
by jjpeleato.com | #CW17 #HTML5SEO
Los lenguajes de marcas se llaman así por la práctica tradicional de marcar los manuscritos con instrucciones de impresión en los márgenes.
En la época de la imprenta, esta tarea ha correspondido a los marcadores, que indicaban el tipo de letra, el estilo y el tamaño, así como la corrección de errores, para que otras personas compusieran la tipografía.
by jjpeleato.com | #CW17 #HTML5SEO
Existen tres tipos de marcado:
by jjpeleato.com | #CW17 #HTML5SEO
World Wide Web (WWW) o red informática mundial es un sistema de distribución de documentos de hipertexto o hipermedios interconectados vía internet.
by jjpeleato.com | #CW17 #HTML5SEO
La WWW se desarrolló en Ginebra en las instalaciones del CERN (Organización Europea para la Investigación Nuclear) entre marzo de 1989 y diciembre de 1990 por el inglés Tim Berners-Lee y el belga Robert Cailliau.
by jjpeleato.com | #CW17 #HTML5SEO
Es importante saber que web o www no son sinónimo de Internet, la web es un subconjunto de Internet que consiste en páginas a las que se puede acceder usando un navegador.
Internet es la red de redes donde reside toda la información. Tanto el correo electrónico, como FTPs, juegos, etc. son parte de Internet, pero no de la Web.
by jjpeleato.com | #CW17 #HTML5SEO
Conocido como el padre de la Web es un científico de la computación que estableció la primera comunicación entre un cliente y un servidor usando el protocolo HTTP en noviembre de 1989.
by jjpeleato.com | #CW17 #HTML5SEO
Él y su grupo crearon lo que por sus siglas en inglés se denomina Lenguaje HTML (HyperText Markup Language), el protocolo HTTP (HyperText Transfer Protocol) y el sistema de localización de objetos en la web URL (Uniform Resource Locator).
by jjpeleato.com | #CW17 #HTML5SEO
En 1989, el CERN era el nodo de Internet más grande de Europa y Berners-Lee vio la oportunidad de unir Internet e hipertexto (HTTP y HTML), de lo que surgiría la World Wide Web.
by jjpeleato.com | #CW17 #HTML5SEO
La primera página web de Internet fue creada por Tim Berners-Lee en 1991 alojada en el primer servidor web del mundo: NeXT Computer que se encontraba en el CERN y fue puesto en línea el 6 de agosto de 1991.
En octubre de 1994 Tim Berners-Lee fundo el consorcio World Wide Web (W3C). Actualmente sigue siendo el presidente y director.
by jjpeleato.com | #CW17 #HTML5SEO
World Wide Web Consortium (W3C), es un consorcio internacional que generan y definen recomendaciones y estándares que aseguran el crecimiento de la World Wide Web.
by jjpeleato.com | #CW17 #HTML5SEO
CSS | DOM | HTML | XHTML |
XML | SOAP | SVG | ... |
by jjpeleato.com | #CW17 #HTML5SEO
HTML, es un estándar que significa Lenguaje de Marcado para Hipertextos (HyperText Markup Language) es el elemento de construcción más básico de una página web y se usa para crear y representar visualmente una sitio web.
HTML es una ampliación/extensión de SGML (Standard Generalized Markup Language), un estándar para la definición de lenguajes de marcas.
by jjpeleato.com | #CW17 #HTML5SEO
HTML determina el contenido de la página web, pero no su funcionalidad.
Otras tecnologías distintas de HTML son usadas generalmente para describir la apariencia/presentación de una página web (CSS) o su funcionalidad (JavaScript).
by jjpeleato.com | #CW17 #HTML5SEO
HTML usa "markup" o marcado para anotar textos, imágenes, y otros contenidos que se muestran en el navegador Web.
El lenguaje de marcas HTML incluye "elementos/etiquetas" especiales tales como head, title, body, header, article, section, p, div, span, img, y muchos más.
by jjpeleato.com | #CW17 #HTML5SEO
HiperText se refiere a enlaces que conectan una página Web con otra, ya sea dentro de una página web o entre diferentes sitios web.
Los hipervínculos son un aspecto fundamental de la Web. Al subir contenido a Internet y vincularlo a páginas de otras personas, te haces participante activo de esta red mundial.
by jjpeleato.com | #CW17 #HTML5SEO
<!DOCTYPE html>
<html lang="es-ES">
<head>
<meta charset="utf-8">
<title>HTML< /title>
</head>
<body>
</body>
</html>
by jjpeleato.com | #CW17 #HTML5SEO
XHTML (eXtensible HyperText Markup Language) es a XML como HTML es a SGML. Es decir, XHTML es un lenguaje de marcado que es similar al HTML, pero con una sintaxis más estricta y expresada como XML.
http://librosweb.es/libro/xhtml/
by jjpeleato.com | #CW17 #HTML5SEO
<?xml version="1.0"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"https://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="https://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html;
charset=utf-8" />
<title>XHTML< /title>
</head>
<body>
</body>
</html>
by jjpeleato.com | #CW17 #HTML5SEO
by jjpeleato.com | #CW17 #HTML5SEO
HTML5 es la última versión de HTML. Quinta revisión del lenguaje básico de WWW donde establece una serie de elementos y atributos que reflejan el uso típico de los sitios web modernos.
by jjpeleato.com | #CW17 #HTML5SEO
Diseñado para ser utilizable por todos los desarrolladores de Open Web, los recursos sobre las tecnologías se clasifican en varios grupos según su función:
by jjpeleato.com | #CW17 #HTML5SEO
by jjpeleato.com | #CW17 #HTML5SEO
by jjpeleato.com | #CW17 #HTML5SEO
by jjpeleato.com | #CW17 #HTML5SEO
by jjpeleato.com | #CW17 #HTML5SEO
by jjpeleato.com | #CW17 #HTML5SEO
https://www.w3schools.com/html/
https://developer.mozilla.org/es
by jjpeleato.com | #CW17 #HTML5SEO
by jjpeleato.com | #CW17 #HTML5SEO
Elemento | Descripción |
---|---|
<!doctype html> | Define que el documento está bajo el estándar de HTML 5. |
<html> | Representa la raíz de un documento HTML o XHTML. Todos los demás elementos deben ser descendientes de este elemento. |
by jjpeleato.com | #CW17 #HTML5SEO
Elemento | Descripción |
---|---|
<head> | Representa una colección de metadatos acerca del documento, incluyendo enlaces a, o definiciones de, scripts y hojas de estilo. |
<title> | Define el título del documento, el cual se muestra en la barra de título del navegador o en las pestañas de página. Solamente puede contener texto y cualquier otra etiqueta contenida no será interpretada. |
by jjpeleato.com | #CW17 #HTML5SEO
Elemento | Descripción |
---|---|
<base> | Define la URL base para las URLs relativas en la página. <base href="http://www.example.com/"> |
<link> | Usada para enlazar JavaScript y CSS externos con el documento HTML actual. |
by jjpeleato.com | #CW17 #HTML5SEO
Elemento | Descripción |
---|---|
<meta> | Define los metadatos que no pueden ser definidos usando otro elemento HTML. |
<style> | Etiqueta de estilo usada para escribir CSS en línea. |
by jjpeleato.com | #CW17 #HTML5SEO
Elemento | Descripción |
---|---|
<script> | Define ya sea un script interno o un enlace hacia un script externo. El lenguaje de programación es JavaScript |
<noscript> | Define un contenido alternativo a mostrar cuando el navegador no soporta scripting. |
by jjpeleato.com | #CW17 #HTML5SEO
Elemento | Descripción |
---|---|
<body> | Representa el contenido principal de un documento HTML. Solo hay un elemento <body> en un documento. |
<div> | Representa un contenedor genérico sin ningún significado especial. |
<header> | Define la cabecera de una página o sección. Usualmente contiene un logotipo, el título del sitio Web y una tabla de navegación de contenidos. |
by jjpeleato.com | #CW17 #HTML5SEO
Elemento | Descripción |
---|---|
<footer> | Define el pie de una página o sección. Usualmente contiene un mensaje de derechos de autoría, algunos enlaces a información legal o direcciones para dar información de retroalimentación. |
<nav> | Define una sección que solamente contiene enlaces de navegación |
by jjpeleato.com | #CW17 #HTML5SEO
Elemento | Descripción |
---|---|
<section> | Define una sección en un documento. |
<article> | Define contenido autónomo que podría existir independientemente del resto del contenido. |
by jjpeleato.com | #CW17 #HTML5SEO
Elemento | Descripción |
---|---|
<aside> | Define algunos contenidos vagamente relacionados con el resto del contenido de la página. Si es removido, el contenido restante seguirá teniendo sentido |
<h1> - <h6> | Los elemento de cabecera implementan seis niveles de cabeceras de documentos; <h1> es la de mayor y <h6> es la de menor importancia. Un elemento de cabecera describe brevemente el tema de la sección que introduce. |
by jjpeleato.com | #CW17 #HTML5SEO
Elemento | Descripción |
---|---|
<address> | Define una sección que contiene información de contacto. |
<main> | Define el contenido principal o importante en el documento. Solamente existe un elemento <main> en el documento. |
by jjpeleato.com | #CW17 #HTML5SEO
Elemento | Descripción |
---|---|
<time> | Representa un valor de fecha y hora; el equivalente legible por máquina puede ser representado en el atributo datetime. |
by jjpeleato.com | #CW17 #HTML5SEO
Elemento | Descripción |
---|---|
<video> | Representa un video y sus archivos de audio con la interfaz necesaria para reproducirlos. |
<audio> | Representa un sonido o stream de audio. |
by jjpeleato.com | #CW17 #HTML5SEO
Elemento | Descripción |
---|---|
<source> | Permite a autores especificar recursos multimedia alternativos para los elementos multimedia como <video> o <audio>. |
<embed> | Representa un punto de integración para una aplicación o contenido interactivo externo que por lo general no es HTML. |
by jjpeleato.com | #CW17 #HTML5SEO
Elemento | Descripción |
---|---|
<canvas> | Representa un área de mapa de bits en el que se pueden utilizar scripts para renderizar gráficos como gráficas, gráficas de juegos o cualquier imagen visual al vuelo. |
<svg> | Define una imagen vectorial embebida. |
<math> | Define una fórmula matemática. |
by jjpeleato.com | #CW17 #HTML5SEO
Elemento | Descripción |
---|---|
<datalist> | Representa un conjunto de opciones predefinidas para otros controles. |
<keygen> | Genera claves asimétricas utilizando varios algoritmos. Dos de los algoritmos predeterminados son: RSA y DSA |
by jjpeleato.com | #CW17 #HTML5SEO
Elemento | Descripción |
---|---|
<output> | Representa el resultado de un cálculo. |
<progress> | Representa el progreso de finalización de una tarea. |
by jjpeleato.com | #CW17 #HTML5SEO
by jjpeleato.com | #CW17 #HTML5SEO
by jjpeleato.com | #CW17 #HTML5SEO
by jjpeleato.com | #CW17 #HTML5SEO
Simplemente, GRACIAS
by jjpeleato.com | #CW17 #HTML5SEO