{"id":293,"date":"2015-10-14T14:29:25","date_gmt":"2015-10-14T17:29:25","guid":{"rendered":"http:\/\/www.temperim.com\/blog\/?p=293"},"modified":"2021-05-19T13:56:52","modified_gmt":"2021-05-19T16:56:52","slug":"ola-2016-6-tendencias-para-web-que-voce-precisa-conhecer","status":"publish","type":"post","link":"https:\/\/temperim.com\/blog\/ola-2016-6-tendencias-para-web-que-voce-precisa-conhecer\/","title":{"rendered":"Ol\u00e1 2016! 6 tend\u00eancias para web que voc\u00ea precisa conhecer"},"content":{"rendered":"<p style=\"text-align: justify;\">Tend\u00eancias em web design v\u00eam e v\u00e3o.<br \/>\nQuem pode esquecer os gifs dos anos 90?<\/p>\n<p style=\"text-align: justify;\">Recentemente, temos visto um aumento da popularidade do web design responsivo, \u00e0 medida que mais e mais sites se juntam para tornar-se <em>mobile-friendly<\/em>, que agora est\u00e1 ainda mais importante, ap\u00f3s a atualiza\u00e7\u00e3o do algoritmo do Google.<\/p>\n<p style=\"text-align: justify;\">Vamos examinar algumas tend\u00eancias mais populares para o pr\u00f3ximo ano.<\/p>\n<p><!--more--><\/p>\n<p>&nbsp;<\/p>\n<h5 style=\"text-align: justify;\">1. A PROLIFERA\u00c7\u00c3O DOS PADR\u00d5ES DE INTERFACE DO USU\u00c1RIO<\/h5>\n<p style=\"text-align: justify;\">Um dos efeitos secund\u00e1rios do design responsivo fez com que uma grande quantidade de sites pare\u00e7a similar. No entanto, o design responsivo n\u00e3o \u00e9 o \u00fanico culpado. A ascens\u00e3o de sites em WordPress no mercado tamb\u00e9m t\u00eam colaborado.<\/p>\n<figure id=\"attachment_294\" aria-describedby=\"caption-attachment-294\" style=\"width: 941px\" class=\"wp-caption aligncenter\"><img fetchpriority=\"high\" decoding=\"async\" class=\"wp-image-294 size-full\" src=\"http:\/\/www.temperim.com\/blog\/wp-content\/uploads\/2015\/10\/001.png\" alt=\"Cr\u00e9dito da foto: Cypress North\" width=\"941\" height=\"618\" srcset=\"https:\/\/temperim.com\/blog\/wp-content\/uploads\/2015\/10\/001.png 941w, https:\/\/temperim.com\/blog\/wp-content\/uploads\/2015\/10\/001-300x197.png 300w\" sizes=\"(max-width: 941px) 100vw, 941px\" \/><figcaption id=\"caption-attachment-294\" class=\"wp-caption-text\">Cr\u00e9dito: Cypress North<\/figcaption><\/figure>\n<p style=\"text-align: justify;\">Mas ter uma apar\u00eancia semelhante n\u00e3o \u00e9 necessariamente uma coisa ruim. Isso porque mudamos a forma de consumir a web, o que resultou em uma s\u00e9rie de padr\u00f5es de design de interface de usu\u00e1rio comum. Os padr\u00f5es de projetos amadurecem, e h\u00e1 pouco em termos de inova\u00e7\u00e3o quando se trata de padr\u00f5es de interface. Ou seja, um <em>check-out<\/em> ainda ser\u00e1 um <em>check-out<\/em> e deve funcionar como tal, mesmo com um outro modelo de login. N\u00e3o h\u00e1 nenhuma raz\u00e3o real para reinventar a roda. Padr\u00f5es de interface do usu\u00e1rio deve guiar os usu\u00e1rios atrav\u00e9s de uma experi\u00eancia suave.<\/p>\n<p style=\"text-align: justify;\">Eis alguns padr\u00f5es que voc\u00ea deve estar familiarizado:<\/p>\n<ul style=\"text-align: justify;\">\n<li style=\"text-align: justify;\"><strong>O Menu <em>Hamb\u00farguer<\/em>:<\/strong> Enquanto alguns criticam o uso deste padr\u00e3o, n\u00e3o h\u00e1 d\u00favidas que \u00e9 o uso generalizado que faz a fun\u00e7\u00e3o ser facilmente reconhecida pelos usu\u00e1rios.<\/li>\n<\/ul>\n<figure id=\"attachment_295\" aria-describedby=\"caption-attachment-295\" style=\"width: 941px\" class=\"wp-caption aligncenter\"><img decoding=\"async\" class=\"wp-image-295 size-full\" src=\"http:\/\/www.temperim.com\/blog\/wp-content\/uploads\/2015\/10\/002.png\" alt=\"Credito da foto: Silenza via Awwwards\" width=\"941\" height=\"482\" srcset=\"https:\/\/temperim.com\/blog\/wp-content\/uploads\/2015\/10\/002.png 941w, https:\/\/temperim.com\/blog\/wp-content\/uploads\/2015\/10\/002-300x154.png 300w\" sizes=\"(max-width: 941px) 100vw, 941px\" \/><figcaption id=\"caption-attachment-295\" class=\"wp-caption-text\">Credito: Silenza via Awwwards<\/figcaption><\/figure>\n<ul style=\"text-align: justify;\">\n<li style=\"text-align: justify;\"><strong>Registro de Conta:<\/strong> Voc\u00ea vai encontrar esse padr\u00e3o sempre que for se registrar em um site. Pode haver um formul\u00e1rio para preencher ou um bot\u00e3o que permitir\u00e1 que voc\u00ea utilize uma conta de rede social para se inscrever. Assistentes de formul\u00e1rios passo a passo s\u00e3o eficazes, uma vez que h\u00e1 &#8220;peda\u00e7os&#8221; de preenchimento obrigat\u00f3rio, incentivando os usu\u00e1rios a fluir atrav\u00e9s do processo.<\/li>\n<\/ul>\n<figure id=\"attachment_296\" aria-describedby=\"caption-attachment-296\" style=\"width: 941px\" class=\"wp-caption aligncenter\"><img decoding=\"async\" class=\"wp-image-296 size-full\" src=\"http:\/\/www.temperim.com\/blog\/wp-content\/uploads\/2015\/10\/003.png\" alt=\"Cr\u00e9dito da foto: Typeform\" width=\"941\" height=\"353\" srcset=\"https:\/\/temperim.com\/blog\/wp-content\/uploads\/2015\/10\/003.png 941w, https:\/\/temperim.com\/blog\/wp-content\/uploads\/2015\/10\/003-300x113.png 300w\" sizes=\"(max-width: 941px) 100vw, 941px\" \/><figcaption id=\"caption-attachment-296\" class=\"wp-caption-text\">Cr\u00e9dito: Typeform<\/figcaption><\/figure>\n<ul style=\"text-align: justify;\">\n<li style=\"text-align: justify;\"><strong>Longa Barra de Rolagem:<\/strong> Colocar todos os seus elementos importantes acima da dobra agora \u00e9 mito. Al\u00e9m disso, todo mundo est\u00e1 quase acostumado a scrolls longos gra\u00e7as aos dispositivos m\u00f3veis. A t\u00e9cnica funciona especialmente para sites que querem atrais os usu\u00e1rios atrav\u00e9s de hist\u00f3rias, e voc\u00ea ainda pode utilizar multi-p\u00e1ginas, quebrando a hist\u00f3ria em se\u00e7\u00f5es claras.<\/li>\n<\/ul>\n<figure id=\"attachment_297\" aria-describedby=\"caption-attachment-297\" style=\"width: 941px\" class=\"wp-caption aligncenter\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-297 size-full\" src=\"http:\/\/www.temperim.com\/blog\/wp-content\/uploads\/2015\/10\/004.png\" alt=\"Cr\u00e9dito da foto: Vimeo\" width=\"941\" height=\"424\" srcset=\"https:\/\/temperim.com\/blog\/wp-content\/uploads\/2015\/10\/004.png 941w, https:\/\/temperim.com\/blog\/wp-content\/uploads\/2015\/10\/004-300x135.png 300w\" sizes=\"(max-width: 941px) 100vw, 941px\" \/><figcaption id=\"caption-attachment-297\" class=\"wp-caption-text\">Cr\u00e9dito: Vimeo<\/figcaption><\/figure>\n<ul style=\"text-align: justify;\">\n<li style=\"text-align: justify;\"><strong>Layouts de\u00a0Cart\u00e3o:<\/strong> Lan\u00e7ado pela Pinterest, cart\u00f5es est\u00e3o em toda parte na web, porque eles apresentam informa\u00e7\u00f5es em peda\u00e7os perfeitos para a digitaliza\u00e7\u00e3o. Cada cart\u00e3o representa um conceito unificado. Uma vez que eles atuam como &#8220;recipientes de conte\u00fado&#8221;, a sua forma retangular torna mais f\u00e1ceis de re-organizar para diferentes pontos de interrup\u00e7\u00e3o do dispositivo.<\/li>\n<\/ul>\n<figure id=\"attachment_298\" aria-describedby=\"caption-attachment-298\" style=\"width: 941px\" class=\"wp-caption aligncenter\"><a href=\"http:\/\/www.temperim.com\/blog\/wp-content\/uploads\/2015\/10\/005.png\"><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-298\" src=\"http:\/\/www.temperim.com\/blog\/wp-content\/uploads\/2015\/10\/005.png\" alt=\"Cr\u00e9dito da foto: TheNextWeb\" width=\"941\" height=\"556\" srcset=\"https:\/\/temperim.com\/blog\/wp-content\/uploads\/2015\/10\/005.png 941w, https:\/\/temperim.com\/blog\/wp-content\/uploads\/2015\/10\/005-300x177.png 300w\" sizes=\"(max-width: 941px) 100vw, 941px\" \/><\/a><figcaption id=\"caption-attachment-298\" class=\"wp-caption-text\">Cr\u00e9dito: TheNextWeb<\/figcaption><\/figure>\n<ul style=\"text-align: justify;\">\n<li style=\"text-align: justify;\"><strong>Images Hero:<\/strong> Uma vez que a vis\u00e3o \u00e9 o mais forte sentido humano, as imagens HD Hero s\u00e3o uma das maneiras mais r\u00e1pidas de prender a aten\u00e7\u00e3o de um usu\u00e1rio. Gra\u00e7as aos avan\u00e7os da largura de banda e compacta\u00e7\u00e3o de dados, os usu\u00e1rios n\u00e3o sofrer\u00e3o com o tempo de carregamento lento. Um layout comum que voc\u00ea encontrar\u00e1 ser\u00e1 uma image Hero acima do rolo, seguido por se\u00e7\u00f5es zig-zagging ou um arranjo de cart\u00f5es baseados.<\/li>\n<\/ul>\n<figure id=\"attachment_299\" aria-describedby=\"caption-attachment-299\" style=\"width: 941px\" class=\"wp-caption aligncenter\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-299 size-full\" src=\"http:\/\/www.temperim.com\/blog\/wp-content\/uploads\/2015\/10\/006.png\" alt=\"Cr\u00e9dito da foto: Maaemo\" width=\"941\" height=\"564\" srcset=\"https:\/\/temperim.com\/blog\/wp-content\/uploads\/2015\/10\/006.png 941w, https:\/\/temperim.com\/blog\/wp-content\/uploads\/2015\/10\/006-300x180.png 300w\" sizes=\"(max-width: 941px) 100vw, 941px\" \/><figcaption id=\"caption-attachment-299\" class=\"wp-caption-text\">Cr\u00e9dito: Maaemo<\/figcaption><\/figure>\n<h5 style=\"text-align: justify;\">2. RICAS ANIMA\u00c7\u00d5ES<\/h5>\n<p style=\"text-align: justify;\">As anima\u00e7\u00f5es est\u00e3o sendo usadas \u200b\u200bcada vez mais para melhorar a narra\u00e7\u00e3o de um site, tornando a experi\u00eancia mais interativa e divertida.<\/p>\n<p style=\"text-align: justify;\">No entanto, voc\u00ea n\u00e3o pode ter uma anima\u00e7\u00e3o em qualquer lugar. Deve considerar cuidadosamente se ele acrescenta elementos na hist\u00f3ria e personalidade do seu site. As anima\u00e7\u00f5es podem ser pensadas em termos de dois grupos:<\/p>\n<ul style=\"text-align: justify;\">\n<li style=\"text-align: justify;\"><strong>Anima\u00e7\u00f5es em grande escala:\u00a0<\/strong>Estas s\u00e3o utilizadas como uma ferramenta de intera\u00e7\u00e3o prim\u00e1ria, que t\u00eam mais impacto sobre os usu\u00e1rios e incluem efeitos como a rolagem de paralaxe e notifica\u00e7\u00f5es pop-up.<\/li>\n<li style=\"text-align: justify;\"><strong>Anima\u00e7\u00f5es em pequena escala:<\/strong>\u00a0Estas incluem spinners, ferramentas e barras de carregamento, e n\u00e3o necessitam de qualquer\u00a0a\u00e7\u00e3o\u00a0do usu\u00e1rio.<\/li>\n<\/ul>\n<p style=\"text-align: justify;\">Vamos descrever 7 das t\u00e9cnicas de anima\u00e7\u00e3o mais populares:<\/p>\n<ul>\n<li style=\"text-align: justify;\"><strong>Anima\u00e7\u00f5es de Carregamento<\/strong><br \/>\nEstas s\u00e3o usadas \u200b\u200bpara entreter os usu\u00e1rios durante uma experi\u00eancia de modo tedioso. Anima\u00e7\u00f5es de carregamento tendem a ser populares no flat design, minimalismo, portf\u00f3lios\u00a0e sites de uma p\u00e1gina (one pages).\u00a0Mantenha-os simples e evite a adi\u00e7\u00e3o de som. Contudo, devem coincidir com personalidade e paleta de cores do seu site.<\/li>\n<\/ul>\n<figure id=\"attachment_300\" aria-describedby=\"caption-attachment-300\" style=\"width: 941px\" class=\"wp-caption aligncenter\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-300 size-full\" src=\"http:\/\/www.temperim.com\/blog\/wp-content\/uploads\/2015\/10\/007.gif\" alt=\"Slack via Lauren Tan\" width=\"941\" height=\"352\" \/><figcaption id=\"caption-attachment-300\" class=\"wp-caption-text\">Slack via Lauren Tan<\/figcaption><\/figure>\n<ul>\n<li style=\"text-align: justify;\"><strong>Navega\u00e7\u00e3o e Menus (nonscrolling)<\/strong><br \/>\nMenus de navega\u00e7\u00e3o escondidos tornaram-se cada vez mais popular, especialmente porque eles podem ser usados \u200b\u200bpara economizar espa\u00e7o na tela. Como voc\u00ea pode ver no exemplo abaixo, criado na ferramenta de prototipagem colaborativo UXPin, estas anima\u00e7\u00f5es de uso para revelar um menu ao clicar em um bot\u00e3o espec\u00edfico e evitar uma transi\u00e7\u00e3o chocante (como um menu de navega\u00e7\u00e3o escondido atr\u00e1s de um \u00edcone hamb\u00farguer).<\/li>\n<\/ul>\n<ul>\n<li style=\"text-align: justify;\"><strong>Anima\u00e7\u00f5es de\u00a0Hover<\/strong><br \/>\nEfeitos d\u00e3o uma sensa\u00e7\u00e3o mais intuitiva para um site quanto os usu\u00e1rios passam o mouse sobre o conte\u00fado.<\/li>\n<\/ul>\n<figure id=\"attachment_301\" aria-describedby=\"caption-attachment-301\" style=\"width: 941px\" class=\"wp-caption aligncenter\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-301 size-full\" src=\"http:\/\/www.temperim.com\/blog\/wp-content\/uploads\/2015\/10\/008.jpg\" alt=\"Cr\u00e9dito da foto: Humaan\" width=\"941\" height=\"548\" srcset=\"https:\/\/temperim.com\/blog\/wp-content\/uploads\/2015\/10\/008.jpg 941w, https:\/\/temperim.com\/blog\/wp-content\/uploads\/2015\/10\/008-300x175.jpg 300w\" sizes=\"(max-width: 941px) 100vw, 941px\" \/><figcaption id=\"caption-attachment-301\" class=\"wp-caption-text\">Cr\u00e9dito: Humaan<\/figcaption><\/figure>\n<ul>\n<li style=\"text-align: justify;\"><strong>Galerias e Slideshows<\/strong><br \/>\nGalerias e slideshows s\u00e3o uma maneira eficaz de mostrar v\u00e1rias imagens sem sobrecarregar os usu\u00e1rios. Estes s\u00e3o mais utilizados em sites de fotografia, vitrines de produtos e portf\u00f3lios.<\/li>\n<\/ul>\n<figure id=\"attachment_302\" aria-describedby=\"caption-attachment-302\" style=\"width: 941px\" class=\"wp-caption aligncenter\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-302 size-full\" src=\"http:\/\/www.temperim.com\/blog\/wp-content\/uploads\/2015\/10\/009.png\" alt=\"Cr\u00e9dito da foto: Born Fighter via Awwwards\" width=\"941\" height=\"481\" srcset=\"https:\/\/temperim.com\/blog\/wp-content\/uploads\/2015\/10\/009.png 941w, https:\/\/temperim.com\/blog\/wp-content\/uploads\/2015\/10\/009-300x153.png 300w\" sizes=\"(max-width: 941px) 100vw, 941px\" \/><figcaption id=\"caption-attachment-302\" class=\"wp-caption-text\">Cr\u00e9dito: Born Fighter via Awwwards<\/figcaption><\/figure>\n<ul>\n<li style=\"text-align: justify;\"><strong>Motion Animation<\/strong><br \/>\nNossos olhos s\u00e3o naturalmente atra\u00eddos para o movimento, o que torna a ferramenta perfeita para chamar a aten\u00e7\u00e3o do usu\u00e1rio. Movimento tamb\u00e9m pode ajudar na hierarquia visual. Isso pode ajudar a adicionar interesse para formul\u00e1rios, CTAs e itens de menu.<\/li>\n<\/ul>\n<figure id=\"attachment_303\" aria-describedby=\"caption-attachment-303\" style=\"width: 941px\" class=\"wp-caption aligncenter\"><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-303\" src=\"http:\/\/www.temperim.com\/blog\/wp-content\/uploads\/2015\/10\/010.gif\" alt=\"Cr\u00e9dito da foto: Bugaboo via Awwwards\" width=\"941\" height=\"374\" \/><figcaption id=\"caption-attachment-303\" class=\"wp-caption-text\">Cr\u00e9dito: Bugaboo via Awwwards<\/figcaption><\/figure>\n<ul>\n<li style=\"text-align: justify;\"><strong>Rolagem<\/strong><br \/>\nUma rolagem suave conta com anima\u00e7\u00e3o e d\u00e1 mais controle para o usu\u00e1rio, que pode determinar o ritmo de como a anima\u00e7\u00e3o se desenrola.<\/li>\n<\/ul>\n<figure id=\"attachment_304\" aria-describedby=\"caption-attachment-304\" style=\"width: 941px\" class=\"wp-caption aligncenter\"><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-304\" src=\"http:\/\/www.temperim.com\/blog\/wp-content\/uploads\/2015\/10\/011.gif\" alt=\"Cr\u00e9dito da foto: Squarespace\" width=\"941\" height=\"540\" \/><figcaption id=\"caption-attachment-304\" class=\"wp-caption-text\">Cr\u00e9dito: Squarespace<\/figcaption><\/figure>\n<ul>\n<li style=\"text-align: justify;\"><strong>Anima\u00e7\u00f5es de Fundo \/ V\u00eddeos<\/strong><br \/>\nUm fundo animado simples pode adicionar visibilidade a um site, mas deve ser usado com modera\u00e7\u00e3o ou pode ser muito perturbador para o usu\u00e1rio. A chave \u00e9 trabalhar em se\u00e7\u00f5es individuais ou criar um movimento suave de uma imagem inteira.<\/li>\n<\/ul>\n<figure id=\"attachment_305\" aria-describedby=\"caption-attachment-305\" style=\"width: 941px\" class=\"wp-caption aligncenter\"><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-305\" src=\"http:\/\/www.temperim.com\/blog\/wp-content\/uploads\/2015\/10\/012.jpg\" alt=\"Cr\u00e9dito: Dunckelfeld\" width=\"941\" height=\"367\" srcset=\"https:\/\/temperim.com\/blog\/wp-content\/uploads\/2015\/10\/012.jpg 941w, https:\/\/temperim.com\/blog\/wp-content\/uploads\/2015\/10\/012-300x117.jpg 300w\" sizes=\"(max-width: 941px) 100vw, 941px\" \/><figcaption id=\"caption-attachment-305\" class=\"wp-caption-text\">Cr\u00e9dito: Dunckelfeld<\/figcaption><\/figure>\n<h5 style=\"text-align: justify;\">3. MICRO-INTERA\u00c7\u00d5ES<\/h5>\n<p style=\"text-align: justify;\">Micro-intera\u00e7\u00f5es acontecem \u00e0 nossa volta, desde desligar o alarme no seu\u00a0celular, a curtir\u00a0uma\u00a0imagem de gato no Facebook.<\/p>\n<p style=\"text-align: justify;\">Cada um feito sem um segundo pensamento. \u00c9 prov\u00e1vel que voc\u00ea come\u00e7ou o seu dia com uma micro-intera\u00e7\u00e3o.\u00a0Ao desligar o alarme no seu celular, voc\u00ea foi envolvido com uma interface de usu\u00e1rio em um \u00fanico momento. E mais e mais destes s\u00e3o inseridos\u00a0nos aplicativos e dispositivos que usamos.<\/p>\n<figure id=\"attachment_306\" aria-describedby=\"caption-attachment-306\" style=\"width: 941px\" class=\"wp-caption aligncenter\"><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-306\" src=\"http:\/\/www.temperim.com\/blog\/wp-content\/uploads\/2015\/10\/013.png\" alt=\"Cr\u00e9dito: Slack\" width=\"941\" height=\"361\" srcset=\"https:\/\/temperim.com\/blog\/wp-content\/uploads\/2015\/10\/013.png 941w, https:\/\/temperim.com\/blog\/wp-content\/uploads\/2015\/10\/013-300x115.png 300w\" sizes=\"(max-width: 941px) 100vw, 941px\" \/><figcaption id=\"caption-attachment-306\" class=\"wp-caption-text\">Cr\u00e9dito: Slack<\/figcaption><\/figure>\n<p style=\"text-align: justify;\">Micro-intera\u00e7\u00f5es tendem a fazer, ou ajud\u00e1-lo a fazer, v\u00e1rias coisas diferentes:<\/p>\n<ul>\n<li style=\"text-align: justify;\"><em>Comunique-se um status ou pouco de realimenta\u00e7\u00e3o<\/em><\/li>\n<li style=\"text-align: justify;\"><em>Veja o resultado de uma a\u00e7\u00e3o<\/em><\/li>\n<li style=\"text-align: justify;\"><em>Ajudar o usu\u00e1rio manipular algo<\/em><\/li>\n<\/ul>\n<p style=\"text-align: justify;\">Micro-intera\u00e7\u00f5es s\u00e3o uma parte vital de qualquer aplicativo.<\/p>\n<p style=\"text-align: justify;\">Voc\u00ea vai querer garantir que essas intera\u00e7\u00f5es acontecem quase invisivelmente. Considere cada detalhe com cuidado, e fa\u00e7a com que cada intera\u00e7\u00e3o sinta-se humana. Isto \u00e9, fazer texto de conversa\u00e7\u00e3o e n\u00e3o rob\u00f3tica.<\/p>\n<p style=\"text-align: justify;\">Micro-intera\u00e7\u00f5es s\u00e3o uma parte importante de quase todos os projetos de design digital. Voc\u00ea vai ser duramente pressionado para criar um site ou aplicativo m\u00f3vel que n\u00e3o inclui algum elemento, ou um momento, que um usu\u00e1rio precisa para interagir com.<\/p>\n<p style=\"text-align: justify;\">Cada um destes tipos de intera\u00e7\u00e3o leva os usu\u00e1rios a um caminho de projeto mais centrado no ser humano. Este conceito de tornar os dispositivos mais semelhante \u00e0 ra\u00e7a humana em seus momentos \u00e9 uma chave para a ado\u00e7\u00e3o e usabilidade.<\/p>\n<p>&nbsp;<\/p>\n<h5 style=\"text-align: justify;\">4. MATERIAL DESIGN: UMA ALTERNATIVA PARA O FLAT DESIGN<\/h5>\n<p style=\"text-align: justify;\">No ano passado, o Google lan\u00e7ou a sua nova linguagem de estilo, o\u00a0Material Design. Ele usa efeitos de sombra e os conceitos de movimento e profundidade, a fim de criar modelos que aparentam ser\u00a0mais realistas para os usu\u00e1rios.<\/p>\n<figure id=\"attachment_307\" aria-describedby=\"caption-attachment-307\" style=\"width: 941px\" class=\"wp-caption aligncenter\"><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-307\" src=\"http:\/\/www.temperim.com\/blog\/wp-content\/uploads\/2015\/10\/014.png\" alt=\"Cr\u00e9dito: Google Now\" width=\"941\" height=\"597\" srcset=\"https:\/\/temperim.com\/blog\/wp-content\/uploads\/2015\/10\/014.png 941w, https:\/\/temperim.com\/blog\/wp-content\/uploads\/2015\/10\/014-300x190.png 300w\" sizes=\"(max-width: 941px) 100vw, 941px\" \/><figcaption id=\"caption-attachment-307\" class=\"wp-caption-text\">Cr\u00e9dito: Google Now<\/figcaption><\/figure>\n<p style=\"text-align: justify;\">O objetivo do projeto \u00e9 criar um design\u00a0limpo, modernista, que se concentram em UX (<em>user\u00a0<\/em><i>experiencie<\/i>\u00a0&#8211; experi\u00eancia do usu\u00e1rio). Enquanto concep\u00e7\u00e3o est\u00e9tica do Google tem detratores, tem sido quase sempre elogiado como um divisor de \u00e1guas.<\/p>\n<p style=\"text-align: justify;\">Com seu olhar minimalista o Material Design\u00a0tem muito em comum com outra tend\u00eancia crescente &#8211; o flat design. O\u00a0Material Design, no entanto, faz uso de profundidade e sombra, o que permite mais profundidade do que flat design.<\/p>\n<figure id=\"attachment_308\" aria-describedby=\"caption-attachment-308\" style=\"width: 941px\" class=\"wp-caption aligncenter\"><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-308\" src=\"http:\/\/www.temperim.com\/blog\/wp-content\/uploads\/2015\/10\/015.png\" alt=\"Cr\u00e9dito: Angular\" width=\"941\" height=\"376\" srcset=\"https:\/\/temperim.com\/blog\/wp-content\/uploads\/2015\/10\/015.png 941w, https:\/\/temperim.com\/blog\/wp-content\/uploads\/2015\/10\/015-300x120.png 300w\" sizes=\"(max-width: 941px) 100vw, 941px\" \/><figcaption id=\"caption-attachment-308\" class=\"wp-caption-text\">Cr\u00e9dito: Angular<\/figcaption><\/figure>\n<p style=\"text-align: justify;\">Temos visto a maioria dos projetos de Material Design\u00a0limitado aos projetos app. O Google anunciou <em>Material Design\u00a0Lite<\/em> em julho, que ser\u00e1\u00a0mais adequado para websites. No entanto, o Material Design\u00a0foi concebido para proporcionar uma grande UI e UX atrav\u00e9s de dispositivos. <em>Lite<\/em> usa CSS, HTML e JavaScript e se destina a tornar mais simples para adicionar a apar\u00eancia de Material Design para websites.<\/p>\n<p style=\"text-align: justify;\">O <em>Material Design\u00a0Lite<\/em> n\u00e3o confia em qualquer estrutura particular, por isso os designers podem usar uma ampla variedade de ferramentas de front-end para criar seus sites. \u00c9 igualmente leve quando se trata do c\u00f3digo.<\/p>\n<p>&nbsp;<\/p>\n<h5 style=\"text-align: justify;\">5. DESIGN\u00a0RESPONSIVO<\/h5>\n<p style=\"text-align: justify;\">Web design responsivo tornou-se incrivelmente popular, gra\u00e7as ao aumento do uso da internet m\u00f3vel.<\/p>\n<figure id=\"attachment_309\" aria-describedby=\"caption-attachment-309\" style=\"width: 941px\" class=\"wp-caption aligncenter\"><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-309\" src=\"http:\/\/www.temperim.com\/blog\/wp-content\/uploads\/2015\/10\/016.png\" alt=\"Cr\u00e9dito: UXPin\" width=\"941\" height=\"430\" srcset=\"https:\/\/temperim.com\/blog\/wp-content\/uploads\/2015\/10\/016.png 941w, https:\/\/temperim.com\/blog\/wp-content\/uploads\/2015\/10\/016-300x137.png 300w\" sizes=\"(max-width: 941px) 100vw, 941px\" \/><figcaption id=\"caption-attachment-309\" class=\"wp-caption-text\">Cr\u00e9dito: UXPin<\/figcaption><\/figure>\n<p style=\"text-align: justify;\">\u00c9 seguro dizer que o design responsivo n\u00e3o vai a lugar nenhum em breve, uma vez que representa uma maneira relativamente simples e barata para as empresas para\u00a0construir um site <em>mobile-friendly<\/em> totalmente funcional. Mas o design responsivo vem com alguns problemas se n\u00e3o for realizado corretamente, o mais importante est\u00e1\u00a0no desempenho.<\/p>\n<p style=\"text-align: justify;\">O desempenho \u00e9 importante n\u00e3o s\u00f3 para UX, mas tamb\u00e9m para o Google, que fez uma atualiza\u00e7\u00e3o em abril de 2015 para <em>mobile-friendly<\/em>. Web design responsivo tamb\u00e9m \u00e9 altamente compat\u00edvel com o minimalismo, gra\u00e7as \u00e0 necessidade de manter o peso da p\u00e1gina baixo. Tamb\u00e9m \u00e9 \u00f3timo para trabalhar com cart\u00f5es e o design responsivo pode facilmente reestrutur\u00e1-los, a fim de adaptar a qualquer tamanho de ponto de interrup\u00e7\u00e3o ou em tela (como reorganizando recipientes retangulares de conte\u00fado).<\/p>\n<figure id=\"attachment_310\" aria-describedby=\"caption-attachment-310\" style=\"width: 941px\" class=\"wp-caption aligncenter\"><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-310\" src=\"http:\/\/www.temperim.com\/blog\/wp-content\/uploads\/2015\/10\/017.png\" alt=\"Cr\u00e9dito: The Guardian\" width=\"941\" height=\"718\" srcset=\"https:\/\/temperim.com\/blog\/wp-content\/uploads\/2015\/10\/017.png 941w, https:\/\/temperim.com\/blog\/wp-content\/uploads\/2015\/10\/017-300x229.png 300w\" sizes=\"(max-width: 941px) 100vw, 941px\" \/><figcaption id=\"caption-attachment-310\" class=\"wp-caption-text\">Cr\u00e9dito: The Guardian<\/figcaption><\/figure>\n<p style=\"text-align: justify;\">Web design responsivo est\u00e1 se tornando menos de uma tend\u00eancia e mais de uma melhor pr\u00e1tica.\u00a0N\u00e3o h\u00e1 d\u00favida de que o design responsivo \u00e9 extremamente \u00fatil e vers\u00e1til, mas tamb\u00e9m deve ser extremamente r\u00e1pido, a fim de entregar uma grande UX.<\/p>\n<p>&nbsp;<\/p>\n<h5 style=\"text-align: justify;\">6. FLAT DESIGN N\u00c3O IR\u00c1 EMBORA T\u00c3O CEDO<\/h5>\n<p style=\"text-align: justify;\">Flat Design\u00a0j\u00e1 existe h\u00e1 algum tempo e \u00e9 compat\u00edvel com outras tend\u00eancias como o minimalismo, web design responsivo e Material Design.<\/p>\n<figure id=\"attachment_311\" aria-describedby=\"caption-attachment-311\" style=\"width: 941px\" class=\"wp-caption aligncenter\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-311 size-full\" src=\"http:\/\/www.temperim.com\/blog\/wp-content\/uploads\/2015\/10\/108.png\" alt=\"Cr\u00e9dito: Beoplay via Awwwards\" width=\"941\" height=\"562\" srcset=\"https:\/\/temperim.com\/blog\/wp-content\/uploads\/2015\/10\/108.png 941w, https:\/\/temperim.com\/blog\/wp-content\/uploads\/2015\/10\/108-300x179.png 300w\" sizes=\"(max-width: 941px) 100vw, 941px\" \/><figcaption id=\"caption-attachment-311\" class=\"wp-caption-text\">Cr\u00e9dito: Beoplay via Awwwards<\/figcaption><\/figure>\n<p style=\"text-align: justify;\">Daqui para frente, \u00e9 prov\u00e1vel que vamos ver as seguintes tend\u00eancias em flat design:<\/p>\n<ul>\n<li style=\"text-align: justify;\"><strong>Longas sombras.<\/strong> Estes trazem mais profundidade ao flat design.<\/li>\n<li style=\"text-align: justify;\"><strong>Esquemas de cores vibrantes.<\/strong> Frameworks de UI\u00a0populares e modelos levaram muitos a come\u00e7ar a usar cores mais vibrantes em seus projetos.<\/li>\n<li style=\"text-align: justify;\"><strong>Tipografia simples.<\/strong> Fontes simples ajudam a garantir que o texto permane\u00e7a leg\u00edvel em flat design.<\/li>\n<li style=\"text-align: justify;\"><strong>Bot\u00f5es de fantasmas.<\/strong> Estes permitem a funcionalidade sem distrair a partir do UX e muitas vezes s\u00e3o representados como outlined, links clic\u00e1veis \u200b\u200bque mudam quando o usu\u00e1rio passa por cima deles.<\/li>\n<li style=\"text-align: justify;\"><strong>Minimalismo.<\/strong>\u00a0Para reduzir o n\u00famero de elementos a fim de criar um fresco\u00a0e organizado\u00a0UI.<\/li>\n<\/ul>\n<p>&nbsp;<\/p>\n<h5 style=\"text-align: justify;\"><em>Conselhos Adicionais sobre Tend\u00eancias de Web Design<\/em><\/h5>\n<p style=\"text-align: justify;\">N\u00e3o siga tend\u00eancias s\u00f3 porque eles s\u00e3o a coisa &#8220;hip&#8221; para fazer no momento. Tend\u00eancias representam t\u00e9cnicas populares por um bom motivo, mas certifique-se que \u00e9 o melhor para seus usu\u00e1rios. Por exemplo, um site de e-commerce certamente n\u00e3o cairia\u00a0bem como uma\u00a0One\u00a0Page de\u00a0infinita\u00a0barra de rolagem.<\/p>\n<p style=\"text-align: justify;\">As tend\u00eancias s\u00e3o nada mais do que ferramentas adicionais em nossa\u00a0caixa de ferramentas designer.<\/p>\n<p>&nbsp;<\/p>\n<p style=\"text-align: justify;\"><em>Fonte:\u00a0Awwwards<\/em><\/p>\n<p>&nbsp;<\/p>\n<p style=\"text-align: justify;\">E ent\u00e3o, gostou das dicas?<\/p>\n<p>&nbsp;<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Tend\u00eancias em web design v\u00eam e v\u00e3o. Quem pode esquecer os gifs dos anos 90? Recentemente, temos visto um aumento da popularidade do web design responsivo, \u00e0 medida que mais e mais sites se juntam para tornar-se mobile-friendly, que agora est\u00e1 ainda mais importante, ap\u00f3s a atualiza\u00e7\u00e3o do algoritmo do Google. Vamos examinar algumas tend\u00eancias [&hellip;]<\/p>\n","protected":false},"author":2,"featured_media":319,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[3,54],"tags":[84,81,26,85,83,82,86],"class_list":["post-293","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-dica-do-chef","category-fique-por-dentro","tag-design-de-interface","tag-flat-desing","tag-responsivo","tag-tendencias","tag-ui","tag-ux","tag-web"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v28.0 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>6 Tend\u00eancias para Web que voc\u00ea precisa conhecer - Mexid\u00e3o<\/title>\n<meta name=\"description\" content=\"Separamos 6 tend\u00eancias para Web para 2016 que voc\u00ea precisa conhecer! Clique e saiba mais!\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/temperim.com\/blog\/ola-2016-6-tendencias-para-web-que-voce-precisa-conhecer\/\" \/>\n<meta property=\"og:locale\" content=\"pt_BR\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"6 Tend\u00eancias para Web que voc\u00ea precisa conhecer - Mexid\u00e3o\" \/>\n<meta property=\"og:description\" content=\"Separamos 6 tend\u00eancias para Web para 2016 que voc\u00ea precisa conhecer! Clique e saiba mais!\" \/>\n<meta property=\"og:url\" content=\"https:\/\/temperim.com\/blog\/ola-2016-6-tendencias-para-web-que-voce-precisa-conhecer\/\" \/>\n<meta property=\"og:site_name\" content=\"Mexid\u00e3o\" \/>\n<meta property=\"article:published_time\" content=\"2015-10-14T17:29:25+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2021-05-19T16:56:52+00:00\" \/>\n<meta property=\"og:image\" content=\"http:\/\/www.temperim.com\/blog\/wp-content\/uploads\/2015\/10\/img_trends.jpg\" \/>\n<meta name=\"author\" content=\"Daniela Pereira\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:title\" content=\"6 Tend\u00eancias para Web que voc\u00ea precisa conhecer - Mexid\u00e3o\" \/>\n<meta name=\"twitter:description\" content=\"Separamos 6 tend\u00eancias para Web para 2016 que voc\u00ea precisa conhecer! Clique e saiba mais!\" \/>\n<meta name=\"twitter:image\" content=\"http:\/\/www.temperim.com\/blog\/wp-content\/uploads\/2015\/10\/img_trends.jpg\" \/>\n<meta name=\"twitter:label1\" content=\"Escrito por\" \/>\n\t<meta name=\"twitter:data1\" content=\"Daniela Pereira\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. tempo de leitura\" \/>\n\t<meta name=\"twitter:data2\" content=\"11 minutos\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/temperim.com\\\/blog\\\/ola-2016-6-tendencias-para-web-que-voce-precisa-conhecer\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/temperim.com\\\/blog\\\/ola-2016-6-tendencias-para-web-que-voce-precisa-conhecer\\\/\"},\"author\":{\"name\":\"Daniela Pereira\",\"@id\":\"https:\\\/\\\/temperim.com\\\/blog\\\/#\\\/schema\\\/person\\\/339d56b9252dec047f4aebede2f7953e\"},\"headline\":\"Ol\u00e1 2016! 6 tend\u00eancias para web que voc\u00ea precisa conhecer\",\"datePublished\":\"2015-10-14T17:29:25+00:00\",\"dateModified\":\"2021-05-19T16:56:52+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/temperim.com\\\/blog\\\/ola-2016-6-tendencias-para-web-que-voce-precisa-conhecer\\\/\"},\"wordCount\":2157,\"publisher\":{\"@id\":\"https:\\\/\\\/temperim.com\\\/blog\\\/#organization\"},\"image\":{\"@id\":\"https:\\\/\\\/temperim.com\\\/blog\\\/ola-2016-6-tendencias-para-web-que-voce-precisa-conhecer\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/temperim.com\\\/blog\\\/wp-content\\\/uploads\\\/2015\\\/10\\\/img_trends.jpg\",\"keywords\":[\"design de interface\",\"flat desing\",\"responsivo\",\"tend\u00eancias\",\"ui\",\"ux\",\"web\"],\"articleSection\":[\"Dica do Chef\",\"Fique por Dentro\"],\"inLanguage\":\"pt-BR\"},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/temperim.com\\\/blog\\\/ola-2016-6-tendencias-para-web-que-voce-precisa-conhecer\\\/\",\"url\":\"https:\\\/\\\/temperim.com\\\/blog\\\/ola-2016-6-tendencias-para-web-que-voce-precisa-conhecer\\\/\",\"name\":\"6 Tend\u00eancias para Web que voc\u00ea precisa conhecer - Mexid\u00e3o\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/temperim.com\\\/blog\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/temperim.com\\\/blog\\\/ola-2016-6-tendencias-para-web-que-voce-precisa-conhecer\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/temperim.com\\\/blog\\\/ola-2016-6-tendencias-para-web-que-voce-precisa-conhecer\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/temperim.com\\\/blog\\\/wp-content\\\/uploads\\\/2015\\\/10\\\/img_trends.jpg\",\"datePublished\":\"2015-10-14T17:29:25+00:00\",\"dateModified\":\"2021-05-19T16:56:52+00:00\",\"description\":\"Separamos 6 tend\u00eancias para Web para 2016 que voc\u00ea precisa conhecer! Clique e saiba mais!\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/temperim.com\\\/blog\\\/ola-2016-6-tendencias-para-web-que-voce-precisa-conhecer\\\/#breadcrumb\"},\"inLanguage\":\"pt-BR\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/temperim.com\\\/blog\\\/ola-2016-6-tendencias-para-web-que-voce-precisa-conhecer\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"pt-BR\",\"@id\":\"https:\\\/\\\/temperim.com\\\/blog\\\/ola-2016-6-tendencias-para-web-que-voce-precisa-conhecer\\\/#primaryimage\",\"url\":\"https:\\\/\\\/temperim.com\\\/blog\\\/wp-content\\\/uploads\\\/2015\\\/10\\\/img_trends.jpg\",\"contentUrl\":\"https:\\\/\\\/temperim.com\\\/blog\\\/wp-content\\\/uploads\\\/2015\\\/10\\\/img_trends.jpg\",\"width\":750,\"height\":410},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/temperim.com\\\/blog\\\/ola-2016-6-tendencias-para-web-que-voce-precisa-conhecer\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/temperim.com\\\/blog\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Dica do Chef\",\"item\":\"https:\\\/\\\/temperim.com\\\/blog\\\/categoria\\\/dica-do-chef\\\/\"},{\"@type\":\"ListItem\",\"position\":3,\"name\":\"Ol\u00e1 2016! 6 tend\u00eancias para web que voc\u00ea precisa conhecer\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/temperim.com\\\/blog\\\/#website\",\"url\":\"https:\\\/\\\/temperim.com\\\/blog\\\/\",\"name\":\"Mexid\u00e3o - o blog da Ag\u00eancia Temperim\",\"description\":\"o blog da Ag\u00eancia Temperim\",\"publisher\":{\"@id\":\"https:\\\/\\\/temperim.com\\\/blog\\\/#organization\"},\"alternateName\":\"Mexid\u00e3o - o blog da Ag\u00eancia Temperim\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/temperim.com\\\/blog\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"pt-BR\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/temperim.com\\\/blog\\\/#organization\",\"name\":\"Mexid\u00e3o - o blog da Ag\u00eancia Temperim\",\"alternateName\":\"Mexid\u00e3o - o blog da Ag\u00eancia Temperim\",\"url\":\"https:\\\/\\\/temperim.com\\\/blog\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"pt-BR\",\"@id\":\"https:\\\/\\\/temperim.com\\\/blog\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"https:\\\/\\\/temperim.com\\\/blog\\\/wp-content\\\/uploads\\\/2026\\\/06\\\/mexidao2-e1777947401510.png\",\"contentUrl\":\"https:\\\/\\\/temperim.com\\\/blog\\\/wp-content\\\/uploads\\\/2026\\\/06\\\/mexidao2-e1777947401510.png\",\"width\":1300,\"height\":460,\"caption\":\"Mexid\u00e3o - o blog da Ag\u00eancia Temperim\"},\"image\":{\"@id\":\"https:\\\/\\\/temperim.com\\\/blog\\\/#\\\/schema\\\/logo\\\/image\\\/\"},\"sameAs\":[\"https:\\\/\\\/www.instagram.com\\\/agenciatemperim\\\/\",\"https:\\\/\\\/www.linkedin.com\\\/company\\\/agenciatemperim\\\/\"]},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/temperim.com\\\/blog\\\/#\\\/schema\\\/person\\\/339d56b9252dec047f4aebede2f7953e\",\"name\":\"Daniela Pereira\",\"pronouns\":\"ela\\\/dela\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"pt-BR\",\"@id\":\"https:\\\/\\\/temperim.com\\\/blog\\\/wp-content\\\/litespeed\\\/avatar\\\/f536d8fd357c722186d9d4d125854110.jpg?ver=1784682924\",\"url\":\"https:\\\/\\\/temperim.com\\\/blog\\\/wp-content\\\/litespeed\\\/avatar\\\/f536d8fd357c722186d9d4d125854110.jpg?ver=1784682924\",\"contentUrl\":\"https:\\\/\\\/temperim.com\\\/blog\\\/wp-content\\\/litespeed\\\/avatar\\\/f536d8fd357c722186d9d4d125854110.jpg?ver=1784682924\",\"caption\":\"Daniela Pereira\"},\"description\":\"Co-founder &amp; Head de Projetos @ Ag\u00eancia Temperim\",\"sameAs\":[\"https:\\\/\\\/temperim.com\\\/\"]}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"6 Tend\u00eancias para Web que voc\u00ea precisa conhecer - Mexid\u00e3o","description":"Separamos 6 tend\u00eancias para Web para 2016 que voc\u00ea precisa conhecer! Clique e saiba mais!","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:\/\/temperim.com\/blog\/ola-2016-6-tendencias-para-web-que-voce-precisa-conhecer\/","og_locale":"pt_BR","og_type":"article","og_title":"6 Tend\u00eancias para Web que voc\u00ea precisa conhecer - Mexid\u00e3o","og_description":"Separamos 6 tend\u00eancias para Web para 2016 que voc\u00ea precisa conhecer! Clique e saiba mais!","og_url":"https:\/\/temperim.com\/blog\/ola-2016-6-tendencias-para-web-que-voce-precisa-conhecer\/","og_site_name":"Mexid\u00e3o","article_published_time":"2015-10-14T17:29:25+00:00","article_modified_time":"2021-05-19T16:56:52+00:00","og_image":[{"url":"http:\/\/www.temperim.com\/blog\/wp-content\/uploads\/2015\/10\/img_trends.jpg","type":"","width":"","height":""}],"author":"Daniela Pereira","twitter_card":"summary_large_image","twitter_title":"6 Tend\u00eancias para Web que voc\u00ea precisa conhecer - Mexid\u00e3o","twitter_description":"Separamos 6 tend\u00eancias para Web para 2016 que voc\u00ea precisa conhecer! Clique e saiba mais!","twitter_image":"http:\/\/www.temperim.com\/blog\/wp-content\/uploads\/2015\/10\/img_trends.jpg","twitter_misc":{"Escrito por":"Daniela Pereira","Est. tempo de leitura":"11 minutos"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/temperim.com\/blog\/ola-2016-6-tendencias-para-web-que-voce-precisa-conhecer\/#article","isPartOf":{"@id":"https:\/\/temperim.com\/blog\/ola-2016-6-tendencias-para-web-que-voce-precisa-conhecer\/"},"author":{"name":"Daniela Pereira","@id":"https:\/\/temperim.com\/blog\/#\/schema\/person\/339d56b9252dec047f4aebede2f7953e"},"headline":"Ol\u00e1 2016! 6 tend\u00eancias para web que voc\u00ea precisa conhecer","datePublished":"2015-10-14T17:29:25+00:00","dateModified":"2021-05-19T16:56:52+00:00","mainEntityOfPage":{"@id":"https:\/\/temperim.com\/blog\/ola-2016-6-tendencias-para-web-que-voce-precisa-conhecer\/"},"wordCount":2157,"publisher":{"@id":"https:\/\/temperim.com\/blog\/#organization"},"image":{"@id":"https:\/\/temperim.com\/blog\/ola-2016-6-tendencias-para-web-que-voce-precisa-conhecer\/#primaryimage"},"thumbnailUrl":"https:\/\/temperim.com\/blog\/wp-content\/uploads\/2015\/10\/img_trends.jpg","keywords":["design de interface","flat desing","responsivo","tend\u00eancias","ui","ux","web"],"articleSection":["Dica do Chef","Fique por Dentro"],"inLanguage":"pt-BR"},{"@type":"WebPage","@id":"https:\/\/temperim.com\/blog\/ola-2016-6-tendencias-para-web-que-voce-precisa-conhecer\/","url":"https:\/\/temperim.com\/blog\/ola-2016-6-tendencias-para-web-que-voce-precisa-conhecer\/","name":"6 Tend\u00eancias para Web que voc\u00ea precisa conhecer - Mexid\u00e3o","isPartOf":{"@id":"https:\/\/temperim.com\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/temperim.com\/blog\/ola-2016-6-tendencias-para-web-que-voce-precisa-conhecer\/#primaryimage"},"image":{"@id":"https:\/\/temperim.com\/blog\/ola-2016-6-tendencias-para-web-que-voce-precisa-conhecer\/#primaryimage"},"thumbnailUrl":"https:\/\/temperim.com\/blog\/wp-content\/uploads\/2015\/10\/img_trends.jpg","datePublished":"2015-10-14T17:29:25+00:00","dateModified":"2021-05-19T16:56:52+00:00","description":"Separamos 6 tend\u00eancias para Web para 2016 que voc\u00ea precisa conhecer! Clique e saiba mais!","breadcrumb":{"@id":"https:\/\/temperim.com\/blog\/ola-2016-6-tendencias-para-web-que-voce-precisa-conhecer\/#breadcrumb"},"inLanguage":"pt-BR","potentialAction":[{"@type":"ReadAction","target":["https:\/\/temperim.com\/blog\/ola-2016-6-tendencias-para-web-que-voce-precisa-conhecer\/"]}]},{"@type":"ImageObject","inLanguage":"pt-BR","@id":"https:\/\/temperim.com\/blog\/ola-2016-6-tendencias-para-web-que-voce-precisa-conhecer\/#primaryimage","url":"https:\/\/temperim.com\/blog\/wp-content\/uploads\/2015\/10\/img_trends.jpg","contentUrl":"https:\/\/temperim.com\/blog\/wp-content\/uploads\/2015\/10\/img_trends.jpg","width":750,"height":410},{"@type":"BreadcrumbList","@id":"https:\/\/temperim.com\/blog\/ola-2016-6-tendencias-para-web-que-voce-precisa-conhecer\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/temperim.com\/blog\/"},{"@type":"ListItem","position":2,"name":"Dica do Chef","item":"https:\/\/temperim.com\/blog\/categoria\/dica-do-chef\/"},{"@type":"ListItem","position":3,"name":"Ol\u00e1 2016! 6 tend\u00eancias para web que voc\u00ea precisa conhecer"}]},{"@type":"WebSite","@id":"https:\/\/temperim.com\/blog\/#website","url":"https:\/\/temperim.com\/blog\/","name":"Mexid\u00e3o - o blog da Ag\u00eancia Temperim","description":"o blog da Ag\u00eancia Temperim","publisher":{"@id":"https:\/\/temperim.com\/blog\/#organization"},"alternateName":"Mexid\u00e3o - o blog da Ag\u00eancia Temperim","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/temperim.com\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"pt-BR"},{"@type":"Organization","@id":"https:\/\/temperim.com\/blog\/#organization","name":"Mexid\u00e3o - o blog da Ag\u00eancia Temperim","alternateName":"Mexid\u00e3o - o blog da Ag\u00eancia Temperim","url":"https:\/\/temperim.com\/blog\/","logo":{"@type":"ImageObject","inLanguage":"pt-BR","@id":"https:\/\/temperim.com\/blog\/#\/schema\/logo\/image\/","url":"https:\/\/temperim.com\/blog\/wp-content\/uploads\/2026\/06\/mexidao2-e1777947401510.png","contentUrl":"https:\/\/temperim.com\/blog\/wp-content\/uploads\/2026\/06\/mexidao2-e1777947401510.png","width":1300,"height":460,"caption":"Mexid\u00e3o - o blog da Ag\u00eancia Temperim"},"image":{"@id":"https:\/\/temperim.com\/blog\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.instagram.com\/agenciatemperim\/","https:\/\/www.linkedin.com\/company\/agenciatemperim\/"]},{"@type":"Person","@id":"https:\/\/temperim.com\/blog\/#\/schema\/person\/339d56b9252dec047f4aebede2f7953e","name":"Daniela Pereira","pronouns":"ela\/dela","image":{"@type":"ImageObject","inLanguage":"pt-BR","@id":"https:\/\/temperim.com\/blog\/wp-content\/litespeed\/avatar\/f536d8fd357c722186d9d4d125854110.jpg?ver=1784682924","url":"https:\/\/temperim.com\/blog\/wp-content\/litespeed\/avatar\/f536d8fd357c722186d9d4d125854110.jpg?ver=1784682924","contentUrl":"https:\/\/temperim.com\/blog\/wp-content\/litespeed\/avatar\/f536d8fd357c722186d9d4d125854110.jpg?ver=1784682924","caption":"Daniela Pereira"},"description":"Co-founder &amp; Head de Projetos @ Ag\u00eancia Temperim","sameAs":["https:\/\/temperim.com\/"]}]}},"_links":{"self":[{"href":"https:\/\/temperim.com\/blog\/wp-json\/wp\/v2\/posts\/293","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/temperim.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/temperim.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/temperim.com\/blog\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/temperim.com\/blog\/wp-json\/wp\/v2\/comments?post=293"}],"version-history":[{"count":9,"href":"https:\/\/temperim.com\/blog\/wp-json\/wp\/v2\/posts\/293\/revisions"}],"predecessor-version":[{"id":321,"href":"https:\/\/temperim.com\/blog\/wp-json\/wp\/v2\/posts\/293\/revisions\/321"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/temperim.com\/blog\/wp-json\/wp\/v2\/media\/319"}],"wp:attachment":[{"href":"https:\/\/temperim.com\/blog\/wp-json\/wp\/v2\/media?parent=293"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/temperim.com\/blog\/wp-json\/wp\/v2\/categories?post=293"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/temperim.com\/blog\/wp-json\/wp\/v2\/tags?post=293"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}