2.15 Apuntes - jangelmm

Referencia: Head First HTML and CSS – A Brain-Friendly Guide

1. HTML#

Visualización en el navegador: El navegador ignora los espacios en blanco, ya que necesita renderizar la página de forma adaptativa según el tamaño y la disposición del navegador. Esto permite que el contenido se vea correcto sin importar los espacios que pongamos en el código.
Creación de archivos HTML:
- Se pueden crear archivos usando Notepad, VS Code u otro editor de texto.
- La visualización final se realiza en el navegador (ej. localhost.html).
Ver el código fuente:
- En cualquier navegador: View Source o Ctrl+U.

Formas de agregar CSS:
1. Archivo externo (style.css)
2. Directamente dentro del HTML (<style> o atributos style)
Uso básico:
- El CSS se aplica a etiquetas, clases o IDs.
- Se renderiza sin retorno de carro ni espacios.
- Recomendación: usar fuentes estándar para compatibilidad.
Ejemplo de link a CSS externo:

1
<link rel="stylesheet" href="estilos.css">

1
<a href="demo.com">Ir a demo.com</a>
2
<a href="demo.html">Regresar al demo</a>

Ubicación de nuestros archivos en Linux (Ubuntu):
- Document root de Nginx: /etc/nginx/nginx.conf
- Comando útil para explorar directorios:

1
ls -al /var/

Buenas prácticas:
- Evita usar etiquetas propias de ciertos navegadores, utiliza estándares.
- Si no especificamos un archivo en el enlace, el navegador abrirá el archivo por defecto.

URL (Uniform Resource Locator): dirección completa de un recurso, incluye protocolo, dominio y ruta.
URI (Uniform Resource Identifier): identifica un recurso, pero no necesariamente cómo localizarlo.

Nota: Muchos frameworks modernos ya manejan esto automáticamente, simplificando la gestión de rutas.

Renderizar: proceso de mostrar el contenido HTML/CSS en el navegador.
Document root: carpeta principal donde viven los archivos que el servidor web sirve al usuario.
ID / Clase: formas de identificar elementos en HTML para aplicar estilos con CSS.
URI / URL: formas de identificar y localizar recursos en la web.