PERIDO 1

TEMÁTICA: Páginas web // Lenguaje de marcado HTML5

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 otras pá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, entre otros.

Las páginas web pueden estar almacenadas en un equipo local o en un servidor web remoto. El servidor web puede restringir el acceso únicamente a redes privadas, por ejemplo, en una intranet corporativa, o puede publicar las páginas en la World Wide Web. El acceso a las páginas web es realizado mediante una transferencia desde servidores, utilizando el protocolo de transferencia de hipertexto (HTTP). Clic para seguir leyendo

.
VÍDEO 1 .¿Qué es una página web?


HTML es un lenguaje de marcado que se utiliza para el desarrollo de páginas de Internet. Se trata de la sigla que corresponde a HyperText Markup Language, es decir, Lenguaje de Marcas de Hipertexto, que podría ser traducido como Lenguaje de Formato de Documentos para Hipertexto


VÍDEO 2. ¿Qué es HTML?

IMAGEN 1. 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.

EXPERIENCIA SIGNIFICATIVA 1.Este tema no lo habíamos visto entonces es algo nuevo para nosotros, es una experiencia significativa ya podemos y vamos a estar en constante aprendizaje tratando cada vez de mejorar nuestra pagina web de poco en poco hasta llegar en tener una excelente pagina nos dimos cuenta el verdadero amor que es tenerlo a esto incriptar los códigos formatos saber que si escribimos algo mas ya la embarramos y no va a salir correctamente nosotros pensamos que todo es color de rosa pero en realidad detrás de pagina hay una persona que dejo unos códigos incriptados para que este corra excelente y para que nosotros nos sentamos augustos en la pagina que estamos visitando hasta ahora creamos la pagina y una que otra cosas.


IMAGEN 2Compilación de la guía 1
FUENTE. Samuel Neira Sua


<!DOCTYPE html>
<html>
<head>
 <title>instituto Zafiro system - Inicio</title>
</head>
<body>
<h1>Instituto Zafiro system</h1>
<p>¡por que debes salir adelante, capacitate !</p>
<hr>
<h2>Metodología</h2>
<p>la forma de enseñar del Instituto Zafiro 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>


EXPERIENCIA SIGNIFICATIVA 2. En esta nueva actividad comenzamos a ver nuevas etiquetas para que nuestra pagina se encuentre mas atractiva y cada vez se valla pareciendo a una pagina o una interfaz oficial


IMAGEN 3. Compilación de la Guía 2
FUENTE. Samuel Neira Sua

las etiquetas que utilizamos esta vez esta guía nos demoramos en trabajarla ya que dejo de ser temática de periodo pero trataremos de seguir subiendo contenido de esta actividad espero que le sirva a cualquier persona que quiera comenzar en el mundo tecnológico o que valla mal en tegnologia básica.


<!DOCTYPE html>
<html>
<head>
 <title>instituto Zafiro system - Inicio</title>
</head>
<body>
<h1>Instituto Zafiro 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 Zafiro 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>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;Matriculas abiertas




IMAGEN 4.. Compilación de la Guía 3


FUENTE. Samuel Neira Sua

<!DOCTYPE html>
<html>
<head>
 <title>instituto Zafiro system - Inicio</title>
</head>
<body>
<h1>Instituto Zafiro 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 Zafiro 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>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;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">institutozafirosystem</h3>
telefono:666000-celular:3130000000
<br>E-mail: zafirosystem@hotmail.com - www.zafirosystem,can
</center>
<hrcolor="blue">
<hrcolor="red"width="450">
<hrcolor="yellow"width="250" size="30">
</body>
</html>


En la tercera guía descubrimos algunos códigos capaces de subrayar, tachar o agregar color.


Los atributos se usan para darleinformación adicional a un elemento (etiqueta) y así modificarlo.

<i>texto<i>: coloca el texto en cursiva.
<em>texto</em>: cursiva para marcar texto importante,los buscadores lo toman mas en cuenta.
<b>texto</b>: coloca el texto en negrilla.
<strong>texto</strong>: negrilla para marcar texto importante, los buscadores lo toman en cuenta.
<u>texto</u>: coloca el texto subrayado.
<ins>texto</s>: coloca el texto insertado (subrayado).
<s>texto</s>: coloca el texto techado.
<del>texto</del>: coloca el texto eliminado (tachado)
ATRIBUTOS
tittle="nuevo": atributo que agrega un tooltip al elemento.
color="blue": atributo que agrega un color al elemento (los colores son en ingles).
width="400": atributo que agrega un ancho al elemento.

size="50": atributo que agrega una talla al elemento


ATRIBUTOS

tittle="nuevo": atributo que agrega un tooltip al elemento.
color="blue": atributo que agrega un color al elemento (los colores son en ingles).

width="400": atributo que agrega un ancho al elemento.
size="50": atributo que agrega una talla al elemento...


No hay comentarios.:

Publicar un comentario