Está en la página 1de 4

Diseño de Interfaces de Software SOF18

Hugo Alejandro Ramirez Hernandez 24/03/2022

Que es HTML
 HTML son las siglas de Hyper Text Markup Language (lenguaje de marcado de
hipertexto)
 HTML es el lenguaje de marcado estándar para crear páginas web
 HTML describe la estructura de una página web
 HTML se compone de una serie de elementos
 Los elementos HTML indican al navegador cómo mostrar el contenido
 Los elementos HTML etiquetan piezas de contenido como "esto es un título", "esto
es un párrafo", "esto es un enlace", etc.

Elementos
Los elementos de HTML son todo lo que va desde la etiqueta inicial hasta la etiqueta final:
<tagname> El contenido va aquí... </tagname>

Ejemplos de algunos elementos HTML:


<h1>Mi primer encabezado</h1>
<p>Mi primer párrafo. </p>

Elementos HTML anidados


Los elementos HTML pueden estar anidados (esto significa que los elementos pueden
contener otros elementos).
Todos los documentos HTML están formados por elementos HTML anidados.
Por ejemplo, lo siguiente contiene cuatro elementos HTML (<html>, <body>, <h1> y <p>):

El HTML no distingue entre mayúsculas y minúsculas


Las etiquetas HTML no distinguen entre mayúsculas y minúsculas: <P> significa lo mismo
que <p>.
El estándar HTML no exige que las etiquetas estén en minúsculas, pero el W3C
recomienda que estén en minúsculas en HTML, y exige que estén en minúsculas para tipos
de documentos más estrictos como XHTML.

Atributos
 Todos los elementos HTML pueden tener atributos
 Los atributos proporcionan información adicional sobre los elementos
 Los atributos siempre se especifican en la etiqueta inicial
 Los atributos suelen venir en pares nombre/valor como: name="value"

Universidad Autónoma de Querétaro 307058


Diseño de Interfaces de Software SOF18
Hugo Alejandro Ramirez Hernandez 24/03/2022

El atributo href
La etiqueta <a> define un hipervinculo. El atributo href especifica la URL de la página a la
que va el enlace.
Por ejemplo: <a href="https://www.w3schools.com">Visita W3Schools</a>

The src Attribute


La etiqueta <img> se utiliza para incrustar una imagen en una página HTML. El atributo src
especifica la ruta de la imagen que se va a mostrar.
Hay dos formas de especificar la URL en el atributo src:

1. URL absoluta
Enlaza con una imagen externa que está alojada en otro sitio web. Ejemplo:
src="https://www.w3schools.com/images/img_girl.jpg".
Las imágenes externas pueden estar bajo copyright. Si no obtienes permiso para utilizarla,
puedes estar violando las leyes de derechos de autor. Además, no puedes controlar las
imágenes externas; pueden ser eliminadas o cambiadas repentinamente.
2. URL relativa
Enlaza con una imagen que está alojada dentro del sitio web. En este caso, la URL no
incluye el nombre del dominio. Si la URL comienza sin una barra, será relativa a la
página actual. Por ejemplo: src="img_girl.jpg". Si la URL comienza con una barra, será
relativa al dominio. Ejemplo: src="/images/img_girl.jpg".

Los atributos width y height


La etiqueta <img> también debe contener los atributos width y height, que especifican la
anchura y la altura de la imagen (en píxeles)
Por ejemplo: <img src="img_girl.jpg" width="500" height="600">

El atributo alt
El atributo alt requerido para la etiqueta <img> especifica un texto alternativo para una
imagen, si la imagen por alguna razón no puede ser mostrada. Esto puede deberse a una
conexión lenta, o a un error en el atributo src, o si el usuario utiliza un lector de pantalla.

El atributo style
El atributo style se utiliza para añadir estilos a un elemento, como el color, la fuente, el
tamaño, etc.

Universidad Autónoma de Querétaro 307058


Diseño de Interfaces de Software SOF18
Hugo Alejandro Ramirez Hernandez 24/03/2022

Atributo lang
Siempre se debe incluir el atributo lang dentro de la etiqueta <html>, para declarar el
idioma de la página web. Esto está pensado para ayudar a los motores de búsqueda y a los
navegadores.
Los códigos de país también pueden añadirse al código de idioma en el atributo lang. Así,
los dos primeros caracteres definen el idioma de la página HTML, y los dos últimos el país .

El atributo title
 El atributo title define alguna información extra sobre un elemento.
 El valor del atributo title se mostrará como un tooltip al pasar el ratón por encima
del elemento.
 El estándar HTML no exige que los nombres de los atributos se escriban en
minúsculas.
 El atributo title (y todos los demás atributos) puede escribirse con mayúsculas o
minúsculas como title o TITLE.
 Sin embargo, el W3C recomienda escribir los atributos en minúsculas en HTML, y
exige que se escriban en minúsculas en los tipos de documentos más estrictos
como XHTML.

Etiquetas HTML básicas


 Todos los documentos HTML deben comenzar con una declaración de tipo de
documento: <!DOCTYPE html>.
 El documento HTML propiamente dicho comienza con <html> y termina con
</html>.
 La parte visible del documento HTML está entre <body> y </body>.
Encabezados HTML

 Los encabezados HTML se definen con las etiquetas <h1> a <h6>.


 <h1> define el encabezado más importante. <h6> define el encabezamiento menos
importante.
Párrafos HTML
Los párrafos HTML se definen con la etiqueta <p>
Enlaces HTML
Los enlaces HTML se definen con la etiqueta <a>.

Imágenes HTML

Universidad Autónoma de Querétaro 307058


Diseño de Interfaces de Software SOF18
Hugo Alejandro Ramirez Hernandez 24/03/2022

Las imágenes HTML se definen con la etiqueta <img>.


El archivo de origen (src), el texto alternativo (alt), la anchura y la altura se proporcionan
como atributos.

Editores de textos
HTML puede ser creado en cualquier tipo de editor de texto, algunos ejemplos son:

 Sublime Text.
 Netbeans.
 JetBrains Webstorm.
 Microsoft Visual Studio for Web.
 Kompozer.
 Notepad++
 Aptana Studio.
 CoffeeCup Free Editor.

Bibliografía
HTML Editors. (s. f.). HTML. Recuperado 24 de marzo de 2022, de
https://www.w3schools.com/html/html_editors.asp
Castellano, E. S. P. L. (s. f.). Los 10 mejores editores de HTML. Programación en Castellano.
Recuperado 24 de marzo de 2022, de
https://programacion.net/articulo/los_10_mejores_editores_de_html_1197

Universidad Autónoma de Querétaro 307058

También podría gustarte