Cambio de Diseño del Blog. ¿Cómo se hace?




Al final me he decidido a cambiar el diseño del blog para tener mejores funcionalidad y un "lay out" más cuidado. 

Las mejoras con respecto al formato anterior son varias:

a) Diseño más limpio y totalmente integrado con dispositivos móviles y tablet.

b) Comentarios con distintas tipo de usuarios. Ya no es necesario hacerlo desde el perfil de Google+. Aunque he perdido los comentarios anteriores, creo que la propia evolución del blog lo necesita.

c) Mejor integración con redes sociales. Es más fácil compartir las entradas y conocer mis perfiles de las redes sociales.

d) Permite buscar por etiquetas, más vistos y por fecha ocupando poco espacio.

e) Información de entradas relacionadas al final de cada post.

He tenido que hacer cambios en "html" directamente por primera vez así que si veis algún error, no dudéis en decírmelo e intentaré arreglarlo.

Toda opinión es bienvenida, las buenas y las malas. Y si las dejáis, así pruebo como funciona los comentarios. :-)

Haré más cambio con calma, por ahora, ya ha sido suficiente en mi primer enfrentamiento con el html.

¿Cómo he hecho este cambio? 

Ante todo, decir que mi blog está alojado en blogger. 

Elegí una plantilla que me gustó en la página web Gooyaabi Templates. En mi caso, usé GVUSIÓN 2, que encajaba con la información y estructura de mi blog personal. Allí hay un montón de plantillas gratuitas.

Lo subí en blogger, a través de la página "plantilla" y "crear/restablecer copia de seguridad". Antes de subirlo, no te olvides de guardarte una copia de seguridad del diseño actual, por si la cosa se complica.

Después realicé las siguientes modificaciones sobre la plantilla, ya que en mi caso, me sobraban menús y botones sociales.

Lo que he hecho es:

1) Modificar en la vista diseño de blogger.  Eliminé y cambié de ubicación los "gadget" que tenía colocado en el blog y que, o bien ya a aparecían en el diseño o bien dejaban de tener sentido.

2) La parte más difícil para mi. Modificar el html del diseño vía plantilla-editar html. Allí quité el código de los distintos "botones" de redes sociales, eliminé un menú completo, etc... Toda una experiencia.

3) Y por último, deshabilité la visión móvil en blogger, ya que la plantilla en "responsive".

Tan fácil como esto, algún susto me he llevado pero creo que el resultado merece la pena. 

Si algún bloguero tan novato como yo decide hacer el cambio y puedo ayudarle, estaré encantado de hacerlo. Y si algún experto ve algo que pueda o deba cambiar, encantado de  recibir todos los consejos.

Un abrazo muy fuerte!!!










13 comentarios:

  1. Pues ahí va mi comentario para que compruebes su funcionamiento ;-).
    Me gusta mucho este nuevo diseño, percibo más estructura, claridad y nitidez, lo que hace más apetecible, desde mi punto de vista, seguir brujulenado por tu blog.
    Muy buen trabajo Pedro. Un muy fuerte apapacho

    ResponderEliminar
  2. Pues ahí va mi comentario para que compruebes su funcionamiento ;-).
    Me gusta mucho este nuevo diseño, percibo más estructura, claridad y nitidez, lo que hace más apetecible, desde mi punto de vista, seguir brujulenado por tu blog.
    Muy buen trabajo Pedro. Un muy fuerte apapacho

    ResponderEliminar
    Respuestas
    1. Muchas gracias Olga!!! Quién iba a ser la primera??? jajaja

      Vamos mejorando poco a poco. Y sí, creo que con este diseño ha mejorado mucho la ergonomía y orden. Hay en el blog más de 60 post y era un poco lioso navegar entre ellos.

      Otro "apapacho" para ti :D

      Eliminar
  3. El color verdecito...se ve mal con el fondo blanco. Ya sabes, cuestión de accesibilidad y contraste de colores.
    Lo de "lay out" .... !cachis!
    Una abrazo
    Alfonso

    ResponderEliminar
    Respuestas
    1. Gracias Alfonso. Llevas toda la razón!!! Buscaré como cambiarlo y lo cambio de color ¿rojo?

      Eliminar
  4. El color verdecito...se ve mal con el fondo blanco. Ya sabes, cuestión de accesibilidad y contraste de colores.
    Lo de "lay out" .... !cachis!
    Una abrazo
    Alfonso

    ResponderEliminar
    Respuestas
    1. Y por cierto, lo de "las out"... Llevas razón pero es que lo utilizo tanto ese palabro en el trabajo que no me he dado ni cuenta :-)

      Eliminar
  5. (el de arriba soy yo, tengo tantas cuentas que ya me lío y prefería comentar con esta)

    Buen cambio Pedro, me gusta, aunque deberías mirar el título que queda en varias líneas en vez de en una sola. Me da la impresión de que estás utilizando uno de tres widgets que se deben poder poner en la cabecera y por eso no utiliza todo el espacio disponible. Mira bien que el tema no tenga un sitio específico para incluir el nombre del blog.

    Si no lo hay puedes, por ejemplo, utilizar el primero para el título, el segundo para el texto descriptivo del blog y el tercero pues.. no se, los iconos de redes sociales o un bloque de Adsense. Así no quedará ese espacio en blanco en la cabecera.


    Preguntale al autor si no hay una versión en español para que sea más personal, hay algunas cosas en ingles que "rompen" un poco la continuidad.

    Lo dicho, me gusta el tema, sencillo, limpio, legible,.. pero es que soy muy detallista xD son críticas constructivas! :) Un abrazo compañero.

    ResponderEliminar
    Respuestas
    1. Muchas gracias Julian!!! Lo del título, me sigo pegando con él, lo tengo que cambiar pero hasta ahora no he dado con la manera. No puedo cambiar el título y no he sido capaz de cambiar el tamaño. Probaré con lo que comentas.

      Lo del inglés, llevas razón que se me han quedado "palabras" ingleses. Tengo que repasarlo todo para cambiarlo a Castellano.

      Se agradecen los comentarios amigo!!!

      Eliminar
    2. Veo que has ganado la pelea con el encabezado :-d

      Eliminar
    3. Siiiii, me ha costado pero el prueba error ha funcionado :-)

      Ahora me falta cambiar los colores y ponerle, debajo del encabezado, una imagen y finiquito por ahora el diseño.

      Gracias Julian!!!!

      Eliminar
  6. tu ya sabes pero ... http://accesibilidadweb.dlsi.ua.es/?menu=hr-trabajar-color
    http://definicion.de/layout/
    otro abrazo...
    Por cierto... ¿porque salen los comentarios dos veces?

    ResponderEliminar
    Respuestas
    1. Gracias!!! Me quedo con la página de la universidad de Alicante para verla con más detalle.

      Lo de los comentarios duplicados creo que tiene que ver con el logado. Pero lo investigaré. Esto del html me cuesta.



      Eliminar

Si quieres coger algo del Blog, puedes hacerlo si citas el propio blog. Con la tecnología de Blogger.