{"id":3152,"date":"2020-05-04T15:16:51","date_gmt":"2020-05-04T15:16:51","guid":{"rendered":"https:\/\/www.conectasoftware.com\/?p=3152"},"modified":"2023-09-02T16:16:59","modified_gmt":"2023-09-02T16:16:59","slug":"25-anos-de-diseno-web-tendencias-y-soluciones","status":"publish","type":"post","link":"https:\/\/www.conectasoftware.com\/magazine\/25-anos-de-diseno-web-tendencias-y-soluciones\/","title":{"rendered":"25 a\u00f1os de dise\u00f1o web. Tendencias y soluciones"},"content":{"rendered":"<p><span style=\"color: initial; font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen-Sans, Ubuntu, Cantarell, 'Helvetica Neue', sans-serif; font-size: 18px;\">+ <\/span><a style=\"font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen-Sans, Ubuntu, Cantarell, 'Helvetica Neue', sans-serif; font-size: 18px;\" href=\"https:\/\/www.conectasoftware.com\/magazine\/diseno-web\/diseno-web-minimalista-tendencia\/\">El Dise\u00f1o Web Minimalista<\/a><\/p>\n<div class=\"wpb_content_element \">\n<div id=\"ut_sb_5f64be1eb93f4\" class=\" clearfix clearfix\">\n<div class=\"ut-info\">+\u00a0<a href=\"https:\/\/www.conectasoftware.com\/magazine\/diseno-web\/mejorar-la-accesibilidad-de-tu-sitio-web\/\">C\u00f3mo Mejorar La Accesibilidad De La Web<\/a><\/div>\n<\/div>\n<\/div>\n<div class=\"wpb_content_element \">\n<div id=\"ut_sb_5f64be1eb946b\" class=\" clearfix clearfix\">\n<div class=\"ut-info\">+ <a href=\"https:\/\/www.conectasoftware.com\/magazine\/diseno-web\/los-10-principios-del-buen-diseno-de-dieter-rams\/\">10 Principios Del Buen Dise\u00f1o De Dieter Rams<\/a><\/div>\n<\/div>\n<\/div>\n<div class=\"wpb_content_element \">\n<div id=\"ut_sb_5f64be1eb94d9\" class=\" clearfix clearfix\">\n<div class=\"ut-info\">&#8211; Inspiraci\u00f3n De 25 A\u00f1os De Dise\u00f1o Web<\/div>\n<\/div>\n<\/div>\n<div class=\"wpb_content_element \">\n<div id=\"ut_sb_5f64be1eb9544\" class=\" clearfix clearfix\">\n<div class=\"ut-info\">+\u00a0<a class=\"ut-service-box-link \" title=\"Cuando cambiar el dise\u00f1o de la web\" href=\"https:\/\/www.conectasoftware.com\/magazine\/diseno-web\/migrar-la-web-corporativa\/\" target=\"_self\" rel=\"noopener noreferrer\">Cuando Cambiar El Dise\u00f1o De La Web<\/a><\/div>\n<\/div>\n<\/div>\n<p>El dise\u00f1o web ya tiene m\u00e1s de <strong>25 a\u00f1os<\/strong>.<br \/>\n<strong>1990<\/strong> es el a\u00f1o de la primera publicaci\u00f3n de una p\u00e1gina web a mano del brit\u00e1nico, <em>Sir Tim Berners-Lee<\/em>. El a\u00f1o anterior hab\u00eda usado por primera vez el <a href=\"https:\/\/www.conectasoftware.com\/magazine\/diseno-web\/la-importancia-del-https-y-su-impacto-sobre-el-posicionamiento\/\" target=\"_blank\" rel=\"noopener noreferrer\">protocolo http<\/a>, vinculando a un cliente con un servidor. Esta <strong>primera URL<\/strong> activa se ha conservado por su relevancia hist\u00f3rica y se puede visitar siguiendo <a href=\"http:\/\/info.cern.ch\/\" target=\"_blank\" rel=\"noopener noreferrer\">este enlace<\/a>.<br \/>\nDesde este contenido de texto en exclusiva sobre fondo blanco, han ocurrido muchas innovaciones. Seg\u00fan aumenta la velocidad de carga de la conexi\u00f3n, hay m\u00e1s posibilidades de <strong>enriquecer la experiencia de usuario<\/strong>. El dise\u00f1o se ha vuelto m\u00e1s sofisticado, atendiendo tanto a estructura como apariencia.<\/p>\n<h2>11 Elementos de Dise\u00f1o Web &#8211; Infograf\u00eda<\/h2>\n<h2><a href=\"https:\/\/www.conectasoftware.com\/magazine\/diseno-web\"><img loading=\"lazy\" loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-large wp-image-6210\" src=\"https:\/\/www.conectasoftware.com\/magazine\/wp-content\/uploads\/2017\/03\/infografia-caracteristicas-dise\u00f1o-web-moderno-484x1024.jpg\" alt=\"infografia caracteristicas dise\u00f1o web 2018 ecommerce dise\u00f1o tienda online\" width=\"484\" height=\"1024\" \/><\/a><\/h2>\n<h2>Estructura y apariencia<\/h2>\n<p>El texto se empez\u00f3 a organizar en <strong>columnas y cuadros<\/strong>, para diferenciar las tem\u00e1ticas. El <strong>posicionamiento<\/strong> de los diferentes elementos que componen la web <strong>influye sobre el comportamiento<\/strong> del usuario. Seguimos leyendo de izquierda a derecha y de arriba abajo. Cuanto m\u00e1s f\u00e1cil orientarse sin saturarse, encontrando informaci\u00f3n interesante que redirige a m\u00e1s informaci\u00f3n interesante, <strong>m\u00e1s tiempo<\/strong> permanecemos sobre una pagina.<br \/>\nLa incorporaci\u00f3n del <strong>Flash,<\/strong>\u00a0en <strong>1996<\/strong> todav\u00eda se puede encontrar en webs de la \u00e9poca. Hoy en d\u00eda ya no se utiliza y mantener una web con Flash <strong>tiene varias desventajas<\/strong>.\u00a0<a href=\"http:\/\/www.apple.com\/hotnews\/thoughts-on-flash\/\" target=\"_blank\" rel=\"noopener noreferrer\">Apple dej\u00f3 de soportar Flash en 2010<\/a>, y nadie mejor que el propio Steve Jobs, para explicarnos sus razones:<\/p>\n<blockquote><p>Flash fue creado durante la era de la PC-para PC y los ratones. Flash es un negocio exitoso para Adobe, y podemos entender por qu\u00e9 quieren empujar m\u00e1s all\u00e1 de la PC. Pero la era m\u00f3vil va sobre dispositivos de baja potencia, interfaces t\u00e1ctiles y est\u00e1ndares de web abierta \u2013 todas las \u00e1reas donde queda corto Flash.<\/p><\/blockquote>\n<h2><\/h2>\n<p>El Museo del Dise\u00f1o Web muestra m\u00e1s de 900 sitios web que recogen las modas y tendencias entre 1995 y 2005.<\/p>\n<p style=\"text-align: center;\"><a href=\"https:\/\/www.webdesignmuseum.org\/\" target=\"_blank\" rel=\"noopener noreferrer\">Web Design Musem<\/a><\/p>\n<h2>Dise\u00f1o web es parte integral de estrategia de marketing<\/h2>\n<p>En esta l\u00ednea siguen las tendencias. El uso de smartphones y tabletas crece continuamente. Los usuarios est\u00e1n acostumbrados a consultar cualquier pregunta en el navegador de su m\u00f3vil. Se mueven por una web de forma t\u00e1ctil. Una web que quiere ser relevante, debe estar tan adaptada a estos dispositivos como a un sobremesa con rat\u00f3n.<\/p>\n<h3>Estas son las caracter\u00edsticas de un dise\u00f1o moderno y atractivo:<\/h3>\n<ul>\n<li>Dise\u00f1o de <strong>una sola pagina<\/strong> con scrolling infinito.<\/li>\n<li>Dise\u00f1o visual <a href=\"https:\/\/www.conectasoftware.com\/magazine\/diseno-web\/diseno-web-minimalista-tendencia\"><strong>minimalista<\/strong> <\/a>con <strong>im\u00e1genes de alta calidad<\/strong> de fondo, <strong>l\u00edneas claras, <\/strong>incluyendo los <em>fonts<\/em> elegidos.<\/li>\n<li><strong>Navegaci\u00f3n<\/strong> f\u00e1cil, con men\u00fa desplegable y botones grandes.<\/li>\n<li>Los iconos de redes sociales como <strong>facebook, twitter, pinterest o instagram<\/strong> deben ser visibles para motivar la interacci\u00f3n del usuario con la empresa.<\/li>\n<li>Aparte de las redes sociales, no puede faltar una v\u00eda para comunicarse directamente con la empresa. Un <strong>chat integrado<\/strong> en la web es la mejor opci\u00f3n, seguida de un\u00a0<strong>formulario de contacto<\/strong> atractivo y sencillo.<\/li>\n<li><strong>Velocidad<\/strong> de carga y <strong>bajo impacto<\/strong>\u00a0en el consumo de la bater\u00eda y datos.<\/li>\n<li>Para una <strong>experiencia<\/strong> <strong>personalizada<\/strong>, la web debe adaptarse al tama\u00f1o del navegador y al tipo de dispositivo.<\/li>\n<li>La <strong>ubicaci\u00f3n<\/strong> y <strong>visitas previas<\/strong> son factores que pueden influir positivamente en la experiencia del usuario. Por lo tanto, son elementos a tener en cuenta en <strong>un dise\u00f1o \u201c<a href=\"https:\/\/www.conectasoftware.com\/magazine\/diseno-web\/adaptacion-dispositivos-moviles-los-disenos-responsive\">responsive<\/a>\u201d.<\/strong><\/li>\n<\/ul>\n<h2 class=\"modal-title\">Tendencias en dise\u00f1o web en 2020<\/h2>\n<p class=\"fusion-responsive-typography-calculated\" data-fontsize=\"28.8\" data-lineheight=\"37.44px\">En el a\u00f1o 2020 las tendencias en dise\u00f1o web vienen marcadas por el contenido din\u00e1mico, los eventos en base al scroll, el dise\u00f1o minimalista, donde menos es m\u00e1s, y los efectos sutiles.<\/p>\n<h3 data-fontsize=\"28.8\" data-lineheight=\"37.44px\">Elementos 3d din\u00e1micos + efecto de movimiento<\/h3>\n<p>Las im\u00e1genes generadas en 3D de colores brillantes son una tendencia en p\u00e1ginas web. Cuando forman parte del dise\u00f1o, est\u00e1s im\u00e1genes crean contraste y tienen la virtud de captar poderosamente la atenci\u00f3n de los visitantes.<\/p>\n<h3><span id=\"3_Contenido_de_la_pantalla_dividido\">Contenido de la pantalla dividido<\/span><\/h3>\n<p>Una de las grandes l\u00ednea de trabajo de <strong>Apple<\/strong> una novedad este 2020 ha sido la <strong>divisi\u00f3n de la pantalla<\/strong>. Si necesitas mostrar m\u00e1s de idea en tu web sin resultar ca\u00f3tico, una gran soluci\u00f3n es dividir la p\u00e1gina web en dos mitades para que cada idea tenga su propio espacio y protagonismo.<\/p>\n<h3><span id=\"4_Bloques_de_color_solido\">Bloques de color s\u00f3lido<\/span><\/h3>\n<p>Adem\u00e1s del contenido dividido, otra de las formas de mostrar el contenido es diferenci\u00e1ndolo en <strong>bloques de color s\u00f3lido<\/strong>. Jugar con l a forma, tama\u00f1o y colores\u00a0 de los bloques te abre un gran abanico de posibilidades creativas causando en el lector una reacci\u00f3n a este contraste.<\/p>\n<h3 class=\"_3f-vr _208Ie blog-post-title-font _19AEJ _6Xxhi _2QAo- _25MYV _6RI6N tFDi5\">Movimiento<\/h3>\n<p>La presencia de los <strong>v\u00eddeos y las animaciones<\/strong> lleva mucho tiempo en la web y hacen olvidar el concepto de sitio web est\u00e1tico. Sea del tipo que sea, el movimiento siempre genera inter\u00e9s, y es especialmente \u00fatil para captar la <strong>atenci\u00f3n de tu audiencia<\/strong>. Estos movimientos nos sirven para dirigir la mirado del visitante hac\u00eda la zona de la web que nos interesa.<\/p>\n<h3 class=\"_3f-vr _208Ie blog-post-title-font _19AEJ _6Xxhi _2QAo- _25MYV _6RI6N tFDi5\">Elementos de gran tama\u00f1o<\/h3>\n<p class=\"XzvDs _208Ie tFDi5 blog-post-text-font blog-post-text-color _2QAo- _25MYV _6RI6N tFDi5\">Una de las principales tendencias en el 2020 es la presencia de <strong>elementos de gran tama\u00f1o<\/strong> que se plasman en todos los elementos del dise\u00f1o de una p\u00e1gina web. Y es que para comunicar de forma clara e inmediata, las p\u00e1ginas web est\u00e1n recurriendo a elementos de gran tama\u00f1o como tipograf\u00edas grandes, im\u00e1genes y v\u00eddeos a pantalla completa e incluso iconos de gran tama\u00f1o en el men\u00fa.<\/p>\n<p><img loading=\"lazy\" loading=\"lazy\" decoding=\"async\" class=\"wp-image-17174 aligncenter\" src=\"https:\/\/www.conectasoftware.com\/magazine\/wp-content\/uploads\/2020\/05\/Captura.png\" alt=\"\" width=\"920\" height=\"369\" \/><\/p>\n<h2>Responsive<\/h2>\n<p>No estamos ante una novedad pero si que tenemos que tener claro que nuestra web debe de tener un dise\u00f1o 100% responsive, navegable y optimo para que el usuario se sienta c\u00f3modo, si no, estar\u00e1s perdiendo una oportunidad de oro para crecer m\u00e1s, y esto, <strong>es una tendencia m\u00e1s<\/strong>.<\/p>\n<p>Tambi\u00e9n te puede interesar:<br \/>\n<a href=\"https:\/\/www.conectasoftware.com\/magazine\/analytics\/tendencias-ecommerce-2020\/\">Tendencias en ecommerce 2020<\/a><\/p>\n","protected":false},"excerpt":{"rendered":"<p>+ El Dise\u00f1o Web Minimalista +\u00a0C\u00f3mo Mejorar La Accesibilidad De La Web + 10 Principios Del Buen Dise\u00f1o De Dieter Rams &#8211; Inspiraci\u00f3n De 25 A\u00f1os De Dise\u00f1o Web +\u00a0Cuando Cambiar El Dise\u00f1o De La Web El dise\u00f1o web ya tiene m\u00e1s de 25 a\u00f1os. 1990 es el a\u00f1o de la primera publicaci\u00f3n de una [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":25372,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"content-type":"","footnotes":""},"categories":[23],"tags":[],"class_list":{"0":"post-3152","1":"post","2":"type-post","3":"status-publish","4":"format-standard","5":"has-post-thumbnail","7":"category-diseno-web"},"_links":{"self":[{"href":"https:\/\/www.conectasoftware.com\/magazine\/wp-json\/wp\/v2\/posts\/3152","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.conectasoftware.com\/magazine\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.conectasoftware.com\/magazine\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.conectasoftware.com\/magazine\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.conectasoftware.com\/magazine\/wp-json\/wp\/v2\/comments?post=3152"}],"version-history":[{"count":3,"href":"https:\/\/www.conectasoftware.com\/magazine\/wp-json\/wp\/v2\/posts\/3152\/revisions"}],"predecessor-version":[{"id":37897,"href":"https:\/\/www.conectasoftware.com\/magazine\/wp-json\/wp\/v2\/posts\/3152\/revisions\/37897"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.conectasoftware.com\/magazine\/wp-json\/wp\/v2\/media\/25372"}],"wp:attachment":[{"href":"https:\/\/www.conectasoftware.com\/magazine\/wp-json\/wp\/v2\/media?parent=3152"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.conectasoftware.com\/magazine\/wp-json\/wp\/v2\/categories?post=3152"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.conectasoftware.com\/magazine\/wp-json\/wp\/v2\/tags?post=3152"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}