Include Import: INSERTAR IMAGEN EN HTML

Que tal programadores !!

El día de hoy veremos como insertar una imagen en html.

Comencemos !!

Antes de pasar a la etiqueta que nos permitirá insertar una imagen necesitamos saber lo siguiente:

Es recomendable que dentro de una carpeta que se llame "insertar imagenes" (o el nombre que gusten) este otra carpeta llamada "imagenes" y nuestros html como en la siguiente representación:

al abrir la carpeta

Al hacer lo anterior nos facilita el llevar y traer nuestra pagina a cualquier lado ademas de que la ruta que se le colocara a las imagenes sera corta por ejemplo esta imagenes/miimagen.extencion de lo contrario sera C:/users/usuario/imagenes/micarpeta/miimagen.extencion y esto provocara que cuando quieras llevártela en tu usb tendras que buscar las imagenes insertadas y si se te olvida alguna no correra tu pagina web.

Para insertar una imagen es muy sencillo solo necesitaremos una etiqueta llamada <img> vamos a ver como se utiliza

Primero debemos escribir la estructura necesaria para que podamos visualizar nuestra pagina de html CLIC PARA CONOCER LA ESTRUCTURA BASICA.
Vamos a colocar entre las etiquetas <body>... </body> el siguiente codigo:

en donde extencion puede ser: jpg, png, gif,... etc.(formatos de imagen).

3. Si la imagen excede los limites deseados o nosotros deseamos que se vea mas grande vamos a escribir los atributos width (ancho) y height (alto) y colocaremos el numero de pixeles de la imagen (por lo general para que se vea una pagina bien en cualquier pantalla son 1000 px)
<img src="ruta/de/imagen.extencion" width="600" height="300">

AHORA HAGAMOS UN EJEMPLO !!

En mi carpeta de imagenes tengo una imagen que se llama logo y es de extencion .png tambien veo que sus dimensiones son de 312px de ancho y 174px de altura por lo que la hare mas grande.
El código para colocar esta imagen SIN anchura ni tamaño seria el siguiente: