Etiqueta: CSS
Yendo más allá de operaciones matemáticas básicas, podremos aprovechar la capacidad de calc para operar con distintos tipos de unidades a la vez, con el fin de generar estilos más flexibles, con técnicas que no son...
Con CSS actualmente solo podemos acceder al perfil de color sRGB, pero esto va a cambiar pronto con la llegada de las funciones Lab y Lch, preparadas para acceder a todos los colores que ya soportan...
Las fuentes variables son una gran revolución digital que, a pesar de llevar con nosotros cerca de 4 años y de tener un soporte de navegadores superior al 91%, aún cuesta ver en sitios en producción.
Las custom properties nos proporcionan una manera de tener algo parecido a variables en CSS. Pero ¿estamos utilizando todo su potencial? Aquí tienes una técnica para usar custom properties para evitar repetir código y hacerlo más...
Así que ya te consideras un experto o experta en HTML, CSS y JavaScript. Pero ¿crees que es lo único que puedes hacer por tu equipo?
Probablemente hayas oído hablar de CSS-in-JS. Puede que seas un firme detractor o un fiel defensor. O simplemente, te da igual. Vamos a hacer un análisis sobre esta forma de escribir CSS y si os puedo...
CSS nos permite construir cosas extremadamente complejas con un puñado de caracteres. El lenguaje ha crecido mucho con los años y el abanico de posibilidades que nos brinda es enorme.
Hace poco tuve que afrontar en el trabajo una tarea poco habitual: "Dar la oportunidad al usuario de imprimir una web". Ante tan extraño reto y con total libertad para ejecutar este poco frecuente encargo, decidí...
Un pequeño tutorial de cómo crear 4 diferentes sistemas de votación para artículos o productos en nuestra web con un poco de HTML, Javascript y mucho CSS nos darán la posibilidad de agregar estos elementos a...
Los formularios dieron un salto cualitativo con HTML5, los nuevos tipos de input y la validación por el navegador. Pero podemos ir un paso más allá y mejorar la UX de los mismos gracias a las...
Últimamente me entristece ver cómo la maquetación es la parte del trabajo de crear una web que menos se valora, incluso se desprecia. Trabajar con HTML y CSS no es programar, pero también es importante.
Una de las tareas más ingratas a la que todo frontend ha de enfrentarse alguna vez es limpiar, estructurar y arreglar bugs generados por un código desastroso heredado en el 99% de los casos.
Esparta se diferencio del resto de ciudades estado griegas gracias a su particular visión de la educación que impartía a sus jóvenes.
Hacer un sitio con buena usabilidad abarca muchas facetas, una de ellas es que sea cómodo y agradable de usarlo. Y algo que haría muy agradable la experiencia a cualquier usuario es no tener que desgastar...
La web con patrones rtl (right to left) es una realidad olvidada y mal implementada dentro del mundo del diseño web. Este artículo arroja algunos datos interesantes sobre este mercado de usuarios emergentes, sobre los patrones...
Jugaremos a re-crear CSShake, una librería de animaciones CSS vibrantes, en React.
Este año he decidido no escribir sobre un tema concreto, sino hacer una lista de “trucos” que he ido recopilando a lo largo del año para hacer cosas que “supuestamente” no pueden hacerse o deberían hacerse...
El CSS es un lenguaje de estilado de reglas sencillas pero parece que nos gusta complicarlo añadiéndole funcionalidades de programación o metodologías de automatización. ¿Por qué lo hacemos? ¿Está justificado?
Para que los efectos y animaciones de tu web sorprendan a los usuarios tenemos que saber ocultarlos. En este artículo veremos 3 Técnicas de Camuflaje y un ejemplo de cada una de ellas.
El anhelo de todo diseñador, programador o viejo webmaster desde los tiempos de geocities, ha sido el homogeneizar los estilos de una web para todos los navegadores.
En web hay pocas cosas peores que enfrentarte a un banner de flash o a la búsqueda de logos vectoriales. Si no cuentas al mail como una de ellas, agárrate los machos: ¡mails responsive!
El Atomic Design es un sistema que nos permite tener un lenguaje común entre los miembros del equipo de desarrollo web, así como hacer más evidentes las relaciones entre los distintos elementos que componen una página.
Como profesionales de la web, es nuestro deber cubrir tantos casos de uso como sea posible. Veremos como conseguirlo de manera incremental, mejorando el proceso de desarrollo y aceptando cómo funcionan las tecnologías web.
Sé lo que estás pensando: “Oh no, ahora que había aprendido Sass aparece otra herramienta más que tengo que aprender, esto nunca termina…” Pero tranquilo, no vine hasta Octuweb para decirte que tenés que cambiar tu...
Es un orgullo participar por segundo año consecutivo en esta excelente idea que es Octuweb. Si el año pasado hablábamos de como maquetar una tabla en webs adaptativas, este año vamos un poco más allá y...
Cómo personalizar los marcadores (marks) de Google Maps, utilizando las clases y métodos que nos ofrece su API. Veremos cómo personalizar su aspecto, pero también cómo podemos hacer que sean "atacables" desde CSS para animarlos con...
Ni los más optimistas creyeron en su resurrección, pero 16 años después ha llegado la hora de aprovechar todas y cada una de las ventajas que nos ofrece SVG para nuestros proyectos web.
Tutorial para crear un diseño de galería con cajas de altura automática y responsive usando FlexBox de CSS3, sin usar Javascript.
Si hay un trabajo duro y desesperante, incluso más que declarar CSS para compatibilizar con los IE's, es el dar nombre al valor del atributo "class" del HTML.
En este artículo abarcaremos diferentes opciones para mostrar contenido dentro de tablas html sin perder de vista su correcta visualización en todos los dispositivos si nuestra web es adaptativa.
¿Te enfrentas a un proyecto grande y no sabes cuál es la mejor manera de organizar tu CSS? Aprende cuál es la metodología que mejor se adapta a tu estilo y tu proyecto.
Un recorrido por las funciones básicas de las propiedades box-shadow y text-shadow a priori poco relevantes. Pero pueden y de hecho tienen, un potencial enorme desconocido para crear bordes, falsos gradientes, relieves y incluso iconos.
Si has usado algún framework de CSS, algún componente de jQuery UI o el último script para hacer sliders responsive sabrás por propia experiencia qué es la clasitis, una enfermedad muy extendida a la que se...
Desde la llegada de los mediaqueries hemos elegido breakpoints basados en el viewport sin saber que eso no es lo que en realidad queremos.
La vida está llena de pequeñas cosas que, sin darle mucha importancia al principio, comienzas a usarlas de forma recurrente, hasta que llega un viernes cualquiera en el que miras por la ventana, con el sol...