En el primer artículo de esta serie, estudiamos los fundamentos de Jekyll y creamos un primer sitio estático sencillo. En esta entrega aprenderemos a compilar el sitio estático en nuestra propia máquina para probarlo en local antes de subirlo a Github. También veremos cómo componer publicaciones y ver los resultados. [Más]

Al principio de los tiempos las páginas se hacían todas "a manivela", una por una. Luego vinieron los primeros gestores de contenidos y finalmente monstruos como Wordpress, que para cualquier tontería necesitan megas y van lentos a menos que los optimices. Una tendencia que hay desde hace relativamente poco tiempo es el uso de generadores estáticos de páginas, el más conocido de los cuales es Jekyll. Con la colaboración de Github es posible usar ambas herramientas para conseguir sitios web y blogs albergados gratuitamente y rapidísimos. En esta serie de posts que empezamos hoy te contamos lo que necesitas saber para ponerlos en marcha. [Más]

El comportamiento de un elemento con position:absolute; quizá te puede parecer errático de entrada, especialmente si no tienes suficiente experiencia maquetando con CSS y no conoces el detalle fundamental que te voy a contar en este post. Así que, si alguna vez te has desesperado al intentar posicionar un elemento de forma absoluta, mejor sigue leyendo. [Más]

Hace unos días Bootstrap liberó su versión 4.2.0, con algunas novedades dignas de mención que vamos a repasar a continuación, entre ellas unos nuevos componentes para denotar progreso en tareas en segundo plano, unas nuevas notificaciones e interruptores sí/no del mismo estilo que los que tiene iPhone. Además también han incluido unas cuantas mejoras de características ya existentes. Vamos a verlas. [Más]

No te alarmes por el título de este post. Esto no va de mindfulness ni de autoayuda, y, por supuesto, no te vamos a tocar los chakras. Es simplemente un ejercicio de pensar un poquito diferente para mostrar lo amplio que es el abanico de posibilidades al definir reglas CSS. Tampoco es que estemos descubriendo la pólvora, simplemente se trata de darte pistas para encontrar alternativas eficaces a la hora de resolver tus maquetaciones que quizá no te habías planteado. [Más]

El truco de hoy es corto y muy sencillo, pero al mismo tiempo poco intuitivo, y puede resultar útil en ciertas ocasiones. Básicamente consiste en "detener el tiempo" o "congelar" una página web de modo que podamos examinarla tal cual está en ese preciso instante sin preocuparnos de que nuestra interacción sobre esta pueda cambiar nada, no mediante un script ni por culpa de cualquier otra acción. Esto puede ser muy útil para depurar o afinar elementos HTML o reglas CSS que afectan a elementos dinámicos, que aparecen y desaparecen en función de las acciones del usuario. Vamos a verlo... [Más]

¿Con qué dispositivo estás leyendo este artículo? Si lo piensas, dependiendo del momento del día y otros factores, seguramente podrías responder varias cosas diferentes: con mi smartphone táctil personal de 6 pulgadas, un tablet de 10'' con resolución de 2048x1536, a o mi monitor de 32'' con resolución WQHD y usando un teclado y un ratón. Y es que hoy en día la información y las aplicaciones se consumen en infinidad de formatos, y una misma persona utiliza diversos dispositivos con capacidades de pantalla, factores de forma, tamaños y resoluciones diferentes, y usándolos de manera táctil o de la manera tradicional: con teclado y ratón. Esto afecta tanto a webs como a aplicaciones y se dominar todos los formatos con un solo diseño es indispensable para cualquier desarrollador o diseñador web. [Más]

Rollbar es una herramienta para análisis de código fuente y detección de errores. Para contribuir a su comunidad de desarrolladores, han analizado su base de datos de miles de proyectos y han hallado los 10 principales errores que se suelen producir en JavaScript. Vamos a mostrarte qué los causa y cómo evitar que sucedan. Si evitas estos "descuidos", te convertirás en un mejor desarrollador. [Más]

En este tutorial vamos a aprender cómo hacer, de una forma muy sencilla y solo con HTML y CSS una galería de imágenes (o de cualquier otro elemento) al estilo Pinterest. Esto es, tenemos imágenes de distinto tamaño que no se alinean horizontalmente, sino verticalmente en columnas. Realmente Pinterest no inventó nada nuevo, pero consiguió polpularizar esta forma tan peculiar de presentar el contenido. [Más]

Segundo y último día del Chrome Dev Summit 2018. En el artículo de ayer nuestro tutor David te contaba desde San Francisco que la mayoría de las conferencias impartidas intentaban hacer hincapié en lo importante que es cuidar el rendimiento y tiempo de respuesta de tu página web. Se podría decir que el foco de ayer consistía en analizar y mejorar la web actual. El foco de hoy ha sido distinto y lo que se pretendía mostrar es cuál va a ser el futuro de la Web en los años venideros. Tema sin duda interesante. Te contamos los detalles a continuación... [Más]