Elementos HTML
Los elementos del HTML deben tener una serie de tags, con los cuales se define de que tipo son y esto afecta sus caracteristicas.
Esto es un elemento con tag h1
Esto es un elemento con tag h2
Esto es un elemento con tag h3
Esto es un elemento con tag h4
Esto es un elemento con tag h5
Esto es un elemento con tag h6
Tags p
Esto es un tag usando p, se usa para parrafos
Anchor Element
Este tipo de elementos es usado para hacer hipervinculos, los cuales tienen la caracteristica de que se ven asi. Al hacer click sobre ellos se dirigira a la ruta especificada en el href que se asigna en el tag. Si se referencia un elemento local no es necesario toda la ruta sino la necesaria para encontrarlo, caso diferente a cuando es un elemento externo de nuestra pagina web.
Su declaracion se puede ver con un ejemplo en la siguiente imagen.
h1>Imagenes
Para agregar imagenes se debe tener en cuenta algunas buenas practicas como el uso del atributo alt, es un nombre que se le da a la imagen que sea entendible para el caso en que la pagina falle y no sea posible procesar la imagen.
Videos
Tambien es posible agregar videos de una pagina externa o de un archivo local, se debe definir el width y el height que se le desea asignar al espacio del video. Adicionalmente se puede usar controls si se desea agregar el poton de play y volumen, y por ultimo un type para especificar el tipo del video.
Se usa el tag video, en este se asignan los valores de width y de height, en su interior se coloca el tag source, en este se incluye el src, es decir la ruta del video, y el type.
Listas
Existen como tal diferentes tipos de listas en HTML.
- Lista
- Sin orden
- Lista
- Con orden
Parent and Child Elements
Aca se introduce un nuevo concepto, el concepto de padres he hijos, el cual se ha utilizado anteriormente:
Div
El uso del tag div permite agrupar los elementos de diferentes maneras con el fin de luego organizarlos en la pagina de una manera mas sencilla y con esto llevar todo el bloque a la posicion que uno desee. Puede tener el atributo class.
Introduction to Semantic HTML
Al construir una pagina web se usa una combinacion de HTML semantico y no semantico, esto permite colocar informacion adicional que es util para la pagina web.
En la parte semantica se usan elementos basados en su significado, no por la manera en que son presentados. Elementos como span y div son elementos no semanticos.
Entonces ¿por qué motivo se usaria HTML semantico?
- Accesibilidad: Permite que la pagina sea accesible desde dispositivos mobiles e incluso para personas con ciertas discapacidades.
- SEO: Esto mejora el motor de busquedas en la pagina web, entre mejor SEO tenga es mas facil de ser encontrada.
- Facilidad de ser entendido: Permite un mejor entendimiento del codigo para un futuro mantenimiento.
Header and Nav
El uso del tag header permite un mayor entendimiento en el codigo, ya que tambien es posible hacer esto con el uso de un div, pero es mas claro para otro esarrollador que sea con la primera opcion.
Aunque estos cambios no hagan nada visualmente, permiten un mejor manejo del codigo.
Main and Footer
Tambien existen los elementos main y footer, igual al caso anterior permiten un mejor orden en la pagina. En la zona main se encapsula la parte principal de la pagina web y en el footer la informacion respecto al pie de pagina.
Article and Section
Este formato permite encapsular segun su contnido, tiene sentido que una seccion contenga articulos por lo cual esto permite que se plantee un mejor orden en la pagina web.
Adicionalmente, el uso de article permite que tenga una mejor visualizacion desde un aparato electronico de lectura.
The Aside Element
Algunos usos para el aside son:
- Bibliografias
- Endnotes
- Comentarios
- Pull quotes
- Editorial sidebars
- Additional information
Setting Up Your Domain
How Websties Work
Web Hosting
Luego de crear una pagina web, si se desea colocar de una manera publica para poder ser accedida por cualquier persona se debe tener un web hosting server, en el cual se almacenaran los archivos en una ubicacion en la cual pueden ser accedidas por otros usuarios.
Generalmente son almacenadas por empresas las cuales ofrecen este servicio.
Domain Names
Esta es una manera mas humana de reconocer a un sitio web, es una direccion que permite tener un acceso a la pagina web. Por detras, lo que realmente se esta haciendo es acceder a una deireccion IP fija, en la cual se encuentra la pagina.
Realmente si se tiene la informacion de la direccion IP es posible acceder a la pagina con ella, pero si tambien se adquiere un domain name, es posible acceder a ella por este, que es la manera como normalmente se hace.
Choosing a Domain Name
El nombre del dominio consiste realmente de dos partes:
- El domain de segundo nivel
- El Top-Level Domain
En el caso, por ejemplo de google.com, la parte de google es el dominio de segundo nivel, mientras que el .com es el Top-Level Domain.
Si realmente se quiere ver todo el cuerpo, se debe tener en cuenta lo siguiente:
