Segunda entrega de nuestro curso de HTML y CSS. Por si alguno os lo habéis perdido la semana pasada hablamos sobre qué se necesita para poder seguir el curso y cuál era la motivación de este. Esta semana comenzaremos dando nociones básicas sobre la programación en HTML que nos ayudarán a progresar, creando en esta entrega nuestra primera web.
Como en todo lenguaje de programación existen unas nociones básicas para lograr entender la técnica que posee el lenguaje y que nos ayudarán a entender la mecánica de este. En el caso de HTML estas nociones básicas son las etiquetas y los argumentos. Las etiquetas están muy relacionadas con el aspecto visual de la página mientras que los parámetros podrían decir que son un complemento que poseen las etiquetas. Hay que indicar también que cada etiqueta está relacionada con una serie de argumentos, lo que ya de entrada nos hace ver que no todas las etiquetas van a tener los mismos argumentos.
Etiquetas
Aunque lo hemos adelantado anteriormente y hemos vislumbrado en qué consisten, las etiquetas indican al navegador cómo debe interpretar este la información.
Dentro de las etiquetas, se puede distinguir principalmente dos tipos:
Etiquetas vacias
Se utilizan principalmente para introducir elementos a los que no se les asocia un tipo de forma concreto, pudiendo utilizar este tipo de etiquetas los saltos de línea, líneas horizontales, líneas verticales, ….
A este tipo de etiquetas las corresponde el siguiente formato:
Etiquetas con contenido o contenedoras
A diferencia de las anteriores, estas etiquetas hacen la poción de página web que abarcan esté supeditada a las características de la etiqueta y de los argumentos que sean utilizados en esta. También hay que decir que a diferencia con las anteriores, estas poseen un inicio y un fin, o lo que es lo mismo:
....
El fin de una etiqueta se indica con «/», lo que hace que todo lo que se encuentre dentro del comienzo y del fin se interprete de acuerdo a la etiqueta y los argumentos.
También hay que indicar que una etiqueta puede contener otras etiquetas, o lo que es lo mismo:
Nota: Es muy importante abrir y cerrar las etiquetas cuando se corresponde, ya que el cierre de estas en un lugar que no corresponde puede provocar un comportamiento anómalo a la hora de interpretar la página web por parte del navegador.
Un ejemplo de cómo se pueden utilizar las etiquetas podría ser poner en cursiva y negrita un texto de forma simultánea:
¡Hola!
Nota: no existe un orden en este caso para aplicar el formato al texto, pero si que hay que tener en cuenta que posteriormente cuando veamos más elementos hay que respetar el orden (más que nada porque existe un orden lógico para determinadas cosas) y hay que recordar que siempre se debe cerrar las etiquetas en el orden contrario a que se ha abierto, es decir, que la última que se ha abierto será primera en ser cerrada.
Por ejemplo:
3>2>1>
Argumentos
Como ya hemos indicado con anterioridad, los argumentos se encargan de dar formato a las etiquetas, y aunque ya veremos con más detalle que argumentos existen, hay que decir que estos indican por ejemplo el tamaño, colocación en la página, acción al hacer click con el ratón, ….
Que mejor que ver esto haciendo uso de un ejemplo:
Un encabezado
Con esto lo que hemos hecho ha sido crear un encabezado, cuyo contenido se va a alinear en el centro de la página y que va a tener el valor de «Un encabezado».
Otro ejemplo:
Texto de prueba
En este caso tenemos un texto que además de ser de color azul va a estar en negrita.
Mi primera web
Toda página web en HTML debe tener una serie de etiquetas fijas que son las que se encargan de que el navegador interprete esta como tal.
La etiqueta se debe utilizar siempre en cualquier fichero html, y su final debe cerrarse siempre al final del documento ().
La etiqueta
va justo después de la apertura de la anterior y se debe cera antes de que comience el cuerpo. En este caso, dentro de esta etiqueta se puede indicar el título de la página que se mostrará en el navegador, las hojas de CSS que utiliza el documento y se pueden declarar scripts o bien indicar que documento o documentos de scripts utiliza.La etiqueta
es el cuerpo del documento y abarca todos lo que se va a interpretar por el navegador. Su etiqueta de cierre () debe ser cerrada siempre antes de la de html.Es la hora de que cojáis vuestro editor de texto y copiéis el siguiente código en un documento, le podéis poner el nombre que queráis, pero tiene que tener la terminación .html para que lo pueda interpretar el navegador.
Código:
Mi primera página web utilizando HTMLCurso gratuito de HTML y CSS de RedesZone />
Una vez hayáis guardado el siguiente código en un fichero, los buscáis y los abrís haciendo uso del navegador. Ya tenemos nuestra primera página web. Puedes hacer algunos cursos para aprender C y C++.
Como ya hemos aprendido lo más básico, en la siguiente entrega del curso aprenderemos todo lo relacionado con la creación de párrafos y de cómo dar formato al texto.
