Artículos

2016

2015

  • Dia 1

    ¡Engañemos al CSS!

    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 de otro modo....

  • Dia 2

    REST API y el futuro de los Themes en WordPress

    WordPress se está preparando para algo nuevo y excitante. La forma de trabajo, interacción y diseño con este CMS van a cambiar radicalmente y los themes son una de las piezas claves de esta revolución. Hablamos de la REST...

  • Dia 3

    Animando SVG con VelocityJS

    A la hora de animar SVG nos encontramos con el poco éxito de SMIL y las limitaciones de CSS3, pero nos queda toda la potencia de JavaScript. En este artículo vamos a ver VelocityJS, una de las librerías más...

  • Dia 4

    Trabajar con CSS en el 2015

    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 crear CSS es necesario controlar, Less, Sass, Stylus,...

  • Dia 5

    Técnicas para Efectos y Animaciones CSS3

    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. Esto servirá como modelo para otras...

  • Dia 6

    Breve historia de un conflicto inexistente: Normalize vs Reset CSS

    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. Como respuesta a esa problemática surgieron iniciativas como reset y/o normalize.

  • Dia 7

    Mails responsive, del papel a la pantalla

    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! Desde el monstruo de Frankenstein...

  • Dia 8

    Cosas que deberías tener en cuenta si decides trabajar con WordPress

    Si estás leyendo esto posiblemente seas un diseñador, desarrollador, site-builder (ese perfil profesional que nos hemos sacado de la manga), SEO, escritor, usuario o lo que sea y trabajas con WordPress a diario -bien sea como herramienta de trabajo,...

  • Dia 9

    Psicología del Color aplicada al Diseño Web

    Los colores forman parte de nuestra vida, de hecho a veces guían nuestras decisiones casi sin que nosotros nos demos cuenta. Cada uno de ellos transmite unos sentimientos, que pueden cambiar nuestra forma de actuar. Son muy poderosos, así...

  • Dia 10

    Adiós bases de datos, construyendo sitios rápidos con Grav

    En los años que llevo diseñando y desarrollando proyectos web, la experiencia te hace ver que lo que has estado usando no siempre es la mejor solución para todo. A medida que empecé a trabajar en conjunto con

  • Dia 11

    Diseño atómico con SCSS + Blade

    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.

  • Dia 12

    Aceptando lo inesperado

    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.

  • Dia 13

    Animando experiencias

    Este artículo acerca algunos conceptos teóricos a tener en cuenta a la hora de emplear la animación como otro elemento más dentro de la comunicación visual en el desarrollo de una interfaz.

  • Dia 14

    Introducción a PostCSS

    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 forma de trabajar....

  • Dia 15

    ¿Debe un diseñador web saber programar?

    Detrás de esta simple pregunta hay mucha historia. La respuesta correcta podría acabar con la eterna lucha entre diseñadores y programadores, pero como es lógico, no hay una respuesta correcta. Se han escrito miles y miles de palabras defendiendo el...

  • Dia 16

    Newsletter basada en RSS con MailChimp

    Descubre cómo crear una Newsletter basada en RSS con MailChimp para enviar automáticamente emails a tus suscriptores y así atraer más tráfico a tu sitio web.

  • Dia 17

    Manipulando CSS con jQuery

    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 veremos como manipular...

  • Dia 18

    Receta: Trabajando con APIs (El tiempo en tu web)

    Nunca antes había sido tan fácil conectar nuestros sitios web o aplicaciones online con servicios de terceros gracias al auge de las APIs. En este mini tutorial echamos un vistazo completo al proceso de obtener datos de una API...

  • Dia 19

    Diseño del aprendizaje

    Cada aplicación es distinta y todos necesitamos cierto tiempo para acostumbrarnos a utilizarlas. De nosotros depende que las personas que manejen nuestras aplicaciones sean capaces de aprender de manera cómoda y transparente como sacarles todo el provecho.

  • Dia 20

    ¿Se ha convertido la web en algo aburrido?

    Dejadme que os haga una confesión: estoy un poquito cansado de los temas recursivos que nos rodean y que aparecen una y otra vez para darle cierta vidilla a la polémica, a las generalidades y a la confrontación dialéctica...

  • Dia 21

    Vigencia Planificada

    Nunca en la historia de la humanidad el hombre había tenido tanto acceso a la información y en frecuencias inimaginables. El tsunami de información actual lleva a que cada uno tome iniciativa si quiere mantenerse vigente. Como consultor e investigador,...

  • Dia 22

    Yo de Affordance no sé nada, o ¿sí?

    Te ha pasado alguna vez… ¡confiesa! te has hecho el tonto con las manos en los bolsillos y has disimulado mirando hacia otro lado. Luego has pensado: “¿ de qué está hablando este hombre?” Affor… ¿qué? Pero en realidad...

2014

  • Dia 1

    Crear una fuente de iconos con Sketch

    En este artículo aprenderemos como configurar Sketch, junto con Sketch Tools, para poder crear fuentes de iconos personalizadas para tus proyectos web. Este proceso es un poco laborioso pero te permitirá optimizar tus tiempos a la hora de desarrollar proyectos...

  • Dia 2

    Git para diseñadores: primeros pasos

    Da igual que seas desarrollador backend o frontend o diseñador web, el control de versiones es un aspecto que debes aprender para trabajar de forma profesional. En este artículo vemos una introducción a Git, uno de los sistemas más...

  • Dia 3

    Custom Google Maps markers: estilos y animaciones CSS3

    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 CSS3.

  • Dia 4

    Sprites con SVG

    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.

  • Dia 5

    Diario de compra de un uxuario

    Es una realidad que cada día más personas se aventuran a comprar a través de Internet, un gran centro comercial que nos abre sus puertas 24 horas al día. Yo soy uno de ellos. Mi objetivo en este artículo, es...

  • Dia 6

    Introducción a Web Components: ¡El HTML ha muerto, larga vida al HTML!

    ¿Conoces los Web Components? ¿No? Pues este artículo te ayudará a introducirte en este nuevo estandar HTML, que cambiará el diseño web por completo. ¡No seas el último en enterarte!

  • Dia 7

    CSS3: galería con columnas de misma altura, autoajustable según contenido

    Tutorial para crear un diseño de galería con cajas de altura automática y responsive usando FlexBox de CSS3, sin usar Javascript.

  • Dia 8

    Cómo crear un plugin en Sublime Text

    En este artículo vamos a ver como crear un plugin en Sublime Text. Para desarrollar un plugin necesitas conocimientos básicos de programación y también del lenguaje Python y por supuesto una idea, algo que tú creas que necesitas para...

  • Dia 9

    Formularios en la era de HTML5

    Hasta hace muy poco un formulario tenia poco mas que 4 o 5 tipos de campo y teníamos que jugar con javascript para hacerlos más funcionales. Vamos a hablar de los nuevos tipos de campos que HTML5 trae bajo el...

  • Dia 10

    WPO: Optimizando webs de alto tráfico

    En este artículo vamos a conocer qué es eso de WPO y cómo hacer para optimizar la velocidad de carga de nuestra web, algo que gustará a usuarios y buscadores.

  • Dia 11

    Por un Diseño y Desarrollo Web Sustentable

    Un servidor web en promedio produce anualmente más de 630 kg. de CO² y consume 1.000 KW/h de energía. Un sitio del tamaño de Tumblr.com es responsable por la emisión de 2.600 toneladas de CO² por día. ¿Cómo lidiar...

  • Dia 12

    Nombres de Clases por su apariencia. ¡No son semánticas?

    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. Y si una vez decidido, y tras revisar el documento el...

  • Dia 13

    WordPress, la potencia sin control no sirve de nada

    WordPress es el gestor de contenidos más utilizado, aproximadamente un 25% de todo internet está creado con él. Conoce el por qué de su popularidad y cómo sacarle el máximo partido.

  • Dia 14

    Responsive Tables

    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. Intentaremos no utilizar frameworks ni lenguajes extras al CSS pero...

  • Dia 15

    Organización del CSS en proyectos grandes

    ¿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.

  • Dia 16

    El poder de las sombras en CSS3

    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. A lo largo del...

  • Dia 17

    Patternizando

    La importancia de construir un lenguaje particular para cada proyecto; una serie de pautas que le dan coherencia al sistema en su conjunto. Aquí algunos pequeños pasajes, ejemplos y scripts...

  • Dia 18

    Generando Gifs con HTML5 Canvas y Javascript

    Gif es uno de los formatos más famosos que podemos encontrar, este tuvo su repunte y éxito en la era de GeoCities y hoy en día en varias formas, colores y sabores en varias redes sociales o agregadores de...

  • Dia 19

    AMCSS – El final de las clases

    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 ha tratado de...

  • Dia 20

    Automatización y el Nuevo Mundo

    La Web nunca duerme. Las tecnologías evolucionan, surgen o desaparecen sin dar descanso. Nuestro papel como diseñadores y desarrolladores es equiparnos con herramientas a la altura de las circunstancias. Descubre nuevas herramientas y modelos de trabajo para liberarse...

  • Dia 21

    Atomic PS Design

    Desde hace más de un año que leí a Brad Frost decir: “We're entering the Post-PSD Era of web design” mi preocupación ha ido en aumento, ¿cómo adaptarse a las necesidades actuales del mundo web?. Durante mis años como...

  • Dia 22

    Element Query

    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 tendencia a modularizar todo nos obliga a ir más allá y buscar un query...

  • Dia 23

    Pseudo-elementos CSS que molan (o que al menos te salvan de un aprieto)

    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 anaranjado el azul...