Crear y publicar una web o blog
Tu clase de 3° básico quiere tener su propia página para mostrar los trabajos de TAC y avisar de las actividades del establecimiento, como la quema del diablo o el desfile del 15 de septiembre. No hace falta ser programador: con un creador de sitios y unas nociones de cómo funciona una página por dentro, pueden tenerla lista en una tarde. Veamos qué hay detrás de cualquier página que visitas desde tu celular.
Qué es una página web
Cuando abres una página intervienen dos programas, que se hablan con un protocolo llamado HTTP: el navegador hace un pedido y el servidor responde con la página. La dirección web (por ejemplo https://www.mineduc.gob.gt) indica el protocolo, el dominio y la ruta de la página.
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…
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.
Cómo se maqueta una página
Las cuatro zonas son: la cabecera (logo y título del sitio), el menú (enlaces a las demás páginas), el contenido (lo principal de cada página) y el pie (contacto, aviso legal y datos de la dirección).
La figura muestra el esquema de maquetació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é…
La figura muestra el esquema de maquetació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 una página web sencilla con: presentación, fotos de sus pasteles, horario y un mapa con la dirección. Diseña su estructura: qué zonas tendrá la…
Una pastelería quiere una página web sencilla con: presentación, fotos de sus pasteles, horario y un mapa con la dirección. Diseña su estructura: qué zonas tendrá la página principal (encabezado, menú, contenido, pie de página), qué irá en cada una y qué dos páginas secundarias enlazarías desde el menú.
Diseña la página principal de la web del club de ciencia: dibuja o describe su esquema de diagramación (encabezado, menú, contenido, pie de página), decide los cuatro…
Diseña la página principal de la web del club de ciencia: 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.
HTML: las etiquetas que describen el contenido
Texto alternativo y enlaces que se entienden
El atributo alt de <img> es una descripción escrita de la imagen. Lo necesitan las personas que usan un lector de pantalla (un programa que lee en voz alta la página) y también sirve cuando la imagen no carga: en lugar de un ícono roto aparece el texto.
Un buen alt describe lo que aporta la imagen, no solo dice «foto» o «gráfico». Y el texto de un enlace debe decir adónde lleva: «Haz clic aquí» no dice nada a quien escucha la lista de enlaces; «Ver el calendario de partidos» sí.
Las imágenes de una web llevan un texto alternativo (el atributo «alt») que describe la foto. Explica quién lo necesita (personas que usan lectores de pantalla) y…
Las imágenes de una 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 de la clase: (a) la foto del equipo ganador del torneo de ajedrez y (b) una gráfica de barras con la asistencia al club cada mes.
El árbol de etiquetas
Crear y publicar sin programar
Para quien empieza, la ventaja es clara: se obtiene un resultado presentable en poco tiempo y el creador escribe el HTML por ti. Su limitación es que solo puedes hacer lo que la herramienta permite. Escribir HTML a mano da control total y enseña cómo funciona internet por dentro, pero tarda más y exige más práctica.
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…
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 web con un creador de sitios están desordenados: (a) revisar cómo se ve en el celular y en la computadora, (b) elegir una plantilla, (c)…
Estos pasos para publicar una web con un creador de sitios están desordenados: (a) revisar cómo se ve en el celular y en la computadora, (b) elegir una plantilla, (c) pensar qué contenidos tendrá, (d) presionar «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.
Blog, escaparate y elegir herramienta
Un blog es un sitio web que se actualiza con artículos (entradas) nuevos, ordenados del más reciente al más antiguo. Una web escaparate (por ejemplo, la de un negocio) casi no cambia: presenta quién eres, qué ofreces y cómo contactarte.
Ejemplos: un blog de recetas o de noticias del instituto encaja en un blog; la página de una librería del barrio encaja en un escaparate. El blog es además un espacio de participación: hay edublogs (blogs educativos) y blogs de ONG, de organismos de gobierno o de instituciones culturales.
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»…
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.
La clase crea un blog sobre las colonias del pueblo o la ciudad. Planifica sus tres primeras entradas: título de cada una, dos contenidos que llevará (texto, foto,…
La clase crea un blog sobre las colonias 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 la computadora.
Elige la web de un comercio o asociación de tu localidad que conozcas (o imagina una realista) y analízala: qué zonas tiene su página principal, qué contenidos ofrece,…
Elige la web de un comercio o asociación de tu localidad 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.
Dirección y alojamiento: dominio y hosting
Para que tu web exista en internet necesita dos cosas distintas.
Hay dos caminos comunes:
-
Sitio gratuito en una plataforma: la dirección es un subdominio de la plataforma y el alojamiento va incluido. No pagas, pero a cambio suele haber publicidad ajena, menos control y dependencia de la empresa (si cambia las reglas o cierra, tu sitio se ve afectado).
-
Dominio propio y hosting contratado: pagas por el dominio (por año) y por el alojamiento (por mes). Tienes dirección propia, sin anuncios impuestos y más control.
Publicar con responsabilidad
Una política de publicación pone estas reglas por escrito. Cuatro apartados breves bastan:
-
Qué se publica y qué no: actividades, trabajos y fotos autorizadas sí; datos personales no.
-
Quién revisa: una persona del equipo y el o la docente revisan antes de publicar.
-
Cómo se citan las fuentes: todo texto o imagen ajeno lleva autor y fuente, y se respeta su licencia.
-
Retirada de contenidos: si alguien pide quitar algo suyo, se retira pronto y sin pedir explicaciones.
Aunque publiques solo en una web escolar, pide siempre permiso y explica para qué usarás los datos: es una buena práctica de ciudadanía digital.
La clase va a crear la página web del grupo. Clasifica estos contenidos en «se pueden publicar» o «no se deben publicar», justificando cada caso: el nombre del…
La clase va a crear la página web del grupo. Clasifica estos contenidos en «se pueden publicar» o «no se deben publicar», justificando cada caso: el nombre del instituto, la foto de la fachada del centro, los nombres y apellidos completos de todos los alumnos, los trabajos de la clase firmados solo con el nombre de pila, el horario personal de un alumno y una descripción de las actividades del grupo.
En la web del instituto se publican fotos de las actividades. Redacta tres normas de publicación responsable para esa web pensando en: qué alumnos pueden salir…
En la web del instituto se publican fotos de las actividades. Redacta tres normas de publicación responsable para esa web pensando en: qué alumnos pueden salir reconocibles, qué datos personales no deben acompañar a las fotos y qué permiso hace falta de las familias. Justifica cada norma.
En la web de la Asociación de Padres de Familia aparece una lista con «nombre y apellidos de los premiados en la fiesta, su grado y su foto». Analiza qué datos…
En la web de la Asociación de Padres de Familia aparece una lista con «nombre y apellidos de los premiados en la fiesta, su grado 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 de la web de la clase: qué contenidos se publican y cuáles no, quién revisa antes de publicar, cómo se citan las fuentes y las…
Redacta la política de publicación de la web de la clase: 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.
Tecnología con mirada crítica
Publicar en la web no es un acto neutro: detrás de cada herramienta hay quién la controla, quién puede usarla y quién paga sus costos. Cuatro ideas te ayudan a analizarlo.
Relaciónalo con lo que viste en esta página. WordPress es software libre: tu curso puede usarlo y adaptarlo sin pedir permiso. Una plataforma «gratuita» puede cobrar con tus datos y tu atención. Si tu sitio es muy pesado, quien tiene un celular modesto y pocos datos en su plan no va a poder verlo: eso es brecha digital. Y cada servidor y cada dispositivo tiene un costo ambiental.
Imagen, música y textos ajenos
Lo que publicas en la web de tu clase tiene autor y reglas. Tres ideas:
-
Imagen de las personas: no se publican fotos de alguien sin su consentimiento (o el de su familia si es menor).
-
Música, fotos y textos de otros: tienen autor y están protegidos por derechos de autor. Para usarlos hace falta permiso o una licencia que lo permita, como Creative Commons, y siempre hay que citar al autor.
-
Plagio: copiar un texto y presentarlo como propio está mal aunque se publique en una web escolar. Se resume con tus palabras y se cita la fuente.
Un compañero dice: «como la web de la clase la hemos hecho nosotros, podemos poner en ella lo que queramos: fotos de quien sea, música de fondo famosa y textos copiados…
Un compañero dice: «como la web de la clase la hemos hecho 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.…
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:
-
Fase 1. Recogida de datos: Entra en la web del INE (ine.es) y anota el porcentaje de menores que utilizan internet habitualmente, o encuesta a 5 familiares sobre sus horas de uso de pantallas para calcular la media diaria (por ejemplo, $3.5\text{ h}$). Registra los datos en una tabla.
-
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.
-
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 valorará:
-
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.
Vuelta al principio: para publicar la web de la clase en una tarde, elijan una plantilla en un creador de sitios, organicen los contenidos en las cuatro zonas de la maquetación, agreguen texto alternativo a las imágenes, comprueben en la vista previa que se lee bien en el celular y asegúrense de no incluir datos personales de nadie.