{"id":1187,"date":"2021-06-16T10:00:58","date_gmt":"2021-06-16T13:00:58","guid":{"rendered":"https:\/\/agenciametrica.com.br\/blog\/?p=1187"},"modified":"2021-06-15T09:37:49","modified_gmt":"2021-06-15T12:37:49","slug":"como-melhorar-a-experiencia-do-usuario-em-um-site","status":"publish","type":"post","link":"https:\/\/agenciametrica.com.br\/blog\/como-melhorar-a-experiencia-do-usuario-em-um-site\/","title":{"rendered":"Como melhorar a Experi\u00eancia do Usu\u00e1rio em um site?"},"content":{"rendered":"\n<figure class=\"wp-block-image\"><img decoding=\"async\" loading=\"lazy\" width=\"1024\" height=\"576\" src=\"https:\/\/agenciametrica.com.br\/blog\/wp-content\/uploads\/2021\/06\/AGM-Open-graph-Experi\u00eancia-do-Usu\u00e1rio-1024x576.png\" alt=\"\" class=\"wp-image-1188\" srcset=\"https:\/\/agenciametrica.com.br\/blog\/wp-content\/uploads\/2021\/06\/AGM-Open-graph-Experi\u00eancia-do-Usu\u00e1rio-1024x576.png 1024w, https:\/\/agenciametrica.com.br\/blog\/wp-content\/uploads\/2021\/06\/AGM-Open-graph-Experi\u00eancia-do-Usu\u00e1rio-300x169.png 300w, https:\/\/agenciametrica.com.br\/blog\/wp-content\/uploads\/2021\/06\/AGM-Open-graph-Experi\u00eancia-do-Usu\u00e1rio-768x432.png 768w, https:\/\/agenciametrica.com.br\/blog\/wp-content\/uploads\/2021\/06\/AGM-Open-graph-Experi\u00eancia-do-Usu\u00e1rio.png 1920w, https:\/\/agenciametrica.com.br\/blog\/wp-content\/uploads\/2021\/06\/AGM-Open-graph-Experi\u00eancia-do-Usu\u00e1rio-1260x709.png 1260w, https:\/\/agenciametrica.com.br\/blog\/wp-content\/uploads\/2021\/06\/AGM-Open-graph-Experi\u00eancia-do-Usu\u00e1rio-960x540.png 960w, https:\/\/agenciametrica.com.br\/blog\/wp-content\/uploads\/2021\/06\/AGM-Open-graph-Experi\u00eancia-do-Usu\u00e1rio-787x443.png 787w, https:\/\/agenciametrica.com.br\/blog\/wp-content\/uploads\/2021\/06\/AGM-Open-graph-Experi\u00eancia-do-Usu\u00e1rio-400x225.png 400w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<p>A M\u00e9trica j\u00e1 desenvolve sites h\u00e1 mais de uma d\u00e9cada e, mesmo que muitos conceitos tenham evolu\u00eddo neste per\u00edodo, a <strong>experi\u00eancia do usu\u00e1rio<\/strong> sempre esteve no centro do nosso trabalho.<br><\/p>\n\n\n\n<p>O importante fator \u00e9 crucial para separar os sites bons dos ruins, o que nos mant\u00e9m sempre alertas na busca constante pela melhor otimiza\u00e7\u00e3o da experi\u00eancia.<br><\/p>\n\n\n\n<p>Quer saber como fazemos? Ent\u00e3o se liga nos principais pontos de aten\u00e7\u00e3o a seguir!<br><\/p>\n\n\n\n<h4 class=\"wp-block-heading\"><strong>Imagens<\/strong><\/h4>\n\n\n\n<p>Para que o usu\u00e1rio tenha agilidade ao acessar o site, o peso das imagens deve ser sempre avaliado. Como influenciam diretamente no tempo de carregamento do site, sugerimos utilizar imagens com peso m\u00e1ximo de at\u00e9 1MB.<br><\/p>\n\n\n\n<p>Outro fator importante \u00e9 que as imagens sejam claramente informativas sobre o conte\u00fado e sejam apresentadas de forma cont\u00ednua e interligada (parte de um storytelling), deixando a entender para o usu\u00e1rio que h\u00e1 mais conte\u00fado a ser explorado ao rolar a tela.<br><\/p>\n\n\n\n<h4 class=\"wp-block-heading\"><strong>Menu<\/strong><\/h4>\n\n\n\n<p>\u00c9 importante que o site tenha um menu no topo, para que o usu\u00e1rio possa visualizar as categorias dispon\u00edveis e chegar de forma mais r\u00e1pida aos conte\u00fados que lhe interessam. Um outro menu no rodap\u00e9 tamb\u00e9m \u00e9 indicado, especialmente para sites de rolamento muito extenso. Por \u00faltimo, mas n\u00e3o menos importante, \u00e9 sugerido um menu lateral expans\u00edvel, principalmente em sites com muitas categorias e conte\u00fados diversos.&nbsp;<br><\/p>\n\n\n\n<h4 class=\"wp-block-heading\"><strong>Itens clic\u00e1veis<\/strong><\/h4>\n\n\n\n<p>Para que o usu\u00e1rio tenha facilidade em navegar pelo site, \u00e9 preciso estar claro o que \u00e9 clic\u00e1vel ou n\u00e3o. Por isso deve-se investir um bom tempo em definir e identificar com destaque (cor, tipologia, \u00edcone do cursor do mouse, etc.) toda \u00e1rea\/item que for de poss\u00edvel intera\u00e7\u00e3o da pessoa.<br><\/p>\n\n\n\n<p>A padroniza\u00e7\u00e3o e a aten\u00e7\u00e3o em n\u00e3o limitar o espa\u00e7o do clique, permitindo que seja mais f\u00e1cil tamb\u00e9m na vers\u00e3o mobile, tamb\u00e9m torna a experi\u00eancia muito mais intuitiva e agrad\u00e1vel.<\/p>\n\n\n\n<h4 class=\"wp-block-heading\"><strong>\u00c1rea de downloads<\/strong><\/h4>\n\n\n\n<p>Uma \u00e1rea (claramente destacada no menu) que centralize todos os materiais de downloads \u00e9 fundamental para a organiza\u00e7\u00e3o do site e facilidade de acesso do usu\u00e1rio.<br><\/p>\n\n\n\n<p>Dentro desta se\u00e7\u00e3o \u00e9 importante destacar o bot\u00e3o para baixar cada conte\u00fado disponibilizado de forma atraente e em blocos bem distintos.<br><\/p>\n\n\n\n<h4 class=\"wp-block-heading\"><strong>Bot\u00f5es<\/strong><\/h4>\n\n\n\n<p>Complementando os itens clic\u00e1veis, os bot\u00f5es do site devem ser atrativos e bem definidos. Eles s\u00e3o inclusive a sugest\u00e3o ideal de padr\u00e3o para item clic\u00e1vel, tornando mais f\u00e1cil a organiza\u00e7\u00e3o do site e o reconhecimento do usu\u00e1rio, que rapidamente ficar\u00e1 condicionado a buscar um bot\u00e3o para avan\u00e7ar na sua experi\u00eancia.&nbsp;<br><\/p>\n\n\n\n<p>Al\u00e9m de tornar o processo mais intuitivo, o bom uso de bot\u00f5es tende a aumentar o tempo m\u00e9dio de navega\u00e7\u00e3o ao motivar mais cliques e intera\u00e7\u00f5es com os variados segmentos e recursos dispon\u00edveis.<br><\/p>\n\n\n\n<h4 class=\"wp-block-heading\"><strong>T\u00edtulos das se\u00e7\u00f5es&nbsp;<\/strong><\/h4>\n\n\n\n<p>Toda se\u00e7\u00e3o precisa de um t\u00edtulo para que o usu\u00e1rio possa identificar rapidamente sobre o que se trata aquele conte\u00fado. O t\u00edtulo precisa estar em destaque e ser facilmente acess\u00edvel por qualquer menu do site. Por isso \u00e9 recomendado que seja curto e direto, deixando para um subt\u00edtulo (oculto do menu, mas presente na se\u00e7\u00e3o) qualquer informa\u00e7\u00e3o complementar eventual.&nbsp;<br><\/p>\n\n\n\n<h4 class=\"wp-block-heading\"><strong>Cores e fontes<\/strong><\/h4>\n\n\n\n<p>\u00c9 importante a utiliza\u00e7\u00e3o de cores de fonte que contrastem bem com o plano de fundo, de modo que a leitura seja f\u00e1cil e agrad\u00e1vel aos olhos dos usu\u00e1rios.<br><\/p>\n\n\n\n<p>Os tamanhos das fontes e tipologia utilizada tamb\u00e9m devem ser avaliadas a fim de proporcionar uma leitura mais fluida.<br><\/p>\n","protected":false},"excerpt":{"rendered":"<p>A M\u00e9trica j\u00e1 desenvolve sites h\u00e1 mais de uma d\u00e9cada e, mesmo que muitos conceitos tenham evolu\u00eddo neste per\u00edodo, a experi\u00eancia do usu\u00e1rio sempre esteve no centro do nosso trabalho.<\/p>\n","protected":false},"author":1,"featured_media":1188,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"ngg_post_thumbnail":0},"categories":[57],"tags":[371,372,374,366,368,370,369,367,373],"_links":{"self":[{"href":"https:\/\/agenciametrica.com.br\/blog\/wp-json\/wp\/v2\/posts\/1187"}],"collection":[{"href":"https:\/\/agenciametrica.com.br\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/agenciametrica.com.br\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/agenciametrica.com.br\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/agenciametrica.com.br\/blog\/wp-json\/wp\/v2\/comments?post=1187"}],"version-history":[{"count":1,"href":"https:\/\/agenciametrica.com.br\/blog\/wp-json\/wp\/v2\/posts\/1187\/revisions"}],"predecessor-version":[{"id":1189,"href":"https:\/\/agenciametrica.com.br\/blog\/wp-json\/wp\/v2\/posts\/1187\/revisions\/1189"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/agenciametrica.com.br\/blog\/wp-json\/wp\/v2\/media\/1188"}],"wp:attachment":[{"href":"https:\/\/agenciametrica.com.br\/blog\/wp-json\/wp\/v2\/media?parent=1187"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/agenciametrica.com.br\/blog\/wp-json\/wp\/v2\/categories?post=1187"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/agenciametrica.com.br\/blog\/wp-json\/wp\/v2\/tags?post=1187"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}