Proceso para el Desarrollo Web
-
Upload
rodrigo-arturo-perez-reyes -
Category
Education
-
view
931 -
download
2
Transcript of Proceso para el Desarrollo Web
Proceso para el Desarrollode un Proyecto WebPor: Ing. Rodrigo Pérez
Objetivos
• Identificar la finalidad y las necesidades del cliente que solicita un sitio web.
• Identificar la audiencia objetivo y los requerimientos
• Identificar el contenido relevante y adecuado para el cliente y la audiencia.
• Demostrar las reglas del Copyright
• Asignar tareas y responsabilidades en la gestión de proyectos.
Sitio Web
• Es la herramienta principal en la cual se implementa la estrategia del cliente.
• Es el elemento más representativo de su identidad digital
• Es de suma importancia plantear el desarrollo del proyecto para conocer las necesidades del cliente.
Primera cita con el cliente
• Se deben desarrollar los siguientes temas:
• Identificación del cliente
• Metas del cliente
• Audiencia objetivo
• Contenido
• Requerimientos de diseño
• Requerimientos necesarios para la distribución
• Estos temas se especifican a continuación
Finalidad Audiencia y Necesidades
Identificación del cliente
• Nombre de la organización
• Misión
• Productos o servicios
• Historia de la compañía
• ¿Por qué está buscando el diseño de un sitio web?
Metas del cliente
• Objetivos a corto y largo plazo
• Hitos* que debe recordar la audiencia después de la visita.
• Información clave para la audiencia
• Expectativas y necesidades de contenido.
*Los hitos son logros importantes
Finalidad Audiencia y Necesidades
Audiencia Objetivo
• Establecer el ámbito (campo de acción) de la audiencia.
• Rango de edades
• Requerimientos de audiencia con discapacidades
• Frecuencia de navegación
• Utilización del sitio
• ¿Qué adjetivos describen el sitio?
Contenido
• Titulo
• Tópicos (temas)
• Requisitos especiales de la empresa
Finalidad Audiencia y Necesidades
Req. De Diseño
• Colores, logos y fuentes corporativas que deban incluirse en el sitio.
• Sitios de que sirvan de inspiración para el diseño
Req. De Distribución
• Navegador
• Explorer
• Firefox
• Chrome
• Sistemas operativos
• Windows
• Linux
• Mac
• Hardware, software y complementos
Planeación del Proyecto
• Hay que entender las necesidades del cliente
• Enlistar las tareas, fechas de entrega y asignar responsabilidades.
• El tamaño del plan refleja el tamaño del proyecto
• Tener información detallada para comunicar tareas clave para el cliente y el equipo de producción
Contenido
• El sitio es la razón de visita por:
• Productos
• Información
• Instrucción
• Entretenimiento.
• Debe ser interesante y conciso.
• La Redacción:
• debe ser clara
• Los textos deben ser concretos y descriptivos
• Las oraciones y párrafos deben ser cortos.
• Imágenes deben ser relevantes.
• El contenido proporciona credibilidad. Hay que mantenerlo actualizado.
• Tener disponibilidad de contacto e información verificable.
El Copyright
• Es la protección de la propiedad intelectual
• Consiste en cualquier contenido creado: música, fotos, contenidos, etc.
• El uso legitimo y razonable limita el material protegido, sin permiso escrito, como fuente de información dando crédito al autor
• Revisar el material del contenido. Verifique que sea de dominio público o cuente con los permisos para utilizarlo.
El Copyright (cont.)
• Trabajo derivado
• es material protegido alterado o cambiado y se necesita permiso par usarlo.
• Estándares académicos
• se debe dar crédito al citar textualmente a un autor, incluso al hacer una paráfrasis.
• Bibliografía
• son fuentes que se utilizaron para una investigación. Puede ser material tomado de internet como gráficos y fotografías.
Reglas del Copyright
• No usar material protegido sin permiso del autor• Asumir que todo material está protegido• La sanción por usar material sin permiso puede incluir:
• Un correo solicitando dejar de utilizar el material• Una solicitud de baja del sitio al web master.• Denuncia ante las autoridades.
• Asegúrese de no violar derechos del autor:• Envíe un correo al autor solicitando permiso• Sigua las instrucciones sobre el uso del material protegido• No utilice el material sin permiso escrito
• Proteja su propio material:• Use © o la abreviación Copr.• Indique el nombre del autor• Indique año de publicación
• Ejemplo: © 2012 Ediciones y Publicidad S.C.
• Los fonogramas usan el símbolo ℗
Fuentes de Internet
• Cuando se usa información de una revista o libro, debe citarse la bibliografía.
• Formato de citas• Para World, Wide, Web.
• Autor. Titulo. [En línea] Disponible en http://sitioweb.com, Fecha del documento o Fecha de descarga.
• Sonido en línea• Descripción o Titulo del sonido. (sonido en línea) Disponible en
http://sitioweb.com, Fecha del documento o Fecha de descarga.
• Video en línea• Descripción o Titulo del videoclip. (Video en línea) Disponible en
http://sitioweb.com, Fecha del documento o Fecha de descarga.
• Imagen en línea• Descripción o Titulo de la imagen. (imagen en línea) Disponible en
http://sitioweb.com, Fecha del documento o Fecha de descarga.
Imágenes para un sitio Web
• Hay que decidir el formato de las imágenes
• Se Optimizan las imágenes para que el tiempo de descarga sea el menor.
• Se ajustan los valores de optimización para encontrar un equilibrio entre la calidad de imagen y el tamaño del archivo.
Tramado (Dither)• El tramado es el método de
simulación de colores que no están disponibles en el sistema de color seleccionado.
• A mayor porcentaje de tramado, mas colores y detalles se aprecian y mayor es el tamaño de archivo.
• Las imágenes de colores uniformes no requieren tramado, no así las de tono continuo, necesitan tramado para evitar franjas de color no deseado.
Un ejemplo de tramado. El rojo y el azul son los únicos
colores utilizados, pero a medida que los píxeles se hacen más pequeños, el parche parece violeta.
Comparación
Imagen original (tramado)
|
Imagen sin tramado
Observe que existen franjas de colores y no se aprecian los
detalles de la imagen correctamente
Observe que el tramado ayuda a que los detalles de una imagen se aprecian mejor y las franjas
de color se disimilan
Tramado
• El tramado consigue aproximaciones de colores que no se encuentran en la paleta actual al alternar dos colores similares.
• Desde una determinada distancia los colores se mezclan para crear el aspecto del color ausente.
• El tramado es útil cuando se exportan imágenes que incorporan mezclas complejas o degradados de color
Tipos de tramado
• Los efectos se difuminan con los pixeles adyacentesDifusión
• Utiliza cuadros similares a los semitonos para simular colores faltantes.Motivo
• Utiliza cuadros de color al azar, sin difuminar los colores adyacentes.Ruido
• No aplica tramado y ocupa únicamente una paleta de 216 colores.Restrictivo
Formatos de Imágenes para la web
GIF JPEG PNG
GIF (Graphic Interchange Format)
• Utiliza máximo 256 colores
• Ideal para imágenes de tonos no continuos o áreas de color homogéneo
• Usarlo en:
• Barras de navegación
• Botones
• Iconos
• Logotipos
JPEG (Joint Photographics ExpertsGroup)• Ideal para fotos de tono continuo.
• Puede contener millones de colores
• A mayor calidad mayor tamaño y mayor tiempo de descarga
• A mayor compresión, menor calidad
ComparaciónImagen de colores uniformes Imagen de colores continuos
Esta imagen si requiere tramados ya que existen colores
intermedios entre el negro el blanco y el gris que requieren ser
simulados
Esta imagen tiene grandes áreas de un colores individuales
(negro, rojo, blanco, crema) por lo que no es necesario utilizar el
tramado con ella.
PNG (Portable Network Group)
• Compatible con colores indexados, escala de grises o color verdadero.
• Soporta canales alfa (transparencias
• Conservan información de Capas, vectores, color y efectos, todos ellos completamente editables en Fireworks.