El viewport de un dispositivo es el tamaño teórico que tiene la pantalla de dicho dispositivo, el cual no tiene por qué coincidir con la resolución real de la pantalla (de hecho no coincide casi nunca en dispositivos modernos). La resolución se refiere al número de píxeles que puede mostrar dicha pantalla. Estos dos conceptos a pesar de ser tan sencillos tienen un gran potencial y es la base del funcionamiento de los navegadores móviles. Te contamos qué son, en qué se diferencian y cómo gestionarlos. Y te hablamos del concepto "píxeles CSS". [Más]

Si estás programando una aplicación tipo dashboard, escribiendo un resumen de estadísticas, o construyendo aplicaciones web para manipular datos, conviene que conozcas las herramientas que te permiten dibujar todo tipo de gráficas en la Web. En este artículo damos un repaso a cinco de las mejores bibliotecas JavaScript que puedes encontrar para esta tarea. [Más]

Los GIF animados vuelven a estar de moda. Cada vez se ven más. Pero este tipo de archivo es muy ineficiente, consume mucho ancho de banda, ralentiza las páginas y hace que el navegador haga más uso del procesador del que debiera. De hecho, la mayor parte de las páginas que tienen GIFs realmente no los utilizan. Usan otro truco para que parezcan GIFs pero en realidad los optimizan para que no tengan ninguno de estos inconvenientes. En este post te contamos cómo conseguir lo mismo... [Más]

Bueno, en realidad no es solo cosa de las imágenes. Suele ocurrir en elementos en línea que están dentro de un elemento de bloque sin altura definida. Si llevan un tiempo trabajando en el frontend, seguro que alguna vez te ha pasado algo así: Tienes una serie de imágenes, cada una dentro de un enlace, y para ordenar esos enlaces decides darles un display:block; o inline-block, para poder manejarlos a gusto. Pero, oh sorpresa, de repente te aparece un hueco debajo de la imagen que no sabes de dónde ha salido. [Más]

El sistema grid de CSS es el nuevo estándar para estructurar elementos en 2 dimensiones en páginas web. A diferencia del sistema flexbox, grid permite definir con precisión la distribución de los elementos en los ejes horizontal y vertical simultáneamente. Además, soluciona muchos problemas clásicos de estilo y estructura con mucho menos código CSS, y nos puede servir como sustituto de frameworks responsive tipo Bootstrap, si únicamente nos hace falta la funcionalidad de columnas. En este artículo construiremos estructuras comunes de páginas web de forma simple mediante grid, y veremos lo versátil que llega a ser. [Más]

En unos pocos días Google Chrome empezará a marcar como inseguros a todos los sitios web que no se sirvan a través de HTTPS. En este artículo te contamos cuándo ocurrirá esto, por qué, cómo puedes evitarlo y trataremos de desmentir algunos mitos importantes que existen acerca de HTTPS y las conexiones seguras en Internet. [Más]

El pasado 29 de mayo se celebró en Madrid la DotNET2018, el evento más importante del año para la comunidad .NET donde, además de ser patrocinadores, participaron tres de nuestros tutores. Aquí te traemos en vídeo sus interesantísimas ponencias y los ejemplos de código. [Más]

Pensemos en un píxel de un objeto o imagen como una terna (r, g, b) donde los valores r, g y b representan la cantidad de color rojo, verde y azul. Estos valores se encuentran en el rango de 0 a 1, siendo 1 la máxima cantidad posible, es decir, (1, 1, 1) sería el color blanco y (0, 0, 0) el negro. Ahora, cuando dos objetos se superponen, habrá uno de ellos que esté por encima (o en el frente), y generalmente su color se impondrá, sustituyendo al que esté debajo (o en el fondo). Sin embargo, los colores de frente y de fondo se pueden mezclar de otras formas, produciendo un color final distinto a ambos. Esto es de uso común en programas de ilustración y diseño gráfico, que nos permiten dibujar utilizando operaciones sobre los colores: desde aritmética básica como sumar y restar hasta otras operaciones más complejas, la combinación de colores invertidos o los cálculos en otros espacios de color. En este artículo vamos a aprender a hacer algunas de estas operaciones con CSS, y a estudiar algunas aplicaciones interesantes. [Más]

Puede que ahora parezca una perogrullada, pero una de las características que contribuyó a la popularización de la web y de HTML (junto a los enlaces de hipertexto) fue la posibilidad de insertar imágenes. Al principio eran simplemente imágenes de mapas de bits, donde reinaban los gif y los jpg por su relación calidad/peso, en función de las características de la imagen. Pero pronto apareció la necesidad de buscar un formato estándar vectorial y así nació SVG (Scalable Vector Graphics) entre 1998 y 2001. [Más]

El pasado 3 de Mayo de 2018 se publicó oficialmente la versión 6 de Angular bajo las palabras: "The first release of Angular that unifies the Framework, Material and CLI". Esta frase resume perfectamente la finalidad que persigue esta release, en la cual se hizo un gran esfuerzo por parte del equipo de Angular por aunar el framework, la biblioteca de estilos y la línea de comandos en una misma versión, la 6.0.0. Vamos a ver cuáles son las principales novedades. [Más]