Entradas

¿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

Las propiedades de los contenedores Flexbox (I)

Ya hace un tiempo que vimos las principales ventajas de Flexbox y sus aportaciones a CSS3, así que ahora queremos profundizar en algunos de sus aspectos más prácticos y funcionales para las tareas de Desarrollo Web y vamos a ver cómo aplicar las reglas de Flexbox y configurarlo para personalizar su comportamiento.

Leer más

Repasamos los principales conceptos de Flexbox

Como vimos en ¿Qué aporta Flexbox a CSS3?, Flexbox es un mecanismo de CSS3 que multiplica las posibilidades de maquetación web y nos facilita la composición del diseño. Vamos a comenzar una serie de artículos prácticos sobre Flexbox, pero antes vamos a explicar hoy algunos conceptos imprescindibles de esta herramienta, que nos obligará a pensar diferente en algunos momentos, e incluimos un ejemplo práctico que nos ayudará a descubrir todas sus posibilidades.

Leer más

¿Cuál es el flujo de trabajo habitual en la creación de páginas y aplicaciones web?

El desarrollo de un proyecto web pasa por diferentes estados hasta su publicación, por lo que es necesario establecer un flujo de trabajo que organice las diferentes etapas, minimice los errores y mantenga siempre  el foco en el aspecto, funcionalidades y experiencia de uso de nuestra aplicación y sitio web. A continuación, te mostramos el flujo de trabajo más habitual (o, al menos, recomendado) que podemos utilizar y que nos permitirá gestionar con éxito nuestros proyectos web.
Leer más

Repasamos las posibilidades de la propiedad text-overflow de CSS3

Con text-overflow tenemos una propiedad de CSS3 muy útil para la maquetación web, ya que nos permite decidir qué aspecto tendrá un texto que no cabe dentro de la caja donde lo hemos ubicado, algo que antes había que solucionar a base de programación, detectando cuando no se mostraba la totalidad de un texto.

Leer más

Cómo crear efectos de resplandor con sombras CSS

Hace años conseguir un efecto de resplandor requería apoyarnos en imágenes generadas desde programas de diseño gráfico como Photoshop. Sin embargo, CSS permite separar el contenido de la presentación y ofrece a los diseñadores un completo control de la apariencia, sin tener que acudir a elementos externos a los propios estándares de la web. En este artículo, conseguiremos que diversos elementos de la página tengan un resplandor exterior, creando el efecto de emisión de luz, y lo haremos únicamente con hojas de estilo CSS.

Leer más