Llega el verano, el tiempo libre (al menos lo que deja el trabajo), y por tanto más horas para dedicarle a la página.


PabloYglesias-ResponsiveDesign

Si habéis estado entrando últimamente en la versión web, habréis notado cambios sustanciales en el servicio, tanto estéticos como lógicos.

Por lo general, no suelo informaros con una entrada, ya que uso para ello los perfiles sociales, pero creo que he hecho las suficientes actualizaciones como para que den para un artículo, y que detallo a continuación:

Arquitectura de la web

  • Como ya os había comentado, con el cambio de arquitectura de Marzo, perdimos bastante posicionamiento orgánico. Una situación que he logrado remediar hace relativamente poco, mediante un grupo de redirecciones 301 y expresiones regulares, partiendo de una estructura como la que sigue:

RedirectMatch 301 /directorioAnterior/(.*) http://www.tuweb.com/$1

hoy en día, no deberíais tener problema alguno para acceder a la web desde enlaces externos antiguos, pero si encontráis alguno, agradecería que me informárais.

  • La página principal de la web ha pasado a ser el blog, dejando el portal como una página anecdótica y puramente informativa. Lo cierto es que como viene siendo habitual, la mayoría entráis en la página para leer el blog, y tal y como estaba antes, os obligaba a clickar una vez más para llegar a vuestro objetivo (dos veces en el caso de dispositivos móviles). De esta manera, nos ahorramos este paso previo, que no hace más que molestar.
  • Oscar de Dios (ES) me recomendó probar a incluir en nuestra web los comentarios de Google+. Lo cierto es que me morí de ganas cuando Blogger recibió esta característica, y cuando llegó a nuestra plataforma, dudé si implementarla o no ya que aunque tengo muchos más comentarios por Google+ que por el blog en sí (como es habitual), soy un poco reacio a delegar el control de los comentarios a una plataforma externa (que está hoy y quizás el día de mañana no esté). Aún así, he encontrado un aparente equilibrio con el cambio, ya que ahora tenéis a vuestra disposición la decisión de escribir comentarios mediante Google+, mediante Facebook o como siempre.

PabloYglesias-comentarios

Por defecto, aparecen los comentarios de Google+, pero en cualquier momento podéis cambiar a los de Facebook (por la estructura privada de esta red, la mayoría de las veces saldrá que hay 0 comentarios, pero qué se le va a hacer…), o los propios de WordPress (donde tendréis que escribir vuestro nick y correo para poder postear). El estilo, como no podía ser de otra forma, es responsivo, y se adaptar por tanto a cualquier tamaño de pantalla. Me interesa sobre todo que opinéis sobre el cambio, ya que según vuestros comentarios decidiré si seguir adelante con esto o volver al modo tradicional.


  • El portafolio ha cambiado ligeramente. Debido a que estos últimos meses por razones ajenas he estado envuelto en varios proyectos audiovisuales, he agregado al lightbox que gobierna el mostrado del portafolio soporte para el visionado de vídeos de Youtube y Vimeo, así como iframes (ya puestos damos soporte a cualquier otra plataforma). Además, he generado dos modos de visionado. El habitual, que mediante lightbox genera una capa superior en el navegador para recorrer las imágenes destacadas y vídeos de cada proyecto, y una página orgánica de cada trabajo donde encontraréis una galería propia del proyecto, así como la información y enlaces sociales oportunos. De esta manera, el portafolio sirve así mismo para visionar rápidamente los trabajos, y si alguno os llama la atención, con pinchar en su nombre os llevará a una página propia con más contenido referencial.
  • Con el abandono por parte de Twitter del soporte al RSS, el widget del pie de página había quedado inservible. He de dar las gracias a Antonio Ortiz (@antonello) de Xataka por aconsejarme el plugin Really Simple Twitter Feed Widget (EN), que funciona a las mil maravillas y es de lo más completo que he visto para WordPress.
  • Por recomendación de una de nuestras lectoras, Trinity (ES), agregamos no hace mucho el soporte para suscribirte a comentarios específicos (para los comentarios en la plataforma), así como la gestión de dichas suscripciones para cualquier usuario (sin tener que estar logueado), y un calendario en el widget lateral con las entradas de cada mes.
  • Los enlaces sociales del widget lateral también han sufrido un gran cambio. Los he reducido de tamaño y eliminado las imágenes de los seguidores. El de Google Plus muestra ahora también el número de conocidos que me tienen en sus círculos, y he agregado enlaces al feed, a Pinterest y a mi cuenta de Youtube para que no tengáis que bajar hasta el footer a buscarlos.

Diseño general

Pocos cambios drásticos en este sentido:

  • Eliminado el espacio superior e inferior de la página en la versión escritorio, que pasa a estar pegada a los márgenes como ya ocurría en la versión móvil. Recomendación de +Oscar (ES). Con ello, recuperamos 50 pixeles perdidos para mostrar más información sin darle al scroll.
  • Eliminando el widget propio de búsqueda de la barra lateral. En su defecto, estará presente en todas las páginas, justo debajo del menú, con un diseño propio (que cambiará adaptándose al modo por defecto de botoneras que usan los diferentes SO).
  • Corregido un pequeño error en los Media Queries por el que la web cargaba la versión móvil en portátiles de baja resolución.

Diseño Móvil

Las versiones móviles son principalmente las mayores beneficiadas de esta serie de cambios. Sobre todo se han eliminado muchas de las Media Queries temporales que estaba usando para parchear pequeños errores según qué versión, por lo que ahora puedo decir con total tranquilidad que PabloYglesias sigue al pie de la letra los estándares del responsive design.

  • Versión móvil de baja resolución: He eliminado toda la información sobrante (barra lateral, que se mostraba bajo el contenido, y el pie de página), por lo que en esta versión, veremos una web que únicamente carga el menú desplazable (con la barra de búsqueda en su interior), las entradas y los enlaces sociales. Una carga mucho más rápida y efectista que la anterior, con el añadido de recuperar a una primera posición la barra de búsqueda, que con el cambio de estilo de Marzo había acabado a mitad de página.
  • Versión móvil de alta resolución (y tablet en vertical): La principal diferencia con la anterior es que en este caso, sí muestra el slide principal del blog, que además puede recorrerse mediante el gesto de desplazado táctil. He solucionado de paso un pequeño error que se producía en terminales de nueva gama (de este año principalmente) con el escalado incorrecto del logo de la web (que cargaba al 100% de tamaño, cuando debería ser al 60%). Tanto imágenes como vídeos cargan ya correctamente al máximo de la pantalla.
  • Versión tablet en horizontal: Muestra una versión muy cercana a la que encontramos en la versión de escritorio, aunque para ahorrar ancho de banda, las imágenes son menos pesadas.

Con estos cambios, hemos ganado en agilidad y sobre todo en accesibilidad, además de adaptarme a las pantallas de nueva generación (debo dar las gracias en este caso a Blackberry England por dejarme probar el z10 y de paso abrirme los ojos a la deficiencia de la web en estas nuevas resoluciones móviles).

Por supuesto, y como ya habréis visto, se trata de cambios que en muchos casos surgen gracias a la participación de la comunidad recomendándome que le eche un ojo a un tema en particular. Lo importante del blog es su contenido, por lo que si echáis en falta algo, si creéis que debería modificar cualquier cosa, o si simplemente queréis preguntarme más detenidamente sobre alguno de los cambios anteriores, no dudéis en poneros en contacto conmigo. Soy una persona bastante activa en los medios sociales (desde el blog, pasando por el mail, hasta en Twitter (ES), Google+ (ES) y Facebook (ES)), así que por canales que no sea :).

 

Edit a día 30 de Junio del 2013: he eliminado del tema cualquier referencia a comentarios (ya que con el cambio, es de esperar que los comentarios de cada publicación en WordPress bajen a favor de Google Plus). También he dejado por escrito justo encima de la llamada al box de escritura, la necesidad de mencionarme en un comentario de Google Plus, ya que de forma natural, no se me notificaría de nuevos comentarios. Queda pendiente ver el futuro del widget inferior de comentarios, que quizás con este cambio pase a ser innecesario (y sería entonces cambiado por otro).

Edit a día 2 de Julio del 2013: Bueno, después de estudiar la API de Google+ Comments a fondo, no hay manera de modificarla para obtener lo que yo buscaba, así que dejaré por defecto los comentarios de WordPress, donde sí recibo notificaciones y puedo gestionar a la perfección, y daré como optativa Google+ y Facebook (y cuando tenga tiempo quizás twitter). Paso de tener que generar dos APIs de Google desde 0 para una tontería como esta.