Uno de los mayores problemas para los desarrolladores web es la diferente interpretación de los estándares web por parte de los navegadores, ocasionando que un sitio web se vea de forma distinta en diferentes navegadores. Ademas, con el surgimiento de dispositivos móviles en los últimos años, ahora también se deben hacer pruebas de las páginas bajo distintas resoluciones para abarcar mas usuarios.
Aunque puede consumir mucho tiempo navegar desde distintos dispositivos y sistemas operativos para hacer las pruebas, existen herramientas para automatizar este proceso. Una que me gustó fue Remote Preview, una aplicación web que al definir una URL en un panel central, envía el navegador web de todos los dispositivos a esa dirección, permitiéndote ver como es la página en cada dispositivo, ademas, cada 1100ms chequea la URL, por lo que si la cambias, automáticamente todos los dispositivos visitan el sitio. Esto permite ahorrar el tiempo de navegación desde cada dispositivo y permite identificar rápidamente, problemas de compatibilidad entre resoluciones o plataformas.
Para entender mejor esta herramienta, les dejo un video donde pruebo como se ve mi blog en distintos navegadores y plataformas móviles:
Remote-Preview: Herramienta para probar sitios web múltiples dispositivos
Así que si desarrollas un sitio web, no dejes de usar esta herramienta para comprobar que el sitio se ve bien desde tu teléfono, tableta, computadora, desde los navegadores de escritorio, sistema operativo y otros. Mientras mas compatibilidad brindes a dispositivos, mas usuarios podrán leer tu contenido y recibir mas visitas.
Cuando estaba programado en el 2do QRDA, durante un momento se cayó la conexión y no se podía escuchar música en streaming. Por lo que empecé a colocar mi música y empecé a parodiar como son los selectores de música, quienes suelen actuar en el escenario como si estuviesen haciendo muchas cosas.
Dj Skatox
Lo que no sabía era que Tatica me estaba grabando en todo momento XD.
El pasado 28 de noviembre, se realizó la segunda edición de QR-DA en la ciudad de Palo Gordo, Táchira. Este evento consiste en un hackaton o una reunión de informáticos, para realizar un aplicativo de labor social, liberarlo y que sea utilizado por muchas personas.
2da Edición
La segunda edición fue organizada por Richzendy y Tatica, quienes prestaron su futura casa como sede del evento. La temática general era probar e intentar instalar el software EventoL para llevar un mejor registro de las tareas realizadas en el FLISOL del 2016, sin embargo, cada integrante podía llevar su propio proyecto a trabajar, siempre y cuando cumpliera con la filosofía de QR-DA.
Mi proyecto
En mi caso, como no sé programar en Django busqué una alternativa y como desde hace tiempo estuve hablando con Richzendy para reactivar el grupo de Linux/Software Libre del Táchira, aproveché la oportunidad para realizar el sitio de Linux Tachira o mejor conocido como TALUG (Tachira’s Linux User Group).
El diseño inicial fue realizado por Tatica, quien se encargó de definir la disposición del sitio, donde ubicar el contenido. Posteriormente junto a Xombra, construimos ese diseño en Bootstrap mientras Tatica ayudó a mejorar el arte creativo. Una vez construido el HTML inicial, llegó Johnpunk para ayudarnos con detalles para hacer el sitio lo mas tachirense posible. Finalmente luego de construir el sitio, Richzendy se encargó de actualizar los DNS, configurar el envío de correo y corregir bugs iniciales.
Fase de planificación
«Todos» programando con mucha concentración
Maria «Tatica» Leandro, Hector «Xombra» Mantellini y yo
En ningún hackaton falta la Pizza y Refresco
Xombra mirando la vista de la ciudad en el receso
Maria Leandro editando una foto mía
Programando
Cierre del evento con una sesión de Guitar Hero
Cierre del evento con una sesión de Guitar Hero
Proyectos realizados
Debido a que estuve concentrado en el desarrollo del sitio de TALUG, no me fijé mucho en lo que hizo en el resto, solo lo de Maria Leandro porque estaba a mi lado. Por mi parte logramos finalizar el sitio de Linux Tachira, pude acomodar algunos detalles visuales de mi sitio web profesional. Tatica se que ayudó con mejoras del arte de Linux Tachira, hizo el diseño de papelería para el FLISOL, acomodó detalles del sitio web del FLISOL, entre otros.
Por parte de EventoL, tengo que entendido que se logró descartar las plataformas donde no puede correr, las dependencias necesarias, se logró crear scripts para crear espejos de repositorios de distribuciones Linux para usarse en el FLISOL, entre otros. Tal vez parezcan pocas cosas, pero trabajamos solo 1 día y fuimos como máximo 8 personas en el evento.
Experiencia adquirida
Algo que me gustó del evento, aparte de compartir con amigos y panas de otras ciudades, fue el ambiente hacking. Por una parte, dar parte de tu tiempo para realizar tareas de código abierto. Por otra parte, compartir conocimientos y permitir expandir tus habilidades gracias a otros, por ejemplo, ese día descubrí una herramienta recomendada por Xombrapara el diseño de interfaces con bootstrap, Richzendy me recomendó un servicio para el envío de correos desde aplicaciones Javascript, entre otros.
Palabra finales
Ojalá en el futuro se realicen mas eventos de este tipo y se realicen ediciones en distintas ciudades. Así podremos lograr avances en el desarrollo de software libre y mejorar nuestra experiencia profesional.
En el pasado JSConf de Europa, Ryan Seddon realizó una excelente charla sobre todo el proceso de un navegador web (como Firefox, Chrome, Edge o Safari) para visualizar una página web.
Este proceso me parece un tema esencial para todo desarrollador web (tanto frontend como backend), sin embargo, he notado que son pocos quienes saben el proceso de dibujado de la página web y al momento de crear sitios web, no lo hacen de forma correcta o muy deficiente, causando problemas de rendimiento en equipos con poca capacidad de cómputo.
Ryan Seddon: So how does the browser actually render a website | JSConf EU 2015
Por los momentos solo está en inglés, pero pueden activar la traducción de subtítulos de Youtube a español y disfrutar un poco del video si no entienden el idioma original del vídeo.
Si quieres seguir investigando sobre este tema, les recomiendo lee este largo pero interesante artículo titulado How browsers works (Cómo funcionan los navegadores), espero que les sea de gran utilidad para futuros desarrollos.