{"id":41250,"date":"2019-10-29T18:44:01","date_gmt":"2019-10-29T18:44:01","guid":{"rendered":"https:\/\/codewebbarcelona.com\/tendencias-en-diseno-web-2020\/"},"modified":"2026-04-21T07:48:41","modified_gmt":"2026-04-21T07:48:41","slug":"tendencies-disseny-web-2020","status":"publish","type":"post","link":"https:\/\/codewebbarcelona.com\/ca\/blog\/tendencies-disseny-web-2020\/","title":{"rendered":"Tend\u00e8ncies en disseny web 2020"},"content":{"rendered":"<p>Si vols estar al dia i comen\u00e7ar l\u2019any vinent amb bon peu, en aquest article repassem les tend\u00e8ncies en disseny web per al 2020. Canvas, 3D, tipografies gegants, contrastos, intel\u00b7lig\u00e8ncia artificial, machine learning, reconeixement de veu i molt m\u00e9s.<\/p>\n<p>[superfeatured]7076[\/superfeatured]<\/p>\n<p>Un any m\u00e9s, aqu\u00ed estem, preparant-nos pel que vindr\u00e0. Ja pr\u00e0cticament a novembre, volem estar a punt per a l\u2019any seg\u00fcent, i tamb\u00e9 volem que els nostres visitants ho estiguin. Com ja \u00e9s habitual, hem preparat un article per parlar sobre el que marcar\u00e0 tend\u00e8ncia dins el m\u00f3n del disseny web el 2020.<\/p>\n<h6>Seguim l\u2019evoluci\u00f3 \u2192 les <a href=\"https:\/\/codewebbarcelona.com\/blog\/tendencias-diseno-web-2026\/\">tend\u00e8ncies de disseny web 2026<\/a> aposten pel minimalisme, la IA i experi\u00e8ncies m\u00e9s humanes.<\/h6>\n<p>Aquest tipus d\u2019article \u00e9s un dels pilars del nostre blog i ens porta una gran quantitat de visites i fins i tot sol\u00b7licituds de pressupost durant tot l\u2019any, de persones que arriben buscant les \u00faltimes tend\u00e8ncies en disseny web, gr\u00e0fic i m\u00e0rqueting. Per aix\u00f2, cada any hi dediquem m\u00e9s esfor\u00e7, atenci\u00f3 i cura que l\u2019anterior. El nostre objectiu \u00e9s oferir contingut de qualitat als nostres visitants, tant si s\u00f3n professionals del disseny gr\u00e0fic\/web com si s\u00f3n futurs clients buscant inspiraci\u00f3 pel seu nou web. A m\u00e9s, crear contingut de qualitat ens ajuda a seguir posicionant als cercadors. Ja ho sabeu: Content is king!<\/p>\n<h6>WOWWW TIO! ja tenim el nou post de les <a href=\"https:\/\/codewebbarcelona.com\/blog\/tendencias-en-diseno-web-2021\/\">tend\u00e8ncies en disseny web per al 2021<\/a>!!!<\/h6>\n<p>Articles d\u2019anys anteriors que et poden interessar: <a href=\"https:\/\/codewebbarcelona.com\/blog\/tendencias-en-diseno-web-2019\/\" target=\"_blank\" rel=\"noopener\">Tend\u00e8ncies en disseny web 2019<\/a> &#8211; <a href=\"https:\/\/codewebbarcelona.com\/blog\/tendencias-diseno-web-2018\/\" target=\"_blank\" rel=\"noopener\">Tend\u00e8ncies en disseny web 2018<\/a> &#8211; <a href=\"https:\/\/codewebbarcelona.com\/blog\/tendencia-de-diseno-web-y-grafico-para-el-2016-vol-1\/\" target=\"_blank\" rel=\"noopener\">Tend\u00e8ncies en disseny web 2016<\/a><\/p>\n<h2>Tend\u00e8ncies en disseny web per al 2020, avan\u00e7a\u2019t<\/h2>\n<h3>Tipografies encara m\u00e9s grans<\/h3>\n<p><img decoding=\"async\" class=\"alignnone wp-image-3883 size-full\" title=\"tendencias en dise\u00f1o web 2020 big typos\" src=\"https:\/\/codewebbarcelona.com\/wp-content\/uploads\/2019\/10\/bigtypos.jpg\" alt=\"\" width=\"1200\" height=\"631\" \/><\/p>\n<p>Una de les tend\u00e8ncies clau del 2020 ser\u00e0, sens dubte, l\u2019\u00fas de tipografies de grans dimensions. No nom\u00e9s als titulars, sin\u00f3 tamb\u00e9 al cos de text general.<\/p>\n<p>Amb la popularitzaci\u00f3 de pantalles panor\u00e0miques d\u2019alta resoluci\u00f3 i la baixada de preus d\u2019aquest tipus de monitors, el tamany de la tipografia per als textos principals ja queda molt lluny dels 12 o 14 p\u00edxels que s\u2019utilitzaven fa una d\u00e8cada. Ara podem fer servir sense problemes mides de 20 p\u00edxels en amunt, sempre que el projecte i el web ho permetin.<\/p>\n<p>Pel que fa als titulars, no hi ha l\u00edmits m\u00e9s enll\u00e0 del bon gust i el sentit com\u00fa: atreveix-te amb mides gegants que generin contrast. Apostar per titulars grans i ben treballats donar\u00e0 molta personalitat a qualsevol web que vulgui destacar i estar preparat pel que vindr\u00e0, no nom\u00e9s el 2020 sin\u00f3 tamb\u00e9 els propers anys.<\/p>\n<h4>Com i quan aplicar-ho<\/h4>\n<p>Aplica aquesta tend\u00e8ncia en webs que:<\/p>\n<ol>\n<li>Necessitin un disseny molt visual i impactant<\/li>\n<li>Tinguin poques imatges i necessitin refor\u00e7 visual; utilitzar tipografies grans de manera descarada donar\u00e0 el toc que busques<\/li>\n<li>No vagin dirigits a un p\u00fablic massa conservador<\/li>\n<li>Tinguin un p\u00fablic objectiu amb equips moderns, especialment pantalles grans<\/li>\n<\/ol>\n<p>Tingues en compte que:<\/p>\n<ol>\n<li>Haur\u00e0s d\u2019ajustar les mides segons la resoluci\u00f3 de pantalla. Crea excepcions responsive, des de 2560px (pantalla gran) fins als m\u00e9s habituals 1330px (port\u00e0til)<\/li>\n<li>Revisa especialment que les mides siguin coherents a la versi\u00f3 m\u00f2bil, ja que la majoria d\u2019usuaris ja naveguen des del m\u00f2bil<\/li>\n<\/ol>\n<h4>Webs que incorporen la tend\u00e8ncia<\/h4>\n<p><strong>Rogue Studio<\/strong><\/p>\n<p><img decoding=\"async\" class=\"alignnone wp-image-3884 size-full\" title=\"tendencias en dise\u00f1o web 2020 tipografias 1\" src=\"https:\/\/codewebbarcelona.com\/wp-content\/uploads\/2019\/10\/tendencias-diseno-web-2020-tipografias-1.jpg\" alt=\"\" width=\"1200\" height=\"631\" \/><\/p>\n<p><a href=\"https:\/\/rogue.studio\/\" target=\"_blank\" rel=\"noopener\">Enlla\u00e7 al web<\/a><\/p>\n<p>En aquest web pots veure clarament l\u2019\u00fas de tipografies no nom\u00e9s grans&#8230; sin\u00f3 EXTRA grans. I la veritat, queden espectaculars.<\/p>\n<p>Estic conven\u00e7ut que aquest web ser\u00e0 un dels candidats pel nostre recull anual dels millors dissenys web.<\/p>\n<p><strong>Granyon Summer Party<\/strong><\/p>\n<p><img decoding=\"async\" class=\"alignnone size-full wp-image-3885\" src=\"https:\/\/codewebbarcelona.com\/wp-content\/uploads\/2019\/10\/tendencias-diseno-web-2020-tipografias-2.jpg\" alt=\"tendencias en dise\u00f1o web 2020 tipografias 2\" width=\"1200\" height=\"631\" \/><\/p>\n<p><a href=\"https:\/\/granyonparty.webflow.io\/\" target=\"_blank\" rel=\"noopener\">Enlla\u00e7 al web<\/a><\/p>\n<p>Un altre gran exemple d\u2019aquesta tend\u00e8ncia aplicada a la perfecci\u00f3. No nom\u00e9s el titular principal i els secundaris, sin\u00f3 que el cos de text tamb\u00e9 \u00e9s gran per si sol.<\/p>\n<p><strong>Team Elite Kickboxing<\/strong><\/p>\n<p><img decoding=\"async\" class=\"alignnone size-full wp-image-3886\" src=\"https:\/\/codewebbarcelona.com\/wp-content\/uploads\/2019\/10\/tendencias-diseno-web-2020-tipografias-3.jpg\" alt=\"tendencias dise\u00f1o web 2020 tipografias 3\" width=\"1200\" height=\"631\" \/><\/p>\n<p><a href=\"https:\/\/teamelitekickboxing.org\/\">Enlla\u00e7 al web<\/a><\/p>\n<p>Per acabar, un \u00faltim exemple on podem veure la tend\u00e8ncia aplicada. A m\u00e9s, aquest web tamb\u00e9 fa servir a la perfecci\u00f3 la tend\u00e8ncia de la qual parlarem tot seguit.<\/p>\n<h3>Contrast, colors negatius i tons vibrants<\/h3>\n<p><img decoding=\"async\" class=\"alignnone wp-image-3887 size-full\" title=\"tendencias dise\u00f1o web 2020 contrastes 1\" src=\"https:\/\/codewebbarcelona.com\/wp-content\/uploads\/2019\/10\/tendencias-diseno-web-2020-contrastes-1.jpg\" alt=\"\" width=\"1200\" height=\"631\" \/><\/p>\n<p>L\u2019\u00fas de contrastos i colors negatius \u00e9s un recurs cada cop m\u00e9s habitual en disseny i desenvolupament web. El 2020 no ser\u00e0 una excepci\u00f3 i veurem webs d\u2019impacte que utilitzen aquests recursos sense complexos.<\/p>\n<p>Deixa\u2019t portar pel teu costat m\u00e9s atrevit i juga amb contrastos i colors vius. Aplica filtres a les imatges, ja sigui pr\u00e8viament amb Photoshop o eines similars, o b\u00e9 amb eines de desenvolupament web m\u00e9s modernes, com els blending modes de CSS o fins i tot l\u2019element canvas.<\/p>\n<h4>Com i quan aplicar-ho<\/h4>\n<p>Aplica aquesta tend\u00e8ncia en webs que:<\/p>\n<ol>\n<li>Necessitin un disseny molt visual i impactant<\/li>\n<li>No vagin dirigits a un p\u00fablic massa conservador<\/li>\n<li>Vulguis captar l\u2019atenci\u00f3 i no deixar ning\u00fa indiferent<\/li>\n<\/ol>\n<p>Tingues en compte que:<\/p>\n<ol>\n<li>En webs corporatius per a empreses m\u00e9s cl\u00e0ssiques, utilitza aquest recurs amb molta subtilesa<\/li>\n<li>Aplica els contrastos de manera coherent, tenint en compte la imatge corporativa i els colors de la marca<\/li>\n<li>Tot i buscar contrast, mantingues l\u2019harmonia visual creant una paleta de colors coherent<\/li>\n<\/ol>\n<h4>Webs que incorporen la tend\u00e8ncia<\/h4>\n<p><b>Ninja guru<\/b><\/p>\n<p><img decoding=\"async\" class=\"alignnone size-full wp-image-3888\" src=\"https:\/\/codewebbarcelona.com\/wp-content\/uploads\/2019\/10\/tendencias-diseno-web-2020-contrastes-2.jpg\" alt=\"tendencias en dise\u00f1o web 2020 contrastes 2\" width=\"1200\" height=\"631\" \/><\/p>\n<p><a href=\"http:\/\/ninjaguru.eu\/\" target=\"_blank\" rel=\"noopener\">Enlla\u00e7 al web<\/a><\/p>\n<p>En aquest web podem veure l\u2019\u00fas del contrast en la seva m\u00e0xima expressi\u00f3. Utilitzen tant colors negatius (blanc\/negre) com contrastos vibrants (blau\/taronja).<\/p>\n<p><strong>Festa da Francofonia 2019<\/strong><\/p>\n<p><img decoding=\"async\" class=\"alignnone size-full wp-image-3889\" src=\"https:\/\/codewebbarcelona.com\/wp-content\/uploads\/2019\/10\/tendencias-diseno-web-2020-contrastes-3.jpg\" alt=\"tendencias en dise\u00f1o web 2020 contrastes 3\" width=\"1200\" height=\"631\" \/><\/p>\n<p><a href=\"https:\/\/www.festadafrancofonia.com\/\" target=\"_blank\" rel=\"noopener\">Enlla\u00e7 al web<\/a><\/p>\n<p>Colors vius, contrastos, elements geom\u00e8trics en moviment&#8230; Un web que no deixa indiferent i un exemple perfecte d\u2019una de les tend\u00e8ncies clau per al 2020.<\/p>\n<p><strong>Kombu<\/strong><\/p>\n<p><img decoding=\"async\" class=\"alignnone size-full wp-image-3890\" src=\"https:\/\/codewebbarcelona.com\/wp-content\/uploads\/2019\/10\/tendencias-diseno-web-2020-contrastes-4.jpg\" alt=\"tendencias en dise\u00f1o web 2020 contrastes 4\" width=\"1200\" height=\"631\" \/><\/p>\n<p><a href=\"https:\/\/www.kombudrinks.com\/\">Enlla\u00e7 al web<\/a><\/p>\n<p>En aquest web, el contrast es trasllada al packaging de cada refresc, representant el sabor de cada beguda. L\u2019efecte \u201cwavy\u201d de les l\u00ednies diagonals, que encaixa perfectament amb el packaging, \u00e9s una aut\u00e8ntica genialitat. Un gran exemple de l\u2019\u00fas no nom\u00e9s de contrastos sin\u00f3 tamb\u00e9 d\u2019efectes JS amb sentit, mantenint una l\u00ednia comunicativa formal per al tipus de producte.<\/p>\n<h3>Experi\u00e8ncia mobile, encara m\u00e9s rellevant<\/h3>\n<div style=\"width: 420px;\" class=\"wp-video\"><video class=\"wp-video-shortcode\" id=\"video-41250-1\" width=\"420\" height=\"746\" preload=\"metadata\" controls=\"controls\"><source type=\"video\/mp4\" src=\"https:\/\/codewebbarcelona.com\/wp-content\/uploads\/2019\/10\/mobile-first.mp4?_=1\" \/><\/video><\/div>\n<p>&nbsp;<\/p>\n<p>A hores d\u2019ara tothom sap qu\u00e8 \u00e9s el disseny web responsive o adaptable, i potser ja no el considerar\u00edem una tend\u00e8ncia per al 2020, almenys en el seu format m\u00e9s b\u00e0sic.<\/p>\n<p>Amb el gran volum d\u2019usuaris navegant des de dispositius m\u00f2bils, \u00e9s imprescindible pensar en ells i oferir una experi\u00e8ncia totalment adaptada al dispositiu i la seva manera d\u2019utilitzar-lo. Es tracta de portar el disseny responsive a un altre nivell.<\/p>\n<p>Ja no n\u2019hi ha prou amb adaptar el web i prou. Ara cal pensar m\u00e9s enll\u00e0 i prendre com a refer\u00e8ncia la usabilitat de les apps. Si aconseguim que la navegaci\u00f3 pel nostre web s\u2019assembli al m\u00e0xim a una app, ens acostarem molt m\u00e9s a l\u2019usuari i a la seva manera de navegar.<\/p>\n<p>Un altre aspecte fonamental per a usuaris m\u00f2bils \u00e9s optimitzar al m\u00e0xim els temps de c\u00e0rrega.<\/p>\n<h4>Alguns consells<\/h4>\n<ol>\n<li>Elements com els v\u00eddeos, millor no carregar-los amb autoplay, ja que consumeixen dades i si l\u2019usuari no t\u00e9 wifi li podem fer una mala passada<\/li>\n<li>Optimitza les imatges, servint versions adaptades a l\u2019amplada del dispositiu, per millorar els temps de c\u00e0rrega<\/li>\n<li>Utilitza men\u00fas tipus burger per comprimir la navegaci\u00f3 en un format similar a una app<\/li>\n<\/ol>\n<h4>Webs que incorporen la tend\u00e8ncia<\/h4>\n<p><strong>Nicholas Munt<\/strong><\/p>\n<div style=\"width: 420px;\" class=\"wp-video\"><video class=\"wp-video-shortcode\" id=\"video-41250-2\" width=\"420\" height=\"746\" preload=\"metadata\" controls=\"controls\"><source type=\"video\/mp4\" src=\"https:\/\/codewebbarcelona.com\/wp-content\/uploads\/2019\/10\/tendencias-diseno-web-mobile-2.mp4?_=2\" \/><\/video><\/div>\n<p>&nbsp;<\/p>\n<p><a href=\"https:\/\/nicholasmunt.com\/\" target=\"_blank\" rel=\"noopener\">Enlla\u00e7 al web<\/a><\/p>\n<p>Aquest web, en utilitzar ajax per carregar cada p\u00e0gina, resulta molt amigable per a m\u00f2bils, ja que s\u2019assembla molt a la navegaci\u00f3 d\u2019una app.<\/p>\n<p><strong>Salmoon &amp; Sons<\/strong><\/p>\n<div style=\"width: 368px;\" class=\"wp-video\"><video class=\"wp-video-shortcode\" id=\"video-41250-3\" width=\"368\" height=\"656\" preload=\"metadata\" controls=\"controls\"><source type=\"video\/mp4\" src=\"https:\/\/codewebbarcelona.com\/wp-content\/uploads\/2019\/10\/tendencias-diseno-web-mobile-3-1.mp4?_=3\" \/><\/video><\/div>\n<p>&nbsp;<\/p>\n<p><a href=\"https:\/\/wsalamoon.com\" target=\"_blank\" rel=\"noopener\">Enlla\u00e7 al web<\/a><\/p>\n<p>En la versi\u00f3 m\u00f2bil d\u2019aquest web, destaca el slider amb funcionalitat swipe totalment adaptada, ja que la imatge es despla\u00e7a seguint el dit a la perfecci\u00f3. Tamb\u00e9 t\u00e9 un men\u00fa burger molt ben resolt, que es desplega des d\u2019un lateral.<\/p>\n<p><strong>Volia<\/strong><\/p>\n<div style=\"width: 420px;\" class=\"wp-video\"><video class=\"wp-video-shortcode\" id=\"video-41250-4\" width=\"420\" height=\"746\" preload=\"metadata\" controls=\"controls\"><source type=\"video\/mp4\" src=\"https:\/\/codewebbarcelona.com\/wp-content\/uploads\/2019\/10\/mobile-first.mp4?_=4\" \/><\/video><\/div>\n<p>&nbsp;<\/p>\n<p><a href=\"https:\/\/studiovoila.com\" target=\"_blank\" rel=\"noopener\">Enlla\u00e7 al web<\/a><\/p>\n<p>Com podeu veure, aquest web utilitza tipografies for\u00e7a grans, per\u00f2 fins i tot a la versi\u00f3 m\u00f2bil estan molt ben treballades. El men\u00fa burger tamb\u00e9 est\u00e0 molt ben implementat i ofereix una transici\u00f3 molt atractiva.<\/p>\n<h6>WOWWW TIO! ja tenim el nou post dels <a href=\"https:\/\/codewebbarcelona.com\/blog\/mejores-disenos-web-2019-2020\/\">millors dissenys web 2019-2020<\/a>!!!! <a href=\"https:\/\/codewebbarcelona.com\/blog\/mejores-disenos-web-2019-2020\/\">Fes clic ara!!<\/a><\/h6>\n<h3>Cursores i scrolls personalitzats<\/h3>\n<p><img decoding=\"async\" class=\"alignnone size-full wp-image-3895\" src=\"https:\/\/codewebbarcelona.com\/wp-content\/uploads\/2019\/10\/tendencias-diseno-web-2020-scroll-cursores-1.jpg\" alt=\"tendencias en dise\u00f1o web 2020 cursores 1\" width=\"1200\" height=\"631\" \/><\/p>\n<p>Una de les tend\u00e8ncies que m\u00e9s estem veient i que guanya popularitat \u00e9s la creaci\u00f3 de cursores personalitzats en lloc del cursor per defecte del navegador.<\/p>\n<p>Aquests cursores solen incorporar certa interacci\u00f3 amb els elements del web, canviant per exemple de mida, color, etc. \u00c9s una de les tend\u00e8ncies m\u00e9s recents i segur que continuar\u00e0 creixent aquest 2020.<\/p>\n<p>El mateix passa amb les scrollbars. Cada cop \u00e9s m\u00e9s habitual utilitzar scrollbars completament personalitzades, obviant les del navegador. A m\u00e9s, solen incorporar despla\u00e7ament suau o smooth scrolling.<\/p>\n<p>Tamb\u00e9 veiem cada cop m\u00e9s webs que opten per no mostrar scrollbar, tot i que hi hagi m\u00e9s contingut a sota. Aquesta tend\u00e8ncia, cada cop m\u00e9s present, segur que ser\u00e0 una de les protagonistes del 2020. La realitat \u00e9s que l\u2019usuari ja est\u00e0 tan acostumat a fer scroll que podem plantejar-nos eliminar la scrollbar per crear una interf\u00edcie m\u00e9s minimalista. Si prescindir-ne et fa respecte, pots optar per no mostrar la barra per\u00f2 guiar l\u2019usuari amb la t\u00edpica icona de \u201cscroll down\u201d.<\/p>\n<h4>Com i quan aplicar-ho<\/h4>\n<p>Aplica aquesta tend\u00e8ncia en webs que:<\/p>\n<ol>\n<li>Vulguis aportar un extra de personalitat<\/li>\n<li>L\u2019usuari sigui avan\u00e7at o acostumat a l\u2019entorn digital<\/li>\n<\/ol>\n<p>Tingues en compte que:<\/p>\n<ol>\n<li>Comprova que el scroll funcioni correctament en tots els navegadors<\/li>\n<li>En dispositius m\u00f2bils, el scroll pot donar problemes, aix\u00ed que el millor \u00e9s ocultar-lo completament<\/li>\n<\/ol>\n<h4>Webs que incorporen la tend\u00e8ncia<\/h4>\n<p><strong>Aluxion<\/strong><\/p>\n<p><img decoding=\"async\" class=\"alignnone size-full wp-image-3896\" src=\"https:\/\/codewebbarcelona.com\/wp-content\/uploads\/2019\/10\/tendencias-diseno-web-2020-scroll-cursores-2.jpg\" alt=\"tendencias en dise\u00f1o web 2020 cursores 2\" width=\"1200\" height=\"631\" \/><\/p>\n<p><a href=\"https:\/\/www.aluxion.com\/\" target=\"_blank\" rel=\"noopener\">Enlla\u00e7 al web<\/a><\/p>\n<p>Aqu\u00ed tenim un scroll personalitzat format per dues circumfer\u00e8ncies, una gran i una petita. Es mou seguint el cursor amb un petit retard i, a m\u00e9s, ofereix un efecte hover molt atractiu. Tamb\u00e9 incorpora una scrollbar personalitzada, integrant tot el disseny.<\/p>\n<p><strong>Joseph Berry<\/strong><\/p>\n<p><img decoding=\"async\" class=\"alignnone size-full wp-image-3897\" src=\"https:\/\/codewebbarcelona.com\/wp-content\/uploads\/2019\/10\/tendencias-diseno-web-2020-scroll-cursores-3.jpg\" alt=\"tendencias en dise\u00f1o web 2020 cursores\n<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Si vols estar al dia i comen\u00e7ar l\u2019any vinent amb bon peu, en aquest article repassem les tend\u00e8ncies en disseny web per al 2020. Canvas, 3D, tipografies gegants, contrastos, intel\u00b7lig\u00e8ncia artificial, machine learning, reconeixement de veu i molt m\u00e9s. [superfeatured]7076[\/superfeatured] Un any m\u00e9s, aqu\u00ed estem, preparant-nos pel que vindr\u00e0. Ja pr\u00e0cticament a novembre, volem estar [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":12093,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"categories":[208,210,134],"class_list":["post-41250","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-disseny-desenvolupament-web","category-inspiracio","category-disseny-grafic"],"acf":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v27.2 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>Tendencias dise\u00f1o web 2020 - Estudio de dise\u00f1o web Code<\/title>\n<meta name=\"description\" content=\"Exploramos en profundidad las tendencias en dise\u00f1o web para 2020. \u00bfQu\u00e9 mejor que hacerlo con ejemplos? Inspiraci\u00f3n a tope!\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/codewebbarcelona.com\/ca\/blog\/tendencies-disseny-web-2020\/\" \/>\n<meta property=\"og:locale\" content=\"ca_ES\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Tendencias dise\u00f1o web 2020 - Estudio de dise\u00f1o web Code\" \/>\n<meta property=\"og:description\" content=\"Exploramos en profundidad las tendencias en dise\u00f1o web para 2020. \u00bfQu\u00e9 mejor que hacerlo con ejemplos? Inspiraci\u00f3n a tope!\" \/>\n<meta property=\"og:url\" content=\"https:\/\/codewebbarcelona.com\/ca\/blog\/tendencies-disseny-web-2020\/\" \/>\n<meta property=\"og:site_name\" content=\"Code Barcelona\" \/>\n<meta property=\"article:published_time\" content=\"2019-10-29T18:44:01+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2026-04-21T07:48:41+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/codewebbarcelona.com\/wp-content\/uploads\/2019\/11\/Active-Theory-01.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"1290\" \/>\n\t<meta property=\"og:image:height\" content=\"700\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"cd26Bc\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Escrit per\" \/>\n\t<meta name=\"twitter:data1\" content=\"cd26Bc\" \/>\n\t<meta name=\"twitter:label2\" content=\"Temps estimat de lectura\" \/>\n\t<meta name=\"twitter:data2\" content=\"9 minuts\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/codewebbarcelona.com\/ca\/blog\/tendencies-disseny-web-2020\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/codewebbarcelona.com\/ca\/blog\/tendencies-disseny-web-2020\/\"},\"author\":{\"name\":\"cd26Bc\",\"@id\":\"https:\/\/codewebbarcelona.com\/ca\/#\/schema\/person\/3af5f44aaf0de2919e9225aa5ca32567\"},\"headline\":\"Tend\u00e8ncies en disseny web 2020\",\"datePublished\":\"2019-10-29T18:44:01+00:00\",\"dateModified\":\"2026-04-21T07:48:41+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/codewebbarcelona.com\/ca\/blog\/tendencies-disseny-web-2020\/\"},\"wordCount\":1739,\"image\":{\"@id\":\"https:\/\/codewebbarcelona.com\/ca\/blog\/tendencies-disseny-web-2020\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/codewebbarcelona.com\/wp-content\/uploads\/2019\/11\/Active-Theory-01.jpg\",\"articleSection\":[\"Disseny i desenvolupament web\",\"Inspiraci\u00f3\",\"Dise\u00f1o gr\u00e1fico\"],\"inLanguage\":\"ca\"},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/codewebbarcelona.com\/ca\/blog\/tendencies-disseny-web-2020\/\",\"url\":\"https:\/\/codewebbarcelona.com\/ca\/blog\/tendencies-disseny-web-2020\/\",\"name\":\"Tendencias dise\u00f1o web 2020 - Estudio de dise\u00f1o web Code\",\"isPartOf\":{\"@id\":\"https:\/\/codewebbarcelona.com\/ca\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/codewebbarcelona.com\/ca\/blog\/tendencies-disseny-web-2020\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/codewebbarcelona.com\/ca\/blog\/tendencies-disseny-web-2020\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/codewebbarcelona.com\/wp-content\/uploads\/2019\/11\/Active-Theory-01.jpg\",\"datePublished\":\"2019-10-29T18:44:01+00:00\",\"dateModified\":\"2026-04-21T07:48:41+00:00\",\"author\":{\"@id\":\"https:\/\/codewebbarcelona.com\/ca\/#\/schema\/person\/3af5f44aaf0de2919e9225aa5ca32567\"},\"description\":\"Exploramos en profundidad las tendencias en dise\u00f1o web para 2020. \u00bfQu\u00e9 mejor que hacerlo con ejemplos? Inspiraci\u00f3n a tope!\",\"inLanguage\":\"ca\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/codewebbarcelona.com\/ca\/blog\/tendencies-disseny-web-2020\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"ca\",\"@id\":\"https:\/\/codewebbarcelona.com\/ca\/blog\/tendencies-disseny-web-2020\/#primaryimage\",\"url\":\"https:\/\/codewebbarcelona.com\/wp-content\/uploads\/2019\/11\/Active-Theory-01.jpg\",\"contentUrl\":\"https:\/\/codewebbarcelona.com\/wp-content\/uploads\/2019\/11\/Active-Theory-01.jpg\",\"width\":1290,\"height\":700},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/codewebbarcelona.com\/ca\/#website\",\"url\":\"https:\/\/codewebbarcelona.com\/ca\/\",\"name\":\"Code Barcelona\",\"description\":\"\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/codewebbarcelona.com\/ca\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"ca\"},{\"@type\":\"Person\",\"@id\":\"https:\/\/codewebbarcelona.com\/ca\/#\/schema\/person\/3af5f44aaf0de2919e9225aa5ca32567\",\"name\":\"cd26Bc\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"ca\",\"@id\":\"https:\/\/secure.gravatar.com\/avatar\/b904e836584635855eaa0ee2922bae4fe2aa94ffb558048dcc5dac5f98f0fadc?s=96&d=mm&r=g\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/b904e836584635855eaa0ee2922bae4fe2aa94ffb558048dcc5dac5f98f0fadc?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/b904e836584635855eaa0ee2922bae4fe2aa94ffb558048dcc5dac5f98f0fadc?s=96&d=mm&r=g\",\"caption\":\"cd26Bc\"},\"sameAs\":[\"https:\/\/codewebbarcelona.com\"]}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Tendencias dise\u00f1o web 2020 - Estudio de dise\u00f1o web Code","description":"Exploramos en profundidad las tendencias en dise\u00f1o web para 2020. \u00bfQu\u00e9 mejor que hacerlo con ejemplos? Inspiraci\u00f3n a tope!","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/codewebbarcelona.com\/ca\/blog\/tendencies-disseny-web-2020\/","og_locale":"ca_ES","og_type":"article","og_title":"Tendencias dise\u00f1o web 2020 - Estudio de dise\u00f1o web Code","og_description":"Exploramos en profundidad las tendencias en dise\u00f1o web para 2020. \u00bfQu\u00e9 mejor que hacerlo con ejemplos? Inspiraci\u00f3n a tope!","og_url":"https:\/\/codewebbarcelona.com\/ca\/blog\/tendencies-disseny-web-2020\/","og_site_name":"Code Barcelona","article_published_time":"2019-10-29T18:44:01+00:00","article_modified_time":"2026-04-21T07:48:41+00:00","og_image":[{"width":1290,"height":700,"url":"https:\/\/codewebbarcelona.com\/wp-content\/uploads\/2019\/11\/Active-Theory-01.jpg","type":"image\/jpeg"}],"author":"cd26Bc","twitter_card":"summary_large_image","twitter_misc":{"Escrit per":"cd26Bc","Temps estimat de lectura":"9 minuts"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/codewebbarcelona.com\/ca\/blog\/tendencies-disseny-web-2020\/#article","isPartOf":{"@id":"https:\/\/codewebbarcelona.com\/ca\/blog\/tendencies-disseny-web-2020\/"},"author":{"name":"cd26Bc","@id":"https:\/\/codewebbarcelona.com\/ca\/#\/schema\/person\/3af5f44aaf0de2919e9225aa5ca32567"},"headline":"Tend\u00e8ncies en disseny web 2020","datePublished":"2019-10-29T18:44:01+00:00","dateModified":"2026-04-21T07:48:41+00:00","mainEntityOfPage":{"@id":"https:\/\/codewebbarcelona.com\/ca\/blog\/tendencies-disseny-web-2020\/"},"wordCount":1739,"image":{"@id":"https:\/\/codewebbarcelona.com\/ca\/blog\/tendencies-disseny-web-2020\/#primaryimage"},"thumbnailUrl":"https:\/\/codewebbarcelona.com\/wp-content\/uploads\/2019\/11\/Active-Theory-01.jpg","articleSection":["Disseny i desenvolupament web","Inspiraci\u00f3","Dise\u00f1o gr\u00e1fico"],"inLanguage":"ca"},{"@type":"WebPage","@id":"https:\/\/codewebbarcelona.com\/ca\/blog\/tendencies-disseny-web-2020\/","url":"https:\/\/codewebbarcelona.com\/ca\/blog\/tendencies-disseny-web-2020\/","name":"Tendencias dise\u00f1o web 2020 - Estudio de dise\u00f1o web Code","isPartOf":{"@id":"https:\/\/codewebbarcelona.com\/ca\/#website"},"primaryImageOfPage":{"@id":"https:\/\/codewebbarcelona.com\/ca\/blog\/tendencies-disseny-web-2020\/#primaryimage"},"image":{"@id":"https:\/\/codewebbarcelona.com\/ca\/blog\/tendencies-disseny-web-2020\/#primaryimage"},"thumbnailUrl":"https:\/\/codewebbarcelona.com\/wp-content\/uploads\/2019\/11\/Active-Theory-01.jpg","datePublished":"2019-10-29T18:44:01+00:00","dateModified":"2026-04-21T07:48:41+00:00","author":{"@id":"https:\/\/codewebbarcelona.com\/ca\/#\/schema\/person\/3af5f44aaf0de2919e9225aa5ca32567"},"description":"Exploramos en profundidad las tendencias en dise\u00f1o web para 2020. \u00bfQu\u00e9 mejor que hacerlo con ejemplos? Inspiraci\u00f3n a tope!","inLanguage":"ca","potentialAction":[{"@type":"ReadAction","target":["https:\/\/codewebbarcelona.com\/ca\/blog\/tendencies-disseny-web-2020\/"]}]},{"@type":"ImageObject","inLanguage":"ca","@id":"https:\/\/codewebbarcelona.com\/ca\/blog\/tendencies-disseny-web-2020\/#primaryimage","url":"https:\/\/codewebbarcelona.com\/wp-content\/uploads\/2019\/11\/Active-Theory-01.jpg","contentUrl":"https:\/\/codewebbarcelona.com\/wp-content\/uploads\/2019\/11\/Active-Theory-01.jpg","width":1290,"height":700},{"@type":"WebSite","@id":"https:\/\/codewebbarcelona.com\/ca\/#website","url":"https:\/\/codewebbarcelona.com\/ca\/","name":"Code Barcelona","description":"","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/codewebbarcelona.com\/ca\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"ca"},{"@type":"Person","@id":"https:\/\/codewebbarcelona.com\/ca\/#\/schema\/person\/3af5f44aaf0de2919e9225aa5ca32567","name":"cd26Bc","image":{"@type":"ImageObject","inLanguage":"ca","@id":"https:\/\/secure.gravatar.com\/avatar\/b904e836584635855eaa0ee2922bae4fe2aa94ffb558048dcc5dac5f98f0fadc?s=96&d=mm&r=g","url":"https:\/\/secure.gravatar.com\/avatar\/b904e836584635855eaa0ee2922bae4fe2aa94ffb558048dcc5dac5f98f0fadc?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/b904e836584635855eaa0ee2922bae4fe2aa94ffb558048dcc5dac5f98f0fadc?s=96&d=mm&r=g","caption":"cd26Bc"},"sameAs":["https:\/\/codewebbarcelona.com"]}]}},"_links":{"self":[{"href":"https:\/\/codewebbarcelona.com\/ca\/wp-json\/wp\/v2\/posts\/41250","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/codewebbarcelona.com\/ca\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/codewebbarcelona.com\/ca\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/codewebbarcelona.com\/ca\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/codewebbarcelona.com\/ca\/wp-json\/wp\/v2\/comments?post=41250"}],"version-history":[{"count":2,"href":"https:\/\/codewebbarcelona.com\/ca\/wp-json\/wp\/v2\/posts\/41250\/revisions"}],"predecessor-version":[{"id":41252,"href":"https:\/\/codewebbarcelona.com\/ca\/wp-json\/wp\/v2\/posts\/41250\/revisions\/41252"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/codewebbarcelona.com\/ca\/wp-json\/wp\/v2\/media\/12093"}],"wp:attachment":[{"href":"https:\/\/codewebbarcelona.com\/ca\/wp-json\/wp\/v2\/media?parent=41250"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/codewebbarcelona.com\/ca\/wp-json\/wp\/v2\/categories?post=41250"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}