HTML

 CENTRO DE BACHILLERATO TECNOLÓGICO AGROPECUARIO Y CIENCIAS DEL MAR n.218

Josué Francisco Valadez Rios

Modulo IV Submodulo II

PRACTICA DE HTML.



INTRODUCCION

HTML, siglas en inglés de HyperText Markup Language, hace referencia al lenguaje de marcado para la elaboración de páginas web. Es un estándar que sirve de referencia del software que conecta con la elaboración de páginas web en sus diferentes versiones, define una estructura básica y un código para la definición de contenido de una página web, como texto, imágenes, videos, juegos, entre otros.

en la siguiente rpactica,aprenderemos a elaborar una pagina web desde cero utilizando nuestro programa de bloc de notas.


DESARROLLO.

como primer paso que haremos, abriremos nuestro bloc de notas, esto lo podemos hacer abriendo el buscador de programas en nuestro ordenador.

una vez lo hayamos abierto, podremos empezar a escribir en el lo que se necesitara para crear nuestra pagina web y para ello lo primero que haremos sera escribir lo siguiente en el bloc de notas:

Es importante recalcar que se tiene que colocar primero el <html> para que esto pueda funcionar correctamente y despues lo cerraremos con el comando </html> asi de esta forma haremos que se cierre por completo.

otra cosa importante es el <body> y el <head> que nos sirve para determinar las partes delcuerpo de nuestra pagina o lineas de comandos, para saber donde ira destinada cosa que le queramos implementar.

Despues de eso, lo vamos a guardar de una manera especifica para que al abrirlo, abra directamente la pagina y no el bloc de notas.

para eso nos dirigimos a archivo y después a guardar como, después de eso, en el nombre borraremos el *.txt y lo reemplazaremos por el nombre que queramos siempre y cuando al final de esta, le pongamos un .html y ahora si lo guardamos, y si logramos hacer todo bien, podremos abrir la pagina web.

Así es como se mostraría la pagina una vez que la abrimos.

=================================================================

ETIQUETAS DE HTML

Antes de entrar en materia, conviene explicar de que vamos a hablar. Las etiquetas HTML son pequeños bloques de código, que indican al navegador como debe interpretar el contenido recogido entre dichas etiquetas. Por ejemplo, si queremos «pintar» un párrafo de texto, hay una etiqueta especifica para que el navegador interprete ese texto como un párrafo. Estas etiquetas cuentan además con atributos que podemos añadir y que en sí, pueden determinar como será el comportamiento específico que tendrá la etiqueta. Te dejo por aquí un listado de atributos HTML para complementar esta entrada.

A continuación voy a indicarte cuales son las etiquetas HTML más usadas y también te indicaré su finalidad. Voy a centrarme en las principales etiquetas y sobre todo las que están soportadas en HTML 5. Ahí van:

ETIQUETAS INICIALES O DE RAÍZ

<!DOCTYPE html> Indica al navegador que el documento está basado en el estándar HTML5

<html> </html> Representa la raíz de un documento HTML. Todos los demás elementos de la estructura HTML deben ser recogidos dentro de estas etiquetas.

METADATOS DEL DOCUMENTO

<head> </head> Representa una colección de metadatos acerca del documento, incluyendo enlaces a, o definiciones de, scripts y hojas de estilo. El resto de etiquetas de metadatos, irán recogidas dentro de las etiquetas de apertura y cierre del head. Importante explicar que estos metadatos del documento, es información para el navegador y no contenido que será visible en la página web. A excepción de la etiqueta <title> que veremos a continuación.

<title> </title> Etiqueta usada para definir el título de la página web.

<link> Se usa para enlazar recursos externos al documento HTML. El ejemplo más común son las hojas de estilos CSS.

<meta> Etiqueta usada para definir otros metadatos que no se pueden definir con una etiqueta HTML especifica. Por ejemplo para definir el autor del sitio, o la descripción del mismo.

<style> </style> Etiquetas usadas para introducir código CSS en línea, es decir, en el propio documento HTML.

ETIQUETAS DE SECCIONES O PARA ESTRUCTURAR EL HTML

<body> </body> Al contrario que la etiqueta de metadatos <head>, todo lo que quieras mostrar en la página web debe ir recogido dentro de las etiquetas de apertura y cierre de <body>. Este contenido será el que se muestre en la web.

<nav> </nav> Usadas para definir el contenido que será la sección de navegación de la web.

<main> </main> Se usa para definir el contenido principal del documento. Solamente puede existir uno por documento.

<section> </section> Define una sección del documento

<article> </article> Define contenido independiente de la web.

<aside> </aside> Dentro de estas etiquetas suele alojarse el contenido adicional de la web. Suele ser contenido relacionado con la web pero de poca importancia

<h1>,<h2>,<h3>,<h4>,<h5>,<h6> Son etiquetas HTML muy importantes, ya que son usadas para jerarquizar el contenido de la web. Las etiquetas se usan para explicar brevemente el contenido que irá a continuación.

<header> </header> Se usan para definir la cabecera la página web. Suele contener el logotipo, menú de navegación, etc.

<footer> </footer> Usadas para definir el pie de página.

ETIQUETAS PARA INCRUSTAR CONTENIDO

<img> Etiqueta para «pintar» una imagen en la página web.

<iframe> </iframe> Es una etiqueta que sirve para anidar otro documento HTML dentro del documento principal.

<embed> Usada para integrar una aplicación o contenido interactivo externo que no suele ser HTML.

<object> </object> Utilizada llamar a un recurso externo de la web. Este recurso será tratado como una imagen, o un recurso externo para ser procesado por un plugin.

<video> </video> Se usa para reproducir video en la página web junto a sus archivos de audio y capciones asociadas.

<audio> </audio> Usada para cargar un archivo de audio o stream de audio.

<source> Permite a autores especificar recursos multimedia alternativos para las etiquetas de <video> o <audio>

<svg> </svg> Se usa para llamar a una imagen vectorizada.


CONCLUCION.

La aplicación del bloc de notas nos puede ser útil para la creación de una pagina web y ya sea con fines educativos o mas avanzados, esto nos servirá como aprendizaje para futuros proyectos que tengamos que llevar a cabo con esta herramienta tan útil.

Comentarios

Entradas más populares de este blog

BASE DE DATOS EN LARAGON

MIS PRACTICAS

EXPORTACION E IMPORTACION DE DATOS