Necesitaban tener un sitio donde podrían publicar sus actividades, eventos, galerías y pudieran comentar sobre sus publicaciones. Uno de los principales desafíos fue crear esa capa de filtrado de comentarios, pues JCLV necesitaba tener cierto grado de control en los comentarios (nombres reales y no alías) pues sus temas son de ámbito social.

La forma más obvia era registrar a los usuarios, pero como ustedes saben; eso de registrarse es tedioso. Wordpress tiene una opción de registro de 2 campos, correo y alias. Una buena opción, un punto muy importante es saber que nuestro grupo objetivo ronda entre los 13 a los 35 años; por lo que se optó por utilizar el API de Facebook llamado Facebook Connect. Donde se utiliza el usuario y contraseña de Facebook para recopilar los datos que necesitamos: Nombre, Apellido y Fotografía.

El UI (user interface) debía ser intuitiva y sobre todo, atractiva y usable. Utilicé la línea del logo para crear un sitio muy dinamico con colores y abarcar todos los puntos importantes (que eran varios) de la mejor forma.

Dando como resultado final un sitio de calidad mundial, que no solo ha sido el que más han reconocido, pero más importante que eso es saber que si está dando el resultado esperado.

Mi trabajo consistió:

• Estudiar el caso y crear una línea de producto
• Diseñar la interfaz
• Maquetar e implementar
• Promocionar el sitio

Puedes ver el sitio visitando su url: www.jovenescontralaviolencia.org

Universidad de San Carlos de Guatemala

Validación de markup | css | accesibilidad

A mi parecer, el ancho del sitio está bien, sin embargo está hecho con tablas. Solo le quita muchos puntos, sabemos que tablas = tabular datos. Es interesante que el menú principal está hecho con flash, no entiendo ¿por qué? Normalmente al menos hay una animación por algún lado, lo que veo es hover que se puede hacer fácilmente con css.

Tiene breadcrums, eso es bueno; lastimosamente el buscador es un custom search de Google que me saca a otra ventana.  Eso sí, tienen ordenado el sitio pues encontré un mapa de sitio que me muestra la estructura del mismo.

Universidad Galileo

Validación de markup | css | accesibilidad

Aquí empiezo por darme cuenta que no tiene DOCTYPE, y también define una codificación UTF-8 en el header y luego en el meta la define como ISO-8859-1, esto puede causar un poco de problemillas con los exploradores.

Fuera de eso el sitio también está hecho en tablas. Lo bueno es que el menú no es flash y aún que las imágenes no tienen alt, ya es poco probable encontrar exploradores que no lean imágenes. A pesar que el búscador tiene problemas, la información del contenido la presentan de forma ordenada, eso es bueno y también tienen un sidebar con información relevante. El diseño está muy cuadrado, se pueden jugar con las figuras geométricas sin perder la seriedad de la institución. Además utliza url’s amigables con los búscadores.

Lo bueno es que utilizan RSS para mantener actualizados a sus suscriptores en diferentes áreas.

Universidad Rafael Landívar

Validación de markup | css | accesibilidad

Veo en la URL, un diseño de los 90′ cuando todo lo cuadrado estaba de moda, si embargo ya utilizan javascript para un acordeón para el menú. Además utilizan divs (aunque no tableless). Me gusta mucho que utilicen thumbnails para mostrar las noticias y también la imagen principal. ¡También utilizan twitter!

También  tienen breadcrumbs, un punto a favor por ser sitios con mucha información. La verdad no está tan mal trabajo, pues también en las páginas internas utilizan una imagen principal que le da una mejor cara.

Universidad Rural

Validación de markup | css | accesibilidad

No tengo mucho que decir con este sitio, pues están con el concepto de la web, donde un logotipo volando y un contador eran la moda. Pienso que deberían re-organizar su menú y también chequear su compatibilidad en firefox y luego en internet explorer. Además de maquetar el sitio con div’s y no tablas.

Universidad San Pablo de Guatemala

Validación de markup | css | accesibilidad

Es increíble que aunque nunca haya escuchado de esta universidad (que no existe físicamente) aprobó las 2 validaciones; de markup y css. Además de un bonito diseño, ya está utilizando tecnologías open-source, pues utiliza Joomla!. A mi parece tiene un diseño coherente y despliega la información de una forma ordenada.

Universidad del Valle de Guatemala

Validación de markup | css (no aplica) | accesibilidad

Primero aclararé que la UVG no aplica a el validado de css puesto que no tiene alguna hoja de estilos; en pocas palabras, malo. Al ver este sitio se me viene una ironía pues, siendo ellos los representantes ante la ICANN, tienen un sitio feo y además es prácticamente solo imágenes. Pienso el webmaster debería empeñarse un poco más en mostrar una buena cara para esta institución. El RSS no sirve, un rediseño total sería bueno.

Universidad Mariano Gálvez de Guatemala

Validación de markup | css | accesibilidad

A decir verdad, el sitio de la UMG es uno de los mejores en los que he visto, sin embargo no veo un diseño inteligente. No se si su prioridad sea informar a los estudiantes o captar. Supongo que están enfocados a los estudiantes matriculados, no pienso que sea una buena idea tener el menú principal como menú de pie. El banner hace bien mostrando la información relevante. En general es sitio cumple con lo necesario.

Universidad Francisco Marroquin

Validación de markup | css | accesibilidad

Debo decir que es el mejor sitio entre las universidades. Me agrada el espacio entre los objetos y las tres columnas para la página principal.  Tiene breadcrumbs, además de un menú facil y a pesar que casi todas las secciones están en sub-dominios me agrada el minimalista.

Universidad del Istmo

Validación de markup | css | accesibilidad

La Unis es otra universidad que no tiene un mal diseño, está bien utilizado el buscador personalizado de Google (con iframe). Un gran error, es el menú; pues son imágenes con un texto con Lucida Sans, una fuente que casi todas las máquinas tienen. El contenido está distribuido de forma ordenada y a pesar que hay un problema con los márgenes y paddings, el sitio esta bien.

Porque un café querría tener un sitio web, la gente no va a entrar a un sitio web para ver café es mejor ir a ver que hay, además no van a comprar un café en línea — no es literal pero esa es la idea.

¿Porque alguien se interesaría en un sitio web?

Dependiendo del sector empresarial me dirán muchos, si, pero al final es uno el objetivo; obtener más ingresos por la inversión. Con ello, no quiero decir que el sitio me va a vender como medio directo, sino que más que vender me va a crear la necesidad en el caso más básico.

Es por eso que hay que recibir/brindar una buena asesoría, mostrándo soluciones a procesos no tan eficientes en la comunicación cliente – empresa y desarrollar ideas para facilitar el medio; de modo que se podría mejorar notablemente las ventas.

La gente dice: quien no tiene sitio web en estos días es como que no existiera. Si existe, sino como hay tanta empresa. Yo digo: quien no tiene una presencia web estratégica, está perdiendo una gran oportunidad de incrementar sus ganancias.

No solo es de tener un sitio web para cumplir con lo que dicen, es tener presencia en línea para facilitar la compra o adquisición de un algo.

Entre los beneficios que podemos encontrar al tener una buena presencia web están:

• Mayor alcance, pues la web no se limita a fronteras o idiomas
• Brindar un medio más efectivo entre el cliente-empresa
• Conocer más al consumidor, para poder brindarle un producto/servicio que realmente necesita
• Vender desde el sitio
• Informar y motivar a la compra, facilitando información para convencer a nuestro visitante que será una buena inversión
• Como medio de publicidad

Un sitio no hace todo el trabajo

No es que al tener un sitio web, automáticamente voy a tener más ingresos. Está la parte de creación de sitio web que implica muchas áreas como UX, SEO, usabilidad, accesibilidad, en sí, saber utilizar las herramientas, entre otras cosas más. Después de la creación de un sitio web, lo que hace exitoso el hacer buen uso del sitio, trabajo que hace tanto el desarrollador como el usuario (cliente) conjuntamente. A este momento, dirás y entonces porque esta  empresa que tiene mucha experiencia en la creación de sitios web no  me ha brindado los resultados que quiero, entre las tareas a cumplir para que un sitio sea exitos están:

• Actualizar el sitio constantemente, un blog de la empresa (donde se hablen temas de interés para el visitante) es un buen ejemplo
• Tener un portafolio (en caso de ofrecer un servicio) o un catálogo (al ofrecer un producto) que se actualice igual
• Que el sitio sea un medio de dos vías, ofreciendo la opción de poder opinar en el servicio/producto.

El tener presencia en línea es un punto a favor

Como dije anteriormente, saber manejar la marca es primordial para tener éxito. La persona que maneje nuestra marca debe saber que hace, y no siempre lo más barato es mejor; el éxito se mide en resultados, no en el precio.

Buscar formas alternativas de promover su negocio, la web tiene cada vez más penetración en la sociedad, a tal punto que nuestro grupo objetivo estará inverso en este medio en poco tiempo, sino es que ya lo hace.

Si no ha tenido los resultados esperados, es porque una pieza del rompecabezas falta o no está en su lugar.

Usando el ejemplo del café

Ahora yo digo, ok… antes de ver el menú, ¿Sabes que venden además de cafés? No del todo, un área que podemos trabajar. Podemos brindar una sección del menú para que los visitantes conozcan la variedad de platillos que brinda un “café”, porqué al ver el menú y unos mantelitos que nos dieron, venden desayunos, almuerzo y helados de sabores que no en todos los lugares hay.

Además de crear la ansiedad de conocer y saborear la comida de dicho café vendiendo el sabor por medio de información fácil de digerir y fotografías que nos hagan imaginar el sabor. Además por ser una empresa con varias sucursales, yo no sabía que allí había una ellas, pues estaba en la Roosevelt e iba a ir a Oakland mall cuando me dí cuenta que en galerías Primma había uno (no voy a decir el nombre), podría también colocar las ubicaciones o brindar una búsqueda para encontrar la sucursal más cerca.

Además poder registrar miembros y brindarles ofertas especiales, al mismo tiempo que promociono mis nuevos platillos. Además se me ocurre que podemos crear encuestas (polls) para saber que platillo (nuevo) podría dar mayor impacto.

Como dije, un medio de dos vías, es muy bueno tener feedback, así podría saber que piensa la gente de mi empresa y si los restaurantes (alías, cafés) están atendiendo a mis clientes. Y si ofrezco servicio de fiestas privadas (implementarlo) para poder reservar lugares en fecha especiales.

Las versiones anteriores

Tal vez se preguntarán en donde están las demás versiones de mi blog. Les contaré un poco de ese asunto. Empecé mi blog este año, sin embargo lo tenía pensado para estas fecha, compré el dominio y lo coloqué en mi hosting (en ese tiempo Hostgator).

Luego de eso, la primera versión de mi sitio era un poco café, y recuerdo que para ese tiempo tenía aproximadamente 50 mensuales (20 mías, 20 de mis amigos y las otras 10 eran de milagro). No pasó más de un mes para que cambiara a la siguiente versión, pues veía muchos inconvenientes en cuanto a estar haciendo hojas de estilo para IE y estar componiendo los errores, todo porque estaba empezando con el CSS y las sombras (sin png’s por IE 6).

Mi segunda versión ya no tenía sombras o texturas en el fondo (por eso del IE 6) y la verdad estaba muy dinámico, pero no llenaba mis expectativas. Necesitaba un espacio para expresarme y colocar mis proyectos de manera eficiente (en esas fechas no tenías clientes).

Escribí mi tutorial de 960 gs, el cual subió mis visitas a 50 diarias, ¡para mi era un logro!

Versión 3

Así es como nació la 3era versión de mi sitio (la gris, que todos conocen). Integré mis conocimientos, ya más maduros y también las habilidades. Para crear ese blog, me sentía (aún lo hago) de que mi blog, con nos más de 4 meses en la web, estuviera en CSS Manía.

¡Era impresionante! Ya tenía 150 visitas diarias, generadas por los artículos que había escrito y con ellos también clientes y cotizaciones. Para mi era increíble que sin tener una gran portafolio podía tener clientes y poder empezar a vivir de las comisiones ganadas en cada uno de los proyectos que tenía.

La demás historia en está en npixels estudio, mi estudio web.

Versión 4 y lo nuevo

Para esta versión, hice una transición de lo dinámico a lo minimalista, pues la objetivo de mi sitio es transmitir mis ideas, comentarios y mostrar mis proyectos. Deseo que los artículos que lean tengan un objeto, ayudar.

No tengo años de experiencia, ni miles de proyectos. Pero a lo largo de mis dos años en la web, puedo decir que he aprendido muchísimo. Conocimiento que en verdad deseo compartir.

Espero que les guste el nuevo diseño, debo decir que aún está en versión beta, tengo que agregar unas imágenes y ver si tiene más de algún bug (que en estos días estaré corrigiendo).

¡Gracias por visitarme y cualquier cosa aquí estoy! Por el momento aún no configuro mi formulario de contacto, puedes mandarme un correo a jepsersk8[at]gmail[dot]com.

¡Éxitos!

Realmente vemos con este rediseño, lo mal que están tanto las personas que asesoran el proyecto (desarrolladores) como el cliente (el periódico). Es un buen ejemplo para saber que NO hacer, pues, cuando las tendencias van a diseño tipo revista para sitios que tienen mucho contenido, ellos decidieron ir por Flex de Abobe.

Accesibiliad y usabilidad

Primero hagamos una prueba con el famoso wave, medidor de accesibilidad en un sitio.

Pero lastimosamente tiene un error de accesibilidad… ¡No tiene nada! Revisando el código (que no es mucho). Me encontré con lo siguiente:

• No tiene etiqueta <title></title>
• No tiene declarado el tipo de documento DTD
• No tiene embebido el flash de una manera correcta
• No entiendo porque tienen dos scripts de Google analytics dentro del sitio, y supongo que el swf le pasa las variables de url y visitas para poder tener estadísticas reales y conscisas

Luego que espero un buen rato para que cargue, en la página principal veo información relevante; que, en un tiempo estuviera en xhtml/css podría ser bueno.

No entiendo por que tengo 3 barritas de desplazamiento vertical, es decir, el del navegador y unos botoncitos para poder navergar en la noticia. Creo que hacer que el usuario haga tantos clicks para poder navegar ¡es atróz! No tiene opción de dejar el click y que empiece a bajar, sino que por clicks.

Le doy click a Nacional y tengo lo mismo que en portada, ¿será contenido duplicado?  jeje

Al leer un artículo, me encuentro que los encabezados son del mismo tamaño que el contenido. No creo que eso sea bueno para distiguir en una buena lectura, subtemas. Además no pude terminar de leer pues el scroll de los botoncitos no se quedó a medias.

En la sección de Contáctanos, solo pulsé Enviar y el formulario se envió… No tenía validadores.

Intenté buscar algo, ¡pero sorpresa! No tiene botón para buscar y presionar la tecla enter, no funcionó.

Si la interactividad es uno de los objetivos del sitio, ¿Porqué no se puede opinar?

En suscripciones no sirven los scrolls, mal porque quería saber que había abajo. Otro bug que encontré sin querer fue el cambiar de suscripciones a otra sección, siendo este el resultado (una sobreposición):

En fín puede que hayan más cositas allí por arreglar.

Mi opinión

A mi parecer (como Oscar Mota también dijo), es un paso hacia atrás (más bien 100). Un medio masivo de información no se puede dar el lujo de cometer tan grandes errores, y el problema fue o del asesor tecnológico que encontró un nuevo juguetito flex y lo vendió a el encargado de tecnología que no sabe nada sobre usabilidad y accesibilidad. Pues el sitio no tiene RSS, una forma muy efectiva de publicar contenidos y notificar a los suscritos. Así también el social media.

Más que hacerlo en Flex, veo deficiencia en el trabajo final. Pues con los errores que encontré (y solo navegué por unos 5 minutos) ya no me dan ganas de regresar, imaginen a las personas que son regulares lectores en la red de este periódico.

Se puede regresar y componer el error, ¿como? Para eso sirven los CMS. El diseño no está mal, y es por eso que pueden rescatar tremendo desastre. Talvez soy un poco cruel, pero creanme, y disculpas si el que hizo el sitio lee esto. Pero donde cabe hacer una “aplicación” con Flex, donde no se requiere. En fin, www.sigloxxi.com hizo una super mala inversión.

Actualización

Este screenshot fue generado en Firefox 3.5.3 para Mac, gracias a (Ignacio Sagone)

Si tienen algo más que agregar, solo escríbanme y lo colocamos por acá. La idea no es hecharles sal como se dice en mi país, sino que mostrar por que se hizo mal y pues como componerlo.