Comienza Contenido

Publicación Web: El lenguaje HTML

Este curso pretende enseñar los conceptos básicos de HTML como lenguaje de publicación de páginas Web. La idea es aprender a realizar documentación web básica (en HTML) y tener una página personal sencilla (sin incluir diseño)

Objetivos

  • Aprender el lenguaje HTML
  • Publicar en la Web

Clases

  1. Introducción
    • Aspectos Básicos de Documentación:
      • Estructura
      • Contenido
      • Diseño
    • Lenguaje HTML, SGML (iso 8879) y XML
    • Proceso de Desarrollo:
      1. Crear: Edito un archivo html (en un Editor de Texto)
      2. Publicar: Lo abro con un Navegador Web
      3. Hago cambios y vuelvo a publicar
    • Usar Estándares W3C: HTML 4.01 Strict o HTML5
    • ¿Es imprescindible saber HTML? Pues no
  2. La Primera Página Web
    • Estructura del documento
      • Etiquetas Básicas de Estructura
        • Documento: html
        • Encabezado: head (incluye título: title)
        • Cuerpo: body
      • Las Marcas HTML:
        • Etiquetas: <etiqueta>Texto a Marcar</etiqueta>
        • Atributos: <etiqueta atributo="valor">Texto a Marcar</etiqueta>
    • Marcando el texto
      • Párrafos: Etiqueta p
      • Salto de línea: Etiqueta br
      • Resaltando texto: Etiquetas b y em
      • Encabezamientos: Etiquetas h1 hasta h6
    • Para Empezar: Try it Yourself
  3. Un poco más de HTML
    • Enlaces entre páginas
      • El Origen de la web (hypertext)
      • Anclas, Nombres y Enlaces: etiqueta a y atributos href / name
      • Enlaces (links):
        • Internos (con #nombre)
        • Externos (URL)
    • Construyendo Listas y Tablas
      • Tipos de listas (numeradas y no numeradas): ol, ul
      • Items de las Listas: li
      • Tablas, filas, datos y encabezados: table, tbody, tr, th, td
    • Imágenes
      • Son una conexión HTTP aparte, es decir, un archivo aparte. No abusar.
      • Se incluyen con la etiqueta img, el atributo src (URL) y el atributo ALT (texto ALTernativo)
    • Texto PREformateado: PRE; Dirección: ADDRESS, Línea Horizontal: HR
    • Entidades: escribir caracteres especiales &nombre ; P.ej & euro ; (€) o & amp ; (&)
    • Repasar HTML: Texto, Listas, Tablas, Enlaces, Imágenes
  4. Construir un Sitio Web
    • La más importante: ¿para qué?
    • Proceso de Publicacion Web:
      • Arquitectura Básica HTTP: envio de archivo HTML
      • Actualizar mi página web:
        • Local: Sistema de Archivos en mi equipo
        • Remoto: Sistema de Archivos del Servidor Web
      • Forma de Publicar:
        1. Enviando Archivos al Servidor: Acceso FTP, DAV o similar
        2. Con Sistemas de Control de Versiones: git, CVS, Subversión, etc
        3. Usando de Formularios Web (Sistemas CMS)
      • Ejemplos de Hosting y Ejemplo Real
    • Planificación Básica de un sitio Web
      • Sitio Web: más de una página Web
      • Objetivos: Para qué lo necesito
      • Diseño: secciones (Estructura de Directorios) y flujo de páginas
      • Reglas para una buena publicación Web
        • Resaltar
        • Simplicidad
        • Buen Contenido
      • Usabilidad (Usability Basics): facilidad del usuario para utilizar nuestro interfaz
        • Facilidad para desempeñar tareas
        • Publicar en Web
        • Navegabilidad
        • Test de Usabilidad (relacionado con los objetivos)
      • Lo más importante: Mantenerlo
      • Codificación de Texto: UTF8 (The Secret of ...)
        • Soporte en el Editor (Entorno de Desarrollo)
        • Soporte en el Servidor y Cliente (Navegador)
  5. Otras formas de publicación Web:
    • ¿Porqué existen diferentes formas de publicar?
    • Necesidades del Usuario: publicación rápida, ágil y simple
    • Sistemas Gestores de Contenidos (CMS)
    • Tipos Principales
    • WebLogs
      • ¿Qué son y de donde surgen?
      • Publicación con lenguaje de etiquetas Mixto: HTML y Propio
      • ¿Cómo lo pongo en marcha?. Funcionamiento: Administración/Usuario
    • Usos interesantes y útiles:
      • Wiki: para documentación
      • WebLogs: para gestión de proyecto y/o soporte

Actividades

  1. Preparar mi Entorno de Desarrollo
    • Navegar y Guardar un documento
    • Abrirlo con el Navegador (sin conexión a Internet)
    • Abrirlo con el editor (HTML o texto)
  2. Hacer la primera página en HTML
    • Crearla en un Editor de Texto
    • Crear un ejemplo básico (máximo 7 elementos HTML)
    • Verla en el navegador
  3. Una página HTML (escoger una opción):
    1. Sobre la manzana
    2. Sobre tu ciudad
    3. Se cae tu servidor y tienes que poner un aviso a tus usuarios
  4. Un sitio Web Básico:
    • Pensar en un sitio web sencillo (basado en la opción anterior)
    • Mínimo 4 Páginas + 1 Foto + Navegabilidad
    • Hacer Test Usabilidad Básico
  5. Utilizar sistemas alternativos de publicación

Duración del Curso

El esfuerzo estimado del curso es de 1 crédito ECTS. Unas 30 horas de dedicación.

Para Aprender Más