Fesc Kevin

PROBLEMA:
DISEO GRFICO EN LAS PGINAS WEB
KEVIN ALEXANDER DIAZ TORRADO

JUSTIFICACIN:
PORQUE ME GUSTA Y ME LLAMA MUCHO LA ATENCIN EL TEMA, ME INTERESA

SABER COMO FUE QUE SURGI EL DISEO GRFICO EN LAS PGINAS WEB
BUSQUEDA DE INFORMACIN:
-DIALNET
-DUAS
-SCIELO
-SCOPUES
BIBLIOGRAFA:
PRIMERO
CIUDAD: SAN CRISTOBAL DE LA

AUTOR: ITANEL BASTOS DE QUADROS JUNIO LAGUNA, TENERIDE (ESPAA)
TITULO: LAS PAGINAS WEB: UN NUEVO CAMPO DEL AO: 2006

DISEO GRFICO
RESUMEN: La presente tesis doctoral busc exponer

las pginas web como un nuevo campo del diseo
grfico y,para alcanzar este objetivo, el trabajo de
investigacin se estructur de la siguiente forma: -
Exploracin de los antecedentes ms lejanos de la
comunicacin visual; de las prcticas de diseo grfico
que fueron definidas in textenso en los cinco siglos de la
llamada Galaxia de Gutenberg; las innovaciones
advenidas en los siglos XIX y XX, como corolario de la
era industrial; las principales contribuciones de Europa y
Estados Unidos para el avance del diseo grfico
contemporneo ; el creciente protagonismo de la
comunicacin visual en la sociedad ; el impacto de la
informtica en la espera del diseo grfico; y los restos
del diseo grfico en la era digital .
LINK:
https://dialnet.unirioja.es/servlet/tesis?codigo=39630
SEGUNDO
AUTOR: MARIA LUISA GARCIA GUARDIA CIUDAD: MADRID (ESPAA)
TITULO: PERSISTENCIA DE MODELOS DE DISEO AO: 2003

GRFICO EN LAS PGINAS WEB
RESUMEN: El objetivo del artculo es conocer si realmente

existe un modelo que de forma repetitiva es utilizado en la
creacin de pginas desde el campo del diseo grfico.
Para ello se ha desarrollado un estudio descriptivo
funcional utilizando las pginas de inicio de quince sitios
webs; un estudio sobre la valoracin de la correlacin
entre profesionales y estudiantes, partiendo de la hiptesis
de que existen diferencias en dicha valoracin; y una
comparativa de ambos estudios. Los resultados
obtenidos muestran que la pgina ideal sera aquella:
con el buscador centrado, copyright, el logotipo centrado,
la ubicacin de la botonera centrada, los tipos botoneras
verticales y con animacin.
LINK:
https://dialnet.unirioja.es/servlet/articulo?codigo=5298417
TERCERO
AUTOR: MAGGIE GORDON (COORD.), BOB CIUDAD: BARCELONA

GORDON (COORD.)
AO: 2007
TITULO: MANUAL DEL DISEO GRAFICO DIGITAL
RESUMEN: El diseo, que cumple un papel

fundamental en las formas de comunicacin
modernas, se ha visto revolucionado por el proceso
de digitalizacin que ha atravesado el sector de la
comunicacin. La digitalizacin de audio, vdeo, texto
e imagen ha elevado el nivel de interactividad
meditica y permite a los profesionales colaborar en
un amplio campo de actividades, lo que ha supuesto
un cambio radical en los mtodos de trabajo del
diseador que ha tenido que familiarizarse con una
amplia gama de procesos de produccin. Se le exige
ahora no slo que muestre visin y creatividad, sino
que domine toda una serie de nuevas habilidades.
LINK:
https://dialnet.unirioja.es/servlet/libro?codigo=306856
CUARTO
AUTOR: JENNIFER NIEDERST ROBBINS EDITORIAL: ANAYA MULTIMEDIA
TITULO: DISEO WEB, GUIA DE REFERENCIA CIUDAD: CDMX
AO: 2006
RESUMEN: Diseo Web. Gua de referencia recoge

una visin general de los estndares web y de las
ventajas del diseo de sitios, y refleja avances
significativos, como enfoques de accesibilidad,
soporte para el formato grfico PNG y hojas de estilos
especficas para la impresin, entre otros temas. Con
este libro aprender a trabajar con herramientas
como CSS, JavaScript y DOM, as como el ya
conocido pero mejorado XHTML.
LINK:
QUINTO
AUTOR: DANIEL DE LA CRUZ HERAS, MANUEL EDITORIAL: ANAYA MULTIMEDIA

LVAREZ GONZLEZ
TITULO: DISEO WEB CON FLASH CS3 CIUDAD: CDMX
AO: 2008
RESUMEN: El crecimiento de las aplicaciones

interactivas, paralelo al desarrollo Web, se ha
extendido de forma espectacular. En este contexto el
uso de Adobe Flash ha resultado esencial. La
evolucin que ha sufrido el programa ha sido tal que
hoy en da es una herramienta casi indispensable
para la creacin de sitios Web. El entorno de Flash
permite incluir animaciones, textos, imgenes, vdeos
y dotar a los proyectos de un carcter profesional.
LINK:
SEXTO
AUTOR: MIGUEL PARDO EDITORIAL: ANAYA MULTIMEDIA
TITULO: CREACION Y DISEO WEB CIUDAD: CDMX
AO: 2008
RESUMEN: La Gua Visual de Creacin y diseo Web

est ideada para mostrarle de forma rpida y eficiente
los fundamentos, utilidades y principales
caractersticas de las ltimas tecnologas del diseo
web.
Este libro le ayudar a comprender los fundamentos

bsicos del funcionamiento de la web y las principales
fases de creacin de un sitio web, conocer cmo
trabajan las herramientas para el desarrollo de los
sitios web ms importantes del mercado, realizar las
tareas bsicas de creacin y organizacin de un sitio
web, as como a crear pginas web desde el principio
y manejar los elementos bsicos de cualquier pgina
web tales como hipervnculos, marcadores,
imgenes, elementos multimedia, etc.
LINK:
SEPTIMO
AUTOR: ANTONIO ARANA SAN SEBASTIAN EDITORIAL: UNESCO
TITULO: LA INFLUENCIA DE LAS NUEVAS CIUDAD: BILBAO

TECNOLOGAS EN DISEO GRFICO
AO: 1999
RESUMEN: Nuestra sociedad produce gran

cantidad de informacin que es necesario que el
receptor, que somos todos nosotros, asimile en
muy poco espacio de tiempo, ya que enseguida
aparece otra nueva. Por eso, sta tiene que
presentarse de forma clara, sencilla, bien
organizada y que sea el propio usuario el que elija
la posibilidad de profundizar en lo que le interese.
Dentro de ese proceso lgico, tambin las Nuevas

Tecnologas han tenido su influencia en Diseo
Grfico. Cambian los cdigos visuales, aparece el
sonido, el movimiento, el tiempo, surge la
interactividad, que es en definitiva, la que va a
permitir una colaboracin ms estrecha entre
diseadores y receptores, y cambian tambin los
soportes, aparece la pantalla del ordenador.
LINK:
OCTAVO
AUTOR: PATRICK J. LYNCH, SARAH HORTON CIUDAD: MLAGA, ESPAA
TITULO: MANUAL DE DISEO WEB AO: 2003
RESUMEN: Esta gua bsica para diseadores de

sitios web ofrece consejos claros y concisos sobre
cmo crear pginas y sitios web prcticos y bien
diseados. El contenido del libro se ha basado
siempre en los aspectos funcionales del diseo.
En esta segunda edicin se amplia esta aproximacin

a la funcionalidad mediante la incorporacin de
secciones adicionales sobre la accesibilidad, las
hojas de estilo en cascada (CSS) y los diseos de
pgina flexibles. Tambin se amplian contenidos
sobre la arquitectura de la informacin, el
mantenimiento de un sitio web y el diseo multimedia.
Y, en general, se han agregado ms ilustraciones y
se han puesto al da los ejemplos de sitios web para
que queden reflejados los mejores diseos actuales.
LINK:
NOVENO
AUTOR: MIGUEL PARDO EDITORIAL: ANAYA MULTIMEDIA
TITULO: CREACIN Y DISEO WEB CIUDAD: CDMX
AO: 2005
RESUMEN: La popularidad creciente de Internet ha

provocado que usuarios que hasta ahora se limitaban
al uso convencional de la Red se adentren en el
mundo de la creacin de sitios web con diferentes
objetivos. Para todos ellos, la Gua Visual de Creacin
y diseo Web. Edicin 2005 constituye la mejor
solucin para resolver las dificultades iniciales y
alcanzar un conocimiento efectivo de los
fundamentos, utilidades y principales caractersticas
del diseo en esta rea.
Con unos contenidos claramente estructurados, esta

obra est concebida para ser utilizada bien como gua
de aprendizaje de las tcnicas bsicas del
funcionamiento de los diversos programas, como
FrontPage, Dreamweaver o CoffeeCup HTML Editor,
o bien como un manual de referencia rpida para
llevar a cabo cualquier tarea especfica que necesite
realizar.
LINK:
DCIMO
AUTOR: MIGUEL PARDO NIEBLA EDITORIAL: ANAYA MULTIMEDIA
TITULO: GUIA VISUAL DE CREACION DE LAS CIUDAD: CDMX

PAGINAS WEB
AO: 2002
RESUMEN: La Gua Visual de Creacin de pginas

Web, ha sido pensada y diseada para ensearle de
forma rpida y eficiente los fundamentos, utilidades
y principales caractersticas del diseo Web. Su
estructura est pensada para que pueda ser
utilizado bien como gua de aprendizaje de las
tcnicas bsicas del funcionamiento del programa, o
bien como gua de referencia rpida para llevar a
cabo cualquier tarea que el lector necesite realizar.
LINK:
ONCE
AUTOR: JAKOB NIELSEN, HOA LORANGER EDITORIAL:ANAYA MULTIMEDIA
TITULO: USABILIDAD-PRIORIDAD EN EL DISEO CIUDAD: CDMX

WEB
AO: 2006
RESUMEN: La usabilidad se podra definir como la

facilidad de uso. Ms especficamente, hace
referencia a la rapidez con que se puede aprender a
utilizar algo, la eficiencia al utilizarlo, cul es su grado
de propensin al error, y cunto le gusta a los
usuarios. Si una caracterstica no se puede utilizar o
no se utiliza, es como si no existiera.
Este libro tiene por objetivo priorizar nuestro extenso

conocimiento de la usabilidad hasta llegar a lo
esencial que se necesita conocer si trabaja en un
proyecto Web, ya sea como diseadores, directores
de marketing, programadores o escritores.
Igualmente, pretende actualizar nuestras directrices
de usabilidad Web de los aos 90 para que reflejen
los hallazgos realizados desde el ao 2000.
LINK:
DOCE
AUTOR: MARA GLORIA DEL RO CIDONCHA, MARA

EUGENIA MARTNEZ LOMAS, JUAN MARTNEZ CIUDAD: SEVILLA
PALACIOS
TITULO: APLICACIN DE LAS NUEVAS

TECNOLOGAS (TIC'S) EN LA ENSEANZA DEL AO: 2006
DISEO GRFICO POR ORDENADOR
RESUMEN: Dentro del marco de la docencia del CAD y

con la entrada en el Espacio Europeo de Educacin
Superior, las nuevas Tecnologas de la Informacin y la
Comunicacin (TIC's) se estn imponiendo a travs de
nuevas herramientas y de los cambios metodolgicos que
ofrecen: aplicaciones multimedia en diferentes formatos y
soportes, paquetes especficos de software, aulas y
campus virtuales, Internet y sus diferentes recursos,
correo electrnico, etc.
El objetivo de este trabajo es tender un puente entre la
concepcin actual de la asignatura de CAD que se imparte
en nuestro centro (Escuela Superior de Ingenieros de
Sevilla) y un curso multimedia, propuesto como futura
asignatura, utilizando el estado actual del arte de las
TIC's.
LINK:
TRECE
AUTOR: STEVE JOHNSON EDITORIAL: ANAYA MULTIMEDIA
TITULO: EXPRESSION WEB CIUDAD: CDMX
AO: 2008
RESUMEN: Microsoft Expression Web es el nuevo

software profesional de diseo y desarrollo de sitios
Web para trabajar con estndares. El programa forma
parte de Microsoft Expression Studio, que incluye
Expression Design, Blend y Media.
WHATExpression Web no es una actualizacin de

Microsoft FrontPage, pero conserva toda su facilidad
de uso y garantiza resultados profesionales sin
necesidad de conocimientos previos. Aprender a
crear un sitio Web desde la planificacin inicial hasta
el desarrollo completo, la publicacin en la Web y el
mantenimiento.
LINK:
CATORCE
AUTOR: DALADIER JABBA MOLINARES, ROBERTO EDITORIAL: EDICIONES UNINORTE

BECERRA BUSTILLO, RODOLFO ANTONIO CUENTAS
AHUMADA
TITULO: DISEO Y MONTAJE DE SITIOS WEB

UTILIZANDO XML Y XSI CON LA HERRAMIENTA DE
MODELADO Y CONSULTA LORE PARA EL MANEJO CIUDAD: BARRANQUILLA
DE CONSULTAS
AO: 2004
RESUMEN: La Web fue diseada sobre Internet para

transferir informacin de un lugar a otro. World Wide Web
(tambin conocida como Web o WWW) es una coleccin
de ficheros, que incluyen informacin en forma de textos,
grficos, sonidos y vdeos, adems de vnculos con otros
ficheros. Los programas informticos denominados
exploradores como Navigator, de Netscape, o Internet
Explorer, de Microsoft utilizan el protocolo Http para
recuperar esos ficheros. La Web maneja grandes
cantidades de informacin, la cual se encuentra dispersa
en toda la red.
LINK:
QUINCE
AUTOR: CHRIS LEEDS EDITORIAL: ANAYA MULTIMEDIA
TITULO: MICROSOFT EXPRESSION WEB CIUDAD: MADRID
AO: 2008
RESUMEN: Expression Web es la nueva y potente

aplicacin de edicin y administracin web de
Microsoft. Se trata de una herramienta profesional
que se utiliza para crear sitios modernos y
compatibles con los estndares de la industria y con
las prcticas de los principales diseadores,
aportando un alto nivel de calidad al diseo y
desarrollo web. Microsoft Expression Web tambin se
distingue por ser el sustituto de Microsoft Office
FrontPage, herramienta de edicin y gestin web que
ha gozado de una gran popularidad.
LINK:
DIECISEIS
AUTOR: TANYA STAPLES EDITORIAL: ANAYA MULTIMEDIA
TITULO: PHOTOSHOP CS2 PARA LA WEB CIUDAD: CDMX
AO: 2006
RESUMEN: Adobe Photoshop e ImageReady se han

convertido en herramientas muy demandadas por los
diseadores de sitios Web. El nuevo paquete CS2 se
ha concebido para realizar grficos que se
descarguen rpida y fcilmente. Adems,
ImageReady CS2 escribe cdigo JavaScript y HTML,
algo que los programas de imgenes tradicionales
apenas se han planteado.
LINK:
DIECISIETE
AUTOR: LON COLEY, JENNIFER FULTON, SCOTT EDITORIAL: ANAYA MULTIMEDIA

M. FULTON
TITULO: CREA TU PAGINA WEB CIUDAD: BARCELONA
AO: 2006
RESUMEN: La evolucin de las nuevas tecnologas y

la llegada de Internet a todos los hogares, ha
provocado que los usuarios que hasta ahora se
limitaban al uso convencional de la Red se adentren
en el mundo del diseo de pginas Web. Este libro
ofrece un mtodo visual, sencillo y directo para
aprender a generar y mantener tus propias pginas
web con dos de los productos ms importantes para
la creacin y el diseo web; Dreamweaver y
Fireworks.
LINK:
DIECIOCHO
AUTOR: JUAN CARLOS TORREALBA PERAZA CIUDAD: BARCELONA
TITULO: APLICACIN EFICAZ DE LA IMAGEN EN AO: 2004

LOS ENTORNOS EDUCATIVOS BASADOS EN
LA WEB
RESUMEN: Las nuevas tecnologas de informacin

y comunicacin (TIC) configuran un nuevo entorno
para la comunicacin con finalidad educativa,
influyendo de manera significativa en todas las
modalidades de formacin presencial,
semipresencial y a distancia, aportando enormes
posibilidades de transmisin de informacin e
interrelaciones comunicativas, superando las
barreras de espacio y tiempo.
LINK:
DIECINUEVE
AUTOR: JAMES J. MAIVALD, CATHY PALMER EDITORIAL: ANAYA MULTIMEDIA
TITULO: INDESIGN CON XML PARA CIUDAD: BARCELONA

DISEADORES
AO: 2008
RESUMEN:
El libro que tiene en sus manos le ensear a

automatizar el proceso de edicin sin necesidad de
utilizar cdigos interminables. XML simplifica el
proceso de insertar y exportar contenidos de las
estructuras, acelerando cualquier proyecto destinado
a la impresin o a Internet. Si trabaja con proyectos
de diseo que manejan gran cantidad de datos y
desea mantener la consistencia, la precisin y la
vigencia de stos, la incorporacin de XML puede ser
una gran ayuda. Tambin podr utilizar XML para
automatizar procesos como la importacin de textos
y de gran cantidad de grficos, desde un diseo al
replanteamiento del contenido al cambiar de
aplicacin.
LINK:
VEINTE
AUTOR: ESTEBAN ROBLES LUNA CIUDAD: ALICANTE
TITULO: AGILE MANAGING OF WEB AO: 2011

REQUIREMENTS WITH WEBSPEC
RESUMEN: El desarrollo de aplicaciones Web es un

proceso complejo y que consume mucho tiempo. A
su vez involucra a equipos de desarrollo
multidisciplinarios (incluyendo clientes, diseadores
graficos, desarrolladores, aseguradores de calidad,
etc.) y por lo tanto el entendimiento de la aplicacion
varia entre los diferentes miembros del equipo.
Ademas, estas aplicaciones poseen algunas
caracteristicas unicas como acceso a la informacion
a traves de la navegacion e interacciones
sofisticadas lo cual hace que su desarrollo sea
diferente respecto a las tradicionales aplicaciones de
escritorio. Como consecuencia, podemos encontrar
en la literatura dos grandes grupos para el desarrollo
de aplicaciones Web: la ingenieria Web dirigida por
modelos (MDWE) y las metodologias agiles.
LINK:
VEINTIUNO
AUTOR: ANTONIO ARANA SAN SEBASTIAN CIUDAD: VIZCAYA
TITULO: LA INFLUENCIA DE LAS NUEVAS AO: 1999

TECNOLOGAS EN DISEO GRFICO
RESUMEN: En pocos aos los avances en el

campo de la informtica se han desarrollado de
forma vertiginosa, Este hecho ha producido que
pasemos de una sociedad industrial a una
postindustrial o, mejor dicho, a una sociedad donde
lo verdaderamente importante es la informacin y la
forma de transmitirla. Estamos en la era digital.
Nuestra sociedad produce gran cantidad de

informacin que es necesario que el receptor, que
somos todos nosotros, asimile en muy poco
espacio de tiempo, ya que enseguida aparece otra
nueva. Por eso, sta tiene que presentarse de
forma clara, sencilla, bien organizada y que sea el
propio usuario el que elija la posibilidad de
profundizar en lo que le interese. Dentro de ese
proceso lgico, tambin las Nuevas Tecnologas
han tenido su influencia en Diseo Grfico.
Cambian los cdigos visuales, aparece el sonido, el
movimiento, el tiempo, surge la interactividad, que
es en definitiva, la que va a permitir una
colaboracin ms estrecha entre diseadores y
receptores, y cambian tambin los soportes,
aparece la pantalla del ordenador.
LINK:
VENTIDOS
AUTOR: OSCAR PEA EDITORIAL: ANAYA MULTIMEDIA
TITULO: DREAMWEAVER MX CIUDAD: BARCELONA
AO: 2002
RESUMEN: Macromedia Dreamweaver es una de las

aplicaciones ms importantes en el mundo del diseo
web. Su nueva versin, pone en manos de los
diseadores, avanzadas herramientas de desarrollo
web basadas en acceso a bases de datos.
Dreamweaver MX ofrece la solucin a los principales

problemas del desarrollo web actual, explicando con
detenimiento la configuracin de los sitios, el trabajo
en entornos locales y el diseo grfico de las
interfaces, utilizando los programas de diseo grfico
ms populares en la comunidad de desarrolladores.
LINK:
VENTITRES
AUTOR: JOSE MANUEL GOMEZ PASTOR EDITORIAL: ANAYA MULTIMEDIA
TITULO: FRONTPAGE CIUDAD: MADRID
AO: 2004
RESUMEN: El hecho de que haya sitios web cada vez

ms sofisticados, crea la necesidad de disponer de un
programa avanzado que est a la altura de tales
destrezas para el desarrollo Web. FrontPage 2003
ofrece tanto la eficacia como las funciones necesarias
para la creacin de sitios web profesionales,
dinmicos e interactivos, ofreciendo mayor capacidad
en tres reas clave: diseo, codificacin, y extensin.
La versin 2003 mejora en muchos aspectos a sus
predecesoras, pues incluye opciones de plantillas y
diseo predefinidas, o funciones de secuencias de
comandos para implementar fcil y rpidamente un
sitio con caractersticas interactivas profesionales.
LINK:
VENTICUATRO
AUTOR: SHAOWEN BARDZELL, JEFFREY

BARZELL EDITORIAL: ANAYA MULTIMEDIA
TITULO: STUDIO MX 2004 CIUDAD: CDMX
AO: 2004
RESUMEN: La solucin integral para el desarrollo de

sitios Web y aplicaciones. Los desarrolladores Web
necesitan herramientas slidas que abarquen todo el
espectro de la creacin de sitios, desde el diseo
grfico ms vanguardista hasta el desarrollo de
aplicaciones vinculadas a bases de datos.
Studio MX 2004 es el paquete de software ms

importante del mercado para el diseo de sitios. Las
cinco aplicaciones que lo componen; Dreamweaver,
Flash, Fireworks, FreeHand y ColdFusion,
constituyen un firme conjunto de soluciones que
multiplican su funcionalidad usadas conjuntamente.
LINK:
VENTICINCO
AUTOR: TONI CUFFI ROIG EDITORIAL: ANAYA MULTIMEDIA
TITULO: OFFICE XP CIUDAD: BARCELONA
AO: 2001
RESUMEN: Microsoft Office XP es la ltima versin

de Office, el popular paquete de aplicaciones para
oficina que utilizan ms de 120 millones de personas
en todo el mundo. Office XP no es slo un programa
sino una suite especialmente diseada para poder
trabajar sin problemas con las seis aplicaciones que
la integran. Adems, Office XP est perfectamente
diseado para trabajar con el sistema operativo
Windows de Microsoft.
LINK:
ARTICULO
DISEO GRAFICO EN PAGINAS WEB
Desde los inicios de la World Wide Web, tanto el diseo de las pginas como de la propia
estructura de los hiperdocumentos, ha variado enormemente. Si al principio, los hipertextos
en la Web se limitaban a plasmar, sobre este nuevo medio, un texto impreso segmentndolo
en pequeos bloques y colocando aqu y all algunos enlaces, en la actualidad, las pginas
web se han convertido en verdaderas obras de diseo grfico, multimedia e ingeniera
informtica. Integracin de bases de datos, servicios online, inclusin de sofisticadas
herramientas de bsqueda y recuperacin de
informacin, dinamismo, usabilidad e interactividad, stas son las claves de las pginas
web actuales. Ya no importa slo el contenido presentado, sino su diseo y, sobre todo, su
funcionalidad.
En 1997, David Siegel en Tcnicas avanzadas para el diseo de pginas web distingua 3
generaciones en el desarrollo de las interfaces de la WWW:
Webs de primera generacin:

Webs de segunda generacin:
Webs de tercera generacin:
Sin embargo, hoy podemos hablar de una cuarta generacin de webs en las que prima
tanto el diseo grfico como la tecnologa. Los webmasters ya no son slo diseadores
grficos, sino expertos informticos que han de conocer los nuevos lenguajes, dominar las
nuevas herramientas de programacin, conectividad a base de datos, seguridad, etc. El
hipertexto ya no es una coleccin de textos enlazados, sino un espacio de intercambio de
servicios de todo tipo: culturales, informativos, comerciales, sociales, etc.
Son muchos los factores que hay que tener en cuenta a la hora de disear un sitio web. Sin
embargo, dos factores destacan sobre los dems: su contenido y el diseo de la interfaz.
Los arquitectos de la informacin se ocupan ahora del diseo centrado tanto en el uso,
como en el usuario para hacerle a ste las tareas lo ms sencillas posibles.
La World Wide Web ya no se entiende como un macrotexto, sino como un espacio de

relacin y de servicios de todo tipo. Quizs haya triunfado la visin mercantil de la Web
como un hipermercado global para hacer negocios, pero a la par, se han desarrollado
otros servicios con fines menos crematsticos y con un enfoque centrado en la transmisin
de conocimientos, la puesta en comn y el desarrollo colaborativo para crear cultura,
pensamiento, ciencia, saber y, en suma, conocimiento.
Este mismo autor, en Arquitectura de la informacin: fundamentos del diseo de sedes en

la World Wide Web, establece los siguientes aspectos a tener en cuenta en el diseo de
una sede web:
informacin: contenidos.
gestin: estructura, organizacin, esquemas.
disposicin y presentacin: acceso, bsqueda, recuperacin y consultas.
En la Web no existe una metodologa concreta para crear hiperdocumentos o sitios web
completos. Por el contrario, existen multitud de estructuras organizativas tanto en lo visual
como en lo conceptual, que pueden provocar una gran desorientacin al usuario. Es por
eso, que a la hora de elaborar un hipertexto se deben establecer una serie de reglas para
que el sistema sea coherente (visual y cognoscitivamente), y para que no se produzca
duplicacin de informaciones o reiteracin de esfuerzos a la hora de recopilar o introducir
la informacin, y de crear la red hipertextual. Como la macroestructura comn de
informacin debe constituirse a partir de una serie de microestructuras, stas deben
construirse siguiendo unas reglas mnimas que favorezcan su articulacin en la estructura
global. Por lo tanto, las reglas deben establecer:
Los tipos de documentos que pueden entrar a formar parte del sistema
Los datos de identificacin del documento: ttulo, autor, descripcin, localizacin,
fecha de introduccin, fecha de la ltima consulta, nivel de acceso, etc.
El formato de introduccin del texto: estructuracin del texto, posicin de las
pginas, modelo grfico utilizado, etc.
El tipo de relacin entre los documentos: normas que indican qu documentos
pueden relacionarse, lugares dentro del documento en donde se deben encontrar
esas relaciones (en todo el documento o en una parte del mismo), presentacin
visual de enlaces, etc.
El acceso a los documentos: recomendaciones para el uso del hipertexto en la
bsqueda de informacin, etc.
Los editores web actuales permiten automatizar una serie de tareas que antes constituan
una afanosa labor, como la creacin automtica de tablas de contenido y herramientas de
bsqueda, creacin de barras de navegacin y exploracin o botones con enlaces de
trayectoria vertical y horizontal (de pginas primarias a secundarias y viceversa, de orden
secuencial anterior-siguiente-arriba, etc.) siguiendo el rbol y jerarquas establecidas en la
estructura, etc. Un aspecto clave y fundamental es la facilidad que ofrecen estos editores
para organizar los archivos y carpetas del sitio web y para construir la propia estructura
del sitio y los enlaces entre documentos, ofreciendo esquemas visuales generales de todo
el conjunto de nodos y sus relaciones jerrquicas y horizontales, o esquemas parciales de
parte de esa estructura jerrquica y/o en red. Slo hay que seleccionar la carpeta o
archivo elegido, arrastrarla y soltarla sobre el lugar que queramos que ocupe en el rbol
que representa la estructura de nodos, y ya tenemos creada de forma automtica la red
jerrquica y sus relaciones, los enlaces estructurales y de trayectoria, etc.
Por otro lado, los editores web tambin facilitan otras labores al ofrecer plantillas de
diseo general de sitios web y "esqueletos" completos de estructuras y modelos para
webs personales, webs de presencia corporativa, webs de discusin, webs de proyectos,
webs de soporte al cliente, webs de colaboracin en grupo, etc. Utilizando dichas
plantillas, slo tenemos que introducir el contenido y aadir o quitar las pginas que falten
o sobren a lo largo y ancho de la estructura propuesta. Los editores actuales tambin
suelen incluir una serie de herramientas y complementos que facilitan otras labores
complejas o tediosas para el diseador web, como asistentes para interfaz de bases de
datos, inclusin de contadores, barras de vnculos, efectos dinmicos, subprogramas java,
controles ActiveX, etc.
Es importante tener en cuenta que la unidad bsica de informacin de un documento
hipertextual no es la pgina, sino la pantalla.
As pues, el diseo de la pgina y la disposicin de los elementos dentro de ella para ser
vistos en pantalla, son uno de los aspectos principales a la hora de disear el
hiperdocumento. Las pginas deben tener un esquema ordenado y legible de un vistazo.
He aqu dos ejemplos de disposicin de pgina, la imagen de la izquierda muestra una
pgina ilegible y desordenada, mientras que la imagen de la derecha, que sigue un
esquema ordenado, facilita la navegacin y comprensin del contenido.
En el encabezamiento de los documentos es imprescindible que aparezca el ttulo

destacado y el uso de grficos sensibles o botones de cabecera que indiquen los
recorridos posibles para orientar la navegacin.
Tambin es corriente la utilizacin de un logotipo u otro sello grfico que identifique la

imagen institucional u oficial, comercial, etc. del sitio web.
En el diseo de las pginas hay que tener en cuenta una serie factores como: enlaces
locales y ayudas a la navegacin, encabezamiento de documentos, tipografa (contraste
visual, esquema y diseo de pginas, tipos de letras, establecimiento de ttulos y
subttulos, etc.). Creacin de pies de pgina con informacin sobre el autor, e-mail de
contacto, enlaces a otras pginas relacionadas, fechas de creacin y actualizacin, etc.
En este sentido, tambin los editores web actuales facilitan la labor de ofrecer un diseo
de pginas homogneo y coherente para el sitio web ya que ofrecen diferentes modelos y
estilos de plantillas para todo un sitio web o para pginas concretas: pginas principales,
pginas de bsqueda, formularios, pgina de preguntas ms frecuentes, tablas de
contenido, pgina con diseo a dos columnas, etc., o realizan otras labores de forma casi
automtica, como poner al da las pginas si se utiliza un sistema modular de
actualizacin para tratar un conjunto enorme de pginas que puedan actualizarse de
forma conjunta.
Los documentos hipertextuales destinados a ser ledos mediante la pantalla de un

ordenador tienen su propio lenguaje. En muchos casos, se convierte en una prctica
comn convertir un texto en hipertexto, por medio de la simple traslacin de un texto a
lenguaje HTML y la particin del texto secuencial completo en bloques de texto ms
pequeos que pasan a convertirse en nodos y que se conectan unos a otros mediante
unos enlaces que siguen ms o menos la misma estructura lineal que tena el texto
primitivo.
Hay que tener en cuenta que el texto impreso en papel necesariamente presenta una
disposicin para la lectura secuencial, mientras que el hipertexto permite otro tipo de
disposicin: la lectura multisecuencial y que esta posibilidad o facultad de lectura se lleva
a cabo por medio del establecimiento de otro tipo de estructuras que le diferencian del
texto tradicional. El hipertexto en la Web implica una nueva manera de presentar el texto y
el conocimiento que nada tiene que ver con el texto lineal.
Al transferir textos impresos a hipertexto, la primera operacin que hay que realizar es
convertir un texto completo en pequeos bloques de texto (o nodos) que luego uniremos
en mltiples trayectos o recorridos mediante los enlaces. Sin embargo, este es slo un
primer paso. El diseo de un hipertexto es una labor muy compleja. Los editores de
pginas web que, en realidad, son sistemas de gestin de hipertextos, nos facilitan esta
labor.
Por supuesto que existen tipos de documentos, en los cuales no tiene ningn sentido
separar el texto en bloques de nodos ms pequeos para ser puestos en la red. Una
novela de intriga se debe leer empezando por el principio y siguiendo, de forma
secuencial, hasta el final. La tecnologa hipertextual se debe aplicar con algn fin
coherente. Es muy til para las obras de consulta y referencia, los artculos y textos
cientficos, manuales, etc. Estas obras impresas ya contienen bsicamente todo lo que
tambin necesita el hipertexto: captulos, prrafos, contenido, ndices de palabras claves,
referencias bibliogrficas, etc. Estas obras no se leen pgina a pgina y el hipertexto
permite hojear los bloques de informacin ayudado por la estructura de navegacin y las
bsquedas directas.
Un buen hipertexto tiene que ofrecer al usuario una estructura de navegacin fcil de
manejar, la fragmentacin de la informacin en bloques debe tener sentido en s misma y
la estructuracin de los bloques de informacin por medio de los enlaces deber ser
coherente conceptualmente. El autor de un sitio web debe ofrecer al usuario toda la
estructura y la infraestructura necesaria para facilitar la exploracin, la navegacin y las
bsquedas mediante un lenguaje de fcil comprensin y utilizacin por el lector.
El diseo de la pgina principal es clave ya que es el primer sitio al que accede el usuario
y esta primera impresin, tanto en relacin al diseo como a la informacin en ella
ofrecida, condicionar al usuario para que sienta o no la necesidad de adentrarse en el
sitio.
ABSTRACT
GRAPHIC DESIGN ON WEB PAGES
Since the beginning of the World Wide Web, both the design of the pages and the
structure of hyperdocuments have varied enormously. If at the beginning, the
hypertexts in the web is limited to a format, a new medium, a printed text
segmentation in small blocks and placing here and there some links, nowadays, web
pages have become true works of design graphic, multimedia and computer
engineering. Integration of databases, online services, inclusion of sophisticated
search and retrieval tools, dynamism, usability and interactivity, these are the keys
to the current web pages. It does not only matter the content presented, but its design
and, above all, its functionality.
In 1997, David Siegel in Advanced Techniques for Web Page Design 3 Generations
in the Development of WWW Interfaces:
First Generation Websites:
Second generation websites:
Third generation websites:
However, we can talk about a fourth generation of webs in which both graphic design
and technology excel. Webmasters are no longer just graphic designers, computer
experts who have to know the new languages, master new programming tools,
connectivity a database, security, etc. Hypertext is no longer a collection of linked
texts, but a space for the exchange of services of all kinds: cultural, informational,
commercial, social, etc.
There are many factors to keep in mind when designing a website. However, its
content and interface design. Information architects are now concerned with both
user-centered and user-focused design to make tasks as simple as possible.
The World Wide Web no longer understands as a macrotext, but as a space of

relationship and services of all kinds. Perhaps the commercial vision of the Web has
triumphed as a global hypermarket to do business, but at the same time, other
services have been developed with less creative fees and with a focus on knowledge
transfer, sharing and collaborative development to create culture, thought, science,
knowledge and, in short, knowledge.
This same author, in Information Architecture: Foundations of the design of venues

in the World Wide Web,
information: contents.
management: structure, organization, schemes.
layout and presentation: access, search, retrieval and queries.
On the Web there is no concrete methodology for creating hyperdocuments or

complete websites. On the contrary, there is a multitude of organizational structures
both visually and conceptually, which can be the object of great disorientation to the
user. That is why, when it comes to developing a hypertext, a series of rules must
be established for the coherent sea system (visual and cognitive), and so that there
is no duplication of information or repetition of efforts to collect or enter the
information and create the hypertextual network. As the common macrostructure of
information must consist of a series of microstructures, they must be constructed
following the minimum rules that favor their articulation in the global structure.
Therefore, the rules should be established:
The types of documents that can become part of the system
Identification data of the document: title, author, description, location, date of

introduction, date of last consultation, level of access, etc.
The text entry format: text structure, page position, graphic model used, etc.
The type of relationship between documents: the rules that indicate the documents
can be referenced, the places within the document in which the same relationships
are found, the visual presentation of links, etc.
Access to documents: recommendations for the use of hypertext in the search for
information, etc.
Current web publishers allow you to automate a series of tasks that were once a
laborious task, such as creating content tables and search tools automatically,
creating navigation and navigation bars, or buttons with vertical and horizontal path
links (from primary pages to secondary and vice versa, from sequential order up-
next-up, etc.) following the tree and hierarchies established in the structure, etc. A
key and fundamental aspect is the ease that these editors offer to organize the files
and folders of the website and to construct the own structure of the site and the links
between documents, offering general visual schemas of the whole set of nodes and
their hierarchical relations and horizontal, or partial schemas of part of that
hierarchical and / or network structure. Just select the folder or file chosen, drag and
drop it on the place that we want to occupy in the tree that represents the structure
of nodes, and we already have created automatically the hierarchical network and
its relationships, structural and path links , etc.
On the other hand, web publishers also facilitate other work by offering general
website design templates and complete "skeletons" of structures and templates for
personal web sites, corporate presence web sites, discussion web pages, project
webs, support web sites client, group collaboration websites, etc. Using these
templates, we only have to enter the content and add or remove the missing or
missing pages throughout the proposed structure. Current editors also often include
a series of tools and add-ons that facilitate complex or tedious tasks for the web
designer, such as database interface wizards, account counters, link bars, dynamic
effects, java applets, ActiveX controls, etc.
It is important to keep in mind that the basic unit of information of a hypertextual

document is not the page, but the screen.
Thus, the layout of the page and the layout of the elements within it to be viewed on
the screen are one of the main aspects when designing the hyperdocument. Pages
should have a neat and readable layout at a glance. Here are two examples of page
layout, the image on the left shows an unreadable and unordered page, while the
image on the right, following an orderly layout, facilitates navigation and
understanding of content.
In the heading of the documents it is imperative that the title highlighted and the use
of sensitive graphics or header buttons that indicate the possible routes to orient the
navigation appear.
It is also common to use a logo or other graphic stamp that identifies the institutional
or official image, commercial, etc. of the website.
In the design of the pages you have to take into account a number of factors such
as: local links and navigational aids, document headings, typography (visual
contrast, layout and page layout, typefaces, setting titles and subtitles, etc. .).
Creating footers with information about the author, contact e-mail, links to other
related pages, creation and update dates, etc.
In this sense, today's web publishers also make it easier to offer a consistent and
homogeneous page layout for the website as they offer different template styles and
templates for an entire website or for specific pages: main pages, search pages ,
forms, FAQs, tables of contents, page with design to two columns, etc., or perform
other tasks almost automatically, such as updating the pages if a modular update
system is used to treat a set pages that can be updated together.
Hypertextual documents intended to be read through a computer screen have their

own language. In many cases, it becomes a common practice to convert a text into
hypertext, by simply translating a text into HTML language and partitioning the entire
sequential text into smaller text blocks that become nodes and become connect to
each other through links that follow more or less the same linear structure as the
primitive text.
It is necessary to take into account that the text printed on paper necessarily
presents a disposition for the sequential reading, whereas the hypertext allows
another type of disposition: the multisecuencial reading and that this possibility or
faculty of reading is carried out by means of the establishment of other types of
structures that differentiate it from the traditional text. Hypertext on the Web implies
a new way of presenting text and knowledge that has nothing to do with linear text.
It is necessary to take into account that the text printed on paper necessarily
presents a disposition for the sequential reading, whereas the hypertext allows
another type of disposition: the multisecuencial reading and that this possibility or
faculty of reading is carried out by means of the establishment of other types of
structures that differentiate it from the traditional text. Hypertext on the Web implies
a new way of presenting text and knowledge that has nothing to do with linear text.
When transferring printed texts to hypertext, the first operation to be done is to

convert a complete text into small blocks of text (or nodes) that we will then join in
multiple paths or paths through the links. However, this is only a first step. The design
of a hypertext is a very complex work. The editors of web pages that, in fact, are
systems of management of hypertexts, facilitate us this work.
Of course there are types of documents, in which it makes no sense to separate the
text into blocks of smaller nodes to be placed on the network. A novel of intrigue
must be read beginning with the beginning and following, sequentially, to the end.
Hypertextual technology must be applied with some coherent purpose. It is very
useful for works of reference and reference, scientific articles and texts, manuals,
etc. These printed works already contain basically everything that the hypertext also
needs: chapters, paragraphs, content, indexes of key words, bibliographical
references, etc. These works are not read page by page and the hypertext allows
browsing the blocks of information aided by the structure of navigation and direct
searches.
A good hypertext has to offer the user an easy-to-navigate navigation structure, the
fragmentation of the information into blocks must have meaning in itself and the
structuring of the blocks of information through the links must be conceptually
coherent. The author of a website must offer the user all the structure and
infrastructure necessary to facilitate the exploration, navigation and searches
through a language that is easy to understand and use by the reader.
The design of the main page is key since it is the first site to which the user accesses
and this first impression, both in relation to the design and the information offered,
will condition the user so that he feels the need to enter or not the place.
PALABRAS CLAVE
DISEO
WORD WIDE WEB
EDITORES
FORMATOS
DOCUMENTOS HIPERTEXTUALES
KEYWORDS
DESIGN
WORD WEB WIDE
EDITORS
FORMATS
HYPERTEXTUAL DOCUMENTS

Fesc Kevin

Transféré par

Informations du document

Copyright

Formats disponibles

Partager ce document

Partager ou intégrer le document

Options de partage

Avez-vous trouvé ce document utile ?

Ce contenu est-il inapproprié ?

Droits d'auteur :

Formats disponibles

Fesc Kevin

Transféré par

Droits d'auteur :

Formats disponibles

PROBLEMA:

DISEO GRFICO EN LAS PGINAS WEB

KEVIN ALEXANDER DIAZ TORRADO

PORQUE ME GUSTA Y ME LLAMA MUCHO LA ATENCIN EL TEMA, ME INTERESA

CIUDAD: SAN CRISTOBAL DE LA

TITULO: LAS PAGINAS WEB: UN NUEVO CAMPO DEL AO: 2006

RESUMEN: La presente tesis doctoral busc exponer

AUTOR: MARIA LUISA GARCIA GUARDIA CIUDAD: MADRID (ESPAA)

TITULO: PERSISTENCIA DE MODELOS DE DISEO AO: 2003

RESUMEN: El objetivo del artculo es conocer si realmente

AUTOR: MAGGIE GORDON (COORD.), BOB CIUDAD: BARCELONA

RESUMEN: El diseo, que cumple un papel

AUTOR: JENNIFER NIEDERST ROBBINS EDITORIAL: ANAYA MULTIMEDIA

TITULO: DISEO WEB, GUIA DE REFERENCIA CIUDAD: CDMX

RESUMEN: Diseo Web. Gua de referencia recoge

AUTOR: DANIEL DE LA CRUZ HERAS, MANUEL EDITORIAL: ANAYA MULTIMEDIA

TITULO: DISEO WEB CON FLASH CS3 CIUDAD: CDMX

RESUMEN: El crecimiento de las aplicaciones

AUTOR: MIGUEL PARDO EDITORIAL: ANAYA MULTIMEDIA

TITULO: CREACION Y DISEO WEB CIUDAD: CDMX

RESUMEN: La Gua Visual de Creacin y diseo Web

Este libro le ayudar a comprender los fundamentos

AUTOR: ANTONIO ARANA SAN SEBASTIAN EDITORIAL: UNESCO

TITULO: LA INFLUENCIA DE LAS NUEVAS CIUDAD: BILBAO

RESUMEN: Nuestra sociedad produce gran

Dentro de ese proceso lgico, tambin las Nuevas

AUTOR: PATRICK J. LYNCH, SARAH HORTON CIUDAD: MLAGA, ESPAA

TITULO: MANUAL DE DISEO WEB AO: 2003

RESUMEN: Esta gua bsica para diseadores de

En esta segunda edicin se amplia esta aproximacin

AUTOR: MIGUEL PARDO EDITORIAL: ANAYA MULTIMEDIA

TITULO: CREACIN Y DISEO WEB CIUDAD: CDMX

RESUMEN: La popularidad creciente de Internet ha

Con unos contenidos claramente estructurados, esta

AUTOR: MIGUEL PARDO NIEBLA EDITORIAL: ANAYA MULTIMEDIA

TITULO: GUIA VISUAL DE CREACION DE LAS CIUDAD: CDMX

RESUMEN: La Gua Visual de Creacin de pginas

AUTOR: JAKOB NIELSEN, HOA LORANGER EDITORIAL:ANAYA MULTIMEDIA

TITULO: USABILIDAD-PRIORIDAD EN EL DISEO CIUDAD: CDMX

RESUMEN: La usabilidad se podra definir como la

Este libro tiene por objetivo priorizar nuestro extenso

AUTOR: MARA GLORIA DEL RO CIDONCHA, MARA

TITULO: APLICACIN DE LAS NUEVAS

RESUMEN: Dentro del marco de la docencia del CAD y

AUTOR: STEVE JOHNSON EDITORIAL: ANAYA MULTIMEDIA

TITULO: EXPRESSION WEB CIUDAD: CDMX

RESUMEN: Microsoft Expression Web es el nuevo

WHATExpression Web no es una actualizacin de

AUTOR: DALADIER JABBA MOLINARES, ROBERTO EDITORIAL: EDICIONES UNINORTE

TITULO: DISEO Y MONTAJE DE SITIOS WEB

RESUMEN: La Web fue diseada sobre Internet para

AUTOR: CHRIS LEEDS EDITORIAL: ANAYA MULTIMEDIA

TITULO: MICROSOFT EXPRESSION WEB CIUDAD: MADRID

RESUMEN: Expression Web es la nueva y potente

AUTOR: TANYA STAPLES EDITORIAL: ANAYA MULTIMEDIA

TITULO: PHOTOSHOP CS2 PARA LA WEB CIUDAD: CDMX

RESUMEN: Adobe Photoshop e ImageReady se han

AUTOR: LON COLEY, JENNIFER FULTON, SCOTT EDITORIAL: ANAYA MULTIMEDIA

TITULO: CREA TU PAGINA WEB CIUDAD: BARCELONA

RESUMEN: La evolucin de las nuevas tecnologas y

AUTOR: JUAN CARLOS TORREALBA PERAZA CIUDAD: BARCELONA

TITULO: APLICACIN EFICAZ DE LA IMAGEN EN AO: 2004

RESUMEN: Las nuevas tecnologas de informacin

AUTOR: JAMES J. MAIVALD, CATHY PALMER EDITORIAL: ANAYA MULTIMEDIA