DISEO DE PGINA WEB
Profa. Sarahi Reyes Perez
COMM 301
Telecomunicaciones en la Oficina
Universidad Del Este
Recinto de Cabo Rojo
INTRODUCCIN
Diseo
Representacin formal y suele ser el primer punto de
contacto entre la persona y el producto o entre el servicio
y la persona.
Para que un diseo sea adecuado se debe disponer de la
informacin necesaria para conocer al cliente, mercado,
consumidores, producto o servicios a ofrecerse en la
pgina Web.
Pgina Web
Archivo que se encuentra disponible en el WWW.
Generalmente est hecho en formato HTML y puede
visualizarse en la pantalla de la computadora como si
fuera una pgina.
PROCEDIMIENTO DE DISEO
Una buena planificacin permite que la pgina se distinga de
otras pginas y capte la atencin de las personas provocando que
lean la misma.
Es importante organizar las ideas para que el lector identifique la
informacin de manera rpida y fcil.
Crea un bosquejo que permita ver las distintas alternativas para
la planificacin del formato y diseo de la pgina.
Planificacin
Identifica el propsito de la comunicacin
vender, promocionar, informar, orientar
Evala la audiencia a quin va dirigido
Presentacin del texto - cmo presentar la informacin
Respuesta del lector como esperas que reacciones el lector
PROCEDIMIENTO DE DISEO
Creacin
Mensaje claro
Propsito del mensaje
Prioridades del contenido
Esquema o formato (no exagerar)
Al momento de disear tome en consideracin la
intencin de la publicacin, la audiencia, la
informacin, el espacio disponible y el tipo de
distribucin.
PRINCIPIOS BSICOS
Sirven de gua para el diseador
Si se aplican correctamente, podr captar
la atencin del lector.
Punto Focal / nfasis
Utilizado para atraer la atencin del lector.
Consiste en realzar un elemento con el fin de
captar la atencin.
Incluye la forma en que se presenta el ttulo, los
elementos grficos como lo son las ilustraciones, logos,
etc. Rodeados por espacios en blanco.
PRINCIPIOS
Balance
Considerar la distribucin equitativa del contenido.
Es la organizacin de los elementos en la pgina de
modo que una seccin no sea ms pesada que la
otra.
La distribucin puede ser simtrico (a igual
proporcin) o asimtrico (en desiguales
proporciones).
Simtrico se dirige a los documentos formales y se refiere a
elementos similares de igual proporcin en todos los lados
de la pgina. Todo es texto.
Asimtrico se refiere a que los elementos no son similares.
Este permite un balance flexible, permite ser creativo y
estimular al lector.
PRINCIPIOS
Proporcin / Equilibrio
Considera el tamao de los elementos en
relacin de unos con otros.
Requiere el control del tamao, tono, peso y
posicin de los elementos.
Elementos considerados visuales deben estar
en proporcin con el tipo y tamao de letra, con
el tamao del texto y el espacio disponible en
la pgina.
PRINCIPIOS
Contraste
Determinar los grados de claridad y oscuridad en la
pgina mediante la seleccin de colores, caracteres
especiales, espacios en blanco, tipo y tamao de letra de
ttulos y subttulos.
Los caracteres especiales como los bullets son tiles para definir listados importantes y ayudan al contraste visual.
Esto permite que la pgina no resulte aburrida a la vista.
Secuencia / Flujo direccional
La ubicacin de los elementos focales deben ser colocados
en forma de Z, o sea, la forma en que el ojo se mueve de un lado a otro.
Permite leer de izquierda a derecha y de arriba hacia
abajo. (orden lgico)
PRINCIPIOS
Consistencia
Uniformidad de los elementos, como mrgenes, tipo de columnas, tipo de letra y tamao para cada una de las secciones a crearse en la pgina, los espacios disponibles, y otros.
Mantenga simplicidad cuando se repiten los elementos.
La inconsistencia no logra el enfoque.
Unidad
Diseo unificado. Debe concebirse como unidad, y la totalidad de sus partes (texto, arte, encabezado, logotipo, etc) se deben relacionar entre s con el fin de producir un efecto general y unificado.
Armona
La idea de que todos los elementos deben de ser compatibles, est muy relacionada con la unidad. El diseador logra la armona mediante la seleccin de elementos que combinen.
PRINCIPIOS
Color
Ayudan a organizar las ideas y a resaltar los factores
importantes
No utilices ms de tres colores y que los mismos no
sean obscuros para el fondo cuando se usan colores
obscuros para el texto. Esto hace difcil la lectura de
tu pgina.
Para otros principios y ampliar esta informacin,
leer Artculo Principios Bsicos del Diseo para
Pgina Web,
http://www.un.org/spanish/Depts/dpi/seminario/p
df/principiosfireworks.pdf
ESTRATEGIAS PARA LA CREACIN
PGINA WEB
Ayuda al diseador a crear su plan
estratgico.
Determine a quin est dirigida la pgina
Motive a su audiencia.
Tratarlos con respeto y ofrecerles los medios
para comunicarse con usted.
Establezca sus objetivos del diseo.
Incluya una seccin donde el usuario pueda
ofrecer reacciones y comentarios sobre su pgina,
e incluya textos de ayuda para aquellos que no
obtienen la informacin que esperaban.
ESTRATEGIAS
Seleccin del Contenido
Seleccione el contenido de su pgina web
Utilice un lenguaje simple y comprensible
Incorpore espacios en blanco
Ofrezca la informacin en forma de resumen.
Considera la Navegacin
La pgina debe ser creado de forma simple, clara y
organizada, que facilite la navegacin por ella sin
problemas.
Determine si se incluyen o no imgenes
La creacin de una pgina Web comienza por su texto y la
estructura bsica de la misma.
Analizar el contenido, determine qu tipos de imgenes e
ilustraciones se pueden utilizar.
RECOMENDACIONES
Selecciona un fondo y un color de texto de gran contraste
Sea consistente con el formato del texto:
evite los cambios de color
evite cursivas (dificultad de lectura) y subrayado (se confunde con los enlaces)
evite textos demasiado largos
Evite los fondos con texturas que no permitan una fcil lectura
Use imgenes simples, reducidas o pequeas e inmviles para ilustrar el contenido
Los formatos de los archivos grficos deben ser utilizados comprimidos (.jpg) fotografas y dibujos (.gif)
RECOMENDACIONES
Analiza el contenido y formalidad del documentos
antes de decidir los elementos del diseo
Elige un diseo simple, consistente, atractivo,
que facilite la comunicacin
Haz un recorrido por el texto de acuerdo al
desarrollo de la lectura normal (desde arriba
hacia abajo, izquierda a derecha)
Limita las letras maysculas para los ttulos y
para enfatizar algo. Las letras minsculas salas
en el texto para su mejor lectura.
Utiliza tipos de letras que sean claros y no se
presten a confundir.
RECOMENDACIONES
Evite terminologa tcnica. De utilizarla, coloca las definiciones para el usuario.
Utiliza pginas subsiguientes para colocar los datos o detalles de aquella informacin que sea compleja.
El contenido de cada pgina subsiguiente debe ser coherente con su enlace.
Revise la ortogrfica de sus pginas, y solicite que otra persona las revise de forma independiente.
Invite a sus lectores a realizar comentarios y sugerencias. Esto aumentar la eficacia de su pgina web.
ETIQUETA EN LA WEB
Asegrese que el encabezado y el ttulo de la pgina
guarde relacin con el contenido.
Utilice un lenguaje apropiado, no utilice letras
maysculas, ello equivale a gritar.
Enve mensajes breve
Cause buena impresiona con sus palabras y contenido de
su pgina. Revise las palabras e imgenes que utilizar.
Sea selectivo con la informacin que publica en el Web.
Esa informacin ser pblica y puede ser visa por
cualquier persona.
Obedezca las leyes de Copyright. No utilice contenidos o
imgenes sin permiso.
Cite las obras que utiliza
REFERENCIAS Borocci, Daniel. (s.f.). Netiquette. Estudios, Gua y Estrategias. Recuperado en
http://www.studygs.net/espanol/netiquette.htm
Martin, Cesar. (2006). Introduccin al Diseo Web. Desarrollo Web.com.
Recuperado de http://www.desarrolloweb.com/articulos/disenio-adecuado.html
Principios Bsicos del Diseo. (2009). Tutor Grfico. Recuperado de
http://tutorgrafico.com/principios-basicos-del-diseno.html
Principios Bsicos del Diseo para Pgina Web. (2005). Internet, el instrumento
esencial de la diplomacia del siglo XXI. Disponible en lnea
http://www.un.org/spanish/Depts/dpi/seminario/pdf/principiosfireworks.pdf
Rosa, Mara. (s.f.). Principios Bsicos del Diseo de Publicacin. Universidad
Interamericana de Aguadilla. Recuperado de http://agu.inter.edu/mrosa/
Selva, Joaqun. (2000). Principios Bsicos en el Diseo de Pginas Web.
(Traduccin- http://www.uv.es/~selva). Estudio Guas y Estrategias. Disponible
en http://www.studygs.net/espanol/basdesign.htm
Selva, Joaqun. (2000). Escribir Pginas Eficaces para el Web. (Traducida -
http://www.uv.es/~selva). Estudios, Gua y Estrategias. Recuperado en
http://www.studygs.net/espanol/content.htm#Diseando%20Pginas%20Web
Top Related