TEMÁTICA. Paginas web / Lenguaje de marcado HTML 5
PÁGINA WEB
Una página web, o página electrónica, página digital, o ciberpágina es un documento o información electrónica capaz de contener texto, sonido, vídeo, programas, enlaces, imágenes y muchas otras cosas, adaptada para la llamada World Wide Web (WWW) y que puede ser accedida mediante un navegador web. Esta información se encuentra generalmente en formato HTML o XHTML, y puede proporcionar acceso a otraspáginas web mediante enlaces de hipertexto. Frecuentemente también incluyen otros recursos como pueden ser hojas de estilo en cascada, guiones (scripts), imágenes digitales.
Una página web, o página electrónica, página digital, o ciberpágina es un documento o información electrónica capaz de contener texto, sonido, vídeo, programas, enlaces, imágenes y muchas otras cosas, adaptada para la llamada World Wide Web (WWW) y que puede ser accedida mediante un navegador web. Esta información se encuentra generalmente en formato HTML o XHTML, y puede proporcionar acceso a otraspáginas web mediante enlaces de hipertexto. Frecuentemente también incluyen otros recursos como pueden ser hojas de estilo en cascada, guiones (scripts), imágenes digitales.
IMAGEN 1. PAGINAS WEB.
VIDEO 1. ¿QUE ES UNA PAGINA WEB?
FUENTE: https://youtu.be/fgQu8KV0q8w
HTML
- Se trata de una nueva versión de HTML, con nuevos elementos, atributos y comportamientos.
- Contiene un conjunto más amplio de tecnologías que permite a los sitios Web y a las aplicaciones ser más diversas y de gran alcance. A este conjunto se le llama HTML5 y amigos, a menudo reducido a HTML5 .
Mediante el uso de las etiquetas HTML puedes subrayar textos, ponerlos en negrita, establecer encabezados, estructurar el texto en guiones, en párrafos, añadir imágenes y vínculos a otras páginas, etc. De ahí que el conocimiento de estas etiquetas sea importante para hacer páginas web, mejor dicho imprescindible.
IMAGEN 2. ETIQUETAS BÁSICAS DE HTML.
- <html>: indica el comienzo del documento HTML.
- <head>: indica que empieza la cabecera de la página. En ella se suele poner el título (<title>) de la web, una descripción y otras informaciones relacionadas con el contenido de la página.
- <body>: es el cuerpo de la página, donde va lo que se ve en el navegador al cargar una web. En el body van los textos, las imágenes y todos los contenidos de la web.
- <h1>, <h2>, etc.: son los títulos o encabezados. Se utilizan para establecer determinados textos de la página como titulares, suelen tener un tamaño de fuente mayor para diferenciarlos del resto del texto. Son importantes en el posicionamiento en buscadores.
- <a>: define los enlaces.
- <table>: es una tabla, y dentro de esta tenemos filas <tr> y celdas <td>.
- <p>: el texto dentro de esta etiqueta forma un párrafo.
- <img>: imágenes.
- <ul>: los textos dentro de esta etiqueta se estructuran en listas. Mediante el uso de <li> definimos cada guión dentro de la lista, y usando <ol> en lugar de <ul> tendremos listas ordenadas.
- <b> y <strong>: se utilizan para resaltar el texto.
- <u>: texto subrayado.
- <i> y <em>: texto en cursiva.
VÍDEO 2. ¿QUE ES HTML?
Básicamente el lenguaje HTML sirve para describir la estructura básica de una página y organizar la forma en que se mostrará su contenido, además de que HTML permite incluir enlaces (links) hacia otras páginas o documentos.
HTML es un lenguaje de marcado descriptivo que se escribe en forma de etiquetas para definir la estructura de una página web y su contenido como texto, imágenes, entre otros, de modo que HTML es el encargado de describir (hasta cierto punto) la apariencia que tendrá la página web.
<head>
<title>instituto jade system - Inicio</title>
</head>
<body>
<h1>Instituto jade system</h1>
<p>¡por que debes salir adelante , capacitate !</p>
<hr>
IMAGEN 3. MAPA MENTAL ¿PARA QUE SIRVE HTML?
IMAGEN 4. EJEMPLO DEL CÓDIGO Y COMPILACIÓN DE LA GUÍA 1.
EXPERIENCIA: Hasta en momento hemos trabajado las guías uno, dos y tres, basadas en el HTML. Esta habla sobre el DISEÑO WEB, lo cual trata de como crear paso a paso nuestra propia pagina web y conocer mas a fondo un poco mas sobre una de las tantas utilidades que tiene el internet. a continuacion dare a conocer las etiquetas utilizadas:
<!DOCTYPE html>
<html>
<head>
<title>instituto jade system - Inicio</title>
</head>
<body>
<h1>Instituto jade system</h1>
<p>¡por que debes salir adelante, capacitate !</p>
<hr>
<h2>Metodología</h2>
<p>la forma de enseñar del Instituto jade system , es 100% personalizada, computador por estudiante, horarios flexibles,de lunes a sabados, precios cómodos cursos prácticos y programas técnicos láborales</p>
<p>En el desarrollo de las estructuras curricurales se uttilizan diferentes metodologias que permiten favorecaer la apropiación del conocimiento y la aplicación del mismo en el medio laboral , profesinal y personal</p>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<title>instituto jade system - Inicio</title>
</head>
<body>
<h1>Instituto jade system</h1>
<p>¡por que debes salir adelante, capacitate !</p>
<hr>
<h2>Metodología</h2>
<p>la forma de enseñar del Instituto jade system , es 100% personalizada, computador por estudiante, horarios flexibles,de lunes a sabados, precios cómodos cursos prácticos y programas técnicos láborales</p>
<p>En el desarrollo de las estructuras curricurales se uttilizan diferentes metodologias que permiten favorecaer la apropiación del conocimiento y la aplicación del mismo en el medio laboral , profesinal y personal</p>
</body>
</html>
IMAGEN 5. EJEMPLO DEL CÓDIGO Y COMPILACIÓN DE LA GUÍA 2.
EXPERIENCIA: En esta imagen ya se puede observar mas texto que en la primera imagen, esto es por que en la guía dos se agregan mas códigos para esta actualización, a continuación daré las etiquetas que se dieron a desarrollar, gracias a la segunda guía de HTML:
<!DOCTYPE html>
<html><head>
<title>instituto jade system - Inicio</title>
</head>
<body>
<h1>Instituto jade system</h1>
<p>¡por que debes salir adelante , capacitate !</p>
<hr>
<center><h1>SISTEMA DE EDUCACION PERSONALIZADA</H1><center>
<h2>Metodología</h2>
<p>la forma de enseñar del Instituto jade system , es 100% personalizada , computador por estudiante , horarios flexibles ,de lunes a sabados , precios cómodos cursos prácticos y programas técnicos láborales</p>
<p>En el desarrollo de las estructuras curriculares se utilizan diferentes metodologías que permiten favorecer la apropiación del conocimiento y la aplicación del mismo en el medio laboral , profesional y personal</p>
<p>La metodología personalizada aplicada permite que los estudiantes alcancen competencias necesarias en las diferentes áreas del conocimiento, dentro de un sistema socioeconomico y culuta globalizado, por medio de un reconocimiento basado en: lo conceptual, la interpretación, transferencia, la aplicación y la creatividad.</>
<h1>programas técnicos laborales</h1>
Tecnico laboral en sistemas y mantenimiento.
<br>
Tecnico laboral en secretariado auxiliar contable.
<br>
<h2>Metodología</h2>
<p>la forma de enseñar del Instituto jade system , es 100% personalizada , computador por estudiante , horarios flexibles ,de lunes a sabados , precios cómodos cursos prácticos y programas técnicos láborales</p>
<p>En el desarrollo de las estructuras curriculares se utilizan diferentes metodologías que permiten favorecer la apropiación del conocimiento y la aplicación del mismo en el medio laboral , profesional y personal</p>
<p>La metodología personalizada aplicada permite que los estudiantes alcancen competencias necesarias en las diferentes áreas del conocimiento, dentro de un sistema socioeconomico y culuta globalizado, por medio de un reconocimiento basado en: lo conceptual, la interpretación, transferencia, la aplicación y la creatividad.</>
<h1>programas técnicos laborales</h1>
Tecnico laboral en sistemas y mantenimiento.
<br>
Tecnico laboral en secretariado auxiliar contable.
<br>
Matriculas abiertas
</body>
</html>
</html>
IMAGEN 6. EJEMPLO DEL CÓDIGO Y COMPILACIÓN DE LA GUÍA 3.
EXPERIENCIA: En esta imagen se ha agregado mucha mas información, esto fue gracias a las etiquetas dadas en la tercera guía de ATRIBUTOS:
<!DOCTYPE html>
<html>
<head>
<title>instituto jade system - Inicio</title>
</head>
<body>
<h1>Instituto jade system</h1>
<p>¡por que debes salir adelante , capacitate !</p>
<hr>
<center><h1>SISTEMA DE EDUCACION PERSONALIZADA</H1><center>
<h2>Metodología</h2>
<p>la forma de enseñar del Instituto jade system , es 100% personalizada , computador por estudiante , horarios flexibles ,de lunes a sabados , precios cómodos cursos prácticos y programas técnicos láborales</p>
<p>En el desarrollo de las estructuras curricurales se uttilizan diferentes metodologias que permiten favorecaer la apropiación del conocimiento y la aplicación del mismo en el medio laboral , profesinal y personal</p>
<p>La mentodologia personalizada aplicada permite que los estudiantes alcancen competencias necesarias en las diferentes áreas del conocimiento, dentro de un sistema socioeconomico y culuta globalizado, por medio de un reconocimiento basado en: lo conceptual, la interpretacion, transferencia, la aplicacion y la creatividad.</>
<h1>programas tecnicos laborales</h1>
Tecnico laboral en sistemas y mantenimiento.
<br>
Tecnico laboral en secretariado auxiliar contable.
<br>
Matriculas abiertas
<h3"el mejor de la ciudad">soporte tecnico</h3>
<i>ventas</i>
<br><em>reparaciones</em>
<br><b>mantenimiento</h>
<br><strong>accesorios</strong>
<br><u>respaldo</u>
<br><ins>garantia</ins>
<br><s>NO TENEMOS COMPETENCIAS</s>
<br><del>Nos han querido imitar</del>
<hr>
<h3tittle="ubicacion del instituto">institutojadessystem</h3>
telefono:666000-celular:3130000000
<br>E-mail: jadesystem@hotmail.com - www.jadesystem,can
</center>
<hrcolor="blue">
<hrcolor="red"width="450">
<hrcolor="yellow"width="250" size="30">
</body>
</html>
