Lista de chequeo para el diseño de un website

Introducción

Este documento puede ser de utilidad tanto para personas o compañías que se dedican al diseño y desarrollo de websites como para los clientes de estas compañías. Cabe anotar que esta lista de chequeo no es para una tienda online sino para un website sin e-commerce.

¿Por qué es útil para agencias o empresas con poca experiencia?

Este tipo de proyectos generan mucha ansiedad en los clientes cuando la comunicación no es efectiva, el cliente le hace seguimiento a los avances una vez tras otra vez, por lo que siempre es bueno que él tenga el control remoto o que sienta que lo tiene. Por lo tanto darle acceso al proyecto y a la lista de chequeo es beneficioso para la tranquilidad del equipo de diseño y desarrollo.

Lectura recomendada

Recomiendo leer el texto “A esa hora no me llame”.

¿Por qué es útil para clientes?

Conocer de principio a fin el paso a paso de cómo se gestionará un proyecto siempre será agradecido por el cliente, sobre todo cuando el proveedor es una agencia de publicidad, agencia digital o empresa de esta industria en donde se reconoce ampliamente el incumplimiento de los términos pactados y la laxitud en tiempos.

Checklist para crear una página web

La siguiente es la lista de chequeo para el diseño de un website de acuerdo a nuestra experiencia desde 1.994 desarrollando proyectos web.

Paso N°0. Sesión de trabajo N°0

Tanto los proyectos de consultoría como las cuentas publicitarias, de marketing digital y de WSDCD inician con una sesión de trabajo que N°0 que es aquella en la que se presenta al cliente la metodología de trabajo.

• El equipo de la agencia presenta la forma como se desarrolla el proyecto y da acceso al equipo del cliente a la plataforma tecnológica, incluyendo la aplicación móvil.
• Se da al cliente el enlace para que inicie el proceso de briefing mediante formulario web.
• Al equipo del cliente se le da acceso al disco duro compartido en el cual se gestionarán todos los archivos del proyecto.
• Se define la forma como se gestionarán las comunicaciones del día a día.

Paso N°1. Briefing

Para poder formular correctamente un proyecto de diseño y desarrollo de website de contenido dinámico (WSDC) es necesario obtener información del cliente. La captura de información inicia con el diligenciamiento de un formulario, luego pasa por una reunión presencial o en videoconferencia, para al finalizar, terminar toda la información estratégica del proyecto radicada en un documento que será la guía del proyecto.

• Formulario | En la agencia contamos con un formulario para la captura inicial de información y es ESTE. Esta es la primera etapa de la fase de briefing y sirve como acercamiento a la visión que tiene el cliente de su proyecto web, son las primeras impresiones pero no es correcto basarse solamente en esta información para formular un proyecto de esta índole porque es información parcial, tiene un importante sesgo.
• Videoconferencia | Una reunión presencial o vía videoconferencia es absolutamente necesaria para ver cómo los ojos del cliente se iluminan cuando habla de su sueño, de sus pasiones, cuando narra aquello que quiere. Mediante esta reunión se complementa la información suministrada a través del formulario.
• Documento | Toda la información recogida mediante el formulario y la reunión presencial o por videoconferencia se ordena y publica en un documento, el cual será la base y guía para la formulación del proyecto.

Paso N°2. Estructura basada en propuesta

Con base en la información recolectada en la fase de briefing, se diseña la estructura del website y se documenta con el fin de entender el alcance del proyecto web.

Paso N°3. Formulación del proyecto

Hay páginas de páginas y cada proyecto tiene sus características particulares por lo que teniendo en cuenta esto, siempre se debe formular un proyecto que le permita al equipo de diseño y desarrollo seguir un paso a paso, documentar el día a día y entender el estado actual del proyecto; pero también, que le permita al cliente acceder a dicho día a día y tener una comunicación con el representante del equipo de producción, una comunicación con argumentos. El hilo conductor de nuestros proyectos es el ADN de marca, construir herramientas comunicacionales que realmente representen a la marca, que funcionen para lo que han sido creadas y que en última instancia sean lindas, no lindas primero.

Con base en la información obtenida en briefing y la recolección de datos de la agencia se realiza la formulación. Una vez formulado el proyecto se le da acceso al cliente a través de la plataforma de la agencia.

Paso N°4. Recepción de recursos ⭐

El cliente debe dar acceso al proveedor a los recursos que requiere para realizar su trabajo, recursos como el panel de dominios, el panel de hosting actual (si lo tiene), el dashboard del sitio web actual (si lo tiene), entre otros. La siguiente es una pequeña guía útil para entender este paso:

• Briefing. El cliente debió diligenciar el briefing y la agencia validarlo con el fin de tener la información necesaria para diseñar la estructura de navegación. Link al briefing.
• Logo de la compañía en curvas (formato Adobe Illustrator, Corel Draw). No se acepta el logo como una imagen, debe ser editable.
• Imágenes en formato digital. El cliente deberá suministrar las imágenes de sus productos, aquellas usadas para ambientar sus servicios, de su equipo, de las instalaciones y todas las que sean necesarias para producir los elementos gráficos que ambientarán las distintas áreas del website. Las imágenes deben tener por lo menos 2000 pixeles de ancho con una resolución de 72 dpi como mínimo.
• Textos en formato digital. Todos los textos que se requiera para documentar y explicar cada una de las áreas del website. Puede entregarlos en formato Word, preferiblemente.
• Videos en formato digital. Si en alguna área se requiere la inserción de video, el cliente deberá entregarlo listo para usar, ya editado, ya que el servicio de edición de video no está incluido en el diseño y desarrollo de un website.
• Acceso al dominio. Si el cliente no tiene hosting y usará el servicio que le ofrecemos gratis por 1 año, deberá entregarnos las credenciales del dominio (URL de acceso, usuario y contraseña) para apuntar el domino hacia el hosting. Si el cliente desea trabajar con el hosting donde actualmente tiene su website, no necesita entregar credenciales del dominio ya que el website está funcionando correctamente a la fecha (se debe comprobar).
• Acceso al hosting actual. El cliente debe suministrar el acceso al panel de administración del hosting actual en el caso en que quiera usar el hosting que ya tiene o que desee hacer una migración. Debe entregar la URL de acceso, nombre de usuario y contraseña.

Cuando una compañía desea mejorar o cambiar radicalmente el proyecto web con el que actualmente cuenta y usa exactamente el mismo material que tiene hoy, no está haciendo un cambio real, solamente está haciendo un ajuste de diseño a su website. Si esta es la situación del proyecto del cliente, la recomendación es revisar área por área los contenidos, los servicios, la forma en que se ha comunicado para que haciendo los ajustes pertinentes el visitante sienta una mejora real.

Paso N°5. Creación del hosting

Una vez formulado el proyecto, en nuestro caso que tenemos servidores propios, creamos el hosting en nuestra plataforma y ésta se configura para preparar el terreno.

Cuando un cliente de Carlos Cortés Agencia contrata el diseño y desarrollo de un website de contenido dinámico (WSDCD) siempre va incluido un año de hosting GRATIS (es realmente gratis, no se incluye en la tarifa). Si el cliente desea mantener el hosting actual, se evalúa que tenga las prestaciones técnicas MÍNIMAS para soportar el proyecto web. Siempre le recomendamos a nuestro cliente usar el servicio que le ofrecemos ya que depende de uno de los tres mejores proveedores de hosting del mundo y ofrece todas las garantías para que un proyecto web funcione con la estabilidad y fluidez que se requiere.

Paso N°6. Documentación sitio antiguo

Este es un paso que muy pocos proveedores realizan y que ofrece garantías bilaterales. Nuestro equipo realiza un registro en video y en PDF del sitio web saliente. Este paso demuestra el tipo de proveedor que somos y da un punto ancla de retorno, en el caso en que se requiera.

Paso N°7. Apuntar el dominio al hosting

Con este paso inicia una cuenta atrás desde el lado del cliente porque se queda sin correos electrónicos por algunas horas o incluso días (mientras se propagan las DNS por Internet), en el caso en que use los emails dependientes del hosting y no los de plataformas como Google Workspace, por ejemplo. Apuntar el nombre de dominio al hosting no es otra cosa que conectar el WWW con el alojamiento de la página web para que sea visible a través de un navegador web.

En el caso en que el cliente desee o hacer una migración de su hosting al nuestro o iniciar un proyecto nuevo de website, suministrará las credenciales necesarias para que el equipo técnico de la agencia pueda apuntar el dominio al hosting.

Paso N°8. Instalación CMS

Este paso hace referencia a la instalación en el hosting de un software sobre el cual diseñar la página web como puede ser WordPress, Joomla, Drupal u otro. En el 100% de los proyectos web que desarrollamos en Carlos Cortés Agencia, el CMS usado es WordPress (lo usamos desde el año 2004).

Paso N°9. Creación de correos dependientes del dominio

Hay empresas que buscan gestionar los correos electrónicos desde plataformas como la de Google o Microsoft por los grandes beneficios que ofrecen para el trabajo colaborativo, a estos proyectos la agencia les ayuda con la configuración en dichas suites online, para aquellos que desean usar el web mail de Carlos Cortés Agencia, se realiza la creación de cada uno de los emails (tiene disponibilidad hasta 100 cuentas de correo en la mayoría de los planes), al configuración de alias si se requieren y la entrega de los instructivos correspondientes para la correcta operación, incluidas las credenciales de acceso.

Paso N°10. Activación de HTTPS

Los certificados SSL son prácticamente una obligación hoy por hoy, cualquier proyecto web que se respete debe tener uno y se pueden adquirir incluso gratuitamente. Desde el hosting se realiza la activación del certificado para que el sitio pase de http a https.

Video recomendado

Recomiendo ver el video “La importancia de un certificado SSL para tu sitio web“.

Paso N°11. Instalación Really Simple SSL

La herramienta llamada Really Simple SSL funciona muy bien en WordPress y permite garantizar una cobertura total del certificado de seguridad sobre el sitio web, tanto a nivel de backend como de frontend. Esto significa que no quede un rincón en el website sin cobertura del certificado de seguridad, incluyendo los contenidos multimediales.

Paso N°12. Imagen de “En Construcción”

Si el sitio web es nuevo, si no existe un website o si el cliente no quiere que se siga viendo su viejo sitio web, está la vieja y muy conocida alternativa de “En Construcción”. Para que no resulte molesto, es posible usar esa página como un lienzo para la creatividad, hay empresas que ponen juegos digitales con ranking entre los visitantes, ponen información de contacto o el texto “En Construcción” crudo.

Esta es la imagen que usamos en los websites que desarrollamos en nuestra agencia:

Imágenes de En Construcción para la agencia

Paso N°13. Instalación componentes ESENCIALES

Cada empresa desarrolladora de software o de sitios web tendrá un banco de componentes esenciales, aquellos innegociables que cualquier sitio web (sin importar la industria a la que pertenezca), debe tener instalados. En nuestra agencia tenemos una serie de componentes innegociables los cuales se buscan y activan en esta fase.

Paso N°14. Instalación GP

Si el sitio web se hace basado en un tema, pues éste se instala y se activa.

Paso N°15. Configuración GP

Si el website se hace basándose en un tema y éste ya está instalado y activado, pues se configura. Un paso que se lee rápido pero dentro de la lista de chequeo para el diseño de un website, puede ser una actividad que tome un buen tiempo.

Paso N°16. Carga de contenido dummy

El contenido dummy es contenido de prueba y sirve para ver el sitio operativo sin tener contenido real del proyecto. Este paso se puede obviar cuando se cuenta con el 100% del contenido desde el principio.

Paso N°17. Diseño de la estructura de navegación

Un paso muy importante en la lista de chequeo para el diseño de un website. Con base en la información recolectada del cliente, se diseñan los mecanismos de navegación de todo el website, área por área y funcionalidad por funcionalidad.

Paso N°18. Carga de contenido real

La información que se entrega en un inicio se ubica en su lugar de destino, textos, imágenes, videos, contenidos destacados, todo queda en el lugar correcto.

Carlos Cortés Agencia es una agencia de marketing digital pionera en Colombia.

Paso N°19. Incorporación de elementos de diseño

El diseño gráfico hace que los proyectos comunicacionales sean tan sexys como se quiera o se pueda. Lo sexy pierde importancia si no comunica las verdades verdaderas de la marca, lo sexy es irrelevante si no funciona para lo que fué creado y lo sexy por lo sexy es una real tontería hueca. En esta fase se hace “la magia” gráfica.

Paso N°20. Validación producto casi final ⭐

Una vez todos los componentes del rompecabezas están unidos, se valida el producto casi final de cara a quien lo ha contratado y si existen retoques finales se realizan en el siguiente paso.

Paso N°21. Ajustes producto casi final

En el caso en que existan retoques finales antes de la entrega, se realizan en este momento, se aprueban y se procede a la entrega.

Paso N°22. Optimización de contenidos para SEO

Todos los contenidos incluidos en el website reciben una optimización inicial para SEO que el cliente debe continuar fortaleciendo con la producción del contenido del día a día. Esta optimización es básica y no busca lograr resultados importantes sino simplemente no abrir una página web bonita y funcional que no esté preparada para ser abrazada correctamente por Google.

Paso N°23. Indexación de contenidos en la consola de búsqueda

Cada uno de los contenidos del website se indexan en la consola de búsqueda de Google (Search Console), previa creación de la cuenta y la vinculación de la propiedad en la misma.

Paso N°24. Entrega producto terminado

El último paso en la lista de chequeo para el diseño de un website. La entrega de una página web en el caso de mi agencia es todo un ritual. Nosotros realizamos una capacitación para nuestro cliente, le entregamos videotutoriales y modificamos el backend del sitio colocando en el dashboard todos los puntos de contacto y soporte técnico que le ofrecemos.

¿Qué significa la estrella? ⭐

La estrella significa que le corresponde al cliente, es su responsabilidad.

Metodología con garantías

La metodología de trabajo representa un porcentaje muy grande del éxito en un proyecto de diseño y desarrollo de un website. La metodología debe tener “candados”, esto es, garantías de aprobación, lo que quiere decir que cuando algo se aprueba en una fase del proyecto no se puede regresar a otra fase.

Metodología creada por Carlos Cortés para Carlos Cortés Agencia

La entrada Lista de chequeo para el diseño de un website se publicó primero en Carlos Cortés Agencia.