Tendencias de diseño web para 2023

,

En este artículo os mostramos algunas de las tendencias más relevantes para este nuevo año sobre el diseño web aunque algunas de ellas ya se empezaron a usar desde hace unos años.

    1. Título o imágenes de gran tamaño
    2. Texto simple y directo
    3. Degradados coloridos
    4. Tipografías integradas
    5. Imágenes con mucho detalle
    6. Elementos 3D interactivos
    7. Priorización en dispositivos móviles
    8. Estilos retro
    9. Cursores animados
    10. Texturas de vidrio

1. Título o imágenes de gran tamaño

Esto se trata de tener títulos en negrita y muy grandes o mensajes abreviados para atraer la atención del cliente más rápido. También es posible combinarlo con otros elementos como la ilustración 3D como vemos en la imagen.

2. Texto simple y directo

Es un diseño minimalista y discreto pero será la tipografía que tú elijas la que sustentará todo el diseño de tu web. Por ello deberás de elegir una que diga algo de tu marca.

3. Degradados coloridos

Esta tendencia se empezó a usar en 2019 y a día de hoy se sigue utilizando para el diseño web. Con el efecto degradado conseguirás una apariencia moderna e innovadora.

4. Tipografías integradas

Para algunos diseñadores encontrar una tipografía que se ajuste al diseño de la web puede ser una tarea un poco complicada pero todo sitio web necesita texto e imágenes. Puedes colocar el texto usando formas y patrones geométricos, en capas sobre las imágenes para que quede integrado completamente en el diseño general.

5. Imágenes con mucho detalle

Otra de las tendencias para este año son las imágenes de gran tamaño donde se pueda apreciar hasta el más mínimo detalle. Esto hará que tu diseño sea más atractivo pero también hay que tener en cuenta que las imágenes no deben de ser muy pesadas para que no afecten a la velocidad de carga de tu web.

6. Elementos 3D interactivos

Esta tendencia no es del todo nueva pero sí que se seguirá usando para este 2023. Lo interesante es combinar elementos en 2D y en 3D ya que se complementan perfectamente dando brillantes contrastes.

7. Priorización en dispositivos móviles

Desde hace unos años, la navegación mediante los dispositivos móviles ha superado a la navegación a través de escritorio. Es por eso que los sitios web deben de estar optimizados para dispositivos móviles y que el diseño sea responsive, es decir que se adapte al tamaño de la pantalla, para mejorar la experiencia del usuario (UX).

8. Estilos retro

En los últimos años hemos visto como los estilos de la década de los 2000 han vuelto en diferentes ámbitos como la moda, la música, el arte o el diseño de interiores e incluso, como era de esperarse, se está extendiendo al mundo del diseño web. Algunos diseñadores lo realizan introduciendo tipografías retro, fuentes e imágenes pixeladas, cursores personalizados, etc. y así consiguen un aire de nostalgia.

9. Cursores animados

Otra forma de mejorar la experiencia de usuario cuando visitan una web es personalizar el cursor o añadirle una animación cuando se mueve. De esta manera los usuarios pueden divertirse mientras interactúan con los diferentes comportamientos de desplazamiento o comandos al hacer clic.

10. Texturas de vidrio

Hoy en día el uso de las texturas de vidrio es muy frecuente ya que las imágenes o formas de este estilo ayudan a acentuar la atención del usuario, crean un diseño gráfico moderno y combinan perfectamente con efectos en 3D. Algunos productos que usan este tipo de diseño son los de Windows 11 o iOs de Apple.

/por

Mejores plantillas gratuitas y de pago para Woocommerce

Existe una gran variedad de temas para tiendas online con Woocommerce y es casi imposible elegir entre todos ellos. En este post os mostramos algunas plantillas gratuitas y otras de pago para añadirlas a vuestra web. Como sabéis, Woocommerce es un plugin para WordPress con el que se pueden crear tiendas online.

Qué tiene que tener una plantilla para Woocommerce

Lo primero que tienes que tener en cuenta a la hora de elegir una plantilla son los siguientes aspectos:

  • Optimizado para la velocidad de carga de la web
  • Tener un diseño atractivo
  • La navegación sea fácil
  • Diseño adaptado para los diferentes dispositivos (móvil, Tablet, etc.)
  • Ser compatible con los plugins

A continuación os mostramos algunas plantillas gratuitas y otras de pago.

Plantillas gratuitas

Zigcy Lite

Este tema cuenta con tres diseños de demostración los cuales los puedes importar y así lanzarás tu tienda más rápidamente.

Está totalmente optimizado para SEO, es compatible con el plugin de construcción de páginas Elementor y ya cuenta con más de 3.000 descargas.

Si quieres obtener más información sobre este tema pulsa en el siguiente enlace.

Plantilla Zigcy

Woostify

Esta plantilla es de las mejores por su optimización a la hora de obtener una mayor velocidad de carga de la página. Tiene la garantía de ser compatible con futuras versiones de WordPress y Woocommerce ya que sigue los estándares de programación de dicho CMS.

Incluye varios diseños de páginas de productos, un sistema de pago en varios pasos y una galería de videos para añadir a las fichas de productos.

Aunque esta plantilla es gratuita, también dispone de tres planes de pago a partir de 49$ al año en los que incluye un año de soporte, actualizaciones y acceso a complementos avanzados.

Si quieres obtener más información sobre este tema pulsa en el siguiente enlace.

Plantilla Woostify

Astra

Este tema consta con muchas posibilidades de personalización, está realizado con un código optimizado y la página cargará rápidamente debido a que requiere menos de 50kB.

Aparte de la versión gratuita, también existe la versión Premium que cuesta 47$ al año donde encontrarás más funciones y personalizaciones, un soporte individualizado y formación.

Si quieres obtener más información sobre este tema pulsa en el siguiente enlace.

Plantilla Astra

Hestia

Este tema es una excelente elección si lo que buscas es crear una web de una sola página. Ofrece la posibilidad de crear un pie de página con widgets, el añadir una página de blog y su personalización es muy sencilla ya que tiene una gran compatibilidad con los constructores de páginas más comunes.

Los creadores del tema ponen a disposición de los usuarios más de 300 artículos y 200 videos tutoriales pero también existe una versión Premium la cual cuesta desde 69€ al año en la que incluye asistencia técnica, actualizaciones y más funcionalidades.

Si quieres obtener más información sobre este tema pulsa en el siguiente enlace.

Plantilla Hestia

WooCommerce Storefront

Cuenta con un diseño que se adapta a los diferentes dispositivos, se pueden usar plugins para modificar el diseño de la página web o bien usar la opción de «Personalizar» dentro de la opción de «Apariencia» en el menú lateral de WordPress.

Al adquirir este tema obtendrás un año de actualizaciones de los plugins que incluye y un año de soporte.

Si quieres obtener más información sobre este tema pulsa en el siguiente enlace.

Plantilla WooCommerce StoreFront

Plantillas de pago

Ekommart

El precio de este tema es desde 58$ por licencia y es ideal para diversas tiendas. Incluye varios plugins esenciales de WordPress como «Slide Revolution» o «Mailchimp» y tiene una vista rápida de productos y la opción de comparar artículos que mejorará la experiencia de compra de tus clientes.

El tema cuenta con varias demos de páginas de inicio, encabezados y pies de página prediseñados con lo que será más fácil crear tu tienda online con WooCommerce.

Si quieres obtener más información sobre este tema pulsa en el siguiente enlace.

Plantilla Ekommart

Velure

Cuesta 69€ al año y a parte del propio tema también incluye actualizaciones, importador de demos y un año de soporte. También existe la opción de un único pago que incluye todo lo anterior excepto el soporte que no expiraría y solo tendrías que pagar una vez 159€.

Este tema está más enfocado a blogs de moda y estilos de vida pero también te permite crear una tienda online con un estilo muy elegante. Cuenta además con una barra de Instagram integrada para ayudarte a mejorar tu presencia online.

Si quieres obtener más información sobre este tema pulsa en el siguiente enlace.

Plantilla Velure

PeakShops

Su precio es de 79$ e incluye futuras actualizaciones y 6 meses de soporte, si quieres extender el soporte hasta 1 año el precio sería de 25,13$ más.

Es uno de los mejores temas para crear una tienda online con WooCommerce ya que incluye diversas plantillas para las páginas de productos así como demos prediseñadas para diferentes tipos de negocios como la venta de muebles, electrónica, etc.

Si quieres obtener más información sobre este tema pulsa en el siguiente enlace.

Plantilla PeakShops

Hongo

El precio es de 59$ en el que incluye 6 meses de soporte y futuras actualizaciones, también se puede ampliar el soporte hasta 1 año por 17,63$ más.

Algunas de las características más destacadas de este tema es que permite la visualización de productos en 360 grados subiendo múltiples imágenes del producto, permite añadir pins a las imágenes y vincularlas a determinados productos. Además tiene incluido el plugin de «MailChimp» con el que podrás crear y lanzar campañas de marketing a través del email.

Si quieres obtener más información sobre este tema pulsa en el siguiente enlace.

Plantilla Hongo

Metro

El precio de esta plantilla es de 35$ en el que se incluye actualizaciones futuras del tema y 6 meses de soporte, también existe la opción de ampliar el soporte hasta 1 año por 8,63$ más.

Tiene un diseño minimalista en el que se centra más en los productos y servicios que ofrece la web y cuenta con siete diferentes diseños de la página de inicio prediseñados. El tema incluye el plugin «Variation Images Gallery» y también es compatible con «Yoast SEO».

Si quieres obtener más información sobre este tema pulsa en el siguiente enlace.

Plantilla Metro

Inicionet Aplicaciones S.L.

/por

Como aplicar filtros a una imagen con CSS

,

La propiedad de CSS «filter» es una herramienta muy útil para aquellas personas que quieren usar efectos visuales sobre una imagen, es como usar los filtros de Photoshop pero para navegadores. Esta propiedad te permite aplicar filtros como por ejemplo cambiar el brillo de una imagen, hace que sea en colores sepia o en escala de grises. En este post veremos el cómo aplicar estos filtros así como la sintaxis que se usa:

Cuál es la sintaxis

Existen dos opciones de escribir esto en las hojas de estilos CSS. La primera de ellas es poner cada parámetro (brillo, saturación, etc.) en diferente línea:

La segunda opción es ponerlo todo en la misma línea y separar cada parámetro con un espacio en blanco:

La última línea que pone «filter: none;» sirve para quitar todos los filtros que tiene aplicados una imagen.

Cambiar el brillo

Para cambiar el brillo de la imagen, se hace con el parámetro «brightness». Permite valores con porcentaje (%) y sin él. El valor 0% o 0 mostrará la imagen completamente en negro, por el contrario si se pone el valor 100% o 1 no se apreciará ningún cambio en la imagen. Para subir el brillo, los valores tendrán que estar por encima de esos valores. Si no se indica ningún valor por defecto se usará 100% o 1.

Filtro brightness CSS

Cambiar el contraste

A la hora de cambiar el contraste de la imagen mediante CSS pasa igual que para el brillo, si se usa el valor 0% o 0 la imagen se quedará en negro, si se usa 100% o 1 la imagen no sufrirá ningún cambio. Para que se note algún cambio se tienen que poner valores por encima de esos. Por defecto se usará el 100% o 1 si no se indica ningún valor.

Filtro contrast CSS

Cambiar a sepia

Para convertir la imagen en colores sepia hay que usar valores entre 0% y 100% o también se pueden usar valores entre el 0 y el 1, como por ejemplo 0.6, donde el 0 sería la imagen sin ningún cambio y el 100% o 1 sería completamente en colores sepia. Si no se indica ningún valor, por defecto se usará el valor de 100% o 1. No funciona si ponemos valores negativos.

Filtro sepia CSS

Cambiar a escala de grises

Para convertir la imagen a escala de grises el valor también será entre 0% y 100% o entre 0 y 1. Si se usa el valor mínimo, la imagen no sufrirá ningún cambio. En cambio, si se usa el valor máximo, la imagen se verá totalmente a escala de grises. Si el valor está vacío, por defecto cogerá el valor máximo. Con esta función no se permite usar valores negativos.

Filtro grayscale CSS

Cambiar la saturación

A la hora de saturar la imagen, si se usa el valor 0% o 0 la imagen estará sin saturar, si se usa el 100% o 1 la imagen estará sin cambiar. Para ver más cambios los valores tendrán que estar entre 0% y 100% o mayor que 100%. Por defecto cogerá el valor 100% y los valores negativos no están permitidos.

Filtro saturate CSS

Cambiar los valores HUE

Este filtro aplica una rotación de los colores. El valor se mide en grados (deg) y es el número de grados alrededor del círculo de color que se ajustarán en la imagen. El valor será entre 0 y 360. Si se usa el valor mínimo la imagen no sufrirá ningún cambio y por defecto también coge ese valor si está vacío.

Filtro hue-rotate CSS

Cambiar la nitidez

Este filtro aplica un efecto borroso sobre la imagen. El valor se mide por píxeles (px) pero no se permiten porcentajes. Por defecto se usará el valor 0 si no es válido o está vacío.

Filtro blur CSS

 

Esperamos que os sirva de ayuda a la hora de crear filtros en una imagen desde los estilos CSS. Existen más opciones de esta función de CSS que podéis mirar en el siguiente enlace: https://www.w3schools.com/cssref/css3_pr_filter.php

 

/por

Mejores extensiones para Mozilla Firefox

,

Mozilla Firefox es otro de los navegadores más usados por los usuarios. Os mostramos algunas de las extensiones más comúnes y que os harán vuestra experiencia de navegación mucho mejor.

Adguard

Esta extensión bloquea eficazmente todos los tipos de publicidad en todas las páginas web así como las ventanas emergentes.

Algunas páginas donde bloquea anuncios son: Facebook, Youtube, páginas de periódicos, etc.

Adguard Extensión para Mozilla Firefox

Para poder descargarla lo podéis hacer desde el siguiente enlace.

Dark Reader

Esta extensión, al igual que en Google Chrome, permite activar y desactivar el modo oscuro del navegador.

Además, también tiene un modo claro con brillo reducido y colores sepia.

Dark Reader Extensión para Mozilla Firefox

Para poder descargarla lo podéis hacer desde el siguiente enlace.

Stylus

Con esta extensión puedes rediseñar libremente tus sitios web favoritos usando hojas de estilo CSS personalizadas. También incluye funciones avanzadas como por ejemplo diseños opcionales, opciones de iconos y colores, puedes instalar temas de otros diseñadores y desarrolladores, hacer copias de seguridad de tus diseños, etc.

Stylus Extensión para Mozilla Firefox

Para poder descargarla lo podéis hacer desde el siguiente enlace.

Lastpass

Esta extensión es un gestor de contraseñas y las mantiene seguras y accesibles en la nube. Solo tendrás que recordar la contraseña de acceso a Lastpass para poder ver todas tus contraseñas guardadas. Además, podrás acceder desde cualquier dispositivo, incluyendo las aplicaciones para Android y para iOS. Todas tus contraseñas estarán a salvo gracias a que las protege con una encriptación de grado militar.

LastPass Extensión para Mozilla Firefox

Para poder descargarla lo podéis hacer desde el siguiente enlace.

LanguageTool

Esta extensión te ayuda con la gramática y la ortografía a la hora de escribir correos electrónicos o contenido en la web. Corrige los errores mientras escribes o bien haciendo clic. Con ella podrás mejorar la gramática y no se necesita ningún registro o suscripción.

LanguageTool Extensión para Mozilla Firefox

Para poder descargarla lo podéis hacer desde el siguiente enlace.

Avast Online Security

Esta extensión te ayuda a evitar que accedas a sitios web peligrosos y estafas de phising usando datos de crowdsourcing. Puedes comprobar la calificación de cualquier sitio web que visites incluso da la opción de que tú mismo puedas calificar los sitios web a los que accedas según su fiabilidad.

Avast Online Security Extensión para Mozilla Firefox

Para poder descargarla lo podéis hacer desde el siguiente enlace.

 

Esperamos que estas extensiones para Mozilla Firefox os sean de gran ayuda a la hora de navegar en Internet.

/por

Mejores extensiones para Google Chrome

,

Google Chrome es uno de los navegadores más usados hoy en día, por ello os presentamos algunas de sus extensiones más conocidas y usadas que os pueden facilitar vuestro día a día en el trabajo o en casa:

Touch VPN

Esta extensión te permite tener una VPN totalmente gratuita y con ancho de banda ilimitado. Esto te da la opción de visualizar las páginas desde el país que tú elijas con solo pulsar un botón.

Touch VPN

Para poder descargarla lo podéis hacer desde el siguiente enlace.

Traductor de Google

Para aquellas personas que suelen navegar por páginas de diferentes idiomas, esta extensión les será muy útil ya que simplemente con pulsar el icono de la extensión podrán escribir una palabra que quieran traducir sin tener que cambiar de pestaña e incluso pueden traducir una página entera. También se pueden seleccionar partes de un texto para traducirlas sin que afecte al resto de la página web.

Traductor de Google

Para poder descargarla lo podéis hacer desde el siguiente enlace.

Push to Kindle

Esta herramienta envía la página web por la que estás navegando directamente a tu cuenta de kindle y la podrás leer tranquilamente y con tranquilidad desde tu dispositivo.

Solo tendrás que pulsar el icono de la extensión y escribir a qué cuenta de Kindle lo quieres enviar.

Push to Kindle

Para poder descargarla lo podéis hacer desde el siguiente enlace.

Grammarly for Chrome

Esta es una extensión imprescindible para aquellas personas que suelen escribir en inglés desde Google Chrome.

Esta aplicación se encarga de analizar lo que estás escribiendo y corrige errores ortográficos, gramaticales, símbolos de puntuación, etc.

Tiene una versión gratuita y otra de pago pero con la opción gratuita sería suficiente.

Grammarly for Chrome

Para poder descargarla lo podéis hacer desde el siguiente enlace.

Google Arts & Culture

Esta herramienta está diseñada para la gente que le gusta el arte. Lo que te permite esta extensión es que cada vez que abras una nueva pestaña se mostrarán obras de distintos pintores, artistas contemporáneos o artistas callejeros de todo el mundo.

Google Arts and Culture

Para poder descargarla lo podéis hacer desde el siguiente enlace.

Escritorio Remoto de Chrome

Esta aplicación está creada por Google y te permite conectarte remotamente a otro ordenador utilizando Chrome. Podrás controlar todo del otro ordenador como ficheros, carpetas, menús, programas, etc.

Esta extensión funciona a través de tu cuenta de Google con la que tendrás que utilizarla para acceder a otros ordenadores o móviles.

Chrome Remote Desktop

Para poder descargarla lo podéis hacer desde el siguiente enlace.

Documentos de Google sin conexión

Te da la posibilidad de acceder a Drive y a sus herramientas como son los Documentos, Hojas de cálculo o Presentaciones de Google sin necesidad de conectarte a Internet.

Es muy útil cuando lo necesitas durante un viaje o si te encuentras en un lugar donde la cobertura no es muy buena.

Documentos de Google sin conexión

Para poder descargarla lo podéis hacer desde el siguiente enlace.

Dark Reader

Te ofrece la posibilidad de activar el modo oscuro en cualquier página que visites. No solo cambia el blanco de fondo por el negro y las letras a blanco, sino que reduce el brillo de las imágenes cuando sea necesario, analiza los colores que tiene la web.

Te permite ajustar el brillo, el contraste, la intensidad de los colores, cambiar las fuentes de texto, elegir en qué sitios web lo quieres aplicar y en cuales no, tiene la opción de usar colores sepia, etc.

Dark Reader

Para poder descargarla lo podéis hacer desde el siguiente enlace.

Screencastify

Permite grabar tu pantalla del ordenador, grabar audio, editarlos y compartirlos en segundos. Además, puedes realizar preguntas interactivas al espectador.

Screencastify

Para poder descargarla lo podéis hacer desde el siguiente enlace.

uBlock Origin

Esta extensión es un bloqueador de publicidad. Bloquea prácticamente todos los anuncios y consume muy pocos recursos del ordenador.

Si estás navegando en una página pero quieres desactivar la aplicación y que aparezcan los anuncios, es tan simple con pulsar un botón. Los anuncios volverán a aparecer pero solamente en la página que estás visitando en ese momento, el resto de páginas seguirán con los anuncios bloqueados.

uBlock Origin

Para poder descargarla lo podéis hacer desde el siguiente enlace.

Video Downloader professional

Esta extensión es completamente gratuita y muy sencilla de utilizar que te permitirá descargar vídeos en cualquier página web donde esté alojado.

Para descargar los vídeos solamente hará falta pulsar un botón y se guardarán en diferentes resoluciones. Cuando la descarga haya finalizado ya se podrán reproducir sin necesidad de conexión a Internet.

Video Downloader Professional

Para poder descargarla lo podéis hacer desde el siguiente enlace.

/por

Tendencias de diseño web para 2022

,

Como hace poco que cambiamos de año, os mostramos las tendencias de diseño web más importantes para este nuevo año 2022. Algunas de las más relevantes son:

  1. Usar colores llamativos
  2. Contenido personalizado
  3. Chatbots más humanos
  4. Carga inteligente del contenido
  5. Formas fluidas
  6. Microanimaciones
  7. Microinteracciones
  8. Animaciones 3D
  9. Uso de degradados
  10. Efecto de vidrio esmerilado
  11. Datos más visibilizados
  12. Inspiración vintage
  13. Modo oscuro
  14. Combinación de fotos y elementos gráficos
  15. Tipografía Bold (Negrita)
  16. Minimalismo y uso de espacios en blanco
  17. Hero Image

 

1. Usar colores llamativos

El uso de tonos atrevidos, saturados y brillantes puede hacer que tu marca destaque mucho más.

Eso sí, hay que utilizarlos con mucho cuidado para no cansar al usuario y provocar un efecto contrario.

2. Contenido personalizado

Seguramente te hayas dado cuenta de que cada vez que vuelves a visitar una página web o una aplicación aparece un contenido totalmente diferente a cualquier otra persona o si lo visualizas desde otro navegador diferente.

Contenido personalizado         Contenido personalizado

Este tema es muy útil para los sitios que son ecommerce, se puede usar para mostrar diferentes productos dependiendo de los intereses del usuario que visita la web y poder generar más ventas.

3. Chatbots más humanos

Gracias a los avances en la inteligencia artificial, los chatbots son capaces de ayudar a los clientes durante el proceso de compra en la web, resolver dudas u ofrecer un servicio determinado.

Aunque los chatbots llevan ya unos años, en este 2022 los veremos evolucionar para ser mucho más humanos.

4. Carga inteligente del contenido

Con la actualización del algoritmo de Google, se añadieron los parámetros Core Web Vitals. Estos parámetros se aplican en todas las páginas web y tienen en cuenta, además de la velocidad de carga, el cómo se presentan los elementos más relevantes de la web.

Se pueden utilizar funciones como el Infinity Scroll y el Lazy Load para no sobrecargar los recursos del servidor y mejorar el tiempo de carga ya que solo se muestra el contenido visible.

5. Formas fluidas

Esta tendencia trata de descartar los ángulos rectos y se introducen formas redondas, asimétricas que pueden dividir las distintas secciones de una web de forma fluida y sin cortes bruscos.

Formas Fluidas

6. Microanimaciones

Se trata de usar pequeñas animaciones en distintas partes del diseño como en los iconos o en las descripciones de productos.

Con esto conseguimos diseños más dinámicos utilizando videos y gifs en vez de imágenes estáticas.

Microanimaciones

7. Microinteracciones

Son pequeñas animaciones que sirven para guiar al usuario en la web a través de algunas acciones.

Algunos ejemplos te esta tendencia son: enlaces que cambian de color cuando pasas el ratón sobre ellos, cambio del propio cursor dependiendo del sitio de la web donde esté ubicado, diferentes efectos al pasar el cursor por un producto en un listado, etc.

Microinteracciones

Microinteracciones

8. Animaciones 3D

Pueden hacer del diseño de la web mucho más moderno.

Aunque no hay que sobrecargar la web de animaciones en 3D, si que es cierto que gracias a los avances tecnológicos cada vez suponen menos problemas en cuanto al tiempo de carga de la página.

Un ejemplo de esto sería mostrar las imágenes de productos en la web con fotos en 360 grados.

Animaciones en 3D

9. Uso de degradados

El uso de degradados puede añadir un efecto de profundidad, puede servir como un fondo llamativo o para añadir textura a una imagen.

Suele utilizarse en tipografías grandes y atrevidas y combina perfectamente con elementos redondeados y con transparencias.

10. Efecto de vidrio esmerilado

Este efecto ofrece una apariencia borrosa en los elementos situados detrás dando prioridad a los que están delante.

A veces se suele usar como sustitución a los fondos degradados y transmite profesionalidad.

Efecto de vidrio esmerilado

11. Datos más visibilizados

Mostrar los datos en gráficas o tablas puede hacer que los usuarios que visitan la web entiendan mucho mejor estos datos además de ser una forma mucho más atractiva que mostrarlos con texto.

Datos más visibilizados

12. Inspiración vintage

Puedes intentar mezclar estilos modernos con estilos vintage para crear una apariencia ultramoderna.

Por ejemplo, puedes usar productos artesanales, de época y tradicionales.

Inspiración vintage

13. Modo oscuro

Este estilo permite reducir la fatiga de los usuarios ya que cada vez pasamos más tiempo mirando pantallas. Además puede ayudar a ahorrar batería en dispositivos móviles.

Utilizando esta tendencia puedes conseguir una apariencia ultramoderna para tu web y resaltar otros elementos.

Modo oscuro

14. Combinación de fotos y elementos gráficos

Mezclando elementos gráficos y fotos puedes conseguir aportar un nivel de diversión y creatividad a una imagen corriente y reforzar la marca de tu empresa.

Combinación de fotos y elementos gráficos

15.Tipografía Bold (Negrita)

Usando fuentes gruesas y en negrita hace que el mensaje de la página sea mucho más claro e instantáneo y no necesite ninguna imagen. Además puede lograr captar la atención del usuario.

Tipografía Bold (Negrita)

16. Minimalismo y uso de espacios en blanco

Usando espacios en blanco y un aspecto minimalista permite mejorar la legibilidad de la web y da prioridad al producto o contenido que se quiere destacar.

Minimalismo y uso de espacios en blanco

17. Hero Image

Hero image se refiere al banner de gran tamaño que suele haber en una página web en la página principal.

Esto puede atraer y hacer que el usuario siga viendo el contenido de tu web.

Se suele usar para expresar el servicio que ofreces y normalmente es la primera impresión que se lleva un cliente al visitarla.

Hero image

 

Estas son las tendencias más importantes que llegarán este nuevo año.

/por

¿Cómo añadir y quitar las www de tu página web?

, ,

Puede que te preguntes si es importante o no el usar las www en tu página web para el rendimiento del SEO. La respuesta es no, es simplemente un tema de preferencias o de estética pero debes saber cómo añadir o quitar las www de tu dominio para asegurar que Google lo indexe correctamente.

En este artículo te explicaremos lo siguiente:

Cómo quitar las www de tu dominio

Si prefieres que tu sitio web sea sin el prefijo www puedes añadir el siguiente código en tu fichero .htaccess en el directorio principal de tu web (Solamente para servidores con Apache):

Cómo quitar las www de tu página web con .htaccess

Para que esto funcione correctamente, el módulo de Apache mod_rewite tiene que estar instalado y habilitado en el alojamiento donde se encuentra tu web. Una vez añadido este código no es necesario reiniciar el servicio de Apache.

Añadir las www a tu página web

Por el otro lado, si lo que quieres es añadirlas en tu web, igual que en la sección anterior, será necesario editar el fichero .htaccess de tu página y añadir lo siguiente:

Cómo añadir las www de tu página web con .htaccess

Al igual que para quitarlas, es necesario que en el servidor esté activado y habilitado el módulo de Apache mod_rewrite, de otra forma esto no funcionará.

Cómo afecta a la seguridad del sitio web

Al realizar este tipo de cambio en una web, hay algunos aspectos sobre su seguridad que hay que tener en cuenta.

Si configuras tu dominio sin las www y posees algún subdominio, puede darse el caso de que el dominio principal y el subdominio compartan cookies. Esto puede ser potencialmente malo si hay alguna información delicada y se guarda en las cookies que tú no quieres compartir con terceras partes.

Inicionet

/por

Plataformas para enviar archivos pesados

Es muy rápido y sencillo enviar adjuntos por email pero, ¿qué pasa cuando estos adjuntos son demasiado pesados? Muchos de los proveedores de correos tienen restricciones sobre el tamaño de los archivos adjuntados.

En este post os explicamos algunas de las plataformas más comunes para enviar archivos pesados a otras personas:

 

Google Drive

Google Drive te da espacio para almacenar ficheros en la nube pudiendo acceder a ella desde cualquier sitio. También te permite compartir dichos archivos con clientes y compañeros para que ellos los puedan ver o modificar.

Esta herramienta te da la posibilidad de tener toda la información sincronizada en tus diferentes dispositivos (iPhone, Mac, Smartphone, etc.) y los cambios que realices se guardan automáticamente mientras los editas. Lo único que necesitas para acceder a ella es una cuenta de Gmail.

Google Drive

Te proporciona hasta 15GB de espacio gratuito y tiene diferentes planes de pago por si necesitas más capacidad. Sus planes son desde 1,99€/mes por 100GB hasta 9,99€/mes por 2TB, también dispone de una opción de pago anual en vez de mensual en el que puedes conseguir hasta un 17% de ahorro.

OneDrive

OneDrive, al igual que Google Drive, te permite almacenar archivos en la nube. Usa el servidor de Microsoft y puedes usar hasta 5GB de espacio gratuito pero dispone de varios planes.

OneDrive

Entre sus planes se puede diferenciar entre “Para el hogar” y “Para empresas”. El primero de ellos oscila entre 2€/mes hasta 99€/año dependiendo de la opción que se elija. En cuanto al segundo, éste no dispone de plan gratuito pero tiene diferentes opciones muy variadas que van desde 4,20€/mes y por usuario hasta 10,50€/mes y por usuario.

Es necesario una cuenta de Outlook o Hotmail para poder usar este servicio.

iCloud

iCloud es una herramienta distribuida por Apple por lo que solamente podrán usarla aquellos dispositivos que pertenezcan a esta marca.
Esta plataforma te permite almacenar fotos, archivos, notas, vídeos, etc. Además se sincronizan automáticamente, todos tus datos estarán protegidos, actualizados y disponibles por si los necesitas.

iCloud

Dispone de 5GB de almacenamiento gratuito pero se puede ampliar fácilmente desde 0,99€/mes por 50GB.

Dropbox

Dropbox es una herramienta en la que puedes almacenar, organizar, crear y compartir archivos con diferentes personas.
Está disponible para uso personal y para empresas.

Además entre sus funcionalidades también se encuentra la posibilidad de añadir firmas electrónicas seguras en documentos, enviar archivos pesados de forma rápida y compartir tus archivos con más personas.

Dropbox

Los precios de los planes oscilan entre 9,99€/mes y 16,99€/mes para particulares mediante cobro anual y para empresas está entre 10€/mes y 16,58€/mes mediante cobro anual.

 

Existen muchas otras plataformas como las mencionadas anteriormente pero creemos que estas cuatro son las más comunes y más utilizadas por todos los usuarios.

/por

Reparación y actualización de páginas

, , , , ,

Puede que te encuentres en la situación de tener una página web pero se muestran diferentes errores, páginas incompletas o quieres hacer algún cambio o mejora, etc.

En este artículo os detallaremos algunos casos en los que te podemos ayudar para hacer que tu página web sea mucho más completa:

Corrección de errores

Algunos de los errores más comunes que pueden surgir en una página web pueden ser que por ejemplo tras una actualización del CMS de tu web ésta haya dejado de funcionar porque se ha quedado la página en blanco, aparece algún otro tipo de error como:  Fatal error, Deprecated, Warning, etc.

Como corregir el error de Parse error

Pueden surgir otros tipos de errores como que después de una actualización o algún cambio se hayan perdido los estilos o hay alguna sección que no aparece como debería.

Traducción de textos

Otra de las acciones que podemos realizar es la traducción de textos en la página web. Dependiendo del CMS que uses y de la plantilla puede que haya campos, secciones o algún botón que no se llega a traducir correctamente o no encuentras donde se realiza esta traducción.

Actualización de contenidos

Muchas veces puede que necesites añadir nuevos productos o servicios que ofrece tu empresa en la página web pero es posible que no tengas tiempo de meterlos uno a uno. Nuestro equipo es experto en realizar estas importaciones masivas de los nuevos contenidos.

Pasa lo mismo con la actualización de los textos, la importación de noticias y eventos o la creación de nuevas páginas o secciones de la web.

Modificaciones del aspecto o funcionalidades de la web

Puede darse el caso de que ya tengas una página web pero te gustaría cambiar el aspecto o añadir alguna nueva funcionalidad en la web que antes no estaba.

Nosotros podemos realizar estas nuevas modificaciones tal y como nos las pides.

Recuperación de datos

Por otro lado, puede que tras una actualización de plugins o del propio CMS se hayan perdido los datos que había antes en la web o se haya desconfigurado por completo. Si esto pasa nosotros podemos recuperar los datos a través de copias de seguridad para que tu página funcione como siempre.

Limpieza de virus o malware

Cada vez es más habitual que las páginas web sean infectadas por virus o códigos maliciosos. Si te encuentras en esta situación no te preocupes porque nosotros nos encargamos de la limpieza del sitio web para dejarlo libre de virus.

También podemos implementar medidas de seguridad para prevenir que la página web sea infectada como instalar un certificado SSL, asegurarnos que el hosting donde se encuentra alojada la web tenga un buen firewall, mantener el CMS de tu web siempre actualizado así como los plugins, etc.

Limpiar de virus y malware la página web

/por

Por qué tener un blog en tu página web

, ,

Los blogs solían ser plataformas en donde la gente expresaba sus opiniones o compartía sus experiencias pero hoy en día un blog es mucho más que eso. Por ejemplo, para las empresas puede ser una buena forma de conectar con sus clientes, generar confianza e incluso aumentar las ventas.

A continuación os mostramos algunas ventajas de tener un blog en tu página web:

Mejora el posicionamiento de tu web

El primer beneficio que tiene es que puede aumentar las búsquedas de tu web. Esto se debe a que puedes usar las nuevas publicaciones de tu blog para añadir nuevas keywords o palabras clave en tu página.

También mejora el posicionamiento de tu web ya que aumenta el volumen de contenido que hay en tu sitio web. Si se publican nuevos artículos en el blog regularmente esto hará que tu empresa se encuentre en los resultados más recientes de las búsquedas y que haya más tráfico en tu web.

Dirigir a los clientes a otras páginas

Como hemos mencionado anteriormente, los nuevos posts pueden atraer más tráfico a tu web y lo que se puede hacer en este caso es redirigir a los clientes a páginas determinadas como fichas de productos, a un formulario para suscribirse en la newsletter o a un formulario para pedir información.

Esto se podría hacer añadiendo hipervínculos en el contenido de los artículos del blog que redirija a esas páginas en concreto.

blog_redirigir_productos

Establece confianza

El blog en una página de empresa también inspira confianza a los clientes ya que se puede demostrar su experiencia, sus últimos trabajos, poner alguna información acerca de ella, etc.

Humaniza la marca

A la gente le gusta comprar productos de marcas con las que se siente identificada. Sin embargo, no es fácil transmitir los valores de la marca en una página web. Pero un blog puede ofrecer un medio de comunicarse con los clientes de una manera mucho más informal. Y esto puede mostrar el lado humano de la empresa y hacer que la marca sea más accesible.

Mantiene al día a los clientes

Si por ejemplo tienes un nuevo producto que te gustaría que vieran los clientes o que llegara a mucha más gente con un blog puedes conseguirlo. También puedes utilizar el blog para mantener a los clientes al tanto de otras noticias sobre la empresa o del sector al que pertenece.

Un blog actualizado con frecuencia es una buena forma de estar en contacto con tus clientes y mantenerlos interesados en tu marca. Por ello, puede ser una herramienta para aumentar la retención de clientes.

 

En resumen, el blog te permite comunicarte con tus clientes de una manera diferente a las páginas web estándar. Además, el coste de tener un blog es mínimo ya que tú mismo puedes escribir los posts de forma muy sencilla o si lo prefieres se puede contratar a otra persona para que redacte las nuevas entradas en el blog.

/por