After y before son dos pseudo-elementos de CSS que deberías tener muy presentes a la hora de componer el diseño de sitios web. Ofrecen una vía excelente para conseguir efectos y trucos atractivos, algunos de los cuales vamos a abordar en este artículo. Pero antes, por si acaso alguien no los conoce todavía, veamos unas breves explicaciones para entender su funcionamiento.
El diseño Web, aunque más bien el diseño en general, evoluciona año tras año y en gran parte, gracias a las novedades tecnológicas que aparecen en el mercado. Es decir, si surge una velocidad de transferencia superior, un formato nuevo de pantalla o una nueva red social, el diseño se adaptará a las características de esta tecnología. Veamos las tendencias en diseño Web que estarán más presentes a lo largo de 2020.
Leer más
En ocasiones cuando trabajamos en una página web, nos encontramos que en un espacio donde queremos situar un texto no cabe por completo en el lugar que hemos establecido. En el siguiente artículo, recortaremos esa línea y colocaremos unos puntos suspensivos para indicar que esa frase continúa. Y lo haremos sólo CSS. Para ello, utilizaremos el atributo text-overflow con el valor clave ellipsis y lo usaremos en conjunto con el atributo overflow y un contenedor que limite su anchura.
En 2019 se espera que proliferen algunas tendencias que vienen a romper con algunas pautas establecidas y muy fuertemente arraigadas entre la Comunidad de Diseñadores a lo largo de los últimos años. A continuación, vamos a repasar las principales propuestas que se están popularizando en cuanto a Diseño Web y que veremos cada vez más en las páginas web maquetas en los próximos meses. Sin duda, evolucionarán en paralelo a las tendencias de Desarrollo Web que analizamos hace sólo unos días.
Después de nuestra introducción a Intervention Image, una librería de PHP especialmente orientada a la manipulación de gráficos y que nos permite automatizar gran parte de las tareas que necesitamos en desarrollo web. En este tutorial, profundizamos en diferentes caso de uso que nos permite utilizarlo para, por ejemplo, enfocar las imágenes o crear miniaturas muy fácilmente.
La edición sencilla de imágenes a través de programación para, por ejemplo, crear miniaturas de forma automática, es posible gracias a librerías de PHP con funcionalidades específicas para ello, como Intervention Image, en la que nos centramos en este artículo. Como veremos, podremos realizar y automatizar modificaciones sobre los gráficos, como zooms, redimensionamientos, rotaciones, incrustaciones de marcas de agua o, incluso, aplicar diferentes efectos para, a continuación, guardarlos en un archivo optimizado. Esto es, sin duda, un recurso especialmente útil para desarrolladores.
Las Redes Sociales son, hoy en día, una de las fuentes de información más consultadas en Internet, por lo que se convierten en el escaparate perfecto para mostrar productos o servicios al público global. Un contenido de calidad con imágenes atractivas se traduce en un alto porcentaje de visitas, llamando más la atención que aquel que no muestra imágenes. No obstante, hay que tener en cuenta que las Redes Sociales están en un estado de continuo cambio y, por ello, es necesario que adaptemos las publicaciones a los estándares que requiere cada una. A continuación, veremos los tamaños recomendados de las imágenes en las principales Redes Sociales.
Leer más
Tal como os anticipábamos en el artículo de la semana pasada, la optimización de nuestra página web es algo que no debemos dejar a la ligera y, afortunadamente, existen numerosos recursos y Mejores Prácticas que nos permiten llevar a cabo estas tareas muy fácilmente. Después de repasar cómo optimizar las CSS, hoy nos toca centrar nuestra atención en el código JavaScript y en los recursos gráficos. Al final, de lo que se trata es de optimizar todos los recursos de Desarrollo y Diseño Web que utilicemos en nuestra página web y tomar conciencia sobre el impacto de este tema en los resultados medibles.
Leer más
Una de las tendencias que estamos viendo en Desarrollo Web es la integración de vídeos en el fondo de una página web. Como comentábamos 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
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.