I.
E SOR MATILDE SASTOQUE
“EDUCACION CON CALIDAD, PARA UN FUTURO MEJOR”
Res. Acred. Estudios hasta 11º Nº 006713 de 26 de Oct. 2020
DANE No. 120770000047 - NIT. 824001582 – 9
DISEÑO WEB HTML
Cesar David coronel quintero
Objetivos:
Identifica conceptos generales asociados al diseño de páginas
web.
Práctica el diseño una página web.
Criterios de evaluación:
Demuestra interés por resolver cada una de las actividades
propuestas en clases.
Presenta sus actividades y participa en la socialización de ellas.
Propone un diseño web único.
Generalidades.
El diseño web es una disciplina que combina
creatividad, tecnología y funcionalidad para
crear sitios web visualmente atractivos y fáciles
de usar. En este curso, exploraremos los
conceptos básicos del diseño web que te
ayudarán a comprender cómo se construyen y
estructuran los sitios en Internet.
El diseño web es mucho más que simplemente hacer que un sitio se vea
bonito. Es una herramienta estratégica que impacta en la experiencia
del usuario, la percepción de la marca y los resultados comerciales, lo
que lo convierte en un aspecto fundamental del éxito en línea.
Es un campo amplio y en constante evolución que combina aspectos
técnicos y creativos para crear experiencias web atractivas y
funcionales. Con una comprensión básica de HTML, CSS y principios de
diseño, podemos empezar a crear nuestros propios sitios web y explorar
las infinitas posibilidades que ofrece este emocionante campo.
TEMA 1: INTRODUCCIÓN A LAS PÁGINAS WEB.
Temas a Aprender.
Historia y evolución de la internet.
Cómo funciona la internet.
Introducción al desarrollo web.
Elementos de una página web.
I.E SOR MATILDE SASTOQUE
“EDUCACION CON CALIDAD, PARA UN FUTURO MEJOR”
Res. Acred. Estudios hasta 11º Nº 006713 de 26 de Oct. 2020
DANE No. 120770000047 - NIT. 824001582 – 9
Programas para crear sitios web.
La www.
Áreas del desarrollo web.
¿Qué debo hacer?
1. Indaga sobre lo propuesto y redacta un documento donde
expreses lo que comprendiste, usa los links del material de
consulta para preparar tu archivo. Al finalizar debes compartir lo
realizado con tus compañeros y docente. (No se permite leer).
Tienes alrededor de una hora para resolverlo y 15 minutos para
socializarlo.
Material & Recursos para el trabajo en clase:
Definición, concepto, tipos
Elementos básicos de una página web
Lenguajes más utilizados en el desarrollo web
Etapas del Desarrollo Web
Software para el diseño web
Cómo alojar un sitio web
Qué es el alojamiento web
Video Historia y origen de la Internet
Video: Cómo funciona la Internet
GUIA 1: INTRODUCCIÓN A LAS PÁGINAS WEB
Ejercicio de aplicación en clase.
Ejemplos de uso de herramientas gráficas para el diseño del documento
(Opcional).
I.E SOR MATILDE SASTOQUE
“EDUCACION CON CALIDAD, PARA UN FUTURO MEJOR”
Res. Acred. Estudios hasta 11º Nº 006713 de 26 de Oct. 2020
DANE No. 120770000047 - NIT. 824001582 – 9
Historia y evolución de la internet:
Internet comenzó en la década de 1960 durante la Guerra Fría con la
creación de ARPANET, una red de computadoras desarrollada por el
Departamento de Defensa de [Link], para asegurar la comunicación
militar. En los 70 surgieron los protocolos TCP/IP, permitiendo la conexión
entre redes. En los 90, la creación de la World Wide Web popularizó su
uso global. A principios de los 2000, Internet evolucionó hacia la Web 2.0,
centrada en la interacción social y el contenido generado por los usuarios.
Hoy, continúa expandiéndose con el Internet de las Cosas (IoT),
inteligencia artificial y 5G
Función del internet:
El internet conecta dispositivos globalmente, permitiendo la
comunicación, el acceso a información, el entretenimiento, el comercio
electrónico, las redes sociales, la educación, los servicios en la nube y la
colaboración. Facilita el intercambio de información y recursos en
múltiples formas y aplicaciones.
Característivas relevantes:
Interconexión Global
Acceso Inmediato a Información
Comunicación Rápida
Multimedia
I.E SOR MATILDE SASTOQUE
“EDUCACION CON CALIDAD, PARA UN FUTURO MEJOR”
Res. Acred. Estudios hasta 11º Nº 006713 de 26 de Oct. 2020
DANE No. 120770000047 - NIT. 824001582 – 9
Generalidades del diseño de una Elementos de una Programas para Áreas del
página web. página web. crear una página desarrollo web.
Objetivo del Sitio: Define el Encabezado web. Desarrollo Front-
propósito y audiencia. (Header) WordPress end: Creación de
Estructura y Navegación: Menú de Wix la interfaz visible
Organiza el contenido y facilita el Navegación Squarespace con HTML, CSS y
acceso a la información. Contenido Webflow JavaScript.
Diseño Visual: Selección de Principal Adobe Desarrollo Back-
colores, tipografías e imágenes Imágenes y Dreamweaver end: Gestión de la
que reflejen la identidad de la Multimedia Joomla lógica del servidor
marca. Barra Lateral Drupal y bases de datos
Usabilidad: Asegura una interfaz (Sidebar) con lenguajes
intuitiva y accesible. Pie de Página como PHP y
Responsividad: Garantiza buen (Footer) Python.
funcionamiento en diferentes Formularios Desarrollo Full-
dispositivos y pantallas. Botones y stack:
Velocidad de Carga: Optimiza el Llamadas a la Combinación de
rendimiento para una carga Acción (CTA) front-end y back-
rápida. Banners y end.
Contenido: Desarrolla contenido Anuncios Diseño Web:
relevante y bien estructurado. Barra de Enfoque en
SEO: Implementa prácticas para Búsqueda estética y
mejorar la visibilidad en usabilidad.
buscadores. Optimización y
Accesibilidad: Asegura que el Rendimiento:
sitio sea accesible para todos los Mejora de la
usuarios. velocidad de carga
Mantenimiento: Realiza y SEO.
actualizaciones y revisiones Seguridad Web:
regulares. Protección contra
4o mini amenazas.
Mantenimiento y
Soporte:
Actualización y
corrección de
errores.
www
I.E SOR MATILDE SASTOQUE
“EDUCACION CON CALIDAD, PARA UN FUTURO MEJOR”
Res. Acred. Estudios hasta 11º Nº 006713 de 26 de Oct. 2020
DANE No. 120770000047 - NIT. 824001582 – 9
Introducción al diseño de páginas web.
Objetivo y Audiencia: Definir el propósito y el público del sitio.
Estructura y Navegación: Organizar el contenido y facilitar el acceso.
Diseño Visual: Elegir colores, tipografías e imágenes adecuadas.
Usabilidad: Crear una interfaz intuitiva y fácil de usar.
Responsividad: Asegurar un buen funcionamiento en diversos dispositivos.
Contenido: Desarrollar contenido claro y relevante.
SEO y Accesibilidad: Optimizar para buscadores y asegurar accesibilidad para todos.
Mantenimiento: Actualizar y revisar regularmente el sitio.