Archivo de la etiqueta: seminario

Concepto > Contenido > Diseño > Tema

El desarrollo de un Tema puede empezar por varias partes, muchas veces comienza por un diseño el cual plasma una idea general de como queremos hacer nuestro theme, pero es el proceso correcto?. Ya hace tiempo que los Temas Premium son una opción fácil a la hora de poner en marcha un proyecto para un cliente, para escojer este Tema nos guiamos por el diseño, las valoraciones y compras que ha tenido ese Tema en concreto, ojeamos un poco el html usando firebug y si vemos necesario hacemos una consulta al desarrollador sobre la compatibilidad de este Tema con otros plugins que nos interesa usar.
Lo malo es que casi siempre el Tema no hace bien todo lo que ofrece, tiene miles de opciones para hacer un Tema Multipropuse, osea que sirve pa todo, cosa que es un gran error ya que terminas usando menos de la mitad de las funcionalidades del mismo.
Esto ya lo discutimos un poco en un Post sobre Themeforest y GPL, os recomiendo leerlo.

¿Pero que pasa si queremos hacer nuestro Tema desde cero, creando todo el código, plugins, css, personalizaciones de plugins o integraciones?, pues que no deberíamos empezar por el diseño.

A continuación os explicaré como creo que deben plantearse la creación de un Tema propio o para un cliente sin necesidad de personalizar un Tema Premium.

 

  1. El Concepto:
    Es el motivo, la razón escensial del porque hacer un diseño web a medida. Para desarrollar un concepto hace falta hacer sesiones con el cliente donde se elavora los objetivos que debe cumplir la web, que apartados se usarán y de que forma se va a administrar el canal web/online.
    Con este proceso crearemos primero un wireframe, son como planos esquemáticos para identificar todos los elementos que necesita la web, definir bien si son videos, fotos, texto, enlaces, es el contenido dinámico, estático o viene desde otras plataformas como el caso de los timelines de twitter o facebook.Este wireframe debe considerar que contenido es visible para mobil, para tablet y para desktop, sabiendo así como gestionar la visibilidad, calidad y carga de ese contenido. Es muy importante tener claro el wireframe y quien o quienes serán los responsables de mantener la web para que el contenido sea coherente con la capacidad de gestión de la información web dentro de la empresa.
  2. El Contenido:
    No solo son los textos, son fotos, videos, comentarios, formularios, respuestas, emails de contacto, galerías, material de descarga, PDFs, enlaces, todo aquellos que la web necesita para poder funcionar correctamente. Si el wireframe está bien hecho siguiendo los objetivos la web tendrá un concepto definido y eso ayudará a entender como se generará ese contenido, se puede calcular tiempos de producción, traducción, edición y revisión.
    Conociendo todo el contenido que vamos a usar es buena idea profundizar si algo de ese contenido se gestionará o generará con plugins, así facilitaremos el paso 3 y 4,  haciendo mas fácil, al diseñador y programador, la creación del código, pero sobre todo los parámetros de gestión que tendrá ese Tema. ¿Es importante tener todo el contenido desde el incio? no necesariamente, pero si tener claro que tipo de contenido es. Cuando falta contenido para realizar el diseño se puede utilizar contenido Dummy o mas conocido como LoremLipsum.
  3. El Diseño:
    Una vez tengamos claro el wireframe y el contenido podemos empezar a diseñar, lo haremos siguiendo y respetando los pasos anteriores haciendo los mínimos cambios posibles, esto ayudará a tener una producción organizada y sin desvíos de tiempo de ejecución.
    Al entrar en el terreno del diseño lo mas importante es saber que estilo se quiere usar, si se parte de un logo seguir las líneas de la marca, escojer una paleta de colores para cada elemento ayuda a la hora de programar, definir que color tienen los enlaces, los rollovers, los menus, el texto general, los titulares.Durante el diseño entramos en el terreno de las Fuentes o Tipografías, actualmente podemos usar Google Fonts de forma gratuita o servicios como Typekit para fuentes con licencia. Hay que tener claro el comportamiento de la fuente en los diferentes navegadores sobre todo para las dimensiones y tamaños de menus, titulares o textos grandes donde el tamaño si que importa, sobre todo para idiomas con palabras largas como el Alemán.
  4. El Tema:
    Como consejo siempre usar un wireframe primero para mobil, subir a tablet y terminar en desktop, es mas fácil añadir que quitar, además que la mayoría de frameworks para wireframing  responsive (foundation zurb) están hechos para programar primero para mobil, small y terminar en desktop, large.La programación del tema empieza por definir los templates a usar, saber si usaremos index.php o front-page.php para nuestra home, cuantas plantillas personalizadas para categorías o custom taxonomies, si hay custom post types necesitaremos los single-CPT.php.
    Lo bueno de seguir estos pasos es que se pueden organizar las tareas de producción por templates y partials (get_template_part()), de esta manera el seguimiento de la producción es mas fácil. El programador del tema debe trabajar conjuntamente con los editores y gestores de la web para coordinar las funcionalidades que debe el Tema ofrecer, como las opciones del Tema, Paneles, Widgets, Configuración de Plugins y sobre todo dejar claro como se carga el contenido.¿Se puede desarrollar mientras se carga el contenido? Si, aunque hay que saber manejar tareas en paralelo de dos equipos, editorial y programación.¿Se puede desarrollar sin tener todo el diseño hecho? Si, pero no es recomendable, ya que al no tener los diseños de todas las secciones y elementos puede hacer que el desarrollo se retrase por cambios sobre cambios.A la hora de programar las funcionalidades de un Tema o su compatibilidad con plugins hay que tener claro el tipo de editor que tendrá la web, ya que dependiendo de sus conocimiento de WordPress este podrá utilizar funcionalidades complejas o en su defecto se debe simplificar al máximo para no retrasar ni entorpecer la carga del contenido.Hay que reconocer que todo el trabajo termina en la programación del Tema, pero el éxito del Tema no solo está en la programación ya que si los pasos previos se hicieron a conciencia el proceso de creación del Tema será mucho mas organizado y seguro.

 

Si te ha gustado este post te invitamos a participar del SEMINARIO: CREACIÓN Y DISEÑO DE TEMAS CON WORDPRESS que nuestro compañero @lonchbox dará en @PalmaActiva, estará enfocado a desarrolladores WordPress con un nivel Medio ya que se toparán aspectos de programación php, js y css. Y si eres un diseñador que quiere aprender a diseñar para WordPress o programar tu propio tema también te puede ayudar este seminario. Anímate y forma parte de la gran comunidad de desarrolladores WordPress que hay en el mundo 🙂
Apúntate ya! que las plazas son limitadas.