Este documento presenta un plan para diseñar e implementar una página web para una empresa de diseño gráfico. Explica que la página web permitirá una mayor interacción entre la empresa y sus clientes, y explorar nuevas oportunidades de negocio. Incluye un marco teórico sobre Internet y la World Wide Web, y establece objetivos como servir de intermediario entre estudiantes y docentes, y proveer información detallada a visitantes.

1. INSTITUTO DE EDUCACIÓN SUPERIOR TECNOLÓGICO PÚBLICO
“DANIEL ALCIDES CARRIÓN”
PLAN DE DISEÑO E IMPLEMENTACIÓN DE UNA PAGINA WEB
“DISEÑO GRÁFICOS DE H&H COMPUTER”
Andrea BALDEON JANAMPA
E-mail: andreabaldeonjanampa@hotmail.com
Yanahuanca – Pasco - Perú
2017

2. INTRODUCCIÓN:
Los cambios que se han presentado en la sociedad contemporánea se ven afectados por los retos
del nuevo siglo y es la educación por medio de la informática el campo donde las expectativas de apertura
hacia la tecnología tienen lugar, para dar respuesta inmediata a ésta necesidad que surge en la vida misma
es importante abrir nuevos espacios para la transformación de las estructuras.
Vienen tiempo nuevos nuevas novedades de modelos de negocio como lo es el corretaje,
la publicidad, los informes diarios. lo que hace posible nuevas posibilidades de relación entre empresas,
consumidores, empleados, administración y la combinación entre ellos. Las nuevas tendencias en estos
días son el uso y manejo de información promedio de Páginas Web tanto por medio
de Internet, Extranet e Intranet. Todo esto dará como resultado más interacción entre usuarios
y organizaciones, generando así una audiencia masiva aumentando la credibilidad de la información de
dicha información que publique o venda sus productos o servicios por medio de una Página De Internet,
explorando así nuevas oportunidades de negocio los cuales podrán enriquecer la organización como tal,
así como una menor pérdida de información, explotando las tecnologías, lo cual podrá permitir la creación
de aplicaciones en Web más interactivos y fáciles de manejar. Por lo cual el siguiente
documento muestra los factores que debemos de tomar en cuenta con anterioridad al momento de
iniciar a crear una Página Web. Primeramente, antes de diseñar y desarrollar nuestra Página Web, hemos
tenido muy claro el tipo de diseño que queremos hacer. Por eso hemos escogido de tipo de contenido ya
que este tipo de páginas es el más utilizado y el más sencillo de realizar. Sólo mostraremos información
de la Página Web: Quiénes somos, nuestra misión, visión, los productos, noticias y eventos, etc.
Las interrelaciones entre el hombre y su ambiente en las tecnologías pueden generar diferentes
necesidades, que suelen experimentar las personas y son originadas por diferentes estados o sensaciones.

3. DIAGNÓSTICO:
La página se empezó a estructurar en abril de este año, en el trascurso de estos meses ha ido tomando
forma con la recopilación de la información que ya se tenía, se había previsto la presentación de la
página para el 12 de julio que ya hemos trabajado con mucho esfuerzo.
Para el diseño de la página se utilizó los programas de Adobe Dreamweaver Cs6, Adobe Flash Cs6,
Adobe Photoshop Cs6 y el Google Chrome que permite visualizar las páginas web en su forma
Terminada, para su mayor interactividad y estética se realizaron algunas animaciones utilizando el
programa de flash, Corel draw, Photoshop, con códigos sencillos en HTML, además para que la página
fuera más dinámica se enlazo ( vinculó) con otro lo que le permitió la interactividad y buen desempeño.
VARIABLE INDEPENDIENTE
Página Web.
VARIABLE DEPENDIENTE
Actualización de la Pagina Web.
VARIABLE INTERVINIENTE
Internet.
Usuarios.
Tecnología.
Infraestructura de Hardware y Software.
JUSTIFICACIÓN
En los últimos años se ha despertado un interés creciente por los temas relacionados con la masificación
en la utilización del internet en todos los campos que existan, Este interés se ha podido apreciar tanto
en la atención de querer publicar los servicios y productos que ofrezcan por medio desde las
instituciones públicas hasta las privadas
Así, por ejemplo, se tienen páginas de los diferentes ministerios del Perú, hasta cualquier negocio como
una florería, gasfitería, ferretería, etc.
En el mundo de la globalización la capacidad de respuesta a las necesidades del mercado viene
determinada por la adecuación y accesibilidad de la comunicación de la empresa.
“Las oportunidades no esperan”
Estar siempre disponible en cualquier lugar con el contenido adecuado. Comunicar la filosofía de la
empresa, valores, posicionamiento y productos requiere cada vez más de herramientas flexibles, donde

4. el contenido se adapte a los intereses del Mercado, oportunidades de negocio y, sobre todo, a las
necesidades del cliente.
Es por ello que se determinó realizar o rediseñar la página web.
OBJETIVOS:
Objetivos Generales
1.1. Servir de Intermediario alumno – docente relacionado a aspectos educativos y público en
general.
Objetivo Específicos
1.2.Herramienta de comunicación e información detallada para estudiantes y el público que tienen
un primer contacto con nuestra página.
1.3.Herramienta de Utilización con fidelización de parte de los visitantes.
MARCO TEÓRICO:
INTERNET
Es un sistema mundial de redes de computadoras, un conjunto integrado por las diferentes
redes de cada país del mundo; por medio del cual un usuario en cualquier computadora puede en
caso de contar con los permisos apropiados, accesar información de otra computadora y poder tener
inclusive comunicación directa con otros usuarios en otros ordenadores.
Starmedia (2003), dice: En Internet, las comunicaciones concretas se establecen entre dos
puntos: uno es el ordenador personal desde el que usted accede y el otro es cualquiera de los
servidores que hay en la Red y facilitan información. El fundamento de Internet es el TCP/IP, un
protocolo de transmisión que asigna a cada máquina que se conecta un número específico, llamado
"número IP" (que actúa a modo de "número teléfono único") como por ejemplo 192.555.26.11.
El protocolo TCP/IP comenta el autor, sirve para establecer una comunicación entre dos
puntos remotos mediante el envío de información en paquetes. Altransmitir un mensaje o una página
con imágenes, por ejemplo, el bloque completo de datos se divide en pequeños bloques que
viajan de un punto a otro de la red, entre dos números IP determinados, siguiendo cualquiera de las
posibles rutas. La información viaja por muchos ordenadores intermedios a modo de repetidores hasta
alcanzar su destino, lugar en el que todos los paquetes se reúnen, reordenan y convierten en la
información original.
Millones de comunicaciones se establecen entre puntos distintos cada día, pasando por cientos
de ordenadores intermedios. La gran ventaja del TCP/IP es que es inteligente; como cada intercambio
de datos está marcado con números IP determinados, las comunicaciones no tienen por qué
cruzarse. Y sí los paquetes no encuentran una ruta directa, los ordenadores intermedios prueban
vías alternativas. Se realizan comprobaciones en cada bloque para que la información llegue intacta,
y en caso de que se pierda alguno, el protocolo lo solicita de nuevo hasta que se obtiene la información
completa.
La base de todas las máquinas y software sobre el que funciona Internet es TCP/IP: los

5. programas de correo electrónico, transferencia de archivos y transmisión de páginas con texto e
imágenes y enlaces de hipertexto. Cuando es necesario, un servicio automático
llamado DNS convierte automáticamente esos crípticos números IP a palabras más
inteligibles para que sean fáciles de recordar (Universidad Metropolita Mexicana, 2003).
LA WORLD WIDE WEB
Según Starmedia (2003), la World Wide Web es tal vez el punto más visible de Internet, y
hoy en día el más usado junto con el correo electrónico, aunque también es de los más recientes.
Originalmente denominado Proyecto WWW y desarrollado en el CERN suizo a principio de los 90,
partió de la idea de definir un "sistema de hipermedios distribuidos". La WWW puede definirse
básicamente como tres cosas: hipertexto, que es un sistema de enlaces que permite saltar de unos
lugares a otros; multimedia, que hace referencia al tipo de contenidos que puede manejar (texto,
gráficos, vídeo, sonido y otros) e Internet, las base sobre las que se transmite la información.
El aspecto exterior de acuerdo con Starmedia (2003), de la WWW son las conocidas "páginas
Web". Una ventana muestra al usuario la información que desea, en forma de texto y gráficos,
con los enlaces marcados en diferente color y subrayados. Haciendo un clic con el ratón se puede
saltar a otra página, que tal vez esté instalada en un servidor al otro lado del mundo.
El usuario también puede navegar pulsando sobre las imágenes o botones que formen parte
del diseño de la página. Las páginas de la WWW están situadas en servidores de todo el mundo
(sitios Web), y se accede a ellas mediante un programa denominado
"navegador" (browser). Este programa emplea un protocolo llamado HTTP, que funciona sobre
TCP/IP y que se encarga de gestionar el aspecto de las páginas y enlaces.
Cada página Web comentan LaQuey y Ryer (1995), tiene una dirección única en Internet, en
forma de Fuente de Localización Uniforme o Uniform Resource Locutor. Un URL indica el tipo de
documento [página Web o documento en formato HyperText Markup Language (HTML)], y el de las
páginas hipertexto de la WWW comienza siempre por HTTP.
Una página Web puede ser http://www.proveedor.es/bienvenida.html, que corresponde a un
documento hipertexto (bienvenida.html) que está en el servidor Web (WWW) de un proveedor
(.proveedor) de España (.es). Al saltar de un enlace a otro, el programa navegador simplemente va
leyendo páginas HTML de distintos lugares de Internet y mostrándolos en pantalla.
La Web nos dice Starmedia (2003), proporciona algunas opciones interesantes: se puede
circular saltando de un sitio a otro y volviendo rápidamente a los sitios que se acaban de visitar,
además el usuario puede completar campos (por ejemplo, una encuesta) y enviarlos por correo
electrónico con sólo hacer clic sobre el botón "enviar" que ve en su pantalla. Por otro lado la Web
también facilita el acceso a información gráfica, películas o sonido de forma automática.
La Web es el lugar de Internet que más crecimiento está experimentando últimamente: se
calculó que para el año 2003 existían más de 50 millones de páginas Web

6. en la Red, y su número continua creciendo a un ritmo vertiginoso. La Web, al facilitar la búsqueda de
información, ha hecho que otros servicios de Internet como Gopher, Archie o WAIS se usen cada vez
menos.
Starmedia (2003), hace énfasis en que cada vez son más las empresas que publican información
en la Web y encontrarla es también cada vez más fácil: casi todos los nombres de los sitios Web
comienzan por el URL que indica que se trata una página Web en formato HTML (http://) seguido de
las letras características de la Web (www), el nombre de la empresa (por ejemplo, .ibm) y terminan
con el identificador de empresa (.com) o país (.mx). Es decir, si usted conecta con
http://www.ibm.com visitará las páginas de IBM en Estados Unidos, y con http://www.ibm.mx, las
de IBM México. Actualmente son menos las empresas de gran tamaño que no tienen su propia página
Web.
Por otro lado se sabe que la gran potencia de la Web también proviene del hecho de que cada
vez es más fácil publicar material en la Web e Internet, no sólo acceder a lo que ya está allí. Existen
programas gratuitos y comerciales para crear páginas HTML para la Web (similares a los programas
de autoedición, sin necesidad de programación), y alquilar espacio en un servidor al que enviar las
páginas es cada vez más barato y accesible. Hoy en día, cualquiera puede publicar lo que desee con
un mínimo esfuerzo, y ponerlo al alcance de millones de personas.
PÁGINA WEB
La definición que da Millenium (2003), sobre página web es que es un documento situado en
una red informática, al que se accede mediante enlaces de hipertexto. Este documento HTML
que tiene su propia dirección Web, o URL, accesa a la primera página usualmente solicitada en un sitio
Web, la cual es llamada "home page”. Usando lo que se conoce como “frames”, varias páginas pueden
ser vistas en los navegadores.
Millenium (2003), también comenta que una página de Internet o página Web es un
documento electrónico que contiene información específica de un tema en particular y que es
almacenado en algún sistema de cómputo que se encuentre conectado a la red mundial de
información denominada Internet, de tal forma que este documento pueda ser consultado por
cualquier persona que se conecte a esta red mundial de comunicaciones y que cuente con los
permisos apropiados para hacerlo.
El autor afirma que una página Web es la unidad básica del World Wide Web, la cual
contiene 3 características:
1. Una página Web tiene la característica peculiar de que el texto se combina con imágenes
para hacer que el documento sea dinámico y permita que se puedan ejecutar diferentes acciones,
una tras otra, a través de la selección de texto remarcado o de las imágenes, acción que nos
puede conducir a otra sección dentro del documento, abrir otra página Web, iniciar un mensaje
de correo electrónico o transportarnos a otro Sitio Web totalmente distinto a través de sus

7. hipervínculos. Estos documentos pueden ser elaborados por los gobiernos, instituciones
educativas, instituciones públicas o privadas, empresas o cualquier otro tipo de asociación, y
por las propias personas en lo individual.
2. Una página Web es una pieza electrónica de información que es vista a través de una
computadora que esta permanentemente conectada a la Internet, permitiendo que los
navegadores la vean.
3. Una página Web provee información al observador; esta información es producida a color y
puede tener animación, imágenes, productos inclusive puedes hacer compras directamente de la
misma. Virtualmente no hay límite a lo que puede ser mostrado en una página Web.
Sitio Web
Millenium (2003), nos dice que es un conjunto de archivos electrónicos y páginas Web
referentes a un tema en particular, que incluye una página inicial de bienvenida generalmente
denominada home page, con un nombre de dominio y dirección en Internet específicos. Estos sitios
son empleados por las instituciones públicas y privadas, organizaciones e individuos para comunicarse
con el mundo entero. En el caso particular de las empresas, este mensaje tiene que ver con la oferta
de sus bienes y servicios a través de Internet, y en general para hacer más eficientes sus funciones de
mercadotecnia.
Un Sitio Web para LaQuey, y Ryer (1995), no necesariamente debe localizarse en el sistema
de cómputo de su negocio. Los documentos que integran el Sitio Web pueden ubicarse en un equipo
en otra localidad, inclusive en otro país. El único requisito es que el equipo en el que residan los
documentos esté conectado a la red mundial de Internet. Este equipo de cómputo o Servidor Web,
como se le denomina técnicamente, puede contener más de un sitio Web y atender
concurrentemente a los visitantes de cada uno de los diferentes sitios. Al igual que los edificios,
oficinas y casas, los Sitios Web requieren de una dirección particular para que los usuarios puedan
acceder a la información contenida en ellos; como se mencionó anteriormente. Estas direcciones, o
URLs (por sus siglas en inglés Uniform Resource Locutor), aparecen cotidianamente en todos los
medios de comunicación como son prensa escrita, radio, televisión, revistas, publicaciones técnicas y
en el propio Internet a través de los motores de búsqueda (por su denominación en inglés
search engines). Los nombres de estos sitios Web obedecen a un sistema mundial de nomenclatura y
están regidos por el Internet Corporation for Assigned Names and Numbers (ICANN).
Los Sitios Web pueden ser de diversos géneros, destacando los sitios de negocios, servicio,
comercio electrónico en línea, imagen corporativa, entretenimiento y sitios informativos. Por otro
lado una página Web es una pieza electrónica de información que es vista a través de una
computadora que esta permanentemente conectada a la Internet, dejando que los navegadores
la vean.
Aunque New Forest Online (2001), tiene una definición más sencilla:

8. Un sitio Web provee información al observador, esta información es producida a color y puede tener
animación, imágenes, productos inclusive puedes hacer compras directamente de la misma.
Virtualmente no hay límite a lo que puede ser mostrado en una página Web.
Desde un punto de vista de negocios, provee una herramienta de marketing a un precio
relativamente bajo.
PORTAL
Según Millenium (2003), Portal es un término, sinónimo de puente, para referirse a un Sitio
Web que sirve o pretende servir como un sitio principal de partida para las gentes que se conectan
al World Wide Web. Son sitios que los usuarios tienden a visitar como sitios ancla. Los portales
tienen gran reconocimiento en Internet por el poder de influencia que tienen sobre grandes
comunidades.
La idea del autor es emplear estos portales para localizar la información y los sitios que nos
interesan y de ahí comenzar nuestra actividad en Internet. Un Sitio Web no recibe el rango de portal
por tratarse de un sitio robusto, importante o por contener información relevante; un portal es mas
bien una plataforma de despegue para la navegación en el Web.
HYPERTEXT MARKUP LANGUAGE
Martínez, A. (1995) dice que HTML es un lenguaje muy sencillo que permite describir
hipertexto, es decir texto presentado de forma estructurada y agradable, con enlaces (hyperlinks)
que conducen a otros documentos o fuentes de información relacionadas y con inserciones multimedia
(gráficos, sonido, entre otros). La descripción se basa en especificar en el texto la estructura lógica del
contenido (títulos, párrafos de texto normal, enumeraciones, definiciones, citas, entre otros), así como
los diferentes efectos que se quieren dar, (especificar los lugares del documento donde se debe poner
cursiva, negrita, o un gráfico determinado) y dejar que luego la presentación final de dicho hipertexto
se realice por un programa especializado Mosaic, o Netscape.
Otra definición que nos da Cuervo (2001), es que HTML (Hyper Text Markup Language) es un
lenguaje para crear documentos para la Word Wide Web mediante el uso de etiquetas; dentro de
este lenguaje se puede incluir texto, imágenes, elementos multimedia, enlaces a otras páginas.
El organismo que gestiona la especificación del lenguaje HTML es W3C (Word
Wide Web Consortium), el cual se puede encontrar en http://www.w3c.org.
Si bien en un principio se pensó que el HTML era un lenguaje portable a diferentes maquinas
en su totalidad, ya fuesen MAC, UNIX, hoy en día cada empresa ha ido generando sus
variaciones sobre los estándares, por lo que puede suceder que haya algunas etiquetas que no
sean visualizados por algunos navegadores. Para desarrollar páginas mediante HTML, bien se
puede hacer mediante la edición de un documento de texto con cualquier procesador de textos, o
bien se puede utilizar algún programa de los muchos que hay en el mercado para la edición de páginas
HTML.

9. HYPERTEXT TRANSFER PROTOCOL
Webopedia (2003), nos dice que el Hypertext Transfer Protocol (HTTP) es un protocolo
que facilita la transferencia de archivos de hipertexto entre sistemas locales y remotos. Además define
cómo los mensajes son formulados y transmitidos, y que acción los servidores y navegadores deben
tomar en repuesta a varios comandos. Por ejemplo cuando se entra a un URL en un navegador,
lo que realmente sucede es que se está mandando un comando HTTP al servidor de la red, y éste
lo dirige para agarrar y transmitir la pagina Web.
La definición de Terra (2003), sobre HTTP es que es el método utilizado para transferir ficheros
hipertexto por Internet. En el World Wide Web las páginas escritas en HTML utilizan el hipertexto para
enlazar con otros documentos, al pulsar en un hipertexto, se salta a otra página Web, fichero de
sonido, o imagen.
La transferencia de hipertexto es simplemente la transferencia de ficheros de un ordenador a
otro. El protocolo de transferencia hipertexto es el conjunto de reglas utilizadas por los ordenadores
para transferir ficheros hipertexto, páginas Web por Internet.
UNIFORM RESOURCE LOCUTOR
La definición de webopedia (2003), sobre Uniform Resource Locutor (URL) es la forma en la
que se localiza algún sito o dirección web. La primera parte de la dirección indica que protocolo se
usa, la segunda parte especifica la dirección IP o el nombre del dominio de donde el recurso esta
localizado.
Nos referimos a "recurso", pues un vínculo no necesariamente será a otra página, aunque sea
lo habitual. Estos recursos pueden ser, imágenes, archivos de sonido, videos, archivos comprimidos,
documentos en algún formato de texto especial, etc. Por lo general el browser tratará de interpretar
el vínculo, y lo desplegará, de lo contrario dará la posibilidad de ejecutarlo o guardarlo en su disco
duro. Lo último sucede y es utilizado frecuentemente para dejar disponible en el sitio web,
documentos comprimidos o "zipeados", con el conocido programa winzip. (Universidad
Tecnológica Metropolitana,
2003).
¿QUÉ HACE BUENO A UN SITIO WEB?
King (2003), nos dice que un buen sitio Web debe proveer lo siguiente:
o Contenido Original y creíble
o Información actual valuable
o Hacer el sitio a la medida del usuario
o Sea fácil de leer
o Sea Interactivo
o Bien organizado
o Ser líder del tema que hablas
o Tener un servidor seguro y confiable
Una idea errónea común para King (2003), en empresas nuevas dentro de la red, es que creen

10. que por colocar una pagina, la gente los va a visitar. Para tener un sitio popular, se le tiene que
ofrecer algo al usuario: información, interactividad, diversión, algo gratis, en fin algo más que un
número a donde llamarte. El autor cree que contenido original es importante. Los usuarios pueden
visitarte una vez, pero para hacerlos volver se tiene que colocar contenido original, como animación,
graficas video, sonido, entre otros.
Además de esto Ryan (2003), nos comenta que una buena página web debe decir quien la hizo,
cuando fue la última vez que se actualizo, que no tenga errores de ortografía, fácil de encontrarla y
cuál es su propósito. Estos factores son indispensables para hacer que hacer que una pagina web sea
valida y buena.
Por otro lado para Karen (1997), entre las principales intenciones y funciones que una
correcta página web debe tener están:
Conocer a tu publico
o Incluir el nombre de la organización en cada página
o Usar un diseño consistente
o Encontrar ayuda para navegar en la parte superior de cada pagina
o Ofrecer un contenido de
calidad Fecha y firma en cada
pagina Buena Ortografía
o Contacto con alguien
o Que Cargue rápido
o Poner lo mas importante en los primeros párrafos
o Usar efectos solo si son necesarios
o Que todas las ligas funcionen
o Crear lealtad por parte de los usuarios
La red es un medio interactivo, dinámico, y constantemente cambiante, esto es
exactamente lo que un sitio Web debe reflejar. Estos conceptos que se mencionan, son el soporte de
lo que es el mundo virtual, con esto se comprende que es una página Web, como funciona y sus
alcances.
La Página de Administración de Hoteles y Restaurantes de la Universidad de la Américas,
Puebla, como cualquier otra pagina Web, en sí contiene todos los elementos que se mencionaron con
anterioridad, esto nos hace pensar que todas las páginas Web deberían ser iguales; no obstante los
cimientos de una pagina Web pueden ser los mismos, lo que cambia es la fachada o el diseño.
HISTORIA DE DREAMWEAVER
Es un producto de la empresa desarrolladora de software Macromedia, que nació en 1992 tras la
fusión de Authorware Inc. (creadora de Authorware) y Macro – Mind Paracomp (responsable de director).
El primer producto de esta nueva compañía fue Shockware, un plugin para los navegadores que permitía
ver animaciones hechas en Director. A causa del éxito que tuvo, la empresa decidió que debía expandirse
más en el sector web y multimedia,

11. Con esta expansión como objetivo primario, en 1996, Macromedia realizo dos grandes
adquisiciones. La primera fue la empresa FutureWave software, creadora del FutureSplash, al que
Macromedia rebautizo como flash. La segunda fue iBand software, creadora de Backstage, un programa
de edición de HTML, al que Macromedia rebautizo, con algunos cambios, como DREAMWEAVER, del que
lanzo su primera versión en 1997. A partir de 1998, Macromedia comenzó a desarrollar una versión del
programa por año. En cada una de ellas, agrego componentes clave para un mejor desarrollo de archivo
de HTML y de otras expresiones (ASP, PHP, JPS, etcétera). En el año 2006, la empresa fue comprada por
Adobe, quien absorbió completamente el nombre Macromedia. Por ello es que la versión CS3 ya no es
más Macromedia, sino Adobe.
DREAMWEAVER
Adobe Dreamweaver es una aplicación en forma de estudio enfocada a la construcción y edición
de sitios y aplicaciones Web Es el programa de este tipo más utilizado en el sector del diseño y la
programación web, por sus funcionalidades, su integración con otras herramientas como Adobe Flash y,
recientemente, por su soporte de los estándares del World Wide Web Consortium. Tiene soporte tanto
para edición de imágenes como para animación a través de su integración con otras. La gran ventaja de
este editor sobre otros es su gran poder de ampliación y personalización del mismo, puesto que en este
programa, sus rutinas (como la de insertar un hipervinculo, una imagen o añadir un comportamiento)
están hechas en Javascript-C, lo que le ofrece una gran flexibilidad en estas materias. Dreamweaver ha
tenido un gran éxito desde finales de los 90 y actualmente mantiene el 90% del mercado de editores
HTML. Dreamweaver permite al usuario utilizar la mayoría de los navegadores Web instalados en su
ordenador para previsualizar las páginas web. También dispone de herramientas de administración de
sitios dirigidas a principiantes como, por ejemplo, la habilidad de encontrar y reemplazar líneas de texto
y código por cualquier tipo de parámetro especificado, hasta el sitio web completo. El panel de
comportamientos también permite crear JavaScript básico sin conocimientos de código. También podría
decirse, que para un diseño mas rápido y a la vez fácil podría complementarse con fireworks en donde
podría uno diseñar un menú o para otras creaciones de imágenes (gif web, gif websnap, gif adaptable,jpeg
calidad superior, jpeg archivo más pequeño, gif animado websnap) para un sitio web y después exportar
la imagen creada y así utilizarla como una sola, en donde ya llevara los vínculos a un dicho sitio en
especifico que uno le haya dado.(MRR - U.P.C.)
 Dreamweaver 1.0 (Lanzado en Diciembre de 1997; Dreamweaver 1.2 Marzo de 1998)
 Dreamweaver 2.0 (Lanzado en Diciembre de 1998)Dreamweaver 3.0 (Lanzado en
Diciembre de 1999)
 Dreamweaver UltraDev 1.0 (Lanzado en Junio de 2000)Dreamweaver 4.0 (Lanzado en
Diciembre de 2000)
 Dreamweaver UltraDev 4.0 (Lanzado en Diciembre de 2000)
 Dreamweaver MX [Numero interno de version: 6.0] (Lanzado en Mayo de 2002)
 Dreamweaver MX 2004 [Numero interno de version: 7.0] (Lanzado el 10 de Septiembre
en 2003)
 Dreamweaver 8 (Lanzado el 13 de Septiembre de 2005)

12.  Dreamweaver CS3 (Lanzado el 16 de Abril de 2007)
 Dreamweaver cs4 (23 de Septiembre 2008)
 Dreamweaver cs5 (12 Abril 2010)
 Dreamweaver cs5.5 (12 de Abril de 2011)
CARACTERÍSTICAS DE DREAMWEAVER.
 Permite crear páginas web avanzadas o profesionales.
 Soporta gran cantidad de tecnologías fáciles de usar.
 Se actualiza con componentes.
 El código generado es de buena calidad.
 Al ser tan avanzado puede resultar difícil para algunos usuarios inexpertos.
 Proveniente de la familia Macromedia/Adobe.
 Permite crear sitios totalmente gráficos.
 Permite agregar diseño y funcionalidad a la página.
 Permite trabajar con tablas, marcos, capas, comportamientos, Javascript.
CAPACIDADES DISTINGUIBLES DE DREAMWEAVER
Dreamweaver ofrece numerosas funciones útiles, tales como la "Vista previa en el navegador"
función. Esta capacidad permite a los usuarios ver la página web en distintos navegadores durante el
proceso de creación de identificar cualquier diferencia de función cruzada. Otras funciones incluyen un
corrector ortográfico básico, una inserción automática de "fecha de hoy" y la función "Buscar y
reemplazar", que busca las palabras y los cambios específicos en todo el sitio. Dreamweaver integra las
hojas de estilo, formas, marcos y archivos multimedia.
Además, Dreamweaver ofrece una función para limpiar el código HTML de las páginas importadas.
La característica de limpieza elimina las etiquetas HTML redundantes y elimina varios de código HTML. Al
final de la limpieza, Dreamweaver crea un informe resumen de todos los cambios.
Menu principal
Controla todo lo que se ve y lo que no se ve. Desde, aquí, podemos crear y guardar archivos ocultar
o mosstrar barras de herramientas, manejar las propiedades de la pagina, colocar las propiedades de las
tablas e insertar objetos – imágenes, archivos, videos, etetera, entre otras cosas la siguiente guia visual,
describiremos las opciones principales del menu princial del Dreamweaver
MENÚ PRINCIPAL
Este es el menú típico de cualquier programa. Básicamente, controla todo lo que se ve y lo que
no se ve. Desde aquí, podemos crear y guardar archivos, ocultar o mostrar barras de herramientas,
manejar las propiedades de la página, colocar las propiedades de las tablas e insertar objetos -imágenes,
archivos, videos, etcétera, entre varias otras cosas. describiremos las opciones principales del menú
principal del Dreamweaver.

13. BARRA DE HERRAMIENTAS HORIZONTAL
Es un menú gráfico que se encuentra justo debajo del menú principal. Si bien todas sus opciones
también están en éste último, a la hora de trabajar resulta muy dinámico y nos deja acceder rápidamente
a herramientas de uso frecuente. Está compuesto por lengüetas que hacen referencia a diversas
categorías y permiten, de forma rápida, crear tablas, insertar imágenes, crear vínculos, crear formularios
y varias otras cosas

14. ÁREA DE TRABAJO
Es el espacio de trabajo, es decir, nuestra página web. Conviene pensar en él como si fuera un
documento de Word. Todo lo que coloquemos allí será visto en un explorador de Internet. También
cuenta con algunas herramientas que, entre otras cosas, permiten pre visualizar la página en un
navegador, insertar y editar contenido del encabezado del documento y alternar entre las diferentes
vistas (Código, Dividir y Diseño

16. BARRA DE VENTANAS
Se encuentra en el lado derecho del programa. Básicamente, es un conjunto de varias ventanas
que podemos abrir, minimizar y ocultar para ayudarnos a controlar aspectos estructurales del programa.
Desde aquí tendremos la posibilidad, entre otras cosas, de definir el sitio sobre el que estamos trabajando,
ver el historial de cambios del documento, crear, modificar y eliminar las hojas de estilo, e insertar
comportamientos

17. PROPIEDADES DE PÁGINA
Permite programar ciertos parámetros básicos que tienen que ver con la apariencia de las
páginas web. Es importante recordar que estas propiedades deben ser colocadas en cada página HTML,
si bien luego se pueden copiar y pegar fundamentalmente permiten controlar el color de texto, el color
de fondo, el color de los vínculos (visitados, no visitados y activos), colocar una imagen de fondo,
configurar los distintos márgenes y agregar un titulo al documento (que aparecerá en la barra superior
del navegador

18. TABLAS Y CELDAS
Dreamweaver tiene una regla de oro: todo el contenido de una página (texto, formatos entre
otros) va dentro de tablas, nada va suelto, salvo alguna pequeña excepción que será aclarada. Si uno
aprende a manejarlas bien, maneja el 50% del programa.
TABLAS
Toda tabla está compuesta por celdas, lo que posibilita que una tabla pueda tener la cantidad de
celdas que deseemos. Esto nos permite distribuir y ordenar los elementos de nuestra página como
queramos. Recordemos que hay tres maneras de insertar una tabla con un clic en el cuadro icono de la
barra de herramientas horizontal, con insertar / tablas o con Ctrl + Alt + T. Al usar cualquiera de estas
opciones, aparecerá el menú de inserción de tabla.
El menú de inserción de tabla. Podemos observar las propiedades y las características básicas de la tabla
que vamos a crear
REPASAREMOS SUS COMPONENTES
 Filas: es la cantidad de filas o divisiones horizontales que tendrá la tabla
 Columnas: es la cantidad de columnas o divisiones verticales que tendrá la tabla
 Ancho de tabla: aquí, colocamos la longitud que tendrá la tabla, expresada en píxeles o
porcentaje. Más adelante veremos cuándo utilizar una u otra medida
 Grosor del borde: aquí especificamos el tamaño de borde (ancho) que tendrá nuestra tabla. Se
mide en píxeles.

19.  Relleno de celda: desde aquí, configuramos el espacio que hay entre el contenido de la tabla o
de la celda y su borde. También se mide en píxeles
 Espacio entre celdas: aquí, definimos la separación que hay entre las distintas celdas de una
misma tabla. Igual que los dos anteriores, se mide en píxeles
Una vez insertada la tabla, podremos modificar todas las propiedades anteriores y también algunas
nuevas, como agregarle un color de fondo y/o de borde, alinearla horizontalmente e insertarle una
imagen de fondo.
CELDAS
Las celdas componen las filas (horizontales) y las columnas (verticales) de unas tablas. Una tabla
puede tener infinitas celdas, pero debemos tener en cuenta que mientras más tenga, cada una de éstas
tendrá menos espacio para colocar contenido Esto también dependerá del Relleno de celda y del Espacio
entre celdas que le coloquemos a la tabla.
La celda tiene propiedades independientes de las de la tabla. Para acceder a éstas debemos
posicionarnos con el cursor y hacer clic adentro de la tabla, sobre la celda que deseemos seleccionar.
Se pueden observar las propiedades de la celda
Seleccionada en la parte inferior de la barra de Propiedades
 Horiz: Permite alinear los elementos que se encuentran dentro de la celda a la izquierda, al centro
o a la derecha
 Vert: permite alinear los elementos que se encuentran dentro de la celda de manera superior,
medio o inferior
 An y Al: nos permite especificar el ancho y el alto de una celda. Generalmente, estas propiedades
no se usan, ya que el mismo contenido se encarga de esto.
 Fnd: permite insertar una imagen de fondo para la celda
 Fnd (con casilla de color): permite colocarle un color de fondo a la celda. Éste puede ser diferente
con respecto al color de fondo de la tabla (Figura).
 Borde: habilita la colocación de un color de borde a la celda. Éste puede ser diferente con respecto
al color de borde de la tabla.
 Combinar celdas: junta las celdas seleccionadas y las convierte en una única celda. Funciona para
unir filas, columnas o ambas.
 Dividir celdas: permite dividir la celda seleccionada en la cantidad elegida de columnas o filas,

20. para generar más campos en la tabla.
Se puede observar desplegado el menú de selección de Color de fondo de la celda
MARCOS
Los marcos o frames son una práctica forma de diseño web que podemos usar para sitios con
mucho contenido. También son muy prácticos a la hora de mantener estáticas ciertas porciones de un
documento HTML. Esencialmente, son distintos archivos HTML unidos en uno solo. Es decir, cualquier
página web hecha en marcos tiene, por lo menos, tres archivos HTML. En el ejemplo que se muestra en
la Figura, podemos ver una página de marcos
Observamos un documento HTML dividido en marcos.
El marco más pequeño de la izquierda actúa como barra de navegación estática, y el
de la derecha como espacio para el contenido
Cada marco es una página web diferente, es decir, un archivo único. En el caso de la Figura, el
marco izquierdo podría llamarse barra.html, el derecho, principal.html y el contenedor (que agrupa a los
otros dos), index.html.

21. Una de las características positivas de diseñar o programar una página con marcos es la barra de
navegación estática. Muchas veces, si la página tiene una cantidad importante de contenido, aparecerá
la barra de desplazamiento vertical a la derecha de la ventana del navegador, para que podamos navegar
todo el documento. Pero al ir bajando, la barra de navegación “ya sea vertical u horizontal”, se perderá y
el usuario no la tendrá más a mano
Las opciones para crear una página web con marcos se encuentran en el menú principal, en
Modificar / Conjunto de marcos. Si diseñamos un archivo HTML de esta manera, la barra de navegación,
tanto si es horizontal como si es vertical, será una página aparte y no se moverá cuando el usuario use la
barra de desplazamiento vertical. Esto posibilitará que los navegantes puedan acceder de forma rápida y
sencilla a los vínculos.
Crear una página o un sitio con marcos suele ser un poco más complicado que hacer un diseño
a página completa (llamado diseño Body). En este caso, tendremos que tener cuidado con las medidas y
con los vínculos. En nuestro proyecto, trabajaremos una página en marcos y allí veremos con más
detenimiento sus propiedades y características.

22. CONCLUSIÓN:
El diseño del Sitio Web diseños gráficos H&H resultó una excelente opción para lograr los
objetivos planteados, además permite iniciar un proceso continuo de mejoras en el rendimiento de las
funciones de nuestra página.
Este Sitio Web facilita el llegar al estudiante, y puede llegar a cambiar la forma en que piensa,
trabaja y aprende la gente, facilitando una mejor comunicación entre los estudiantes y la parte
administrativa del creador de esta página, permitiendo responder mejor a la dinámica de los cambios
actuales. Que resulta un plan de marketing para darse a conocer a nivel mundial.
SUGERENCIAS:
Para las personas que tienen una idea de negocio, o tienen algo que comunicar, lo ideal es que
te crees una página web para poder informar desde ese medio a un público inmenso y en minutos lo
que desees. Por esto, si sientes la necesidad de comunicar lo que piensas o dar a conocer información
lo ideal es que te crees una página web personal.
Las plataformas pueden ser de carácter personal o profesional. En cualquier caso, los sitios en
Internet te permiten difundir lo que quieras a un público en todo el mundo y las 24 horas del día los 365
días del año.
Si estás pensando en crearte un espacio en el mundo virtual, puedes valerte de
ciertas herramientas que te ayudarán a crear tu web como Wixi y otros.
BIBLIOGRAFÍA:
IMPRESO
 MACROMEDIA DREAMWEAVER Cs6 Editorial Macro
DIGITAL
 http://www.adobe.com/es
 http://techlosofy.com/manual-dreamweaver-cs5-en-espanol/
 www.google.com
 http://www.taringa.net/posts/downloads/9332657/Mega-Tutorial-Dreamweaver-
cs5-_pdf_.html
 http://www.wikipedia.org
 http://www.google.com