Crear y publicar una web o blog

Explica con tus palabras la diferencia entre una página web y un sitio web, usando el símil de un libro: qué sería cada hoja y qué sería el libro completo. Pon un ejemplo de un sitio web que conozcas y nombra dos de sus páginas.

Cuando visitas un sitio web intervienen dos programas: el navegador de tu computador y el servidor donde vive el sitio. Explica qué hace cada uno (quién pide la página, quién la guarda y la envía, quién la muestra) y qué ocurre si el servidor está apagado.

La figura muestra el esquema de diagramación típico de una página web, con sus cuatro zonas, pero el nombre de una de ellas está tapado.

Indica qué zona está tapada y qué contiene normalmente, y explica para qué sirve cada una de las otras tres zonas de la página.

Una pastelería quiere un sitio web sencillo con: presentación, fotos de sus tortas, horario y un mapa con la dirección. Diseña su estructura: qué zonas tendrá la página principal (cabecera, menú, contenido, pie), qué irá en cada una y qué dos páginas secundarias enlazarías desde el menú.

Diseña la página principal del sitio web del club de ciencias: dibuja o describe su esquema de diagramación (encabezado, menú, contenido, pie de página), decide los cuatro contenidos que destacarías en ella y explica qué enlaces pondrías en el menú y por qué esos y no otros.

Puedes hacerlo en papel y enviar una foto con tu respuesta.

El HTML no «programa» la página: la describe con etiquetas que marcan qué es cada cosa. Explica qué es una etiqueta HTML usando el símil de los plumones de colores con los que marcas un apunte (esto es un título, esto es un párrafo) y di qué diferencia hay entre el contenido y las marcas.

Relaciona cada etiqueta HTML con lo que coloca en la página: (a) <h1>, (b) <p>, (c) <img>, (d) <a>, con estas funciones: un enlace a otra página, una imagen, el título principal y un párrafo de texto. Después, di cuál de las cuatro necesita siempre una dirección de dónde está el recurso.

Lee este fragmento de HTML y describe cómo se verá la página en el navegador, elemento por elemento: <h1>El rincón de Marta</h1>, <p>Manualidades y recetas fáciles.</p>, <img> con una foto de unas galletas, <a> con el texto «Ver la receta completa». Indica qué etiqueta produce cada parte.

Las imágenes de un sitio web llevan un texto alternativo (el atributo «alt») que describe la foto. Explica quién lo necesita (personas que usan lectores de pantalla) y escribe un buen texto alternativo para estas dos imágenes del blog del curso: (a) la foto del equipo ganador del torneo de ajedrez y (b) un gráfico de barras con la asistencia al club cada mes.

La figura muestra el árbol de etiquetas de una página web muy sencilla: cómo unas etiquetas contienen a otras, pero dos etiquetas están tapadas.

Averigua qué dos etiquetas están tapadas usando las pistas de debajo de cada caja, y explica con tus palabras qué significa que una etiqueta «cuelgue» de otra en el árbol.

Hoy se puede crear una web sin escribir código, con creadores de sitios como Google Sites o WordPress. Explica qué es un creador de sitios web, cómo se trabaja en él (arrastrar bloques, elegir plantillas) y qué ventaja tiene para alguien que está empezando.

Estos pasos para publicar una página web con un creador de sitios están desordenados: (a) revisar cómo se ve en el celular y en el computador, (b) elegir una plantilla, (c) pensar qué contenidos tendrá, (d) hacer clic en «publicar» para darle una dirección en internet, (e) añadir los textos y las imágenes. Ordénalos y explica por qué la revisión debe ir antes de publicar.

Compara crear una web escribiendo HTML a mano con crearla en un creador de sitios sin código: una ventaja y una limitación de cada vía. Después recomienda una de las dos para cada caso: (a) la web del club de lectura, lista en una semana; (b) aprender cómo funciona internet por dentro.

Un blog es un sitio web que se actualiza con artículos nuevos, ordenados del más reciente al más antiguo. Explica qué diferencia hay entre un blog y una web «escaparate» (la de una tienda, que casi no cambia) y pon un ejemplo de tema que encajaría bien en cada uno.

El curso crea un blog sobre los barrios del pueblo o la ciudad. Planifica sus tres primeras entradas: título de cada una, dos contenidos que llevará (texto, foto, entrevista, mapa) y qué sección del menú le corresponde. Explica por qué conviene planificar antes de tocar el computador.

Tres proyectos necesitan una web: (a) el diario del liceo, que publicará artículos cada semana entre varias personas; (b) la presentación de un trabajo, una sola página fija; (c) la tienda de la cooperativa del colegio, con catálogo y pedidos. Elige para cada uno la herramienta más adecuada (creador de sitios tipo Google Sites, un blog tipo WordPress o una solución de comercio electrónico) y razona tu elección.

Elige la web de un comercio o asociación de tu comuna que conozcas (o imagina una realista) y analízala: qué zonas tiene su página principal, qué contenidos ofrece, qué le falta y qué le sobra. Propón tres mejoras concretas de estructura o de contenido y justifícalas.

El curso va a crear la web del grupo. Clasifica estos contenidos en «se pueden publicar» o «no se deben publicar», justificando cada caso: el nombre del liceo, la foto de la fachada del colegio, los nombres y apellidos completos de todos los alumnos, los trabajos del curso firmados solo con el nombre de pila, el horario personal de un alumno y una descripción de las actividades del grupo.

En la página web del liceo se publican fotos de las actividades. Redacta tres normas de publicación responsable para esa página pensando en: qué estudiantes pueden salir reconocibles, qué datos personales no deben acompañar a las fotos y qué autorización hace falta de las familias. Justifica cada norma.

En la página web del Centro de Padres y Apoderados aparece una lista con «nombre y apellidos de los premiados en la fiesta, su curso y su foto». Analiza qué datos personales se están publicando, qué riesgos tienen juntos (más que por separado), qué permisos harían falta y cómo publicarías la misma noticia protegiendo a los alumnos.

Redacta la política de publicación del sitio web del curso: qué contenidos se publican y cuáles no, quién revisa antes de publicar, cómo se citan las fuentes y las imágenes ajenas, y qué se hace si alguien pide retirar un contenido suyo. Preséntala como un documento de cuatro apartados breves.

Un compañero dice: «como la web del curso la hicimos nosotros, podemos poner en ella lo que queramos: fotos de quien sea, música de fondo famosa y textos copiados de otras webs». Rebate sus tres afirmaciones con argumentos: privacidad y derecho a la imagen, derechos de autor de la música y plagio de los textos, y propón la alternativa correcta en cada caso.

Reto del tema. Diseña un artículo para un blog de divulgación sobre hábitos tecnológicos y privacidad, utilizando datos reales y respetando la propiedad intelectual.

Completa las siguientes fases:

1. Fase 1. Recogida de datos: Ingresa al sitio web del INE de Chile (ine.gob.cl) y anota el porcentaje de menores que utilizan internet habitualmente, o encuesta a 5 familiares sobre sus horas de uso de pantallas para calcular el promedio diario (por ejemplo, $3,5\text{ h}$). Registra los datos en una tabla.

2. Fase 2. Creación y contenidos: Maqueta tu entrada en LibreOffice Writer (o una herramienta de blog gratuita) simulando la interfaz web. Analiza los datos obtenidos e ilustra la entrada con una imagen obtenida de un repositorio libre (como Wikimedia Commons o Pixabay), referenciando adecuadamente autor, fuente y tipo de licencia.

3. Fase 3. Difusión y licencias: Redacta tres pautas sobre privacidad para publicar fotos o información de terceros en redes. Finalmente, asigna una licencia Creative Commons a tu propio trabajo (como CC BY-NC-SA), argumenta por qué la has escogido y exporta el resultado en PDF.

Se evaluará:

• Obtención rigurosa de datos reales y su tratamiento claro.

• Correcta atribución de licencias libres a los recursos ajenos y elección justificada de la licencia propia.

• Calidad técnica de la maqueta y relevancia ética de los consejos de publicación responsable.