¡Hola! Hoy toca volver a hablaros de desarrollo web y de cómo trabajamos en Ensalza.
No, no es un post de autobombo que ya sabéis que no nos gustan mucho. Simplemente me resulta más sencillo hablar (o más bien escribir) basándome en algo que conozco de primera mano en lugar de conceptos abstractos ¿no os pasa a vosotros también con vuestro blog?
Cada desarrollo web tiene sus fases y cada agencia de diseño tiene su forma de trabajar. Pero cada vez en más ocasiones nos encontramos con clientes con afirmaciones como estas:
- Tengo un amigo que sabe de esto y me ha dicho que es una cosa que se puede hacer bastante rápido.
- Me han dado presupuestos de 400€ y otros de 7.000€. ¿Cómo es posible?
- (la que más me gusta) Me ha encantado vuestro presupuesto y todo lo que me dijisteis en la reunión pero otros me lo hacen por un 50% menos ¿por qué?
Si te has visto reflejado el alguno de estos casos, es importante que valores 2 cosas:
- Nadie quiere regalar su trabajo
- Por lo general, la mayoría de los profesionales no quieren estafarte (o al menos eso espero)
Ya os hemos hablado otras veces por aquí de cómo pedir un presupuesto web y la importancia de tenerlo todo claro antes de hacer un proyecto online.
Cuanto más clara sea la información, menos diferencia habrá entre presupuestos que recibas.
Pero al margen de esto, es muy habitual ver grandes diferencias entre presupuestos de empresas de diseño web aparentemente similares. Y el cliente se vuelve loco intentando elegir la mejor opción porque no llega a entender que, ante la misma información, los resultados sean tan diferentes.
Algunos se piensan que es sencillo: basta con calcular cuánto tiempo voy a invertir en un proyecto y presupuestarlo en base a eso.
¿Cómo presupuesto esto?
Bueno, en realidad no todo se puede valorar en tiempo desarrollo. La experiencia de la agencia, la cualificación del equipo de desarrollo y, siendo sinceros, el caché o la fama que pueda tener una agencia influirán en el precio.
Más allá del tiempo y la fama, esa diferencia de precios depende de la metodología de trabajo; o para entendernos, las fases que debe tener un proyecto web y cómo las ejecuta cada profesional o agencia de desarrollo.
Y volviendo a lo de antes: como la mejor manera de explicar algo es hablando de lo que conoces, vamos a contaros qué fases cumplimos en los proyectos web de Ensalza.
¿De qué hablamos hoy?
Ingredientes de un buen desarrollo web
Si analizo los proyectos que han pasado por nuestras manos y han salido bien, TODOS comparten una serie de características comunes.
No quiero decir que sean garantía de éxito, pero no recuerdo ningún proyecto «bueno» que no cumpliera con estas 3 cosas:
Comunicación fluida
Esto va de la mano de facilitar toda la información a la hora de dar un presupuesto.
No, comunicación fluida no es llamar a todas horas para saber cómo va tu proyecto.
Se trata de establecer una relación con el equipo de desarrollo y encontrar la mejor manera de llevar a buen puerto tu página web.
En Ensalza utilizamos un sistema de tickets y un gestor de tareas que nos permite ir registrando los comentarios e incidencias que van surgiendo durante el desarrollo. Así se puede acceder en todo momento a la información y consultar cómo o por qué se hizo cierta funcionalidad.
No te sientas raro por querer hacer las cosas bien
Calendario claro
Nadie tiene la varita mágica ni puede prever las incidencias que puedan surgir durante el desarrollo de un proyecto web. Pero tener un calendario claro con todos los proyectos facilita que la cosa llegue a buen puerto.
Es importante tener claras 3 fechas:
- Cuándo se va a empezar el proyecto (no siempre tiene que ser inmediato después de la firma del contrato)
- Cuál es la duración (en días laborables) de las fases intermedias.
- En qué fecha se estima que se hará la puesta en producción.
¿Por qué hablamos de estimaciones? Porque En muchos casos, la agencia de desarrollo también necesitará información (imágenes, contenidos, dominio, alojamiento web, etc) durante las distintas fases.
Si no aportas la información en los plazos previstos, es lógico pensar que la fase actual y la entrega se retrasen.
Alcance 100% definido
Otro punto importantísimo: conocer cuáles son las tareas de la agencia y hasta qué grado van a desarrollarse.
Si esa información no queda clara, es casi imposible que se cumplan las fases y el calendario del que hablábamos antes.
Lo ideal es establecer un interlocutor único entre la agencia y el cliente. Además, es fundamental aclarar antes de empezar el desarrollo quién se va a encargar de cada área.
Hay algunos puntos que suelen ser claves:
- El alojamiento web: qué proveedor ofrecerá el servicio y si es compatible con la tecnología del desarrollo.
- Los contenidos: quién los generará, en qué formato se entregarán y quién se encargará de la carga en la página web.
- Los recursos gráficos: ¿la empresa dispone de banco de imágenes? ¿será la agencia la encargada de buscarlas?
[box type=»info»] ¡Ojo! Todos los proyectos deben pasar por estas fases pero es obvio que no todos deberán dedicarle el mismo tiempo a cada una.[/box]
Aunque parezca lo contrario, el orden de importancia y complejidad es descendente. Cuanto mejor se hagan las fases iniciales, más sencillas serán las fases finales y mejor será el resultado del proyecto.
Ahora sí que empezamos con las fases:
Elaborar el presupuesto web
Sí, los presupuestos requieren de tiempo y esfuerzo. Y son la primera fase de un buen desarrollo web. Muchos piensan que no, pero un presupuesto de un desarrollo medio puede llevar bastante tiempo.
¿Qué hacemos en esta fase?
- Investigar el proyecto: entorno, alcance e historia anterior (si existe).
- Analizar la información que ha facilitado el cliente.
- Reunirnos con el cliente (si es necesario por el alcance del proyecto)
- Abstraer las partes del desarrollo, y buscar referencias similares en trabajos anteriores de la agencia.
- Determinar los departamentos que van a tomar parte del proyecto y, en caso de dudas, evaluar con los responsables una estimación de costes.
Sí, podríamos tener un comercial que hace un cálculo rápido y le da un precio gancho al cliente en 2 horas sin analizar nada. Pero la experiencia nos dice que eso casi siempre acaba mal.
Si el cliente piensa elegir a su proveedor porque le entregó el presupuesto en 12 horas. ¿Cómo va a ser ese proyecto?
Prefiero entregar más tarde un buen presupuesto que hacerlo sin pensar. Si el cliente piensa elegir a su proveedor porque le entregó el presupuesto en 12 horas…
Igual no es mi cliente ideal ni el tipo de proyecto en el que queremos trabajar. Recuerda: comunicación fluida para que todo salga bien.
Consultoría e investigación
Parte de esta fase siempre tiene que hacerse durante el presupuesto. Todo depende, una vez más, de lo elaborado que tenga el cliente el alcance de su proyecto y la funcionalidad.
De hecho, puede que un presupuesto de envergadura media (tirando a grande) requiera hacer un proceso doble: en un primer análisis se elabora un presupuesto para la consultoría de desarrollo web; y de ese trabajo saldrá el presupuesto del proyecto real.
La consultoría y el desarrollo son trabajos independientes, aunque pueden ser desarrollados por el mismo equipo. Aquí es habitual (o al menos así lo hacemos en Ensalza) que si, después de la consultoría de desarrollo, el cliente acepta el presupuesto para el desarrollo del proyecto ese importe inicial de la consultoría se descuente del presupuesto final.
Todos ganan: el cliente ya sabe cómo debe hacer su proyecto y el equipo de desarrollo tiene todas las pautas para llevarlo a cabo. La información es poder, como decía aquel.
Sin conocer el alcance un proyecto web es imposible elaborar un presupuesto correcto Share on XDesde mi punto de vista, esta es la fase fundamental del proyecto web y la que marca en muchas ocasiones las diferencias entre agencias.
En el caso de proyectos a medida de gran tamaño nadie en su sano juicio se saltaría esta fase. Pero en páginas web corporativas sí que es habitual que se elimine por optimizar tiempos y costes.
Así, surgen dos tipos de agencias de diseño web: las que «fabrican» la web que ha pedido el cliente y las que aportan su conocimiento del sector al proyecto.
Como se puede intuir, las primeras suelen ser más económicas en la entrega que las segundas. Aunque no entro a valorar qué tipo de agencia es mejor (hay clientes que quieren la web tal y como la tienen pensada pero técnicamente no la pueden llevar a cabo), en Ensalza entramos en el segundo grupo.
Nos sentimos más cómodos en proyectos en los que podemos aportar nuestro punto de vista y ver la solución online que logra los objetivos del cliente.
Como un cliente nos dijo un día en una reunión:
Yo (cliente) quiero una web que funcione. Tú (agencia) eres el profesional que debe llevarlo a cabo.
¿Qué hacemos en esta fase?
- Analizar el histórico (si existe) del proyecto: datos de visitas, campañas de marketing, posicionamiento en Google, etc.
- Marcar el objetivo principal del proyecto.
- Determinar al público objetivo y analizarlo.
- Planificar las fases de desarrollo y qué parte del equipo se encargará de ello.
- Marcar la estructura general de la web y el esquema de navegación
- Elaborar los procesos de decisión del cliente.
- Establecer objetivos y requisitos: cuándo se van a necesitar los recursos de terceras partes para cumplir el calendario.
- Elegir la plataforma sobre la que se va a desarrollar el proyecto: puede ser WordPress, un gestor de tiendas online o un desarrollo a medida, por ejemplo.
Créeme: todas las horas invertidas en esta fase es ahorro de tiempo en las siguientes. Por favor, no escatimes en dedicación a la investigación y planificación del proyecto.
Diseño web
Empezamos a llegar a la primera fase «tangible» de todo el proyecto web: el proceso de diseño.
Ya os hemos hablado muchas veces por aquí de la parte de diseño. Podéis echarle un ojo a los errores que no debes cometer en un diseño web o la serie que está haciendo Yanira sobre mejores prácticas para las secciones de tu página web.
Junto a la consultoría, todo lo que se detalle en esta fase de diseño web es clave para que las fases siguientes sean productivas. Un cambio a nivel de diseño siempre es más sencillo que una vuelta atrás en fase de desarrollo. Y sí, cuando hablamos de más sencillo me refiero a más económico. Que luego vienen los sustos.
Reacción del programador cuando todo cambia frente a los requisitos iniciales
Detallar no es definir el color exacto o los píxeles de grosor que tiene una banda y el número de fotos que pasan en un slider.
Diseño web es hablar de usabilidad web, posición de los elementos y navegabilidad.
¿Qué hacemos en esta fase?
- Analizar la identidad corporativa del cliente. O renovarla, en caso de que se haya pedido eso.
- Definir una línea de diseño: lo ideal es marcar la página o páginas principales para que el cliente lo valide y en base a eso continuar con el resto del diseño
- Diseñar las distintas páginas que forman el diseño: aquí nos apoyamos en prototipos y esquemas de diseño (o mockups y wireframes si quieres hacerte el guay)
Este es el momento de definir cómo queremos que el usuario se comporte y afinar el embudo de conversión. Recuerda: toda página web tiene un objetivo que cumplir y no puedes ponerle trabas al cliente.
Implementación del proyecto web
Si la fase anterior era la primera tangible, esta es la fase del desarrollo web por la que muchos empiezan.
Una vez dan el presupuesto y el cliente lo acepta, se ponen a instalar el wordpress de turno y a maquetar los contenidos sobre la web. Desde mi punto de vista esto tiene varios problemas (sin contar la falta de análisis, claro):
- El proceso no está optimizado (diseñar, maquetar y cargar contenidos a la vez no es eficiente).
- Los cambios, si al cliente no le gustan, pueden suponer un dolor de cabeza.
- Aunque no quieras, estás condicionando la estructura y la forma de conseguir el objetivo de la página web a las herramientas que disponga la plantilla elegida.
Que se ajuste el desarrollo al presupuesto es lógico, pero no se puede condicionar un objetivo por una mala planificación o implementación del proyecto.
¿Qué hacemos en esta fase?
- Para WordPress: instalar y configurar el entorno de desarrollo.
- Para desarrollos a medida: programar el entorno base del desarrollo, elaborar la base de datos y comenzar la programación del área de gestión.
- Implementar los módulos o áreas del desarrollo.
- Crear las estructuras de datos necesarias para el proyecto.
- Generar las páginas principales que componen el proyecto web.
- Maquetar estas páginas en base al diseño de la fase anterior.
- Conectar esas maquetas con la parte dinámica del desarrollo.
- Configurar las herramientas de analítica.
De verdad, no sé si es porque confío mucho en nuestro equipo de programadores, pero esta es la parte fácil. Me explico: si se ha definido la estructura, el diseño, el alcance y la navegación… solo queda unir las piezas y darle la forma final.
Y cuando te juntas con programadores web que saben muy bien lo que hacen… parece hasta fácil 😉
Carga de contenidos
¿Recuerdas lo de tener el alcance definido y tener una comunicación fluida cliente-proveedor? Pues aquí es vital. Todas las partes deben tener claro quién cargará los contenidos de la página web.
Puede darse el caso que los contenidos los cargue directamente el cliente desde un panel de gestión; o tal vez se los entregue a la agencia (en formato digital, por favor) para que el equipo de marketing los analice y pula de cara a conseguir los objetivos marcados.
En ocasiones, es directamente la propia agencia la que elabora los contenidos y después el cliente los valida antes de cargarlos en la página web.
De hecho, tal vez sea necesario incluir en la fase 1 del desarrollo web una partida para programar un proceso de carga. Esto es habitual en proyectos web con mucho contenido que es necesario migrar de un entorno a otro (catálogos amplios, blogs con bastante antigüedad, portales de noticias…). «Casi» todo es posible en este mundo, pero debe haberse analizado antes.
Revisión y pruebas
Con la fase de carga de contenidos ya deberíamos tener completado el proyecto web y estamos listos (y nerviosos) porque queremos hacerlo público ya.
¡Pero espera! Aunque aquí entren las prisas por querer publicar la web, no puedes saltarte esta fase previa: la revisión final y las pruebas. No corras tanto y dedícale un último esfuerzo a que tu proyecto no fracase, por favor.
¿Qué hacemos en esta fase? Voy a hacer un resumen muuuuuy ligero, porque de aquí me sale un artículo entero.
- Revisión de enlaces (internos y externos): que todo esté correcto y vaya donde debe.
- URLs: amigables, cortas y con sentido. Que no se qu
- Botones de redes sociales: si vas a poner botones para que la gente te siga en las redes sociales, revisa que lo has enlazado bien y que el icono de facebook no te lleva a Youtube… (cuña publicitaria: ¿has visto cómo mola ensalza en twitter?)
- Formularios de contacto: ¿llegan donde deben llegar? ¿traen todos los campos con la info del cliente?
- Redirecciones antiguas: un clásico. Alguien publica una web nueva y las 60 urls antiguas (o 2.000, que también he visto el caso) te llevan a un hermoso error 404. Consecuencia: pésima experiencia de usuario, problemas de indexación y ho***** en los resultados de Google. Es importante hacer un mapa de redirecciones y ver a qué nueva URL llevamos el contenido antiguo.
- Imágenes: échale un ojo a este artículo de Yanira y optimiza el peso de las imágenes de tu web. No metas elefantes en un hormiguero.
- Velocidad de carga: plantea instalar plugins de caché. Aquí te contamos cómo hicimos para cargar nuestro blog en menos de 1 segundo.
- Indexación: ¿Usas wordpress? Revisa que no estés bloqueando a Google con tu robots.txt o con la casillita que tienes en Ajustes -> Lectura de tu panel de gestión.
- Modo mantenimiento: sí, también lo hemos visto. Lanzas tu nueva web, lo publicas en todos los lugares pero te has dejado el modo mantenimiento activo y los clientes llegan a un hermoso «Próximamente estaremos operativos».
- Google Analytics: no hay nada que me duela más que perder datos para analizar. Antes de publicar la página web revisa que el código de Analytics trackea correctamente y que se disparan los objetivos configurados. Acuérdate también de añadir una nota en Analytics con el lanzamiento para luego poder comparar las métricas.
Tampoco está de más que hagas alguna prueba de usabilidad con público objetivo y que haya estado ajeno al proyecto: muy posiblemente tú ya te sepas la página web de memoria y llegues por inercia al formulario de conversión. Pero unos ojos externos pueden aportarte un punto de vista diferente e interesante.
¡Ojo! No hagas infinitos testeos ni preguntes ¿qué te parece la web? porque te van a marear. Quieres ver si llegan al objetivo de manera fácil, no si les parece bonito el verde que has elegido.
Puesta en producción
Ahora sí: tienes todo pensado, el diseño está perfecto, la programación de la web es maravillosa y todo funciona a la perfección. ¡Ya puedes publicar tu proyecto web!
Bueno, antes de lanzar mira el calendario. Al menos en Ensalza tenemos algo tatuado a fuego:
Norma nº1 de @ensalzacom: NUNCA se lanza una web en viernes ni en vísperas de festivos. Tu salud lo agradecerá Share on X
Lo que pasa en el servidor cuando publicas una web en viernes
¿Qué hacemos en esta fase?
- Preparar el hosting y el dominio:
- Si lo lleva la misma agencia de desarrollo: preparar el servidor y configurar los registros DNS del dominio
- Si hay una tercera parte que se encarga: la agencia deberá comprobar (con antelación) que tiene todos los accesos y que el entorno es compatible con el desarrollo
- Guardar una copia de la web actual (en caso de tratarse de una renovación de la página web)
- Desplegar el nuevo desarrollo web
- Hacer algunos ajustes finales de velocidad en el servidor
- Repetir las pruebas de envío de formularios de contacto
- Instalar y configurar el certificado SSL para evitar el mensaje de página no segura.
- Celebrarlo, publicar el trabajo en nuestro portfolio y pensar en el próximo reto.
Por cierto y volviendo al inicio del post, a ese cliente que volvió preguntando por qué éramos un 50% más caros, le dijimos:
Si yo bajo un 50% nuestro precio, manteniendo la calidad y consiguiendo que mi equipo haga las mismas cosas que te han encantado de la reunión, fui un auténtico ladrón al darte el presupuesto.
Y si has vuelto, es porque aquella agencia barata tampoco iba a hacer esas cosas.
Y parece que el argumento le convenció bastante. Al final se convirtió en cliente de Ensalza, la comunicación fue excelente y cumplimos las fases del desarrollo que habíamos marcado en esas primeras reuniones.
¿Qué te ha parecido el artículo? ¿Has tenido alguna experiencia similar como cliente? ¿Te dedicas al desarrollo web y utilizas una metodología de trabajo diferente? Me encantaría leer tu comentario.
¡Hasta el próximo miércoles!