Muchas veces nos hemos topado con sitios web muy presentables que no ofrecen contenido relevante o son muy poco eficientes técnicamente (sitios desarrollados totalmente en flash), algunas otras con sitios web los cuales la eficiencia es tan buena que ni siquiera la tomamos en cuenta aun así su diseño deja mucho que desear (sitios web que funcionan solamente como foros), pero peor es el caso de los sitios en los cuales la presentación del contenido es tan saturada que nos perdemos en un mar de texto sin encontrar lo que realmente deseamos (portales web mal diseñados, msn.foxsports.com).

Si bien vemos un patrón acá, hay un tipo de sitio web que alguna vez hemos visitado el cual no necesita un moderno diseño grafico ni tampoco la tecnología mas avanzada en procesamiento y manipulación de información para llegar a su publico especifico una vez el visitante entro al sitio (www.google.com) y son estos los modelos a seguir.

En otros artículos tocaremos cada uno de estos temas (desarrollo flash, portales web, etc), por ahora nos enfocaremos en que es lo mas importante al realizar un sitio web.

Existen 3 factores que debemos priorizar al desarrollar un sitio web:

• comunicación
• diseño
• tecnología

En muchas ocasiones podemos observar de manera directa si la empresa o equipo desarrollador esta influenciado en su mayoría por diseñadores gráficos, desarrolladores web (ingenieros, programadores, etc) o publicistas. Solo hace falta observar mas allá en cada sitio para poder ver este tipo estas influencias.

Por ende los diseñadores gráficos desean que el sitio web tenga la mejor presentación posible, sin importar la tecnología que se use, la cantidad de imágenes, si es totalmente desarrollado en flash o incluso sacrificando la cantidad y calidad del contenido que aparece.

Por otro lado los desarrolladores se preocupan por la eficiencia, desean reducir la cantidad de imágenes, saturan de javascript “para mejorar el rendimiento”, prefieren que se despliegue HTML puro y normalmente usan CSS aplicando solamente colores (ni siquiera usan la teoría de los colores) y diagramación básica, muchas veces los sitios no poseen un mínimo rastro de diseño.

Y por último, pero no menos importante, están los publicistas quienes tienen una mejor idea de que es lo que se desea hacer pero no saben utilizar las herramientas o a veces el concepto web les parece algo muy nuevo e irrelevante.

La comunicación

Si bien los elementos que mencionamos anteriormente pueden asignarse a cada uno de estos grupos, vemos que sobre todos los aspectos la comunicación es la más importante de todas.

El hecho que un visitante entre a nuestro sitio web y de inmediato conozca el objetivo de nuestra organización o empresa lo incita e buscar mas sobre nuestra labor, lo importante es transmitir claramente el mensaje, haciéndole ver que es lo que hacemos y que obtendrá de nuestra información.

Uno de los problemas mas básicos al desarrollar un sitio web es cuando el equipo desarrollado da poca importancia en resaltar los servicios o productos de una empresa o los relega a una sección insignificante de la portada (inicio, homepage, etc), estos son parte primordial de lo que se desea transmitir a un cliente potencial, si bien la historia, misión, visión, personal y demás información son necesarios, es mucho mas importante dar a conocer nuestros servicios o productos, o bien al tratarse de un sitio no comercial dar a conocer cual es el objetivo de nuestra organización de manera clara y concisa, esto lo logramos simplificando y mejorando la calidad de nuestro contenido.

Al desarrollar un sitio web el contenido es una de las cosas mas importantes en organizar y estructurar, no solo para transmitir el mensaje mas claro sino que de ahí parten o se nos facilitan aspectos esenciales del diseño, tales como la usuabilidad (no existe la palabra en español pero viene del ingles usability) que es la capacidad de las interfaces de datos y navegación en el sitio sean de uso fácil a los usuarios (user-friendly), e incluso la visibilidad, que se refiere a que el sitio debe ser fácil de encontrar por los motores de búsqueda (search-engines) y publicidad externa.

En el caso de la usabilidad, notamos que una buena estructuración y presentación del contenido hace mas fácil su acceso y por consiguiente disminuye la cantidad de menús y enlaces (links) necesarios en una pagina para que el usuario acceda a esta.

Siguiendo con nuestro ejemplo de productos y servicios, si en el menú principal ponemos un enlace que con la palabra “Servicios” o “Productos”, al ingresar nuestros visitantes en busca de nuestros servicios o productos llamará su atención inmediatamente he irán hacia ese enlace, el cual proveerá 2 opciones, un menú desplegable (es importante que sea no mas de un nivel) con las categorías o bien un acceso directo hacia una sección dedicada a nuestros servicio o productos.

Para el caso de la visibilidad nos ayuda mucho para una optimización orgánica ha motores de búsqueda (organic SEO),  esto lo hablaremos en otro articulo.

El diseño

Si bien un buen diseño atrae clientes, el abuso de este puede alejarlos, o bien no atraer al público deseado, esto último se aprecia fácilmente cuando encontramos un sitio web muy bien diseñado que atrae más a diseñadores gráficos que buscan inspiración que a clientes potenciales, por supuesto que cualquier persona es un cliente potencial o publico deseado pero lo mas importante es atraer una mayoría que aumente nuestra ventas o trafico.

En el diseño siempre tenemos que ver que es lo que le interesa más al cliente y sobre todo siempre asesorarlo pero no imponer nuestras ideas, algunos clientes saben lo que quieren ver en su pagina pero no tiene las palabras para expresarlo, debemos priorizar características (como colores) que resalten su imagen y no distraigan a los visitantes del contenido presentado. Algunos diseñadores integra los colores que posee el logo de la organización o empresa, no existen reglas exactas ya que muchos contrastes son siempre bienvenidos y la utilización de colores fuera del rango es permitida manteniendo siempre una atmósfera de armonía en el diseño al ingresar al sitio.

Por supuesto esta la conocida teoría de los colores, para aquellos que el diseño no es fuerte, o bien la inspiración en otros sitios siempre es la mejor aliada. Algo muy importante que cabe mencionar es “un diseñador grafico no es un diseñador grafico web”, la web es algo relativamente nuevo y el diseño grafico web es algo que se remarca en pocas universidades, por lo que la experiencia de un diseñador grafico en este campo siempre se adquiere (como muchas cosas) a través de la practica constante, atreverse y asimilar nuevas ideas.

Pero siempre existe la capacidad de sorprender en el diseño, y para muestra un botón, he aquí algunos sitios web con colores muy atrevidos que logran una armonía muy radical:

albertlo.com	casioexilimlab.com	cottonseedoiltour.com
dadan.net	designdisease.com	dimchevski.com
drewwilson.com	ndesign-studio.com	macalicious.com
mediconmedia.no

Tecnología

Es básicamente la base de todo esto, sin lenguajes (HTML, XML, CSS, Javascript, Actionscript, etc,), protocolos (HTTP, FTP, TCP, IP, etc) y tecnologías de transmisión (Wifi, LAN, WiMax, etc) no existiera la web.

Ahora bien, ¿cuanto ha avanzado y cuantos de estos avances hemos aprovechado? Existen muchas empresas, equipos de personas y personas particulares que desarrollan páginas a la antigua… ¿y esto es?... paginas web a partir de cero.

Entran los CMS

Hoy en día existen los llamados sistemas de gestión de contenido (CMS, del ingles Content Management System) en el mercado, muchos sin costo alguno y algunos otros con cuotas mensuales (por el soporte) o precios fijos, además de todo esto existen en cualquier lenguaje que dominemos desde PHP, TCL, Perl, Python, Java, ASP, la familia .NET,  etc.

El objetivo de un CMS es que permite crear una estructura de soporte (framework) para la creación y administración de contenidos, principalmente en páginas web, por parte de los participantes. Nos da la capacidad de poder gestionar, crear, editar, borrar, buscar y publicar diferentes tipos de medios digitales y texto electrónico (contenido en general).

Es posible clasificarlos en base a tipo de sitio que permiten gestionar, aun así no entraremos en estos detalles, si desean adentrarse un poco mas lean el artículo en wikipedia que es bastante sencillo e informativo: Sistema de gestión de contenido.

Una característica muy importante de un CMS es la estructura de soporte (framework) detrás de el, ya que a través de esto puede expandirse agregando distintas extensiones (gratuitas o pagadas), mejorando funcionalidad, usabilidad y visibilidad de nuestro sitio web.

En muchas ocasiones poseen un sistema de usuarios que puede permite gestionar el acceso al contenido dentro de nuestra pagina a diferentes niveles y por si fuera poco todo esto integrado en una consola de administración.

Algunos CMS tienen la capacidad de dividir la administración del sistema de la publicación de contenido. Los creadores de contenido publican sus documentos en el sistema. Los editores comentan, aceptan o rechazan los documentos, lo que permite una estructuración mas clara y eficiente de todo nuestro sitio web, además facilita las actualizaciones.

Una de sus desventajas es que el dominio de CMS posee cierto camino de aprendizaje, en lo personal lo veo como más como una ventaja, pero para algunos tratar de entender su funcionamiento puede frustarlos y abandonar su uso, como consejo les puedo decir que la paciencia, investigar, leer y buscar en la web puede ayudarles a mejorar su funcionamiento.

CSS (Cascade Style Sheet)

Uno de los mejores avances que se dieron en el desarrollo web, fue el de separar la presentación del lenguaje que genera la pagina web (markup language). Mediante el uso de CSS podemos dar apariencia, color, estructura y mucho mas a nuestro sitio, en un archivo separado haciéndolo mas claro y fácil de actualizar.

Algo muy importante al utilizar CSS es el uso de los estándares de notación, Firefox e Internet Explorer poseen características únicas (filtros, transparencias, etc) que pueden ser accedidas median CSS pero que se vuelven obsoletas o de uso innecesario en otros navegadores, algunas veces la combinación de imágenes optimizadas y propiedades en CSS pueden darnos el efecto que queremos.  Como mencionamos en la parte de diseño el abuso de imágenes en el diseño puede llevarnos a un rendimiento pobre de nuestro sitio web.

Javascript

Uno de los mejores aliados en el desarrollo web ha sido Javascript, desde su creación por Netscape en 1995, ha evolucionado y expandido creando muchas aplicaciones muy útiles, desde librerías que permiten el desarrollo de animaciones sin la necesidad de Adobe Flash, interacción con tecnología AJAX, manejo de eventos, manipulación del código HTML y CSS sobre la marcha (on the fly), entre muchas otras cosas.

Un aspecto muy importante es que Javascript es un lenguaje interpretado y orientado a objetos que se  ejecuta del lado del cliente y no del servidor, esto siempre debemos tenerlo en cuenta al desarrollar un sitio web, ya que algunos cafés Internet y empresas han desactivado esta herramienta para evitar infecciones de virus u otras amenazas que este posea, además existen navegadores que no tienen implementado Javascript.

Algunos pensaran que esto no es posible dada la tendencia del desarrollo tecnológico actual, pero todavía existen muchas computadoras de modelos antiguos funcionando (sobre todo las que se donan),  dispositivos (como celulares) que solo traen las funciones básicas de navegación y sistemas operativos sin interfase grafica (SUNOS sin Solaris instalado o bien cualquier conexión hiperterminal).

De igual manera siempre debemos planear la forma en que el sistema se adapte al usuario al no encontrar estos componentes, ahí es donde entra una técnica conocida como Graceful Degradation, la cual hablaremos en otro articulo.

Existen otras tecnologías que por tamaño del articulo no hablaremos, pero de las cuales nos estaremos refiriendo en próximamente.

¿Y en que concluimos?

El diseño y desarrollo de sitios web venido del típico “yo conozco el hijo de un amigo que es bueno para computadoras”; que realmente se traduce que sabe usar servicios de red social (facebook, hi5, etc), mensajería instantánea (MSN, Skype, etc) y que posiblemente estudia ingeniería en sistemas o diseño grafico… o eso dice en su casa; y ha llegado a especializarse tomando ideas de múltiples disciplinas, tales como animación, diseño de comunicación, derecho de autor, identidad corporativa, diseño grafico, interacción con el diseño, interfaces de usuario, arquitectura de la información, fotografia, SEO (Search Engine Optimization), tipografía, entre otros, durante este artículo simplemente las agrupamos en comunicación, diseño y tecnología para hacer la comprensión mas sencilla.

Si vemos, hacer una pagina web es relativamente sencillo, por lo que nadie puede quedarse afuera y no intentarlo nunca, ahora bien la diferencia esta en hacerla rentable. Como hemos visto un balance entre comunicación, diseño y tecnología crea un sitio que cumple con las expectativas de los clientes (que es lo más importante), disminuye la carga de labores y las reparte de manera eficiente, promueve la creatividad sin imponer caprichos ostentosos y sobre todo presenta a los visitantes del sitio el contenido de manera efectiva y directa, ya que un visitante con una idea clara sobre nosotros es un cliente potencial.

Fuentes:

http://en.wikipedia.org/wiki/Web_design

http://www.tmtbox.com/32-examples-of-websites-with-a-brave-colour-scheme

CMS

http://en.wikipedia.org/wiki/List_of_content_management_systems#Free_and_open_source_software

CSS

http://www.csszengarden.com/

Javascript Frameworks y Librerias

http://en.wikipedia.org/wiki/Comparison_of_JavaScript_frameworks