Guía de Enlaces e Imágenes

Sintaxis de Enlaces

Enlaces en Línea

[Texto del enlace](https://www.markdownlang.com)
[Enlace con título](https://www.markdownlang.com "Título del enlace")

Enlaces de Referencia

[Texto del enlace][ref]
[Texto del enlace][]

[ref]: https://www.markdownlang.com "Título opcional"
[Texto del enlace]: https://www.markdownlang.com

Enlaces Automáticos

<https://www.markdownlang.com>
<correo@ejemplo.com>

Enlaces de Anclaje

[Ir a encabezado](#nombre-encabezado)
[Volver arriba](#top)

Sintaxis de Imágenes

Imágenes en Línea

![Texto alternativo](imagen.jpg)
![Texto alternativo](imagen.jpg "Título de la imagen")

Imágenes de Referencia

![Texto alternativo][img-ref]

[img-ref]: imagen.jpg "Título opcional"

Imágenes con Enlace

[![Texto alternativo](imagen.jpg)](https://www.markdownlang.com)

Especificar Tamaño

<img src="imagen.jpg" alt="Texto alternativo" width="300" height="200">

Combinaciones Comunes

Imagen Enlazada

[![Logo del Proyecto](logo.png)](https://github.com/usuario/repositorio)

Imagen Centrada

<div align="center">
  <img src="imagen.jpg" alt="Descripción">
</div>

Imágenes Lado a Lado

<img src="img1.jpg" width="48%"> <img src="img2.jpg" width="48%">

Buenas Prácticas

Tipo	Sugerencia	Ejemplo
Texto enlace	Usa texto descriptivo	✅ [Guía de Usuario]()
Texto enlace	Evita "haz clic aquí"	❌ [Haz clic aquí]()
Archivo img	Usa ruta relativa	✅ ./images/pic.jpg
Alt	Describe el contenido	✅ ![Captura de UI]()
Formato	Formatos web recomendados	✅ JPG, PNG, WebP

Salida HTML

Markdown	HTML
[texto](url)	<a href="url">texto</a>
	<img src="img" alt="alt">
<url>	<a href="url">url</a>

Errores Comunes

❌ Ejemplos incorrectos:
[Enlace(https://www.markdownlang.com)     ← Falta paréntesis derecho
![Imagen](imagen.jpg             ← Falta paréntesis derecho
[ Enlace ]( https://www.markdownlang.com ) ← Espacios innecesarios

✅ Ejemplos correctos:
[Enlace](https://www.markdownlang.com)
![Imagen](imagen.jpg)
[Enlace](https://www.markdownlang.com)