SESION PRACTICA-3 CSS

Introducción

En esta entrada, compartiré mi experiencia modificando una página web utilizando CSS. Esta práctica forma parte de la asignatura Sistemas de Comunicación Multimedia (SCM), donde trabajamos con hojas de estilo para mejorar la apariencia de una página web.

El objetivo era:
✅ Aplicar modificaciones al diseño del sitio web.
✅ Añadir un selector de clase para personalizar elementos específicos.
✅ Incluir un enlace a mi blog.
✅ Subir la página a un hosting gratuito.

---

¿Qué es CSS y por qué es importante?

CSS (Cascading Style Sheets) es un lenguaje que permite definir el estilo de una página web, separando la presentación del contenido. Con CSS, podemos cambiar colores, fuentes, diseños y hacer que las páginas sean visualmente atractivas sin alterar el código HTML.

En esta práctica, trabajamos con un archivo externo de estilos llamado estilo1.css, lo que facilita la gestión del diseño en múltiples páginas.

---

Modificaciones realizadas en el código

1️⃣ Cambio del tipo de letra y colores de fondo

Antes, la página utilizaba la fuente Arial con un fondo blanco. Lo cambié por Verdana y un fondo gris claro para hacerla más moderna y fácil de leer.

2️⃣ Personalización del encabezado y menú de navegación

El encabezado y el menú de navegación ahora tienen colores más llamativos. El fondo azul oscuro (#004080) mejora el contraste con el texto blanco.

3️⃣ Creación de un selector de clase para destacar texto

Agregué una clase llamada .destacado, que permite resaltar ciertos títulos con un fondo amarillo.

4️⃣ Añadir un enlace a mi blog en el pie de página

Modifiqué el footer para incluir un enlace directo a mi blog.

---

Publicación de la página en un hosting gratuito

Para que cualquiera pueda ver los cambios, subí la página a un hosting gratuito. Elegí W3Schools Spaces, ya que es fácil de usar y permite visualizar los cambios en línea.

📌 Enlace a mi página web: MI LINK

Pasos para subir la web:
1️⃣ Creé una cuenta en W3Schools Spaces.
2️⃣ Subí los archivos practica2.html y estilo1.css.
3️⃣ Obtuve el enlace y lo añadí a esta entrada.