Vamos a hacer una prueba telefonica 555-555-5555

Photoshop y Fireworks

Photoshop

Photoshop es un software de la compañía Adobe. Cuenta con 20 años de experiencia en el tratamiento de imágenes digitales. Posee una gran variedad de herramientas que permiten al usuario realizar imagenes realistas con retoques profesionales.

De acuerdo con Adobe, Photoshop está destinado a la fotografía y a proyectos de diseño. La edición que maneja es en mapa de bits.

Fireworks
 
Fireworks es un software originario de la compañía Macromedia, pero que pasó a ser de Adobe cuando ésta compró a Macromedia. Cuenta con aproximadamente 10 años de experiencia en la creación de gráficos altamente optimizados para la web y cualquier dispositivo.

De acuerdo con Adobe, Firefox está dirigido a la creación de sitios web, interfaces de usuario, interfaces para dispositivos móviles. Maneja tanto edición en modo vectorial como en mapa de bits.

 Fireworks o Photoshop

Revisando las opiniones de personas que llevan tiempo utilizando ambos programas, y de acuerdo con las definiciones que dan el mismo Adobe, cada uno de los programas tiene su propia función. Sin embargo, la discusión entre los usuarios siempre permanecerá vigente pues cada uno apoya a su programa favorito. De todas formas, hay algunas opiniones que me parecieron valiosas de rescatar:

1. La primera opinión valiosa es la de un usuario fiel a Photoshop, pero que quizo experimentar las funciones de Fireworks y pudo comprobar la compresión que hace cada uno de los programas en sus archivos y como los archivos que se almacenan en Fireworks son más livianos que con Photoshop. Para ella, este dato es bastante importante para el manejo de su sitio web, pues de esta forma puede minimizar el tiempo de carga de cada una de las imagenes, es decir, minimizar el ancho de banda necesario en cada conexión, ayudando asi a cada uno de sus usuarios. Utilizando el mismo archivo en cada prueba, esto fue lo que consiguió:
* PNG: 20Kb menos en Fireworks
* GIF: 4 Kb menos en Fireworks
* JPG: 8 Kb menos en Firworks
Fuente: http://www.webdesignerwall.com/general/fireworks-vs-photoshop-compression/

2. La otra opinión valiosa para exponer aquí, es la de un usuario que muestra las 7 razones principales por las cuales prefiere utilizar Fireworks a Photoshop, aunque aclara que en algunas ocasiones hace uso de las herramientas del otro programa. Estas son sus razones:

1. Control pefecto de los pixeles
2. La capa web que maneja Fireworks
3. El manejo de los gradientes y las opciones que estos tienen
4. La curva de aprendizaje
5. La herramienta de vectores
6. El manejo de las páginas, los símbolos y los estilos
7. ... pero sobre todo, la diferencia de precios entre uno y otro programa

Cualquier ampliación a sus comentarios, pueden ser vistos en: http://www.webdesignerdepot.com/2010/08/7-reasons-why-i-choose-fireworks-over-photoshop/

En cualquier caso es de libre elección el programa con el que más se sienta comodo.

CSS

Qué son, ventajas y algunas propiedades

CSS son las siglas para Cascading Style Sheets o en español Hojas de Estilo en Cascada. En otras palabras, el CSS es un lenguaje para hojas de estilo que permiten controlar la presentación de los documentos HTML y XHTML.

La ventaja de utilizar CSS es que permite separar el contenido de la presentación y es de gran importancia en la creación de páginas web con bastante complejidad. Las ventajes de hacer dicha separación incluye:

• Mejor acceso al documento
• Reduce la complejidad del mantenimiento
• Permite visualizar el documento en diferentes dispositivos

De esta manera, cuando se desea crear una página web, simplemente se realiza el contenido en lenguaje HTML o XHTML, asignandole las funciones respectivas a cada parte del contenido: párrafo, texto, lista de elementos, tablas, etc. Teniendo el contenido listo, se hace uso del lenguaje CSS para definir el aspecto de cada elemento: tamaño, color, separación, ubicación, etc.

La forma en que CSS funciona es considerando cada elemento como una caja. Las dimensiones de cada caja se pueden controladas para producir una gran variedad de efectos:

Las propiedades que se manejan con CSS son:

• De Fuente
• De Color y Fondo
• De Texto
• De Cuadros
• De Clasificación 
• Unidades

Debido a que hay numerosas propiedades, se nombrarán sólo algunas de las tantas que se pueden encontrar y utilizar. Además, no es necesario utilizarlas todas al momento de diseñar una página web, sino simplemente las que sean útiles y necesarias para lo que necesitemos:

- font-style: nos permite definir el estilo de la fuente. Sus valores posibles son: normal, italic, oblique

- background-attachment: nos permite definir la forma en que queremos tener el fondo, es decir, estático o en movimiento, por lo que sus valores posibles son: scroll, fixed 

- text-decoration: con esta propiedad se puede decorar el texto de 5 maneras diferentes: underline (subrayado), overline (línea superior), line-through (tachado), blink(parpadeo), o la por defecto none (ninguna)

De todas formas, en cualquier momento se puede consultar la lista de propiedades de CSS, directamente desde la página web: http://htmlhelp.com/es/reference/css/properties.html en donde además de encontrar la lista de propiedades, se puede aprender cual es el funcionamiento de cada propiedad y que elementos la componen.

Comentario otras páginas

A continuación expongo mis impresiones acerca de los sitios publicados por mis compañeros:

SOY MAMÁ

1. ¿Cuál fue su primera impresión del sitio?

Mi primera impresión fue que la página era seria y elegante. Considero que el uso de las curvas logró su objetivo de romper con los esquemas tradicionales. Lamentablemente la proyección no mostraba bien los colores y parecía una página sobria, pero ahora que puedo ver como son, considero acertado los colores elegidos.

2. Como usuario, ¿cree usted que cumple su objetivo en el sitio? ¿Cumpliría un usuario su objetivo en el sitio?

Creo que un usuario podría encontrar la información que desea en el sitio. Sin embargo, las etiquetas por etapas no me termina de convencer, ya que la primera opción para entrar a una página que se llama Soy Mamá, es porque o estoy embarazada o ya tengo hijos.  Y si este fuera el caso, creo que optaría por entrar a la etapa 1, a menos de que previamente algo me indique que la etapa 1 es para antes del embarazo.

3. En que acertaron en el sitio (Fortalezas)

- Los colores tienen que ver con los utilizados en los bebés, colores suaves, tranquilos, pasteles.

- La iconografía me parece acertada, acorde con el tema que indica y con la página

- El diseño en general es muy agradable, muy profesional

- La abstracción del logo es muy buena, e incluso se me hace familiar. Creo que se logra capturar la esencia del sitio web.

4. En que no acertaron en el sitio (Debilidades)

- En ninguna parte se le indica al usuario el nombre del sitio. Esto dificulta la recordación en el usuario y el poderlo recomendar a otras personas en caso de que olvide en donde encontró cierta información

- El fondo blanco que enmarca el logo hace perder la relación del loo con la página, a pesar de que el cuadrado no está derecho. Podría dejarse el relleno blanco, pero quitar el exterior.

- Creo que debido a que los iconos ya tienen su descripción, y que la página no va a tener scroll, el menú de abajo podría estar sobrando.

- La página puede estar sobrecargada en amplitud y poca profundidad, y con una mezcla de temas algo extrañas, ya que las Etapas 1,2 y 3 tienen características en común, mientras que Tienda Niños, Médico y Blog son diferentes entre sí. De pronto se podría haber conjugado en una sola sección las tres etapas.


EN CASA

1. ¿Cuál fue su primera impresión del sitio?

Mi primera pregunta fue: ¿Por qué el usuario al que se dirige es casado?.
El uso de los colores permite que la página sea homogénea y por tanto profesional y seria.

2. Como usuario, ¿cree usted que cumple su objetivo en el sitio? ¿Cumpliría un usuario su objetivo en el sitio?

El manejo de la página es bastante sencilla, pues las categorías claramente reflejan el sitio de la casa que se desea ubicar. Sin embargo, siento que a menos de que haya llegado a ella sabiendo de que se trata, sería complicado conocer que es una página de Hágalo Usted Mismo en Casa

3. En que acertaron en el sitio (Fortalezas)

- El diseño del logo

- La ubicación del logo, que aunque es diferente a lo normal, debido a las características del mismo, se adapta correctamente.

4. En que no acertaron en el sitio (Debilidades)

- El diseño de las páginas es débil en comparación con el diseño del logo. La enmarcación de las páginas las hacen parecer como que les faltara acabados.  

- Es difícil conocer cual es el objetivo del sitio.

- El logo es muy pequeño para el diseño del sitio, además de la ubicación en la que se encuentra. Aunque es cierto que es un logo que puede ubicarse en el centro para dar la impresión de que es el techo del sitio, sería bueno que tuviera un mejor tamaño.

- El espacio para los comentarios de los usuarios es demasiado reducido

Dio Papaya

A continuación se presenta el diseño definitivo del sitio:

HOME

Suelta la lengua

Chismes Bomba

Papaya Dulce

Radar de Chismes

Mapa del sitio

Respuesta a algunas preguntas...

¿Cuál es el rol del arquitecto de información?

El rol principal del arquitecto de información es el de dar una definición de cómo será y cómo funcionará un sitio web. Entre otras tareas, tiene además:

- La responsabilidad de darle claridad a la misión y la visión del sitio web, generando un balance entre las necesidades de los dueños de la página y de los usuarios finales de la página. 

- La necesidad de determinar cual será el contenido y la funcionalidad del sitio. 

- El deber de especificar cómo será la forma en que los usuarios encuentren la información que desean en el sito web, definiendo así la organización de la información, las rutas de navegación, la forma de etiquetar la información y los sitemas de búsqueda. 

- La tarea de determinar cómo hará el sitio web para proyectarse a futuros cambios y crecimiento del sitio web. 

¿Qué clase de perfil debe tener un arquitecto de la información? (competencias, capacidades, habilidades)

El perfil ideal para un arquitecto de información, es el de alguien que pueda entender el punto de vista desde afuera de la organización, desde adentro y la perspectiva de diferentes disciplinas.

Cuando el arquitecto de la información es capaz de ponerse en los zapatos del usuario, puede entender de una mejor manera sus necesidades y la forma en que le gusta encontrar lo que desea. Para lograr esto requiere además una gran sensibiidad a las necesidades del usuario.

Sin embargo, no es suficiente conocer la perspectiva de los usuarios, se requiere también tener en cuenta el punto de vista de la organización a la que se le está diseñando el sitio web. Se debe conocer y entender su misión, sus metas, el contenido, el público al que desea llegar y las necesidades de sus empleados. A partir de esta información se puede diseñar una sitio web que esté acorde al tipo de organización. 

Finalmente, el arquitecto de información debe poder entender la perspectiva de otras disciplinas con puntos de vista especializados. No es lo mismo dirigirse a un público infantil, a dirigirse a un público profesional. Además, en el ámbito profesional, cada rama tiene una serie de términos especializados, los cuales deben ser conocidos por el arquitecto de información de acuerdo al público al que desea dirigirse.

 
¿Qué opinión tiene sobre el usuario de un sitio web?

El usuario final de un sitio web es alguien que desea encontrar la información de manera rápida y fácil. Sin embargo, no se puede catalogar a los usuarios de un sitio web en un sólo tipo de usuario, ya que cada uno puede tener un nivel educativo diferente, una experiencia y experticia en tecnología diferente, un lenguaje diferente y unas necesidades diferentes. Por tal motivo, es importante que el arquitecto de la información permita a los usuarios, tener diferentes alternativas para encontrar la información que desean, especialmente la información más importante y relevante para la organización. 

Autores que han escrito sobre arquitectura de la información y lo más importante de cada uno

Inicio está mini sección con una imágen que encontré en el siguiente link: www.nosolousabilidad.com/articulos/historia_arquitectura_informacion.htm

En dicha página hacen un recuento acerca de la historia de la arquitectura de la información, haciendo especial énfasis en autores que hicieron uso de este tema desde que Richard Saul Wurman inició el término en 1975, hasta 1998, fecha en que Rosenfeld y Morville lo hicieron popularizar en su libro "Information Architecture for the Wold Wide Web". La definición hecha por Richard Saul Wurman es:

"El estudio de la organización de la información con el objetivo de permitir al usuario encontrar su vía de navegación hacia el conocimiento y la comprensión de la información."

Desde otra página podemos encontrar algunos libros recomendados, que también están incluídos en el link anterior. En esta oportunidad es www.infotectura.com/2007/03/16/recomendaciones-de-libros-sobre-arquitectura-de-la-informacion-y-usabilidad/ quien nos recomienda los siguientes ligros acerca de la arquitectura de la información:

1. Obviamente se hace mención al libro de Rosenfeld y Morville: Informaton Architecture for the World Wide Web, más conocido como el libro del oso polar. Es considerado el libro fundamental para la arquitectura de la información. 

Permite conocer el arte y la ciencia de estructurar y clasificar sitios web e intranets para ayudar a los usuarios a encontrar y manejar la información.

 2. Don't Make Me Think, de Steve Krug, es un libro acerca de los principales criterios que se deben tener en cuenta en cuanto a usabilidad. Los temas que incluye son:   

* Patrones de usuario

* Diseñar para la digitalización

* Uso racional de los ejemplos* Diseño de navegación
* Diseño de la página de Inicio o Home* Test de usabilidad

3. Information Architecture, Blueprints for the Web, de Christina Wodtke y Austin Govella es otro libro acerca de la arquitectura de la información, enfocada a sitios web. 

Hace una introducción a los conceptos básicos de la arquitectura de la información, la organización de la información y el diseño de la interacción del sitio web. 

 4. Designing Web Usability de Jakob Nielsen, se basa en la usabilidad de los sitios web. Entre los temas que trata se encuentran: 

* La navegación

* La consistencia

* El contenido

* El uso indebido de plugins

* El tamaño del tipo de letra 

 5. Del mismo autor del libro anterior, Homepage Usability está basado especialmente en el diseño y la usabilidad de las páginas principales o páginas Home de un sitio web. El libro permite al usuario un mejor acercamiento al tema de la usabilidad, por medio del análisis de páginas iniciales de 50 sitios web.

6. The Elements of User Experience, libro de Jesse James Garrett, explica el papel que desempeñan los responsables de la producción de un sitio web grande, y la relación que existe entre la estrategia de negocios, el diseño, y la producción.

7. Paper Prototyping, de Carolyn Snyder desarrolla como tema principal las pruebas de usabilidad de sitios web e interfaces interactivas utilizando prototipos en papel en etapas tempranas del diseño. De esta manera, los diseños en papel pueden ser validados por usuarios finales potenciales, antes de dar inicio al diseño real y final.

Analizando Kelloggs.com.co

Jerarquización de la página

Al analizar la página www.kelloggs.com.co se puede obtener la siguiente estructura que indica como está jerarquizada la página:

La jerarquía presenta una amplitud de 6 categorías y una profundidad de 4 niveles. 

Otra manera de ver la organización o jerarquía de la página es a través de una lluvia de ideas o mapa mental:

Aspectos Positivos

+ La página presenta una buena identidad corporativa. Desde cualquier punto del sitio, se tiene siempre el logo de Kellogg's y su línea de productos:

Además, al ser los productos lo que los usuarios conocen, es bastante positivo tenerlos a la vista desde el principio. 

+ Encuentro bastante positiva la categorización que hacen en la sección de Hoja de Vida, de acuerdo al perfil del interesado. Para un usuario es muy fácil poder ubicar en que parte debe registrar su hoja de vida para aplicar a algún empleo, no sólo por la división realizada sino además, por la pequeña descripción que realizan: 

Aspectos Negativos

- La página presenta algunas imágenes que parecen indicar un link, pero que no tienen ningún enlace, son simplemente imágenes:

En el caso de "Términos y Condiciones", hace parecer como si la página estuviera sin terminar. De la misma manera en la zona en que dice "Nutrición Kellogg's", pues pareciera como si invitara al usuario a hacer click cuando dice: "Conoce todo lo que te pueden dar los cereales Kellogg's". 

- Los aspectos generales de la empresa, como la Misión, la Visión, los Valores, etc, no deberían estar en una sección llamada "Trabaja con Nosotros". Si un usuario desea conocer estos detalles, es probable que no los encuentre si no está buscando como trabajar en la empresa. Posiblemente estos datos fueron agrupados con los datos laborales, para evitar crecer el sitio en amplitud. Sin embargo, si ese fuera el caso, sería recomendable tener otro nombre para la categoría, como tal vez: simplemente: "Nosotros" o "Conócenos". Además, creo que sería conveniente indicar al menos en donde se encuentran localizados, ya que si es una categoría para aquellas personas que quieren trabajar en la empresa, lo mínimo que deberían saber es donde se encuentra.