Cómo insertar vídeos de fondo en nuestra página web

Una de las tendencias que estamos viendo este año en Desarrollo Web es la integración de vídeos en el fondo de una página web. Como comentábamos la semana pasada desde el punto de vista teórico, esto es posible especialmente gracias a la popularización del formato de vídeo WebM, que consigue incorporar esta funcionalidad  sin afectar a la usabilidad y experiencia de usuario. En este tutorial práctico, explicamos las diferentes formas de insertar un vídeo de fondo en nuestra página web, un recurso audiovisual muy atractivo actualmente.
Leer más

Mejora el diseño de tu página web de WordPress con estos plugins

Dentro de los plugins que encontramos para WordPress, nos centramos en repasar algunos complementos especialmente recomendables para todos los administradores de páginas web realizadas con este gestor de contenidos. Esta selección nos permitirá aportar diferentes y atractivas posibilidades estéticas a un sitio web, con una interesante particularidad: apenas requieren conocimientos de programación o diseño para usarlos y sacarles el máximo partido.

Leer más

Personalización de los campos input de texto con CSS

Si queremos quitar los  bordes a  los campos input de texto o personalizarlos al máximo, CSS nos ofrece muchas alternativas para modificar los estilos y que así podamos conseguir que su aspecto se adapte a todos los requerimientos visuales de nuestra página web, como explicamos en este artículo.

Leer más

ITCSS, el triángulo invertido que facilita el trabajo con las hojas de estilo CSS

Las siglas ITCSS, que se corresponden con Inverted Triangle architecture for CSS (Arquitectura CSS del Triángulo Invertido en inglés), estandarizan las mejores prácticas para una forma de trabajar que facilita el Desarrollo Web con  hojas de estilo CSS y que facilita su crecimiento y adaptabilidad a medio y largo plazo, como explicamos en este artículo.

Leer más

¿Qué es CSS Grid?

Hace poco hablábamos de Flexbox, uno de los mecanismos de CSS más útiles en la  maquetación de páginas web, incluso lo enfrentábamos con Grid. Sin embargo, teníamos pendiente profundizar un poco más en el propio CSS Grid , otro de los recursos de diseño CSS para disponer con mayor libertad los elementos en una página web o aplicación, algo que hacemos en este artículo.

Leer más

¿Qué veremos en diseño y maquetación web en 2018?

Tal y como hicimos la semana pasada con las tendencias de 2018 en Desarrollo Web,  nos centramos ahora en las principales novedades que se esperan en diseño y la maquetación web durante este año. Su evolución constante nos llevará a centrarnos en las landing pages en vez de aglutinar todo el contenido en nuestra página principal y a optar por un diseño modular, en el que conviene ir aparcando el tradicional menú horizontal y el tan manido menú hamburguesa si queremos estar a la última en interfaces. Analizamos cómo va a cambiar todo en cuanto a  diseño, maquetación, color y forma, tipografías, imágenes, videos y efectos  en los próximos meses.

Leer más

¿Por qué conviene saber crear nuestros propios temas de WordPress?

No cabe duda de que los temas que ya existen para WordPress son un utilísimo recurso para personalizar una página web, como ya vimos en nuestro tutorial Primeros pasos con WordPress. Sin embargo, siempre tenemos la posibilidad de crear nuestras propias plantillas y compartirlas con la Comunidad de este popular gestor de contenidos. En próximos artículos, explicaremos cómo hacer uno de estos themes, pero de momento vamos a centrarnos en las ventajas teóricas de aprender a crear nuestros propios temas de WordPress.

Leer más

¿Grid o Flexbox? ¿Qué resulta más útil en diseño y maquetación web?

En las últimas semanas hemos hablado bastante de Flexbox, uno de los mecanismos de CSS más útiles de cara a la  maquetación de páginas web. Sin embargo, nos quedaba compararlo con Grid, otra de las opciones que nos permiten llevar más allá las posibilidades de CSS, algo que hacemos en este artículo. Y, sólo por enfrentarlos en una primera pasada, tenemos que reconocer que Grid puede hacer cosas que Flexbox no puede hacer y Flexbox puede hacer cosas que Grid no puede hacer. Con la ventaja de que ambos pueden trabajar juntos: un elemento de Grid puede ser un contenedor Flexbox y un elemento de Flexbox puede ser un contenedor de Grid.

Leer más

Profundizamos en el uso de justify-content de Flexbox

En este artículo, realizamos un ejemplo práctico de la propiedad justify-content de Flexbox, el mecanismo de maquetación web del que estamos hablando en últimos artículos. Recordemos que esta propiedad es muy útil para indicar cómo se van a colocar los justificados y márgenes de los ítems. A la hora de su distribución, podemos tanto justificarlos al inicio del eje como al final, indicar que se coloque un espacio entre ellos o entre ellos y los bordes.

Leer más

Las propiedades de los ítems de Flexbox

Si hace poco repasábamos las propiedades de los contenedores de Flexbox, en esta ocasión nos centramos en los atributos de  que permiten que los ítems tengan diferentes comportamientos. A continuación, veremos sus descripciones acompañados con unos ejemplos que nos ayuden a visualizar esas propiedades.

Leer más