Esta es probablemente la pregunta del millón, la pregunta que todos los clientes se hacen y que más desconcierta a veces. Quiero pedir presupuesto y no se si me van a cobrar 4000€ o me van a pagar por hacérmela.

En el fondo esta pregunta no es tan complicada: a la pregunta ¿cuanto vale un coche? todos sabemos qué contestar: depende, ¿de qué? pues del diseño, de las prestaciones, de la marca, de la robustez, de la durabilidad, de los extras…pues exactamente lo mismo se puede aplicar a una página web con un único pero: una web es algo inmaterial por lo que sólo se cobra por el tiempo dedicado al diseño y por el tiempo dedicado a conocer las tecnologías apropiadas para aplicarlas a ese diseño.

-”Ya pero, yo se si un coche es bueno o no, todos entendemos de coches pero de una web no puedo saber si es buena porque no entiendo”.

¿O quizás si entiendes? Volviendo al símil de los coches, todos opinamos sin tener profundos conocimientos de mecánica, no sabemos como funciona la inyección variable pero si disfrutamos cuando apretamos el acelerador y el coche responde con consumos moderados. La función final de una web debe ser mejorar la experiencia de nuestro visitante, facilitando el acceso a los contenidos e intentando que el tiempo que navegue en nuestro sitio suponga una experiencia lo más agradable posible. Con estos criterios en mente todos podemos saber si una web es un “Mercedes” o un “Kia” sin necesidad de ser expertos.

En lo que respecta al precio debemos de partir de una máxima a veces poco intuitiva y que es la que conduce a muchos clientes a confusiones:

Lo bueno, por muy sencillo que parezca y, a veces, precisamente por su sencillez, lleva tiempo. Y el tiempo vale dinero.

Cuando vemos que dentro de una página nos encontramos bien, los textos se leen perfectamente, la información está bien organizada, los colores no son estridentes, las animaciones tienen su razón de ser, las imágenes cargan rápidamente, no lo dudes: detrás de esa sencillez aparente hay mucho trabajo.

Siguiendo con nuestro paralelismo automovilístico estas serían las cualidades a tener en cuenta a la hora de valorar la calidad, y por tanto el precio, de una página web:

• Diseño gráfico: Existen gigantescas bases de datos de iconos, fondos, texturas etc… que reducen mucho el tiempo dedicado a diseñar una web. Sin embargo, la utilización de prefabricados despersonaliza la web, la hace (aunque el usuario no lo sepa) parecida a muchas y hace más difícil transmitir una imagen de marca fiel. No hace falta decir que personalizar/diseñar estos elementos lleva tiempo… y dinero.
• Accesibilidad y usabilidad: Estos dos conceptos indican la capacidad de una web para ser visualizada por personas o dispositivos con alguna deficiencia física o técnica. Una web accesible lleva más tiempo que una poco accesible, por ej: una animación Flash sin contenido alternativo en un menú provocará que el usuario que navegue sin Flash o a través de un dispositivo incompatible con Flash no pueda ver la página. Crear un contenido alternativo lleva tiempo… y dinero.
• Tipografía: Detrás de una web legible se esconden pruebas de tipografía. La aplicación de nuevas tecnologías (CSS3) hace posible utilizar fuentes ilimitadas a la hora de crear una web pero precisamente eso hace de la elección de una tipografía correcta un proceso más largo que en la época de las “fuentes seguras”.
• Programación: Quizá esta sea la cualidad más complicada de percibir y en la que hace falta un poco de confianza en el desarrollador de la web: cuando en unos años alguien quiera hacer alguna modificación en la web va a depender de la limpieza del codigo, de la organización, de los comentarios etc.. que dicha modificación sea un proceso sencillo o que directamente sea un proceso imposible que haga más fácil crear la página desde cero.
• Compatibilidad con navegadores y dispositivos: Puede que cambie en el futuro pero, a día de hoy, crear una web que sea compatible con todos los navegadores, incluyendo los “obsoletos al nacer” de la familia Explorer lleva entre un 20% y un 40% del tiempo total dedicado al diseño. Si además nos preocupamos de que la página se vea correctamente en nuevos dispositivos como tablets, teléfonos móviles etc el tiempo dedicado aumenta… y por consiguiente el precio.

Money money money money… vale pero ¿cuanto?

Si has leído y asimilado lo expuesto hasta aquí simplemente te voy a dar tres franjas de precios y voy a dejar al sentido común identificar que cualidades de las anteriormente expuestas va a tener cada una:

• 300€ me la hace un amigo/primo/amigo de primo/amigo de mi hermano/conocido.
• 400-1000
• 1100-3000

No tengo nada contra las páginas del primer punto. Yo también a veces hago alguna. Tienen su razón de ser pero no se puede pedir…donde no hay.

A partir del segundo punto, dependiendo de la complejidad, numero de secciones, textos, imágenes, animaciones etc… podemos empezar a encontrar buenos trabajos que reunan alguna de las cualidades citadas antes.

Ahora bien: una pagina bien realizada intentando cumplir con todo lo anteriormente dicho debería estar, dependiendo de lo complejo de la misma, dentro de la horquilla del tercer punto. Aunque solo sea por el tiempo dedicado a ella, debería estar ahí.

Si piensas que se puede conseguir una página de la gama 3 al precio de la gama 1 no te preocupes. Hay quien sigue pensando que un BMW o un Mercedes solo son buenos porque son caros y en el fondo todos los coches son más o menos iguales.

El fenomeno de Internet Explorer algún día será estudiado por psicólogos y antropólogos y a alguna conclusión interesante llegarán sobre la naturaleza del ser humano. De momento nos tenemos que conformar con decir que el hecho de que la gente siga usando de forma masiva Internet Explorer y, sobre todo, que su uso sea superior en España que en el resto del mundo, dice muy poco en favor de nuestra raza y de nuestra etnia ibérica.

Los navegadores de la familia Explorer vienen siendo durante la última década en la que los avances en el desarrollo de estandars para la web ha sido espectaculares, un lastre para que dichos desarrollos se hayan implementado. Y cuando digo estandars para la web no quiero decir oscuras herramientas para que los diseñadores tengan la vida más fácil. Todos los estandars tienen la finalidad última de mejorar la experiencia de los usuarios finales de las webs que los diseñadores idean.

Se podría pensar que es un problema de nivel de desarrollo, los pobres están un poco retrasados,  pero viendo los gráficos de soporte de las últimas especificaciones (CSS3) observamos que incluso la versión 8 del Explorer sigue sin soportar la mayoría de las nuevas funcionalidades. Pensar que Microsoft no llega a integrar los estándares porque no puede es simplemente una estupidez.. Si no lo hace es porque no quiere. ¿Y porque puede alguien no querer que la web evolucione?

En mi opinión, y no es una opinión políticamente correcta, en todo este asunto hay algo de simple prepotencia:

No solo soy el dominador del mercado sino que lo soy con el peor producto del mercado y que vale lo mismo que todos los del mercado, o sea nada.

La verdad es que tiene que tener su morbo ver la cara que se le queda a tu competencia cuando arrasas haciendo conscientemente un producto peor. Que cada uno lo aplique al sector que quiera pero dudo mucho que exista un ejemplo tan surrealista en ninguno.

Y entonces ¿porqué la gente sigue con el Explorer?

El resto de navegadores, más rápidos, seguros, agradables, y que además permiten visualizar las páginas tal cual las idearon los diseñadores, son gratuítos. Instalar cualquiera de esos navegadores lleva aproximadamente 2 minutos de un proceso extremadamente sencillo, bastante más sencillo que crear una cuenta de correo electrónico. La interfaz de cualquiera de ellos es mucho más intuitiva que la del Explorer y acostumbrarse a ellos puede suponer para un usuario con nivel básico no más de dos horas de navegación. Y pese a ello la gente sigue utilizando el Explorer.

La asociación que se ha establecido entre IE e internet, al igual que la que existe entre Google e Internet está frenando la evolución de la misma Internet de forma escandalosa. Todos conocemos a alguien que en un momento dado nos dice, “quítame esa página y ponme google (queriendo decir “ponme internet”). De la misma manera la gente busca en los escritorios de los PC el icono de “Internet” es decir el de “Internet Explorer”.

Es verdad que el proceso se está invirtiendo. En muchos sitios IE está empezando a perder cuota de mercado en favor de mejores productos, en España también pero a un ritmo mucho más lento.. y es eso lo que da a entender que el uso de IE y el nivel decultura digital están íntimamente ligados. Donde existe una cultura web avanzada IE va perdiendo usuarios a marchas forzadas. De hecho, allí donde existe una cultura web ni siquiera el sistema operativo Windows (que incorpora IE) es predominante y el uso de otros sistemas operativos (Linux, MacOS, etc) crece a ritmos exponenciales.

Además, la navegación a través de dispositivos de última generación como tablets y smartphones, dispositivos que no incorporan mayoritariamente IE hace que se pueda mirar al futuro con un poco de esperanza y pensar que los días del “monopolio” están contados. De hecho, a día de hoy utilizar los más modernos estándares para optimizar webs en dispositivos móviles ya es una realidad.

Una de las primeras preguntas que se suele hacer a los clientes a la hora de comenzar con el diseño de una página web es la resolución de pantalla para la que la web debe estar optimizada.  Empezamos mejor dejando claro lo que es la resolución:

Debemos tener claros dos conceptos:

• Tenemos una configuración de pantalla que podemos personalizar y que fija los pixels que el monitor puede mostrar tanto horizontal como verticalmente. Es fácil comprobar la resolución que tiene establecida tu monitor: si entras en panel de control >>pantalla>>configuración verás que te aparecen unas opciones como estas:  800 x 600 1024 x 768 1280 x 960 etc.   El resultado dará un numero total de pixels que el monitor podrá mostrar.
• Aparte de esto, tenemos el tamaño que físicamente tiene el monitor tanto horizontal como verticalmente: este tamaño se suele medir en pulgadas (inches) que equivalen a 2,54cm.

Por lo tanto, resumiendo, tenemos: la medida física del monitor (en pulgadas) y los pixels que el monitor puede mostrar (en número). Pues bien, la resolución de pantalla va a ser el resultado de dividir los pixels entre las pulgadas dando lugar a los famosos ppp (pixels por pulgada) o ppi (pixels per inch). El resultado de la división para las medidas horizontales te saldrá aproximadamente igual al de las medidas verticales. Evidentemente cuanto mayor sea los ppp mejor será la calidad que percibimos. Los primeros PC tenían una resolución de 72 ppp, hoy en día los nuevos iPad tienen unos maginificos 132 ppp de resolución. Si cojes una regla y consultas que configuración de pantalla tienes establecida es muy fácil que saques la resolución de pantalla de tu monitor.

La resolución de pantalla y el ancho de la web

Ahora bien, en que influye todo esto a la hora de diseñar una página web. A decir verdad, la resolución no mucho. Cuanto mejor sea la resolución mejor será la calidad de imagen que tenga nuestro visitante pero eso no es algo que podamos controlar. Lo que si podemos controlar es el ancho y el alto en pixels que vamos a dar a nuestra web. Y de estos dos últimos el que nos importa es el ancho. Me explico:

Los usuarios están acostumbrados a tenerse que desplazar verticalmente dentro de una página web para ver los contenidos que no muestra completamente la pantalla, es algo habitual. Sin embargo lo que no está tan bien visto (mejor dicho, está muy mal visto) es tener que desplazarse horizontalmente para ver todo el contenido y eso es precisamente lo que ocurre cuando se navega con una configuración de pantalla inferior al tamaño en que se diseño la web. Si pruebas a poner tu monitor a los arcaicos 800 x 600 (alguno queda por ahí navegando a esa resolución) verás o mejor dicho no verás la mayoría de las páginas completamente en el navegador, tendrás que hacer scroll horizontal para ver todo el contenido.

Ahora pongámonos en el caso contrario: navegas con tu pantalla configurada a 1280 x 1024 y visualizas una web que está diseñada a 800 x 600. Bien, en este caso, lo único que ocurrirá es que veras unas bandas verticales o background correspondientes al espacio que le sobra a tu pantalla. Si bien esta situación no es ideal sí es admisible desde el punto de vista del usuario ya que prácticamente todos los navegadores tienen una opción para ampliar la página visualizada. Además, el fondo o background es fácilmente personalizable a la hora de diseñar la web por lo que puede ser incluso un elemento decorativo. Como ejemplo puedes ver esta pagina a más de 1024 y ver como el fondo puede ayudar a dar un toque distinto a tu página.

De acuerdo, hasta aquí todo bien, entonces ¿que tamaño, o más bien, que ancho debe tener mi web? . Si te fijas en el gráfico a 2010 había un insignificante 1% que navegaba con anchos de 800 px, una gran mayoría con anchos por encima de 1024 px pero todavía existe un 20% que tiene configurado un ancho de 1024. Es por eso que optimizar el diseño de una página a 1024 es hoy en día la práctica más habitual. Dentro de esta práctica, la realidad es que hay que dejar espacio para el scroll o barra de desplazamiento vertical del navegador y ésta, dependiendo de que navegador se trate, tiene anchos distintos. Por eso las páginas se suelen diseñar para anchos de aproximadamente 960 px dejando 64 px de espacio para la barra.; si esta es más estrecha, se verá un pequeño fragmento del fondo a los lados, lo cual no supone ningún problema.

Dicho esto, no es una ley fija que no se pueda violar: dependiendo del tipo de visitante es muy posible que el gráfico anterior no sea del todo exacto. Una web que mayoritariamente vea gente joven va a tener forzosamente un porcentaje superior de gente navegando con resoluciones altas (mejores equipos, más modernos, menos problemas de vista etc).

De igual manera, parecería estúpido optimizar una pagina al 1% decreciente de usuarios con 800 de ancho. Sin embargo, diseñar una página con 800 px bien centrada,siempre y cuando no necesite de espacio para mostrar mucho contenido puede resultar un recurso estilístico en determinadas circunstancias.

Por todo lo anterior es tan importante tener claro quienes van a ser nuestros potenciales visitantes y que perfil van a tener.

Dejamos para otra entrada las configuraciones para nuevos dispositivos: moviles, iPad, iPod, tablets etc.

Características del proyecto:

• Pagina corporativa de 6 pestañas.
• Cabecera animada en Flash.
• Menú de navegación mediante imágenes.
• Transmite la idea de cliente VIP requerida por la empersa..
• Pie de página con links externos.

Técnicas utilizadas:

Características del proyecto:

• Pagina corporativa de 6 pestañas.
• Menú animado mediante JavaScript.
• Slide Show de imagenes de la empresa.
• Sencilla, accesible y bien posicionada.
• El cliente sabe que producto se ofrece y como contactar.

Técnicas utilizadas:

Características del proyecto:

• Página personal con información curricular.
• Cabecera en Flash animada.
• Realizada en español e ingles.
• Videos insertados y galería animada con Javascript
• Sección de noticias auto-gestionable

Técnicas utilizadas:

Técnicas utilizadas:

Características del proyecto:

• Página diseñada integramente en Flash.
• Animaciones programadas en Actionscript3

Técnicas utilizadas:

Club Social Deportivo

Características del proyecto:

• Sitio corporativo con 7 secciones y para cada area de actividad cada una de las cuales cuenta con sus propias subsecciones.
• Menu animado mediante Flash con carrousel de imágenes actualizable desde archivo xml.
• Banner publicitario interactivo para los colaboradores de la empresa.
• Todos los contenidos Flash disponen de versión alternativa para facilitar el posicionamiento y el acceso desde dispositivos móviles que no soportan flash.
• Sección de noticias actualizable desde plataforma WordPress.

Técnicas utilizadas:

Características del proyecto:

• Pagina corporativa de 6 pestañas.
• Menú animado mediante JavaScript.
• Slide Show de imagenes de la empresa.
• Sencilla, accesible y bien posicionada.
• El cliente sabe que producto se ofrece y como contactar.

Técnicas utilizadas:

[ht] [js] [dw] [ps]

Club Deportivo de natacion y waterpolo

Características del proyecto:

• Sitio desarrollado íntegramente en la plataforma WordPress.
• El cliente es absolutamente autónomo para gestionar todas las secciones.
• Preparado para instalar widgets y plugins con facilidad.
• Cabecera facilmente personalizable por el cliente.
• Optimizada para buscadores.

Técnicas utilizadas: