Planificación de Clase Técnico Medio en Diseño Gráfico I año

Módulo: Diseño Web Tiempo: 60 horas

Prof. Delvin Martín Díaz M.

02 octubre de 2012 Clase: Nº 1

Unidad I: Introducción a Internet y al Lenguaje HTML Contenidos:

1. ¿Qué es Internet y Página Web? 2. Breve historia del Internet 3. El Internet en la actualidad 4. ¿Cómo Funciona el Internet? 5. Tipos de Sitios Web 6. ¿Qué es HTML? 7. Versiones de HTML 8. Los navegadores y su compatibilidad 9. Editores 10. ¿Por qué utilizar HTML5? 11. Planeación y recomendaciones para crear un Sitio web 12. Planificación jerárquica del Sitio Web 13. Ejemplos de Sitios Web Objetivos:

Desarrollo:

1. ¿Qué es Internet y Página Web? Internet es un conjunto descentralizado de redes de comunicación interconectadas que utilizan la familia de protocolos TCP/IP, garantizando que las redes físicas heterogéneas que la componen funcionen como una red lógica única, de alcance mundial. Sus orígenes se remontan a 1969, cuando se estableció la primera conexión de computadoras, conocida como ARPANET, entre tres universidades en California y una en Utah, Estados Unidos.

Uno de los servicios que más éxito ha tenido en Internet ha sido la World Wide Web (WWW, o "la Web"), hasta tal punto que es habitual la confusión entre ambos términos. La WWW es un conjunto de protocolos que permite, de forma sencilla, la consulta remota de archivos de hipertexto. Ésta fue un desarrollo posterior (1990) y utiliza Internet como medio de transmisión. Existen, por tanto, muchos otros servicios y protocolos en Internet, aparte de la Web: el envío de correo electrónico (SMTP), la transmisión de archivos (FTP y P2P), las

Planificación de Clase Técnico Medio en Diseño Gráfico I año

Módulo: Diseño Web Tiempo: 60 horas

Prof. Delvin Martín Díaz M.

conversaciones en línea (IRC), la mensajería instantánea y presencia, la transmisión de contenido y comunicación multimedia -telefonía (VoIP), televisión (IPTV)-, los boletines electrónicos (NNTP), el acceso remoto a otros dispositivos (SSH y Telnet) o los juegos en línea. Una página web es el nombre de un documento o información electrónica adaptada para la World Wide Web y que puede ser accedida mediante un navegador para mostrarse en un monitor de computadora o dispositivo móvil. Esta información se encuentra generalmente en formato HTML o XHTML, y puede proporcionar navegación a otras páginas web mediante enlaces de hipertexto. Las páginas web frecuentemente incluyen otros recursos como hojas de estilo en cascada, guiones (scripts) e imágenes digitales, entre otros. Las páginas web pueden estar almacenadas en un equipo local o un servidor web remoto. El servidor web puede restringir el acceso únicamente para redes privadas, p. ej., en una intranet corporativa, o puede publicar las páginas en la World Wide Web. El acceso a las páginas web es realizado mediante su transferencia desde servidores utilizando el protocolo de transferencia de hipertexto (HTTP). Características Una página web está compuesta principalmente por información (sólo texto y/o módulos multimedia) así como por hiperenlaces; además puede contener o asociar datos de estilo para especificar cómo debe visualizarse, y también aplicaciones embebidas para así hacerla interactiva. Las páginas web son escritas en un lenguaje de marcado que provee la capacidad de manejar e insertar hiperenlaces, generalmente HTML. El contenido de la página puede ser predeterminado («página web estática») o generado al momento de visualizarla o solicitarla a un servidor web («página web dinámica»). Las páginas dinámicas que se generan al momento de la visualización, se especifican a través de algún lenguaje interpretado, generalmente JavaScript, y la aplicación encargada de visualizar el contenido es la que realmente debe generarlo. Las páginas dinámicas que se generan, al ser solicitadas, son creadas por una aplicación en el servidor web que alberga las mismas. Respecto a la estructura de las páginas web, algunos organismos, en especial el W3C, suelen establecer directivas con la intención de normalizar el diseño, y para así facilitar y simplificar la visualización e interpretación del contenido. Una página web es en esencia una tarjeta de presentación digital, ya sea para empresas, organizaciones, o personas, así como una tarjeta de presentación de ideas y de informaciones. Así mismo, la nueva tendencia orienta a que las páginas web no sean sólo atractivas para los internautas, sino también optimizadas (preparadas) para los buscadores a través del código fuente. Forzar esta doble función puede, sin embargo, crear conflictos respecto de la calidad del contenido.

Planificación de Clase Técnico Medio en Diseño Gráfico I año

Módulo: Diseño Web Tiempo: 60 horas

Prof. Delvin Martín Díaz M.

¿Qué es un sitio web?

Un sitio web es un conjunto de páginas web que se encuentran conectadas entre sí por medio de enlaces (links). Una página web contiene contenido como texto, imágenes, audio y video. Para organizar el contenido que una empresa desea publicar en Internet, generalmente se divide este contenido en diversas páginas.

Un sitio web de calidad le permitirá mejorar su imagen profesional, demostrando por encima de todo, el conocimiento y la aceptación de las nuevas tecnologías. Además, cada vez son más los miles de usuarios que acceden a Internet buscando información, un producto o servicio. Por eso, no tener una web supone una gran desventaja competitiva con respecto a otras empresas que sí la tienen. Internet se ha convertido en la forma más eficiente de transmitir información. Permite el contacto directo entre su empresa, cliente y proveedor de una manera más rápida y económica. Toda la información que usted incluya en su sitio web estará disponible las 24 horas del día, 7 días a la semana y 365 días al año.

2. Breve historia del Internet

Ver Vídeo Historia de internet.flv Internet es uno de los grandes logros tecnológicos de la actualidad. Al día de hoy la gran mayoría de gente hace uso de la red de redes bien de manera activa o bien pasivamente durante sus actividades diarias. Internet ha cobrado una gran importancia y, aunque parezca una obviedad, cada día hay más y más dispositivos para acceder a ella. Es un asunto que da mucho juego, hay muchos datos, ya que la tecnología ha facilitado la expansión de la idea original y germen de Internet, nos referimos a ARPANET.

Planificación de Clase Técnico Medio en Diseño Gráfico I año

Módulo: Diseño Web Tiempo: 60 horas

Prof. Delvin Martín Díaz M.

1969 .- ARPANET La red de ARPANET (Advanced Research Projects Agency Network) fue creada por encargo del Departamento de Defensa de los Estados Unidos como medio de comunicación para los diferentes organismos del país norteamericano. El primer nodo se creó en la Universidad de California, Los Ángeles. El día 29 de octubre de 1969, los ordenadores de Stanford y UCLA se conectaron por primera vez.

1969 .- Unix Otro de los grandes hitos durante los 60 fue la creación de Unix, el sistema que ha influenciado a los populares y actuales Linux y FreeBSD, que son los sistemas operativos más populares en los servidores y servicios de Hosting Web.

1970 .- Crece la red ARPANET La red ARPANET se estableció entre Harvard, MIT y BNN (la compañía que creó los ordenadores “procesadores del mensaje del interfaz” usados para conectar a la red) en 1970.

Planificación de Clase Técnico Medio en Diseño Gráfico I año

Módulo: Diseño Web Tiempo: 60 horas

Prof. Delvin Martín Díaz M.

1971 .- Email El correo electrónico fue desarrollado en 1971 por Ray Tomlinson, quien tomó la decisión de utilizar la arroba (“@”) para separar el nombre de usuario del nombre del ordenador, que posteriormente se transformó en el nombre del dominio.

1971 .- Proyecto Gutenberg y eBooks Uno de los desarrollos más impresionantes de 1971 fue el comienzo del Proyecto Gutenberg. Fue una de las primeras iniciativas en las que se proponía la creación de libros en formato digital disponibles electrónicamente. Es decir, se podría decir que fue el primer portal/biblioteca y el nacimiento de los eBooks.

El proyecto comenzó cuando Michael Hart dispuso de mucho tiempo de computación en los ordenadores de la época y se hizo a la idea de que el futuro de los ordenadores no estaba sólo en la computación y el proceso de datos sino también en el almacenamiento y búsqueda de información, que por aquellos años sólo estaba disponible en bibliotecas. Nació de esa manera el eBook. 1973 .- Primera conexión transatlántica ARPANET se expandió desde Estados Unidos hasta Europa y en particular con la University College of London en 1973. Este mismo año destaca la popularización del email, el 75% del tráfico transmitido en toda la Red eran email. Actualmente el porcentaje es mayor aún, pero tenemos que tener en cuenta que la mayoría es spam.

Planificación de Clase Técnico Medio en Diseño Gráfico I año

Módulo: Diseño Web Tiempo: 60 horas

Prof. Delvin Martín Díaz M.

1974 .- El comienzo de TCP/IP El año 1974 fue decisivo en el desarrollo de Internet. Una propuesta fue publicada para enlazar todas las redes del estilo ARPANET juntas en una única red, llamada inter-network. Dicha red no tendría un control centralizado y trabajaría sobre un protocolo de control de transmisión (que posteriormente se convirtió en TCP/IP).

1975 .- El cliente de email Con la creciente popularidad del correo electrónico, nació el primer programa dedicado a los emails, de la mano de John Vittal, programador de la Universidad de California del Sur en 1975. El mayor avance tecnológico de este programa (MSG) fue la adición de las ahora habituales funcionalidades: Responder (Reply) y Reenviar (Forward ). 1977 .- El módem para PC Internet dio un paso de gigante en 1977 gracias al desarrollo de lo que conocemos como módem de PC. Fue desarrollado por Dennis Hayes y Dale Heatherington. Gracias a ello el acceso a Internet se popularizó años después y podría realizarse a través de la red telefónica. 1978 .- Nace el spam El año 1978 también será recordado como el que trajo al mundo el spam, que inicialmente se denominó unsolicited commercial email message. Fue enviado a 600 usuarios de ARPANET California por Gary Thuerk. Internet, tal y como hoy lo conocemos, ha pasado a través de numerosos cambios y evoluciones adoptando nuevas tecnologías para los usos que iban surgiendo. Los 80 fueron muy importantes ya que nacieron los DNS y se implementó TCP/IP, entre otras muchas novedades. 1983 .- Cambio a TCP/IP en ARPANET

Planificación de Clase Técnico Medio en Diseño Gráfico I año

Módulo: Diseño Web Tiempo: 60 horas

Prof. Delvin Martín Díaz M.

El 1 de enero de 1983 fue la fecha límite para el cambio a los protocolos TCP/IP en los ordenadores de ARPANET. Vinton Cerf los creó y en aquella época sólo afecto a cientos de ordenadores. El servidor de nombre también fue desarrollado el mismo año. 1984 .- Domain Name System (DNS) 1987 .- Internet crece Este año ya había cerca de 30.000 ordenadores conectados a Internet. El protocolo ARPANET tenía limitación para 1.000 usuarios, pero la adopción de TCP/IP hizo que ese número creciera considerablemente. 1988: IRC – Internet Relay Chat Internet Relay Chat (IRC) fue el primer desarrollo que ofrecía chat en tiempo real, el germen de lo que hoy conocemos como programas de mensajería instantánea.

1988 .- Primer ataque malicioso a través de Internet Uno de los primeros gusanos de Internet fue lanzado este año, conocido como The Morris Worm. Fue escrito por Robert Tappan Morris y causó interrupciones en el servicio de manera general en gran parte de Internet. 1989 .- La propuesta World Wide Web 1989 trajo consigo la propuesta de la World Wide Web, escrita por Tim Berners-Lee. Fue publicada en marzo en MacWorld y posteriormente se redistribuyó en mayo de 1990. Fue escrita para persuadir al CERN de que un sistema global de hipertexto sería beneficioso para todo el mundo. Originalmente se llamó Mesh y el término World Wide Web se acuñó cuando Berners-Lee escribía el código en 1990.

Planificación de Clase Técnico Medio en Diseño Gráfico I año

Módulo: Diseño Web Tiempo: 60 horas

Prof. Delvin Martín Díaz M.

Esta década es más reciente y muchos de nosotros la recordaremos de manera nostálgica. Por aquel entonces la informática doméstica comenzó a tomar fuerza y el acceso a Internet mediante línea telefónica popularizó la red de redes. 1990 .- Primer ISP telefónico El nacimiento del primer proveedor de Internet a través del teléfono (The World) junto con el módem para PC hizo que Internet se popularizara y la gente de a pie pudiese acceder a ella. Ese mismo año ARPANET como tal desapareció debido a la facilidad de uso y los servicios a través de ISPs. 1990 .- Finalizan los protocolos World Wide Web El código para la World Wide Web fueron escritos por Tim Berners-Lee, siguiendo la propuesta que redactó el año anterior, junto con los estándares HTML, HTTP y las URLs. 1991 .- Nace la primera página web 1991 fue el año en el que Internet comenzó a tomar un aspecto más actual. Nació la primera página web de manera similar al primer email. La primera página web no era más que una pequeña referencia sobre qué era y qué se podía hacer en la World Wide Web. 1991 .- Nace el primer buscador por contenidos El mismo año que nace la World Wide Web, surge la necesidad de un buscador que examine la Red para encontrar contenidos de nuestro interés. Así pues, nació Gopher, que buscaba dentro de los contenidos de las páginas web y no en los nombres en sí de las mismas. 1991 .- Nace la primera webcam Uno de los más interesantes desarrollos de los años 90 fue la primera webcam. Fue en el laboratorio de ordenadores de la Universidad de Cambridge donde nació y su propósito inicial fue monitorizar una cafetera para que el equipo pudiera comprobar si quedaba café y evitar viajes en balde. A día de hoy las videoconferencias son posibles gracias a esta invención. 1993 .- Primer navegador gráfico – Mosaic El primer navegador apto para todos los públicos nació en 1993. Se llamó Mosaic y se considera el primero en ofrecer acceso a Internet y WWW de manera sencilla para los que no tenían conocimientos informáticos. Anteriormente se navegaba en modo texto, de manera mucho menos intuitiva. 1993 .- Los gobiernos se unen a Internet En 1993, tanto la Casa Blanca estadounidense como las Naciones Unidas se unieron a la red de redes y comenzaron dos de los dominios actuales .gov y .org. 1994 .- Netscape Navigator

Planificación de Clase Técnico Medio en Diseño Gráfico I año

Módulo: Diseño Web Tiempo: 60 horas

Prof. Delvin Martín Díaz M.

El primer gran competidor de Mosaic nació en 1994, hablamos de Netscape Navigator. Internet se iba convirtiendo en un lugar al acceso de todos gracias a los nuevos navegadores gráficos que permitian una navegación muy clara y sencilla. 1995 .- Comercialización de Internet Este año es conocido como el año en el que se volvió comercial la Web. Varios desarrollos hicieron posible dicho paso, como por ejemplo el SSL (Secure Sockets Layer), un sistema de cifrado que fue desarrollado por Netscape y que permitía realizar de manera segura transacciones financieras on-line. Además, dos grandes compañías comenzaron su negocio ese mismo año; nos referimos a eBay (Echo Bay fue su nombre originario) o Amazon.com. A modo de curiosidad ninguna de ellas ofreció beneficios en los primeros 6 años de vida, es decir, hasta 2001. 1996 .- Llega el webmail Fue en 1996 cuando HoTMaiL (con mayúsculas homenajeando HTML) se convirtió en el primer servicio de email on-line.

1998 .- Nace Google!

Planificación de Clase Técnico Medio en Diseño Gráfico I año

Módulo: Diseño Web Tiempo: 60 horas

Prof. Delvin Martín Díaz M.

Google nació en 1998 revolucionando la manera en la que la gente buscaba información on-line. A día de hoy la compañía tiene numerosos proyectos en marcha y ha tomado dimensiones de multinacional que planta cara a Microsoft, y otras grandes compañías en sectores como ofimática, email, buscadores, telefonía móvil y, en breve, en sistemas operativos. 1998 .- Nace Napster, y compartir archivos on-line 2001 .- Nace Wikipedia Wikipedia fue lanzada en 2001 y se convirtió en la primera enciclopedia hecha por y para internautas de manera colaborativa. A día de hoy sigue entre nosotros y aumenta el número de artículos y de aportaciones de los internautas. 2003 .- La telefonía VoIP se populariza Skype nació como programa para cualquier usuario que permitía realizar llamadas a un precio económico a través de Internet de manera sencilla. Podríamos decir que se popularizó la VoIP (Voice over IP). 2004 .- Web 2.0 Aunque el término fue acuñado en 1999 por Darcy DiNucci, en referencia a sitios web y Rich Internet Applications (RIA) que son muy interactivas y creadas por participación de los propios usuarios, no fue hasta la primera conferencia Web 2.0 cuando se propuso este término como una plataforma o lo que viene a ser el precursor de las aplicaciones en la nube. 2004 .- Nace Facebook Facebook fue lanzado en 2004 aunque de manera cerrada, es decir, sólo disponible para los estudiantes universitarios estadounidenses. Por aquel entonces se conocía como "The Facebook". A día de hoy ha perdido el "The" y ha ganado millones de usuarios a nivel global, hablamos de más de 350 millones de usuarios.

2005 .- YouTube ¿Qué internauta de hoy día no conoce YouTube? Parece mentira que sólo lleve cuatro años entre nosotros. Google adquirió el servicio posteriormente y a día de hoy es uno de los lugares más visitados en la red de redes.

Planificación de Clase Técnico Medio en Diseño Gráfico I año

Módulo: Diseño Web Tiempo: 60 horas

Prof. Delvin Martín Díaz M.

2006 .- Nace Twitter Twitter fue lanzado en 2006 e inició una nueva manera de comunicarse, conocida como microblogging. A principio se iba a llamar Twittr, de manera similar a Flickr, de hecho el primer mensaje enviado en el servicio es "just setting up my twttr". A día de hoy sigue sumando nuevos usuarios y está buscando formas de monetizar el servicio. 2007 .- La TV en Internet Servicios de vídeo bajo demanda de contenidos televisivos comenzaron a nacer en 2007. De hecho, Hulu, compañía con capital de riesgo de ABC, NBC y Fox, permite ver on-line contenidos de dichas cadenas a traves de Internet.

2007 .- iPhone e Internet para móviles Con el iPhone y su gran popularidad Internet ha evolucionado adaptándose a este tipo de dispositivos, los smartphones, con pantallas de gran tamaño para tratarse de móviles. Internet para móviles existe desde los tiempos de WAP, pero no ha sido hasta la popularización de los smartphones y las conexiones de banda ancha móvil cuando la Red ha comenzado a moverse hacia esa direción.

Planificación de Clase Técnico Medio en Diseño Gráfico I año

Módulo: Diseño Web Tiempo: 60 horas

Prof. Delvin Martín Díaz M.

3. El Internet en la actualidad Su contenido equivale a 3 millones de veces la cantidad de libros escritos en la historia. El Universo Digital tiene más de 1.000 millones de usuarios e igual cantidad de dispositivos para tomar imágenes. ¿Se termina la capacidad de almacenamiento? El Informe “La expansión del Universo Digital: Un pronóstico del crecimiento mundial de la información al año 2010”, revela la cantidad anual de información creada y copiada a escala global. Se estima la dimensión y las características del denominado “universo digital” hasta el año 2010, y específicamente se identifican los distintos tipos de información y geografías que contribuyen a su crecimiento. Los resultados de este reporte tienen implicancias radicales para las personas, las organizaciones y la sociedad Conclusiones Clave En el 2006 el universo digital ha alcanzado la dimensión de 161.000 millones de gigabytes (161 exabytes), continuando un período sin precedentes de crecimiento de la información. Este universo digital equivale aproximadamente a 3 millones de veces la cantidad total de libros escritos en la historia de la humanidad o el equivalente a 12 pilas de libros, cada una ellas extendiéndose a 93 millones de millas desde la Tierra al Sol. Imágenes: Las imágenes, capturadas por más de mil millones de dispositivos en el mundo, desde cámaras digitales, teléfonos con cámara digital, escaners médicos y cámaras de seguridad, comprenden la mayor porción del universo digital. Cámaras Digitales: En el año 2006 y a escala mundial, las imágenes capturadas por cámaras digitales excedieron los 150 mil millones, mientras que las imágenes capturadas por teléfonos celulares alcanzaron la cantidad de 100 mil millones. IDC pronostica que la captura de imágenes por medio de estas tecnologías alcanzaran globalmente la cifra de 500 mil millones de imágenes para el año 2010. Filmaciones Digitales: El uso de las mismas se duplicará en minutos totales desde la actualidad hasta el 2010. E-mail: Las direcciones de e-mail crecieron de 253 millones en el año 1998 a 1.600 millones en el año 2006. En ese lapso, la cantidad de e-mails enviados creció a una tasa tras veces mayor que las personas que utilizan el e-mail. En el año 2006, el tráfico unilateral e-mail incluyendo el spam, alcanzó los 6 exabytes. Mensajes Instantáneos: Se estima que existirán 250 millones de cuentas de mensajes instantáneos para el año 2010, incluyendo las cuentas de consumidores hacia donde los mensajes comerciales instantáneos son enviados. Banda Ancha: Hoy en día, el 60% de usuarios de Internet tiene acceso mediante banda ancha.

Planificación de Clase Técnico Medio en Diseño Gráfico I año

Módulo: Diseño Web Tiempo: 60 horas

Prof. Delvin Martín Díaz M.

Internet: En el año 1996 existían 48 millones de personas utilizando rutinariamente Internet. La Web tenía solamente 2 años de antigüedad. IDC declara que existen en la actualidad 1.100 millones de usuarios. Para el año 2010 se esperan otros 500 millones de usuarios adicionales. Datos No estructurados: Más del 95% del universo digital se compone de datos no estructurados. En las organizaciones, los datos no estructurados comprenden más del 80% de toda la información. Cumplimiento de regulaciones y Seguridad: En la actualidad, el 20% del total del universo digital está sujeto a políticas y estándares regulatorios, y cerca del 30% de ese universo está potencialmente sujeto a aplicaciones de seguridad empresaria. Clasificación: IDC estima que en la actualidad menos del 10% de la información dentro de las organizaciones está clasificada, o bajo un ranking de valoración. IDC espera que la cantidad de datos clasificados crezcan más de un 50% anual. ¿Hacia un Big Bang? “Esta masa de información cada vez mayor está poniendo una tensión considerable sobre las infraestructuras de IT que tenemos hoy en día. Este crecimiento explosivo cambiará la manera en que las organizaciones y profesionales de IT hacen su trabajo y la manera en que los consumidores utilizan la información”, dijo Mark Lewis, vicepresidente Ejecutivo y Jefe de Desarrollo de EMC. “Dado que el 85% de la información creada y copiada será responsabilidad de las organizaciones, debemos tomar medidas como industria para asegurarnos de desarrollar infraestructuras de información flexibles, confiables y seguras para manejar la avalancha”, agregó. “Este crecimiento increíble representa más que un explosión mundial de información sin precedentes”, dijo John Gantz, jefe de Investigaciones y Vicepresidente de IDC. “Esto representa un cambio radical en la forma en que la información permutó desde la tecnología analógica - en donde los datos eran finitos al formato digital. Bajo la consideración de una perspectiva tecnológica, las organizaciones deberán implementar técnicas cada vez más sofisticadas para transportar, almacenar, asegurar y replicar la información que es generada a diario”.

4. ¿Cómo Funciona el Internet?

Ver Vídeo Cómo Funciona el Internet.flv

5. Tipos de Sitios Web Existen muchas variedades de sitios web, cada uno especializándose en un tipo particular de contenido o uso, y puede

Planificación de Clase Técnico Medio en Diseño Gráfico I año

Módulo: Diseño Web Tiempo: 60 horas

Prof. Delvin Martín Díaz M.

ser arbitrariamente clasificados de muchas maneras. Unas pocas clasificaciones pueden incluir: 1. Sitio archivo: usado para preservar contenido electrónico valioso amenazado con extinción. Dos ejemplos son: Internet Archive, el cual desde 1996 ha preservado billones de antiguas (y nuevas) páginas web; y Google Groups, que a principios de 2005 archivaba más de 845.000.000 mensajes expuestos en los grupos de noticias/discusión de Usenet, tras su adquisición de Deja News. 2. Sitio weblog (o blog): sitio usado para registrar lecturas online o para exponer diarios en línea; puede incluir foros de discusión. Ejemplos: Blogger, Xanga. LiveJournal, WordPress etc. 3. Sitio de empresa: usado para promocionar una empresa o servicio. 4. Sitio de comercio electrónico: para comprar bienes, como Amazon.com. 5. Sitio de comunidad virtual: un sitio donde las personas con intereses similares se comunican con otros, normalmente por chat o foros. Por ejemplo: MySpace, Facebook etc. 6. Sitio de Base de datos: un sitio donde el uso principal es la búsqueda y muestra de un contenido específica de la base de datos como la Internet Movie Database. 7. Sitio de desarrollo: un sitio el propósito del cual es proporcionar información y recursos relacionados con el desarrollo de software, diseño web, etc. 8. Sitio directorio: un sitio que contiene contenidos variados que están divididos en categorías y subcategorías, como el directorio de Yahoo!, el directorio de Google y el Open Directory Project. 9. Sitio de descargas: estrictamente usado para descargar contenido electrónico, como software, demos de juegos o fondos de escritorio: Download, Tucows, Softonic, Baulsoft. 10. Sitio de juego: un sitio que es propiamente un juego o un "patio de recreo" donde mucha gente viene a jugar, como MSN Games, Pogo.com y los MMORPGs VidaJurasica, Planetarion y Kings of Chaos. 11. Sitio de información: contiene contenido que pretende informar a los visitantes, pero no necesariamente de propósitos comerciales; tales como: RateMyProfessors.com, Free Internet Lexicon and Encyclopedia. La mayoría de los gobiernos e instituciones educacionales y sin ánimo de lucro tienen un sitio de información. 12. Sitio de noticias: Similar a un sitio de información, pero dedicada a mostrar noticias y comentarios. 13. Sitio pornográfico: muestra imágenes y vídeos de contenido sexual explícito.

Planificación de Clase Técnico Medio en Diseño Gráfico I año

Módulo: Diseño Web Tiempo: 60 horas

Prof. Delvin Martín Díaz M.

14. Sitio buscador: un sitio que proporciona información general y está pensado como entrada o búsqueda para otros sitios. Un ejemplo puro es Google, Yahoo etc. 15. Sitio shock: incluye imágenes u otro material que tiene la intención de ser ofensivo a la mayoría de visitantes. Ejemplos: rotten.com, [ratemypoo.com]. 16. Sitio de subastas: subastas de artículos por internet, como eBay. 17. Sitio personal: Mantenido por una persona o un pequeño grupo (como por ejemplo familia) que contiene información o cualquier contenido que la persona quiere incluir. 18. Sitio portal: un sitio web que proporciona un punto de inicio, entrada o portal a otros recursos en Internet o una intranet. 19. Sitio Web 2.0: un sitio donde los usuarios son los responsables de mantener la aplicación viva, usando tecnologías de última generación: pikeo, flickr Creador de sitios: es básicamente un sitio que te permite crear otros sitios, utilizando herramientas de trabajo en línea, como PageCreative. 20. Wiki: un sitio donde los usuarios editan colaborativamente (por ejemplo: Wikipedia). 21. Sitio político: un sitio web donde la gente puede manifestar su visión política. Ejemplo: New Confederacy. 22. Sitio de rating: un sitio donde la gente puede alabar o menospreciar lo que aparece. 23. Sitios educativos: promueven cursos presenciales y a distancia, información a profesores y estudiantes, permiten ver o descargar contenidos de asignaturas o temas. 24. Sitio spam: sitio web sin contenidos de valor que ha sido creado exclusivamente para obtener beneficios y fines publicitarios, engañando a los motores de búsqueda.

6. ¿Qué es HTML? HTML, siglas de HyperText Markup Language («lenguaje de marcado de hipertexto»), es el lenguaje de marcado predominante para la elaboración de páginas web. Es usado para describir la estructura y el contenido en forma de texto, así como para complementar el texto con objetos tales como imágenes. HTML se escribe en forma de «etiquetas», rodeadas por corchetes angulares (<,>). HTML también puede describir, hasta un cierto punto, la apariencia de un

Planificación de Clase Técnico Medio en Diseño Gráfico I año

Módulo: Diseño Web Tiempo: 60 horas

Prof. Delvin Martín Díaz M.

documento, y puede incluir un script (por ejemplo JavaScript), el cual puede afectar el comportamiento de navegadores web y otros procesadores de HTML. Es importante comprender que el lenguaje HTML es un estándar, compuesto por recomendaciones publicadas por un consorcio internacional: el World Wide Web Consortium (W3C). Las especificaciones oficiales de HTML describen las "instrucciones" del lenguaje, pero no cómo seguirlas, es decir, cómo las interpretan los programas informáticos. Esto permite visualizar páginas Web independientemente del sistema operativo o la arquitectura del equipo del usuario. Sin embargo, aunque las especificaciones son muy detalladas, hay cierto margen para la interpretación por parte del navegador y esta es la razón por la cual la misma página puede aparecer de modo diferente en un navegador u otro. Es más, algunos editores de software agregan instrucciones HTML exclusivas que no se hallan en las especificaciones de W3C. Por este motivo, las páginas Web que contienen dichas instrucciones pueden ser vistas en un navegador, y ser completa o parcialmente ilegibles en otros. Por esto, las páginas Web deben seguir las recomendaciones de W3C, de forma que lleguen al público más amplio posible.

7. Versiones de HTML HTML fue diseñado por Tim Berners-Lee, quien trabajaba entonces como investigador de CERN, en 1989. Anunció oficialmente la creación de la Web en Usenet en agosto de 1991. Sin embargo, no fue hasta 1993 que HTML se consideró suficientemente avanzado para ser llamado lenguaje (HTML fue simbólicamente bautizado HTML 1.0). El navegador Web usado adoptó el nombre de NCSA Mosaïc. RFC 1866, de noviembre de 1995, representó la primera versión oficial de HTML, denominada HTML 2.0. Luego de la breve aparición de HTML 3.0, que nunca se lanzó oficialmente, HTML 3.2 se convirtió en el estándar oficial el 14 de enero del 1997. Los cambios más significativos de HTML 3.2 fueron la estandarización de las tablas, así como muchos aspectos relacionados con la presentación de las páginas Web. El 18 de diciembre de 1997 se lanzó HTML 4.0. Las versión 4.0 de HTML fue importante para la estandarización de las hojas de estilo y los marcos. La versión HTML 4.01, que apareció el 24 de diciembre de 1999, introdujo modificaciones menores en HTML 4.0. HTML 4.0 implementa características como XForms 1.0 que no necesitan implementar motores de navegación que eran incompatibles con algunas páginas web HTML. En 2004 la W3C reabrió el debate

Planificación de Clase Técnico Medio en Diseño Gráfico I año

Módulo: Diseño Web Tiempo: 60 horas

Prof. Delvin Martín Díaz M.

de la evolución del HTML, dándose a conocer las bases para la versión HTML5. No obstante, este trabajo fue rechazado por los miembros del W3C y se daría preferencia al desarrollo del XML. Apple, Mozilla y Opera anunciaron su interés en seguir trabajando en el proyecto bajo el nombre de WHATWG,12 que se basa en la compatibilidad con tecnologías anteriores. En 2006, el W3C se interesó en el desarrollo de HTML5, y en 2007 se unió al grupo de trabajo del WHATWG para unificar el proyecto. La versión HTML 5, promete revolucionar la red completamente, está respaldada por algunas de las mayores compañías de Internet, se trata de una actualización, esperada por mucho tiempo. Así como es utilizado en navegadores que incluyen Firefox, Chrome, Safari, e Internet Explorer 9, muchos teléfonos móviles también apoyan el nuevo lenguaje. Esto abre todo tipo de nuevas posibilidades para que las compañías desarrollen servicios que pueden ser potencialmente utilizados por casi todo el mundo, sin importar qué aparato utilizan para navegar en la red.

8. Los navegadores y su compatibilidad Ahora, vamos a ver varias tablas de compatibilidad entre los navegadores web más populares y HTML 5. Compatibilidad de los navegadores con aplicaciones web en HTML 5

Compatibilidad de los navegadores con el contenido embebido en HTML 5

Planificación de Clase Técnico Medio en Diseño Gráfico I año

Módulo: Diseño Web Tiempo: 60 horas

Prof. Delvin Martín Díaz M.

Compatibilidad de los navegadores con los códecs de audio en HTML 5

Compatibilidad de los navegadores con los códecs de vídeo en HTML 5

Compatibilidad de los navegadores con los formularios de entrada de HTML 5

Planificación de Clase Técnico Medio en Diseño Gráfico I año

Módulo: Diseño Web Tiempo: 60 horas

Prof. Delvin Martín Díaz M.

Compatibilidad de los navegadores con los atributos de los formularios de HTML 5

Una de las características más deseadas de HTML 5 es su capacidad para AUDIO y VIDEO.

Planificación de Clase Técnico Medio en Diseño Gráfico I año

Módulo: Diseño Web Tiempo: 60 horas

Prof. Delvin Martín Díaz M.

9. Editores La función principal de los editores web es la de facilitar la creación de código HTML, que es el código con que se construyen las páginas web. Así, puedes crear una página web incluso sin saber nada de HTML ni de otros lenguajes de la web, ya que el editor se encarga de eso. Sin embargo, incluso cuando uses un editor HTML, es bueno que sepas algo de HTML y CSS para tener más libertad en el desarrollo de tu web. Otras cosas para las que sirve un editor web son:

Facilita el desarrollo de código CSS y JavaScript Ayuda a seguir los estándares web Ayuda a gestionar los archivos tanto en la computadora local como en el servidor remoto Puede facilitar el diseño en tiempo real, permitiéndote ver la página a medida que la vas

creando

Tipos de editores web Existen dos tipos principales de editores web, los de texto (ejemplo: blog de notas de Windows, notepad++, Aptana Studio, editpad lite, entre otros) y los editores WYSIWYG (ejemplo: Dreamweaver). Los editores web de texto colorean de diferente manera las instrucciones y parámetros del texto, revisan la sintaxis del código indicando y corrigiendo errores, y cumplen otras funciones similares que facilitan el desarrollo de código HTML. Estos editores permiten mucha flexibilidad para crear la página web, pero para usarlos tienes que ser experto en HTML y CSS, ya que el código se introduce manualmente. Suelen ser usados principalmente por programadores y no son tan apreciados por diseñadores. Los editores web WYSIWYG se llaman así porque sus siglas significan What You See Is What You Get, o, que en castellano sería Lo que ves es lo que obtienes. Son editores ideales para diseñadores y para gente sin mucho conocimiento de codificación, ya que permiten crear la página web en modo diseño, arrastrando elementos y apretando botones. Por tanto, no necesitas saber HTML ni CSS para crear una página web con un editor WYSIWYG, aunque la mayoría también tiene una ventana que permite editar directamente el código. Ventajas de los editores web de texto

Facilitan y aceleran el desarrollo de código HTML, CSS, JavaScript y otros lenguajes de desarrollo web

Al corregir la sintaxis reducen la cantidad de errores Facilitan la gestión de archivos en un proyecto

Desventajas de los editores web de texto Necesitas conocer bien HTML y otros lenguajes empleados para crear páginas web

Planificación de Clase Técnico Medio en Diseño Gráfico I año

Módulo: Diseño Web Tiempo: 60 horas

Prof. Delvin Martín Díaz M.

Algunos de estos editores no permiten visualizar el resultado en tiempo real (mientras estás desarrollando la página)

Ventajas de los editores web WYSIWYG Puedes ver el resultado a medida que creas tu página web Tienes poca probabilidad de producir errores en el código porque el editor revisa y corrige la

sintaxis El editor web te facilita el trabajo con CSS, JavaScript y XML También te facilita la gestión de archivos en el sitio No necesitas saber nada de HTML (aunque siempre es útil saber aunque sea un poquito) Te permite y facilita el uso de plantillas web El tiempo de creación de una página web se reduce notablemente

Desventajas de los editores web WYSIWYG Aunque el código que genera el editor es funcional, puede no ser el más eficiente Lo que puedes ver durante el desarrollo de tu página no siempre corresponde 100% con lo que

verás en el navegador Sacrificas algo de control y flexibilidad sobre el diseño de tu web (aunque esto vale más para

las versiones antiguas de editores web que para las versiones modernas) En resumen, es buena idea que uses un editor para crear tu web, porque te facilitará y acelerará el trabajo. Si no eres un experto en lenguajes de diseño y desarrollo web es importante que elijas un editor WYSIWYG, pero aun teniendo uno confiable es importante que aprendas algo de HTML y CSS como mínimo.

10. ¿Por qué utilizar HTML5? ✔ Más fácil de escribir e interpretar.

✔ Más ligero de cargar por el navegador.

✔ Varias opciones disponibles para el posicionamiento web de las páginas.

Una de las causas de la necesidad de ir migrando al uso del HTML5, es la infinidad de opciones disponibles en la actualidad y que crece cada día. Una de ellas es el empleo del microformato en las páginas web, que algunos son totalmente incompatibles con otros lenguajes por lo que no validan correctamente a no ser que se use HTML5. La nueva versión de HTML contiene elementos dedicados ampliamente a mejorar la experiencia del usuario en nuestra página web, haciendo más fácil al diseñador poder agregar elementos de audio, video y en general del web 2.0 así como organizar sus contenidos utilizando menos código. También HTML5 nos permite una mayor interacción entre nuestras páginas web y contenido media (video, audio, entre otros) así como una mayor facilidad a la hora de codificar nuestro diseño básico. La nueva versión es más eficiente y ocupa menos recursos en la computadora del cliente, en particular mediante el uso del nuevo reproductor que no requiere flash o adobe player para utilizarse,

Planificación de Clase Técnico Medio en Diseño Gráfico I año

Módulo: Diseño Web Tiempo: 60 horas

Prof. Delvin Martín Díaz M.

y siendo el HTML5 compatible con las versiones anteriores de HTML, utilizar la nueva versión en una página ya diseñada implica un menor trabajo que si fuera una colección completamente nueva. Por el contrario, HTML5 radica fuertemente en las capacidades del explorador, por lo que en estos momentos no todos los exploradores lo soportan (actualmente sólo Chrome, Safari, Firefox y Opera soportan la mayoría de las características).

11. Planeación y recomendaciones para crear un Sitio web La elaboración de Web sites hoy por hoy son una nueva fuente de trabajo para muchas personas de diferentes profesiones, pero desarrollarlos de forma eficiente es una tarea que requiere investigación, creatividad y gestión. Con estas recomendaciones se busca orientar en aspectos sobre planeación, diseño, contenido y estructura de sitos Web, a personas que inician el desarrollo de un Web site o a las que ya lo hacen, a fin de que comparen y tomen decisiones, para que un Web site verdaderamente sea una herramienta y le brinde un valor agregado a sus empresa. No se pretende ofrecer un tratado sobre creación de sitios, se busca contribuir con un resumen práctico, para que un sitio sea más competitivo y se diferencie de los demás. Para ello se han dividido estas reglas en 4 ejes centrales

Planeación Diseño Contenido Estructura

Planeación Montar un Web site en la red de redes Internet, no es solamente un problema de tecnología. La planeación, la organización y el control, son procesos que se deben desarrollar con la profundidad y antelación necesarias para que el sitio cumpla realmente con el objetivo que se pretende. Un Web site se puede colgar de la red con muchos y diversos propósitos: hacer conocer un negocio, institución u organización; ofrecer y vender productos o servicios; generar una imagen institucional; describir organizaciones; publicar opiniones; promocionar eventos; información de revistas, periódicos o libros; facilitar procesos internos en la organizaciones; opiniones personales u hojas de vida, etc. Realmente un Web site es una herramienta poderosísima para divulgar, informar o hacer conocer, por parte de personas u organizaciones, cualquier hecho, circunstancia o cosa, ante los ojos del mundo.

Planificación de Clase Técnico Medio en Diseño Gráfico I año

Módulo: Diseño Web Tiempo: 60 horas

Prof. Delvin Martín Díaz M.

Con la planeación de un Web site, se pretende determinar y definir en términos globales y concretos, cuáles serán las condiciones en el presente y el futuro en cuanto a su estructura, contenido, diseño, tecnología, administración, entorno, elaboración y actualización permanente. Si se ha tomado la decisión de tener un Web site en la red y no se tienen las condiciones tecnológicas, ni de conocimientos para construirla y actualizarla, en el mercado se encuentran cientos de empresas que pueden realizar ese trabajo y aportar la tecnología que se necesita para tener presencia amplia, permanente y oportuna en la red, y así estar conectado al mundo. Delimitar el tema que se incluirá en el sitio es fundamental para evitar dificultades posteriores como puede ser un crecimiento desorganizado sin especificaciones claras y predeterminadas. 1. Definir claramente el público a quien va dirigido el contenido del Web site 2. Delimitar el tema de que va a tratar el Web site 3. Definir si el sitio es de opinión, personal o institucional 4. Aclarar si la información es de fuente primaria o secundaria 5. Evaluar adecuadamente la cantidad de tiempo que se dispone frente a la cantidad de tiempo requerido para elaborar el sitio 6. Definir la magnitud de los contenidos del sitio 7. Aclarar y definir las especificaciones concretas que debe cumplir el sitio 8. Definir necesidades y limitaciones tecnológicas para la visita al sitio 9. Definir que navegador (browser) se debe utilizar para una mejor visualización del sitio 10. Aclarar si la información expuesta es para: persuadir, informar, educar o explicar 11. Definir si el sitio va a ser interactivo 12. Definir claramente el tipo de estructura del sitio 13. Registrar el sitio en los diferentes motores de búsqueda 14. Si el sitio ofrece algún producto, documento, curso, servicio o información se debe estar seguro que se dispone realmente de él 15. Probar, probar, probar; revisar, revisar, revisar 16. Responder rápidamente la correspondencia generada desde el sitio 17. Los sitios se deben lanzar o inaugurar una sola vez 18. El sitio debe tener un perfil global 19. Hacer publicidad al sitio en medios convencionales 20. Realizar alianzas con otras empresas que tengan sitios 21. El sitio debe ser responsabilidad de todos los estamentos de la organización

Diseño Los elementos que componen un Web site, deben ubicarse y distribuirse dentro de él, de tal manera que el usuario no olvide con facilidad que ha estado en un lugar de la Internet donde se ha sentido cómodo en todos los sentidos, aún digiriendo un contenido pesado.

Planificación de Clase Técnico Medio en Diseño Gráfico I año

Módulo: Diseño Web Tiempo: 60 horas

Prof. Delvin Martín Díaz M.

Los gráficos, el estilo gráfico, la cantidad, calidad y tamaño de imágenes, los colores, los fondos, los estilos de texto, la música, las distribuciones y coherencias etc. son los elementos a tener en cuenta para el buen diseño de un Web site. Cualquier descuido que se tenga sobre alguno de ellos, al incorporarlo en el sitio, puede echar al traste con los objetivos perseguidos al abrir una ventana con información al mundo. 22. Muchas veces el mejor diseño es el más sencillo 23. El contenido horizontal de las páginas debe ocupar como máximo el tamaño de la pantalla 24. Todas las imágenes o iconos desplegados deben llevar un texto explicativo 25. Las imágenes en la primera página o home page se deben evitar al máximo o reducirlas de tamaño 26. Ninguna imagen debe sobrepasar el tamaño de 30K 27. Si necesariamente se desea incluir imágenes de gran tamaño, referenciarlas 28. Las imágenes de tipo fotográfico deben estar en formato JPG 29. Las imágenes de tipo dibujo deben estar en formato GIF 30. Las imágenes deben verse bien a una resolución de 256 colores 31. El texto debe necesariamente contrastar con el color o el diseño del fondo 32. Los colores utilizados deben guardar relación con el mensaje o tema tratado 33. Utilizar un solo tipo de letra (fuente) en todo el Web site 34. No se debe utilizar mayúscula sostenida en los textos 35. La interfaz de usuario debe tener un diseño sencillo pero completo 36. El diseño del sitio debe replicar en cierta forma la "personalidad" de su propietario 37. Los elementos de navegación deben ser probados para reafirmar que sus funciones son obvias 38. Todas las páginas del sitio deben diseñarse en un estilo consistente 39. Si el sitio tiene música de fondo debe guardar armonía con la información presentada en la pantalla 40. No usar campanas o sonidos dentro del sitio 41. Se debe utilizar el mismo diseño de interfaz con el usuario en todas las páginas 42. Escribir los textos con claridad y breves 43. Los encabezados deben ser resúmenes de los temas 44. Utilizar listas para resumir temas relacionados 45. Utilizar los menús de vínculos 46. Lo principal y lo fundamental del sitio se debe colocar en la parte superior izquierda de la página 47. Si una página depende de la anterior diseñar un vinculo de navegación que permita regresar al visitante a la anterior 48. Evitar el uso de los términos "esto" y "eso" para no confundir al lector 49. En las diferentes páginas se deben utilizar títulos significativos y descriptivos 50. Los textos largos y los párrafos completos no se deben utilizar como vínculos 51. Utilizar la negrilla lo menos posible en los textos 52. Evitar la utilización de la frase "haga clic aquí" 53. No utilizar terminología de visulizadores específicos

Planificación de Clase Técnico Medio en Diseño Gráfico I año

Módulo: Diseño Web Tiempo: 60 horas

Prof. Delvin Martín Díaz M.

54. No abusar de las imágenes 55. Ofrecer la posibilidad de visualizar el sitio con imágenes o sin ellas 56. La distribución de los mismos elementos utilizados en las diferentes páginas debe ser constante 57. Colocar los elementos de navegación en el mismo lugar en todas las páginas 58. Utilizar elementos de navegación explícitos 59. Utilizar en cada página un elemento de navegación que lleve al lector a la página inicial 60. Separar visualmente las secciones 61. Utilizar los pie de página o notas finales de página

Contenido Todo navegante de la Internet, en definitiva, va tras un contenido que satisfaga la necesidad de conocimiento, en un momento determinado, en cualquier lugar de la red. Si un Web site no tiene un contenido que solucione un problema de información y conocimiento, puede decirse que este sitio no existe en la Internet. Un sitio puede tener el mejor diseño, la más eficiente estructura y la más amplia difusión, pero si su contenido no interesa, nadie lo visitará. ¿Y para qué tanto despilfarro de recursos?. 62. Identificar el autor del sitio 63. Determinar el tipo de institución que soporta la información 64. Indicar si el sitio pertenece o tiene conexión con una institución más grande 65. Indicar la fecha de la última actualización del sitio 66. Utilizar e-mail para contactos con la organización propietaria del sitio o con el administrador (webmaster) 67. Indicar si el sitio ha sido recomendado por personas reconocidas, ha sido incluido en bibliografías por bibliotecas o ha sido merecedor de algún reconocimiento 68. El texto de un sitio no debe tener errores de ortografía 69. El sitio no debe contener malas construcciones gramaticales 70. Expresar claramente y al inicio del sitio si el uso de la información tiene algún costo o gravamen 71. Indicar específicamente la utilidad del sitio 72. Indicar el estado del sitio, ¿está en proceso de elaboración o actualización? 73. Indicar si la información tiene derechos de autor o comerciales 74. Incluir en la primera página la URL del sitio 75. Elaborar un mapa de búsqueda interna 76. Incluir información sobre seguridad 77. Manifestar al usuario la privacidad y responsabilidad del sitio frente a los posibles datos solicitados 78. Crear una página con información adicional para no recargar las páginas con datos sobre contactos

Planificación de Clase Técnico Medio en Diseño Gráfico I año

Módulo: Diseño Web Tiempo: 60 horas

Prof. Delvin Martín Díaz M.

79. Utilizar vínculos directos con la página inicial 80. Incluir dirección física del sitio 81. Si tiene logotipo utilizarlo 82. Indicar la fuente de la información 83. Si es una publicación, indicar el número de la edición 84. Traducir el sitio a otro idioma

Estructura La forma en que se unen o integran las diferentes páginas de un sitio, tiene incidencia directa en la eficiencia y eficacia, y en la búsqueda de información por parte de los navegantes. Un Web site puede tener desde una estructura completamente lineal hasta una estructura sin ninguna estructura aparente. Las estructuras para las páginas de un sitio más utilizadas son las jerárquicas, las lineales y las de red. Sin embargo, la mejor estructura es aquella que refleja los enlaces lógicos de la información que se desea presentar para ser navegada por los usuarios. La estructura del sitio debe ser una subordinada de la estructura lógica del contenido. Toda estructura tiene ventajas y desventajas, parece que la mejor es aquella por la cual el usuario puede pasearse y navegar como un pez en el agua; sin complicaciones, ni perdidas, ni trancones, y lo más importante, satisfecho en el recorrido lógico de su búsqueda de información, a medida que va encontrando el conocimiento entrelazado de acuerdo a su necesidad. 85. Equilibrar el número de páginas, ni muchas ni muy poquitas 86. Proporcionar un rápido y fácil acceso al contenido 87. Estructurar el contenido en forma lógica desde el punto de vista de los usuarios 88. La primera página del sitio debe ser funcional y considerarse como el núcleo central del sitio 89. Si el sitio utiliza bases de datos se debe ofrecer la forma de consultarla 90. Usar una dirección o URL mnemotécnica 91. Enlace el sitio con otros más interesantes o atractivos 92. Colocar título al sitio 93. Si se tienen secciones, usar encabezados 94. No olvidar la regla 14.4-30 95. Utilizar tablas de contenidos 96. Si se tienen tablas de contenidos utilizarlas para navegar 97. Definir los criterios para utilizar un enlace 98. Evitar los enlaces ciegos 99. Enlazar el sitio con otros tipos de fuentes de información 100. Estructurar el sitio en forma dinámica El tener un Web site dinámico lo hace atractivo, potente y más competitivo que la mayoría de los que

Planificación de Clase Técnico Medio en Diseño Gráfico I año

Módulo: Diseño Web Tiempo: 60 horas

Prof. Delvin Martín Díaz M.

están en la red. Un sitio dinámico no tiene límites para agregarle características especiales. Puede tener comunicación con bases de datos, mapas de imágenes, transacciones, formularios, servicios de suscripción, rotación de contenidos, anuncios diarios, cintas o frases del día, encuestas, etc.

12. Planificación jerárquica del Sitio Web Antes de programar el sitio, la estructura que tendrá debe ser bien clara. La estructura puede ser dibujada a mano o se puede utilizar unas de las aplicaciones graficas que se encuentran en comercio, también se deben definir los nombres de las carpetas y archivos que serán parte del sitio Web. Las extensiones de los archivos HTML deben ser ‘.html’ o ‘.htm’, se debe utilizar siempre la misma extensión para evitar confusiones. Es mejor no usar acentos en las letras que componen en nombre de los archivos, no poner espacios y de preferencia no hacerlo demasiado largo (diseno_01.html, Diseño 01.html).

HOME PAGE

Sección 2

Subsección 1.1

Sección 1 Sección 3 Sección 4

Subsección 1.2

Subsección 2.1

Subsección 2.2

Subsección 2.3

Subsección 2.4

Subsección 3.1

Subsección 3.2

Subsección 3.3

Subsección 4.1

= Links principales

= Links secundarios

Nivel 0

Pagina

principal

Nivel 1

Sessión

Principal

Nivel 2

Sessión de

aprofundimento

Home Page

Novedades

Historia

Presentación Impresa(Quien somos)

Productos

Fotografias

Noticias y Novedades

Eventos

Donde estamos

Contáctenos

Catalogo Productos

Documentación Técnica

Art. 1

Art. 2

Art. 1 (pdf)

Art. 2 (pdf)

Art. ...

Art. … (pdf)

NIVEL 0

NIVEL 1

NIVEL 2

NIVEL 3

Link principales

Link secundarios

NIVEL 0: Acceso al sitio

NIVEL 1: Secciones principales, permiten al usuario de orientarse en el sitio y de encontrar las informaciones que desea

Nivel 2: Subsección, informaciones más detalladas

Planificación de Clase Técnico Medio en Diseño Gráfico I año

Módulo: Diseño Web Tiempo: 60 horas

Prof. Delvin Martín Díaz M.

Nivel 3: Páginas específicas, documentos conectados, elementos multimediales

novedades

novedades.html

noticias.html

eventos.html

index.html (Home page)

mi_web

presentacion

historia.html

fotografias.html

fotografias

productos

presentacion.html

art_1.html

art_2.html

catalogo.html

t_art_1.pdf

t_art_2.pdf

tecnica.html

productos.html

novedades

novedades.html

noticias.html

eventos.html

index.html (Home page)

mi_web

presentacion

historia.html

fotografias.html

fotografias

productos

catalogo

presentacion.html

art_1.html

art_2.html

catalogo.html

doc_tecnica

t_art_1.pdf

t_art_2.pdf

tecnica.html

productos.html

novedades

index.html

noticias.html

eventos.html

index.html (Home page)

mi_web

presentacion

historia.html

fotografias.html

fotografias

productos

catalogo

index.html

art_1.html

art_2.html

index.html

doc_tecnica

t_art_1.pdf

t_art_2.pdf

index.html

index.html

13. Ejemplos de Sitios Web Ver documentos adjuntos en pdf en carpeta MaterialesUnidad1