Guía completa sobre cómo planificar un proyecto web

Cómo planificar un proyecto web

Para empezar una web con buen pie siempre es necesario desarrollar un plan de acción que nos evite problemas futuros. En esta guía explico los pasos a tener en cuenta al planificar cualquier proyecto web. Al final del artículo os dejo un Google Sheets donde podrás marcar/desmarcar las secciones trabajadas para una mayor organización.

1. Cómo definir el enfoque de tu web

Esta sección será de gran ayuda para saber cómo planear el diseño, desarrollo y análisis futuro de una web.

Revisa páginas web de tu competencia

Antes de empezar revisa un buen número de webs de tu competencia, analízalas y fíjate en lo siguiente:

  • Cuáles son sus puntos fuertes
  • Cuáles son sus puntos débiles
  • Cómo las mejorarías
  • Cómo han enfocado el diseño
  • Con qué tono se dirigen al lector
  • Analiza rendimiento de la web con PageSpeed Insights
  • Si tienes acceso a herramientas de análisis como Semrush o Ahrefs ¡Genial!

Ten en cuenta que si existe competencia y han hecho un trabajo coherente, deberían haber realizado un estudio previo ¡Si analizas lo que ellos han hecho te ahorrará mucho trabajo!

Define tu público objetivo

El público objetivo nos da rasgos generales del comprador ideal, sin una identidad propia y específica. nos servirá para centrarnos en un grupo de segmento del mercado.

Define tu buyer persona

Un buyer persona sería un perfil ficticio de una persona concreta y de rasgos definidos. A mi forma de verlo es súper útil para saber a quién dirigirme y qué necesidades cubrir a la hora de crear contenido. En el punto 12 del artículo “características de una web exitosa” escribo sobre una herramienta gratuita para definir el buyer persona.

Por ejemplo, un público objetivo sería:
Mujeres embarazadas de entre 25 y 40 años con unos ingresos mensuales de entre 800 y 1000€. Se conectan a redes sociales como instagram.

Por ejemplo, un buyer persona sería:

María, 38 años. trabaja como cajera de un supermercado y pasa el tiempo en su barrio o en casa viendo la tele o mirando instagram.

2. Planear el diseño de una web

Antes de realizar nada en el diseño de una web deberíamos planificar bien algunas cosas para tener una estructura homogénea y, si estamos creando una web bien personalizada, tener un código CSS limpio.

Proporciones de márgenes y padding

De cualquiera de las formas que creemos la web es importante tener un protocolo establecido de márgenes y paddings para todos los dispositivos y mantenerlo en toda la web. Esto hará que tengamos una estética estable en toda la web dando sensación de profesionalidad.

Si trabajamos con una web personalizada podremos declarar variables CSS para estos parámetros. Así también podremos controlarlo todo desde un solo lugar.

Tamaños de las imágenes

También es importante mantener un protocolo de tamaños de imagen. Esto hará que evitemos la carga de imágenes en tamaños diferentes a los que realmente se están mostrando, con la consecuente sobrecarga de la web, tanto de uso del servidor como velocidad de carga.

Yo suelo trabajar con 4 tamaños de imagen diferentes para el 90% de los proyectos. Estos son:

  • 1400x350px
  • 600x400px
  • 350x350px
  • 250x250px

Tamaño de las fuentes

Otro punto a tener en cuenta es el tamaño de las fuentes. Para tener un diseño sólido y que dé sensación de profesionalidad necesitaremos mantener el mismo tamaño de fuentes para todas las páginas.

Si trabajamos con webs personalizadas, al igual que con los márgenes y paddings, podremos declarar variables CSS para controlar todos los tamaños desde un punto. Y no solo eso, también evitaremos mucho código al declarar las media queries.

Establecer puntos de ruptura (responsive)

Estos son los puntos responsive (para tener una web adaptable a cualquier dispositivo) en que la estructura web cambia más. Por ejemplo: Podemos encontrarnos con 3 elementos distribuidos en 3 columnas, pero en el móvil se distribuyen en una única columna. Esto se realiza mediante los media queries en código CSS. Recomiendo 2 puntos de ruptura: 768px y 1024px.

Estable colores principales y secundarios acordes con tu identidad corporativa

Esto depende mucho de cada proyecto, claro. Pero en líneas generales no recomendaría usar más de 4 colores (sin contar blanco, negro o gris). Hay estudios en los que se comenta que mientras más colores más distracción, lo que se traduce en menos conversiones.

Si trabajamos con CSS podremos declarar los colores en root y así organizarlos todos desde un solo punto.

Define cuántas páginas va a tener tu web

No es lo mismo una web para promocionar un negocio de albañilería local que una web de una escuela online. Dependiendo de tus necesidades debes tener bien claro qué páginas se incluirán. Y cuanto antes lo sepas mejor

Define qué funcionalidades son necesarias en tu web

Esto es importante si no queremos que nuestro desarrollador acabe tirándose de los pelos. Antes de empezar con el proceso de desarrollo es muy importante que nos planteemos qué funcionalidades son necesarias para nuestra web. Así tendremos un plan de desarrollo coherente.

3. Antes de empezar con el desarrollo conoce el enfoque SEO básico

A diferencia de lo que muchos creen es importante hacer un pequeño trabajo SEO antes incluso de tener la web. Así podrás colocar las imágenes con un nombre adaptado a este estudio previo.

4. Planificación del desarrollo web

En esta etapa lo más importante es conocer las funcionalidades y tecnologías a usar.

Por ejemplo, si conocemos las ventajas de una web en WordPress 100% personalizada podremos trabajar en PHP, código nativo de WordPress, JavaScript, jQuery, MySQL, etc.

Una vez conozcamos qué funcionalidades, qué páginas y cómo será el diseño de la web, lo que quedará es la implementación o desarrollo.

Siempre recomiendo trabajar con algún servidor local como Xampp, ir haciendo copias de seguridad, y luego subir el trabajo definitivo a nuestro servidor.

Al terminar con el desarrollo debemos recordar habilitar la web para su indexación. Por ejemplo, si usamos WordPress, deberíamos desactivar la casilla «Pedir a los motores de búsqueda que no indexen este sitio»

5. Identificar necesidades

Muchas veces queremos abarcar todo el trabajo y no nos damos cuenta que hay empresas de diseño web a precios muy competitivos a las que puedes delegar muchas tareas. Así que preguntémonos:

Con qué recursos cuento

Hazte las preguntas:

  1. ¿Tengo dinero para invertir en el proyecto?
  2. ¿Puedo reducir otros gastos para facilitar la inversión en el proyecto?
  3. ¿Tengo conocimientos para realizar un proyecto así?
  4. ¿Quiero que mi proyecto genere ingresos en 1 año o menos?

Claro, si no tenemos conocimientos de desarrollo, marketing, diseño o SEO, no nos quedará otra que sacrificar el bolsillo o condenar el proyecto a un crecimiento muy lento o fracaso.
También hay otros factores como la competencia. Si nadie vende tu producto o servicio, nadie escribe en internet sobre ello y hay un gran número de usuarios a la búsqueda de lo que ofreces, es probable que te posiciones rápidamente en Google y tu negocio triunfe sin una inversión. Pero honestamente, es una posibilidad muy remota.

Cuál es mi especialidad

Si realmente dominamos algún campo relacionado con el proyecto ¡Genial! Pero ten en cuenta que no podemos saberlo todo, y un proyecto web bien hecho abarca un gran número de factores.

Cómo hacer mi web

Hay un gran número de plataformas y CMS que nos permiten hacer una web de un modo sencillo y rápido. Siempre aconsejo utilizar WordPress por su precio, su rápido aprendizaje y su capacidad de personalización. Y además, dispone de un gran número de herramientas, como los maquetadores visuales, que nos permitirán hacer una web de forma rápida y sencilla. Pero no todo son beneficios, cualquier plugin, como los maquetadores, genera un gran impacto en el rendimiento, así que también tendremos que preguntarnos el siguiente punto.

6. Aplicaciones para gestionar proyectos web

Aquí os presento 2 posibilidades:

  1. Si queremos trabajar con un equipo existen muchas aplicaciones con las que podremos gestionar todas las tareas y así tener bajo control qué, quién y cuándo hace estas tareas. Os recomiendo las siguientes aplicaciones:
    1. Asana
    2. Trello
    3. Airtable
      Todas ellas tienen versión gratuita
  2. Si preferimos no trabajar con un equipo podemos seguir este Google Sheets para planificar marcar/desmarcar cada uno de los pasos de esta guía:
    Planificador de Proyecto Web
    Puede crear una copia del documento haciendo click arriba a la izquierda. En Archivo/Hacer una copia

Si tienes alguna pregunta, sugerencia o simplemente quieres dar tu opinión no lo dudes y deja tu comentario

Aviso Legal

Política de Privacidad

Utilizamos cookies para asegurar que damos la mejor experiencia al usuario en nuestra web. Si sigues utilizando este sitio asumiremos que estás de acuerdo