{"id":2949,"date":"2020-11-02T08:51:43","date_gmt":"2020-11-02T06:51:43","guid":{"rendered":"https:\/\/www.moixo.com\/2020\/11\/02\/como-se-disena-y-desarrolla-una-web-profesional\/"},"modified":"2020-11-02T08:51:43","modified_gmt":"2020-11-02T06:51:43","slug":"como-se-disena-y-desarrolla-una-web-profesional","status":"publish","type":"post","link":"https:\/\/www.moixo.com\/es\/2020\/11\/02\/como-se-disena-y-desarrolla-una-web-profesional\/","title":{"rendered":"\u00bfC\u00f3mo se dise\u00f1a y desarrolla una web profesional?"},"content":{"rendered":"\t\t
\n\t\t\t\t\t\t
\n\t\t\t\t\t\t
\n\t\t\t\t\t
\n\t\t\t
\n\t\t\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t\t\t\t\t

Fases y claves para afrontar un proyecto web con \u00e9xito<\/h2>\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t\t\t\t\t

Afrontar un proyecto web no es una tarea menor. El correcto dise\u00f1o y desarrollo de una p\u00e1gina web es un proceso que consta de distintas fases. Son todas cruciales, y deben realizarse con un enfoque profesional y sincronizarse\/encadenarse de forma coherente.\u00a0<\/p>\n

En Moix\u00f3 tenemos muchos a\u00f1os de experiencia en dise\u00f1o web y desarrollo web. Hemos ofrecido nuestros servicios a un amplio abanico de clientes y sectores, creando centenares de p\u00e1ginas y portales. En este art\u00edculo, repasamos algunas de las fases (y sus claves) que consideramos imprescindibles para que un proyecto web llegue a buen puerto.<\/p>\n

No obstante, antes de entrar en materia, incidimos brevemente en un aspecto fundamental. El desarrollo y dise\u00f1o de una p\u00e1gina web debe afrontarse conjuntamente y con la m\u00e1xima implicaci\u00f3n tanto del proveedor del servicio como del cliente. Dicho esto, empezamos.<\/p>\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t

\n\t\t\t\t\t\t
\n\t\t\t\t\t
\n\t\t\t
\n\t\t\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t\t\t\t\t

An\u00e1lisis, requerimientos y funcionalidades<\/h3>\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t\t\t\t\t

Una p\u00e1gina web es una pieza clave del marketing online. Y no lo es \u00fanicamente porque sobre ella se sustenta gran parte de la identidad online de una empresa o instituci\u00f3n. Tambi\u00e9n lo es porque juega un papel fundamental en la estrategia de marketing.<\/p>\n

Por todo ello, es imprescindible tener muy claros algunos aspectos. Por ejemplo: \u00bfa qu\u00e9 p\u00fablico se dirigir\u00e1 la p\u00e1gina web? \u00bfcu\u00e1les son los objetivos de la web? \u00bfc\u00f3mo se plasmar\u00e1 la conversi\u00f3n? \u00bfcu\u00e1l ser\u00e1 su relaci\u00f3n con otras herramientas de marketing?…<\/p>\n

Dar respuesta a estos puntos ser\u00e1 fundamental a la hora de detectar los requerimientos y las funcionalidades de la web. Definir correctamente el proyecto y su alcance es b\u00e1sico para dise\u00f1ar y desarrollar con conocimiento de causa y afrontar con garant\u00edas las siguientes fases.<\/p>\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t

\n\t\t\t\t\t\t
\n\t\t\t\t\t
\n\t\t\t
\n\t\t\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t\t\t\t\t

Elaboraci\u00f3n de los wireframes<\/h3>\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t\t\t\t\t

Antes de entrar en lo relativo al dise\u00f1o gr\u00e1fico y al desarrollo web es de mucha utilidad realizar unos esbozos previos que denominamos wireframes. Estos wireframes (de la p\u00e1gina Home, p\u00e1ginas espec\u00edficas, p\u00e1gina de contacto…) ayudan a percibir la estructura de las distintas p\u00e1ginas y a identificar todos sus elementos.<\/p>\n

Es decir, estos wireframes permiten vislumbrar c\u00f3mo se ubicaran los bloques que conformaran el contenido, con sus t\u00edtulos, textos, im\u00e1genes, call to action, etc.\u00a0Y tambi\u00e9n c\u00f3mo ser\u00e1n\u00a0 la cabecera y el pie de p\u00e1gina.<\/p>\n

Adem\u00e1s, tambi\u00e9n nos ayudar\u00e1n a percibir c\u00f3mo ser\u00e1 la navegaci\u00f3n contextual en la p\u00e1gina web. Nos permitir\u00e1n definir, m\u00e1s all\u00e1 del men\u00fa principal, c\u00f3mo ser\u00e1 la navegaci\u00f3n por medio de los elementos que conformar\u00e1n las p\u00e1ginas.<\/p>\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t

\n\t\t\t\t\t\t
\n\t\t\t\t\t
\n\t\t\t
\n\t\t\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t\t\t\t\t

Elaboraci\u00f3n del contenido<\/h3>\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t\t\t\t\t

Es muy habitual pensar que esta es una de las \u00faltimas tareas de un proyecto web. Nada m\u00e1s lejos de la realidad.\u00a0Disponer de contenido real (de una muestra muy significativa del contenido total) es imprescindible para afrontar el dise\u00f1o gr\u00e1fico y el desarrollo web con \u00e9xito. En el art\u00edculo \u00abEl contenido de calidad es crucial en un proyecto web<\/a>\u00bb explic\u00e1bamos ampliamente los motivos. B\u00e1sicamente, se resumen en:<\/p>\n

En una web, el dise\u00f1o gr\u00e1fico tiene un componente comunicativo, funcional y de usabilidad que resulta fundamental y que hay que trabajar con rigor. Y la mejor manera de hacerlo es utilizar contenido real.<\/p>\n

Sin una buena muestra de contenido real nos ser\u00e1 imposible afinar el gestor de contenidos (CMS). Disponer de contenido real es necesario para que todo funcione a la perfecci\u00f3n y para que la web sea lo que queremos que sea.<\/p>\n

Nota. A la hora de elaborar el contenido tambi\u00e9n se deben tener en cuenta cuestiones relativas a posicionamiento web. En el art\u00edculo \u00abPosicionamiento SEO sin estresarse demasiado<\/a>\u00bb nos centr\u00e1bamos en los contenidos de calidad. \u00c9s decir, contenidos que gustan a los buscadores y que ofrecen una buena experiencia a los usuarios.\u00a0<\/p>\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t

\n\t\t\t\t\t\t
\n\t\t\t\t\t
\n\t\t\t
\n\t\t\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t\t\t\t\t

Dise\u00f1o gr\u00e1fico y usabilidad web<\/h3>\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t\t\t\t\t

El dise\u00f1o gr\u00e1fico enfocado al dise\u00f1o web traspasa lo puramente est\u00e9tico para centrarse en el aspecto funcional y en la usabilidad. \u00bfEsto significa que debemos renunciar a dise\u00f1os bellos e impactantes? No, en ning\u00fan caso.\u00a0<\/p>\n

\u00danicamente decimos que el dise\u00f1o web tienen una dificultad a\u00f1adida.\u00a0 De poco servir\u00e1 un dise\u00f1o est\u00e9ticamente sobresaliente si suspende a la hora de proporcionar una experiencia de usuario satisfactoria.<\/p>\n

Adem\u00e1s, cuando elaboramos el dise\u00f1o gr\u00e1fico debemos tener en mente la multicanalidad. Es decir, debemos tener en cuenta la necesidad de que el dise\u00f1o web est\u00e9 optimizado para todo tipo de dispositivos (desktops y dispositivos m\u00f3viles).<\/p>\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t

\n\t\t\t\t\t\t
\n\t\t\t\t\t
\n\t\t\t
\n\t\t\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t\t\t\t\t

Desarrollo web<\/h3>\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t\t\t\t\t

El desarrollo web es el engranaje que t\u00e9cnica y tecnol\u00f3gicamente debe hacer funcionar la p\u00e1gina de manera eficiente. En este sentido, dos aspectos son fundamentales.<\/p>\n

En primer lugar, el hecho de haber realizado un an\u00e1lisis riguroso del proyecto. Si as\u00ed ha sido, se tendr\u00e1n muy claros cu\u00e1les son los requerimientos de la web y c\u00f3mo deben resolverse.<\/p>\n

En segundo lugar, el hecho de dotarse de herramientas tecnol\u00f3gicas adecuadas sobre las que basar el desarrollo web. Gestores de contenidos com Drupal o WordPress, en los que somos expertos, nos permiten afrontar pr\u00e1cticamente cualquier requerimiento. Y en el caso de requerimientos muy espec\u00edficos, nuestra capacidad de desarrollar a medida e integrar estas herramientas con otras nos permite aportar una soluci\u00f3n personalizada.<\/p>\n

Teniendo en cuenta todos los aspectos anteriores, el resultado final debe ser una web\u00a0profesional que:<\/p>\n

    \n
  • Cumpla con los requerimientos de la empresa.<\/li>\n
  • Satisfaga las necesidades de los usuarios.<\/li>\n
  • Sea \u00e1gilmente modificable, adaptable y flexible.<\/li>\n
  • Sea segura, robusta y con funcionalidades pr\u00e1cticamente ilimitadas.<\/li>\n
  • Tenga capacidad para crecer y evolucionar para adaptarse a los cambios del mundo digital.<\/li>\n<\/ul>\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t
    \n\t\t\t\t\t\t
    \n\t\t\t\t\t
    \n\t\t\t
    \n\t\t\t\t\t\t
    \n\t\t\t\t
    \n\t\t\t\t\t\t\t\t\t

    Y despu\u00e9s… actualizaci\u00f3n, seguimiento e inversi\u00f3n<\/h3>\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t
    \n\t\t\t\t
    \n\t\t\t\t\t\t\t\t\t

    Pensar que tras el d\u00eda de apertura todo est\u00e1 hecho es un error. Pero de esto ya nos ocuparemos en otro art\u00edculo.<\/p>\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"

    El correcto dise\u00f1o y desarrollo de una p\u00e1gina web es un proceso que consta de distintas fases. Son todas cruciales, y deben realizarse con un enfoque profesional y sincronizarse\/encadenarse de forma coherente.\u00a0<\/p>\n","protected":false},"author":1,"featured_media":3378,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"om_disable_all_campaigns":false,"footnotes":""},"categories":[44],"tags":[],"class_list":["post-2949","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-proyectos"],"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/www.moixo.com\/es\/wp-json\/wp\/v2\/posts\/2949","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.moixo.com\/es\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.moixo.com\/es\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.moixo.com\/es\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.moixo.com\/es\/wp-json\/wp\/v2\/comments?post=2949"}],"version-history":[{"count":0,"href":"https:\/\/www.moixo.com\/es\/wp-json\/wp\/v2\/posts\/2949\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.moixo.com\/es\/wp-json\/wp\/v2\/media\/3378"}],"wp:attachment":[{"href":"https:\/\/www.moixo.com\/es\/wp-json\/wp\/v2\/media?parent=2949"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.moixo.com\/es\/wp-json\/wp\/v2\/categories?post=2949"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.moixo.com\/es\/wp-json\/wp\/v2\/tags?post=2949"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}