{"id":1904,"date":"2011-01-31T08:30:21","date_gmt":"2011-01-31T10:30:21","guid":{"rendered":"https:\/\/www.kadunew.com\/blog\/?p=1904"},"modified":"2015-04-28T14:43:10","modified_gmt":"2015-04-28T17:43:10","slug":"10-crimes-de-usabilidade-que-voce-nao-deve-cometer","status":"publish","type":"post","link":"https:\/\/www.kadunew.com\/blog\/acessibilidade\/10-crimes-de-usabilidade-que-voce-nao-deve-cometer","title":{"rendered":"10 Crimes de usabilidade que voc\u00ea n\u00e3o deve cometer"},"content":{"rendered":"<p>A usabilidade de web sites est\u00e1 diretamente ligada \u00e0 capacidade de permitir que o <strong>usu\u00e1rio consiga atingir seus objetivos<\/strong> de uma forma <strong>r\u00e1pida<\/strong>, <strong>eficaz<\/strong> e com o <strong>menor n\u00famero de erros<\/strong> poss\u00edveis. Deve ser principalmente de f\u00e1cil aprendizagem.<\/p>\n<p>Ao longo do tempo algumas conven\u00e7\u00f5es pr\u00e1ticas t\u00eam sido desenvolvidas para ajudar a melhorar a usabilidade dos sites em geral, durante a sua concep\u00e7\u00e3o e constru\u00e7\u00e3o. Este resumo de dez crimes de usabilidade destaca alguns dos erros mais comuns entre Web Designers e fornece uma solu\u00e7\u00e3o alternativa para ajudar a melhorar a usabilidade do seu site.<br \/>\n<!--more Continuar lendo...--><\/p>\n<div class=\"obs\">\nTer um site r\u00e1pido tamb\u00e9m faz parte da usabilidade. Aprenda <a href=\"https:\/\/www.kadunew.com\/blog\/web-design\/tecnicas-e-ferramentas-para-melhorar-a-performance-de-sites\" title=\"T\u00e9cnicas e ferramentas para melhorar a performance de sites\">T\u00e9cnicas e ferramentas para melhorar a performance de sites<\/a> . S\u00e3o pr\u00e1ticas que resultam em um site muito mais r\u00e1pido.\n<\/div>\n<p>O site <a href=\"http:\/\/line25.com\">line25<\/a> fez uma lista tempos atr\u00e1s de <strong>10 Crimes de usabilidade que voc\u00ea n\u00e3o deve cometer<\/strong>, achei interessante e resolvi divulg\u00e1-las aqui no blog com algumas adapta\u00e7\u00f5es.<\/p>\n<h2>N\u00e3o associar label a campos de formul\u00e1rios<\/h2>\n<figure id=\"attachment_1905\" aria-describedby=\"caption-attachment-1905\" style=\"width: 500px\" class=\"wp-caption alignleft\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/www.kadunew.com\/blog\/wp-content\/uploads\/2011\/01\/label-em-formularios.png\" alt=\"Label em formul\u00e1rios\" title=\"Label em formul\u00e1rios\" width=\"500\" height=\"300\" class=\"size-full wp-image-1905\" srcset=\"https:\/\/www.kadunew.com\/blog\/wp-content\/uploads\/2011\/01\/label-em-formularios.png 500w, https:\/\/www.kadunew.com\/blog\/wp-content\/uploads\/2011\/01\/label-em-formularios-300x180.png 300w\" sizes=\"(max-width: 500px) 100vw, 500px\" \/><figcaption id=\"caption-attachment-1905\" class=\"wp-caption-text\">Associando label em formul\u00e1rios<\/figcaption><\/figure>\n<div class=\"clear\"><\/div>\n<p>Usando o atributo <code>for<\/code> <strong>permite que o usu\u00e1rio clique no r\u00f3tulo para selecionar os campos de entrada<\/strong> apropriado dentro de um formul\u00e1rio HTML. Isto \u00e9 especialmente importante para caixas e campos de r\u00e1dio, dando assim uma maior \u00e1rea clic\u00e1vel para o usu\u00e1rio.<\/p>\n<p>Dessa forma o usu\u00e1rio pode clicar diretamente no campo do formul\u00e1rio (por exemplo, bot\u00e3o de r\u00e1dio e checkbox) ou na palavra (label) para marcar esse elemento. Isso tem tamb\u00e9m um grande peso para a <a href=\"http:\/\/www.acessibilidadelegal.com\/13-formularios.php\" title=\"Acessibilidade em formul\u00e1rios\">acessibilidade em formul\u00e1rios<\/a>.<\/p>\n<h2>Um logotipo que n\u00e3o linka para a p\u00e1gina inicial<\/h2>\n<figure id=\"attachment_1908\" aria-describedby=\"caption-attachment-1908\" style=\"width: 500px\" class=\"wp-caption alignleft\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/www.kadunew.com\/blog\/wp-content\/uploads\/2011\/01\/logo-clicavel.png\" alt=\"Logo com link\" title=\"Logo com link\" width=\"500\" height=\"300\" class=\"size-full wp-image-1908\" srcset=\"https:\/\/www.kadunew.com\/blog\/wp-content\/uploads\/2011\/01\/logo-clicavel.png 500w, https:\/\/www.kadunew.com\/blog\/wp-content\/uploads\/2011\/01\/logo-clicavel-300x180.png 300w\" sizes=\"(max-width: 500px) 100vw, 500px\" \/><figcaption id=\"caption-attachment-1908\" class=\"wp-caption-text\">Logo com link para p\u00e1gina inicial<\/figcaption><\/figure>\n<div class=\"clear\"><\/div>\n<p>Linkar o logotipo de um site para a p\u00e1gina inicial se tornou pr\u00e1tica comum, e agora \u00e9 natural para a maioria dos internautas clicarem sobre o logotipo para voltar a p\u00e1gina inicial do site. Tamb\u00e9m vale a pena mencionar o logotipo deve aparecer na parte superior esquerda. Todo site deve ter um link que leve seu visitante a a p\u00e1gina de entrada do site, no caso a p\u00e1gina inicial. Isso j\u00e1 \u00e9 um requisito b\u00e1sico de usabilidade em web sites.<\/p>\n<h2>N\u00e3o destacar os links visitados<\/h2>\n<figure id=\"attachment_1910\" aria-describedby=\"caption-attachment-1910\" style=\"width: 500px\" class=\"wp-caption alignleft\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/www.kadunew.com\/blog\/wp-content\/uploads\/2011\/01\/links-visitados.png\" alt=\"Links visitados\" title=\"Links visitados\" width=\"500\" height=\"300\" class=\"size-full wp-image-1910\" srcset=\"https:\/\/www.kadunew.com\/blog\/wp-content\/uploads\/2011\/01\/links-visitados.png 500w, https:\/\/www.kadunew.com\/blog\/wp-content\/uploads\/2011\/01\/links-visitados-300x180.png 300w\" sizes=\"(max-width: 500px) 100vw, 500px\" \/><figcaption id=\"caption-attachment-1910\" class=\"wp-caption-text\">Destacar os links visitados<\/figcaption><\/figure>\n<div class=\"clear\"><\/div>\n<p>\u00c9 uma boa pr\u00e1tica destacar os links que o usu\u00e1rio j\u00e1 visitou no seu site, principalmente em sites com grande conte\u00fado onde o seu visitante visitar\u00e1 uma grande quantidade de links. Creio que epenas em sites desse tipo deve ser empregada a t\u00e9cnica.<\/p>\n<p>Destacando os links visitados fica evidente para o usu\u00e1rio as p\u00e1ginas que ele j\u00e1 visitou. Para fazer isso n\u00e3o precisamos de uma regra CSS avan\u00e7ada, por\u00e9m ela \u00e9 muitas vezes esquecida pelos desenvolvedores de sites. N\u00e3o esque\u00e7a, sempre mostre aos seus visitantes por onde ele j\u00e1 passou.<\/p>\n<h2>N\u00e3o destacar campos ativos<\/h2>\n<figure id=\"attachment_1911\" aria-describedby=\"caption-attachment-1911\" style=\"width: 500px\" class=\"wp-caption alignleft\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/www.kadunew.com\/blog\/wp-content\/uploads\/2011\/01\/elementos-ativo.png\" alt=\"Elementos ativo\" title=\"Elementos ativo\" width=\"500\" height=\"300\" class=\"size-full wp-image-1911\" srcset=\"https:\/\/www.kadunew.com\/blog\/wp-content\/uploads\/2011\/01\/elementos-ativo.png 500w, https:\/\/www.kadunew.com\/blog\/wp-content\/uploads\/2011\/01\/elementos-ativo-300x180.png 300w\" sizes=\"(max-width: 500px) 100vw, 500px\" \/><figcaption id=\"caption-attachment-1911\" class=\"wp-caption-text\">Elementos ativo em formul\u00e1rios HTML<\/figcaption><\/figure>\n<div class=\"clear\"><\/div>\n<p>Voc\u00ea pode usar o seletor <code>focus<\/code> em v\u00e1rios  elementos HTML, mas \u00e9 super \u00fatil quando usado em <code>inputs<\/code> e <code>textareas<\/code> de formul\u00e1rios para indicar que o campo est\u00e1 ativo. Utilizando CSS voc\u00ea pode estilizar facilmente esses elementos com uma cor de fundo diferente, uma borda com uma espessura maior, etc.<\/p>\n<h2>Imagem sem descri\u00e7\u00e3o alt e title<\/h2>\n<figure id=\"attachment_1913\" aria-describedby=\"caption-attachment-1913\" style=\"width: 500px\" class=\"wp-caption alignleft\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/www.kadunew.com\/blog\/wp-content\/uploads\/2011\/01\/atributos-alt-title.png\" alt=\"Atributos alt e title\" title=\"Atributos alt e title\" width=\"500\" height=\"300\" class=\"size-full wp-image-1913\" srcset=\"https:\/\/www.kadunew.com\/blog\/wp-content\/uploads\/2011\/01\/atributos-alt-title.png 500w, https:\/\/www.kadunew.com\/blog\/wp-content\/uploads\/2011\/01\/atributos-alt-title-300x180.png 300w\" sizes=\"(max-width: 500px) 100vw, 500px\" \/><figcaption id=\"caption-attachment-1913\" class=\"wp-caption-text\">Atributos alt e title<\/figcaption><\/figure>\n<div class=\"clear\"><\/div>\n<p>Muitos n\u00e3o sabem a <a href=\"https:\/\/www.kadunew.com\/blog\/seo\/importancia-do-atributo-alt-para-seo\" title=\"Atributo alt\">Import\u00e2ncia do atributo alt<\/a> e <code>title<\/code>. Utilizar o atributo <code>alt<\/code> no elemento <code>img<\/code> do HTML n\u00e3o \u00e9 s\u00f3 bom para a usabilidade quanto tamb\u00e9m para a acessibilidade e ainda para a <a href=\"http:\/\/www.brasilseo.com.br\/geral\/otimizacao-de-imagens-seu-site-ate-60-mais-rapido\">otimiza\u00e7\u00e3o de imagens<\/a>. Lembre-se sempre de adicionar um atributo <code>alt<\/code> descritivos para suas imagens.<\/p>\n<p>Imagens que tem por finalidade montar seu layout n\u00e3o h\u00e1 necessidade de por esse atributo, at\u00e9 porque as imagens que s\u00e3o inseridas no site com intuito de design devem ser inseridas via CSS, nesse caso n\u00e3o tem como descrev\u00ea-las no atributo alt.<\/p>\n<p>Outro atributo importante \u00e9 o atributo <code>title<\/code>, ele pode ser usando em links de imagens do tipo \u00edcone, atrav\u00e9s dele podemos ter uma descri\u00e7\u00e3o desse link. Um exemplo \u00e9 um \u00edcone de um envelope, o title poderia ser &#8220;e-mail&#8221;.<\/p>\n<h2>Imagem de fundo, sem uma cor de fundo<\/h2>\n<figure id=\"attachment_1915\" aria-describedby=\"caption-attachment-1915\" style=\"width: 500px\" class=\"wp-caption alignleft\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/www.kadunew.com\/blog\/wp-content\/uploads\/2011\/01\/cor-fundo-imagens.png\" alt=\"Cor fundo nas imagens\" title=\"Cor fundo nas imagens\" width=\"500\" height=\"300\" class=\"size-full wp-image-1915\" srcset=\"https:\/\/www.kadunew.com\/blog\/wp-content\/uploads\/2011\/01\/cor-fundo-imagens.png 500w, https:\/\/www.kadunew.com\/blog\/wp-content\/uploads\/2011\/01\/cor-fundo-imagens-300x180.png 300w\" sizes=\"(max-width: 500px) 100vw, 500px\" \/><figcaption id=\"caption-attachment-1915\" class=\"wp-caption-text\">Cor fundo nas imagens<\/figcaption><\/figure>\n<div class=\"clear\"><\/div>\n<p>\u00c9 comum a utiliza\u00e7\u00e3o de imagens de fundo por tr\u00e1s do texto, mas vale a pena lembrar que se as imagens est\u00e3o desativadas pelo usu\u00e1rio ou simplesmente n\u00e3o carregam, \u00e9 necess\u00e1rio que haja um tom semelhante na forma de uma cor de fundo para evitar que o texto se torne ileg\u00edvel. Um exemplo \u00e9 voc\u00ea ter uma imagem escura de fundo e um texto branco sobre a imagem. Caso essa imagem n\u00e3o seja carregada pelo navegador seria interessante ter uma cor escura no fundo desse elemento, pois assim o visitante do seu site conseguir\u00e1 ler o conte\u00fado sem problemas.<\/p>\n<h2>Textos longos no conte\u00fado<\/h2>\n<figure id=\"attachment_1916\" aria-describedby=\"caption-attachment-1916\" style=\"width: 500px\" class=\"wp-caption alignleft\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/www.kadunew.com\/blog\/wp-content\/uploads\/2011\/01\/conteudo-longo.png\" alt=\"Conte\u00fado longo\" title=\"Conte\u00fado longo\" width=\"500\" height=\"300\" class=\"size-full wp-image-1916\" srcset=\"https:\/\/www.kadunew.com\/blog\/wp-content\/uploads\/2011\/01\/conteudo-longo.png 500w, https:\/\/www.kadunew.com\/blog\/wp-content\/uploads\/2011\/01\/conteudo-longo-300x180.png 300w\" sizes=\"(max-width: 500px) 100vw, 500px\" \/><figcaption id=\"caption-attachment-1916\" class=\"wp-caption-text\">Conte\u00fado longo<\/figcaption><\/figure>\n<div class=\"clear\"><\/div>\n<p>N\u00e3o h\u00e1 nada mais desanimador do que entrar em uma p\u00e1gina onde h\u00e1 textos extremamente gigantes, sem t\u00edtulos, subt\u00edtulos e imagens. <\/p>\n<p>Divida o seu conte\u00fado com imagens, t\u00edtulos e se\u00e7\u00f5es claras para facilitar a leitura do seu visitante. Praticamente ningu\u00e9m l\u00ea textos desse tipo na Web. Saiba <a href=\"http:\/\/www.mestreseo.com.br\/usabilidade\/como-escrever-na-web-usabilidade\" title=\"Como escrever para web\">como escrever para web<\/a>, isso \u00e9 fundamental.<\/p>\n<h2>Sublinhar textos que n\u00e3o s\u00e3o links<\/h2>\n<figure id=\"attachment_1917\" aria-describedby=\"caption-attachment-1917\" style=\"width: 500px\" class=\"wp-caption alignleft\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/www.kadunew.com\/blog\/wp-content\/uploads\/2011\/01\/texto-sublinhado.png\" alt=\"texto sublinhado\" title=\"texto sublinhado\" width=\"500\" height=\"300\" class=\"size-full wp-image-1917\" srcset=\"https:\/\/www.kadunew.com\/blog\/wp-content\/uploads\/2011\/01\/texto-sublinhado.png 500w, https:\/\/www.kadunew.com\/blog\/wp-content\/uploads\/2011\/01\/texto-sublinhado-300x180.png 300w\" sizes=\"(max-width: 500px) 100vw, 500px\" \/><figcaption id=\"caption-attachment-1917\" class=\"wp-caption-text\">Texto sublinhado<\/figcaption><\/figure>\n<div class=\"clear\"><\/div>\n<p>Todo mundo sabe que o texto que est\u00e1 sublinhado, e est\u00e1 em uma cor diferente \u00e9 muito prov\u00e1vel que seja um link. N\u00e3o v\u00e1 confundir as pessoas que visitam seu site colocando texto sublinhado onde n\u00e3o seja link.<\/p>\n<p>Se quer destacar algo, chamar a aten\u00e7\u00e3o para uma determinada palavra, tente usar o negrito (<code>strong<\/code>), \u00e9 bem melhor.<\/p>\n<h2>Utiliza\u00e7\u00e3o de textos justificados<\/h2>\n<figure id=\"attachment_1918\" aria-describedby=\"caption-attachment-1918\" style=\"width: 500px\" class=\"wp-caption alignleft\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/www.kadunew.com\/blog\/wp-content\/uploads\/2011\/01\/texto-justificado.png\" alt=\"texto justificado\" title=\"texto justificado\" width=\"500\" height=\"300\" class=\"size-full wp-image-1918\" srcset=\"https:\/\/www.kadunew.com\/blog\/wp-content\/uploads\/2011\/01\/texto-justificado.png 500w, https:\/\/www.kadunew.com\/blog\/wp-content\/uploads\/2011\/01\/texto-justificado-300x180.png 300w\" sizes=\"(max-width: 500px) 100vw, 500px\" \/><figcaption id=\"caption-attachment-1918\" class=\"wp-caption-text\">texto justificado<\/figcaption><\/figure>\n<div class=\"clear\"><\/div>\n<p>Esta \u00e9 outra dica que est\u00e1 indo um pouco mais para o lado da acessibilidade, mas tamb\u00e9m \u00e9 um ponto importante a considerar. Texto justificado pode gerar alguns problemas de legibilidade, particularmente para os usu\u00e1rios disl\u00e9xicos (l\u00eaem com dificuldade) que podem n\u00e3o conseguir identificar as palavras e letras corretamente, devido ao espa\u00e7amento desigual dos par\u00e1grafos justificados. Prefira textos alinhados \u00e0 esquerda a textos justificados.<\/p>\n<h2>N\u00e3o utilizar espa\u00e7amentos entre linhas<\/h2>\n<figure id=\"attachment_1936\" aria-describedby=\"caption-attachment-1936\" style=\"width: 500px\" class=\"wp-caption alignleft\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/www.kadunew.com\/blog\/wp-content\/uploads\/2011\/01\/espacamento-entre-linhas1.png\" alt=\"Espa\u00e7amento entre linhas\" title=\"Espa\u00e7amento entre linhas\" width=\"500\" height=\"300\" class=\"size-full wp-image-1936\" srcset=\"https:\/\/www.kadunew.com\/blog\/wp-content\/uploads\/2011\/01\/espacamento-entre-linhas1.png 500w, https:\/\/www.kadunew.com\/blog\/wp-content\/uploads\/2011\/01\/espacamento-entre-linhas1-300x180.png 300w\" sizes=\"(max-width: 500px) 100vw, 500px\" \/><figcaption id=\"caption-attachment-1936\" class=\"wp-caption-text\">Espa\u00e7amento entre linhas<\/figcaption><\/figure>\n<div class=\"clear\"><\/div>\n<p>Utilizando a propriedade <code>line-height<\/code> do CSS conseguimos criar um espa\u00e7amento entre as linhas em um par\u00e1grafo, com isso a facilidade de leitura aumenta. Seguido entro em sites onde as linhas est\u00e3o muito pr\u00f3ximas, em terminar de ler uma linha encontro um pouco de dificuldade em ir para a pr\u00f3xima. <strong>Textos com espa\u00e7amentos adequados s\u00e3o lidos mais rapidamente dos que n\u00e3o tem espa\u00e7amento<\/strong>.<\/p>\n<h2>N\u00e3o usar uma navega\u00e7\u00e3o breadcrumbs &#8211; migalhas de p\u00e3o<\/h2>\n<figure id=\"attachment_1926\" aria-describedby=\"caption-attachment-1926\" style=\"width: 500px\" class=\"wp-caption alignleft\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/www.kadunew.com\/blog\/wp-content\/uploads\/2011\/01\/migalhas-de-pao.png\" alt=\"Migalhas de p\u00e3o\" title=\"Migalhas de p\u00e3o\" width=\"500\" height=\"300\" class=\"size-full wp-image-1926\" srcset=\"https:\/\/www.kadunew.com\/blog\/wp-content\/uploads\/2011\/01\/migalhas-de-pao.png 500w, https:\/\/www.kadunew.com\/blog\/wp-content\/uploads\/2011\/01\/migalhas-de-pao-300x180.png 300w\" sizes=\"(max-width: 500px) 100vw, 500px\" \/><figcaption id=\"caption-attachment-1926\" class=\"wp-caption-text\">Crie uma navega\u00e7\u00e3o secund\u00e1ria, migalhas de p\u00e3o<\/figcaption><\/figure>\n<div class=\"clear\"><\/div>\n<p>As migalhas de p\u00e3o s\u00e3o utilizadas para mostrar o <strong>caminho da p\u00e1gina inicial at\u00e9 a p\u00e1gina que o visitante est\u00e1<\/strong> no exato momento. Isso funciona como um esquema de navega\u00e7\u00e3o secund\u00e1ria. Voc\u00ea deve usar as migalhas de p\u00e3o sempre que um site tiver uma hierarquia  muito profunda de p\u00e1ginas.<\/p>\n<p>O link original do artigo pode ser conferido em <a href=\"http:\/\/line25.com\/articles\/10-usability-crimes-you-really-shouldnt-commit\">10 Usability Crimes You Really Shouldn\u2019t Commit<\/a><\/p>\n<p>Siga-me no Twitter: <a href=\"http:\/\/twitter.com\/kadunew\" rel=\"nofollow\">@kadunew<\/a><\/p>\n","protected":false},"excerpt":{"rendered":"<p>A usabilidade de web sites est\u00e1 diretamente ligada \u00e0 capacidade de permitir que o usu\u00e1rio consiga atingir seus objetivos de uma forma r\u00e1pida, eficaz e com o menor n\u00famero de erros poss\u00edveis. Deve ser principalmente de f\u00e1cil aprendizagem. Ao longo do tempo algumas conven\u00e7\u00f5es pr\u00e1ticas t\u00eam sido desenvolvidas para ajudar a melhorar a usabilidade dos [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[32],"tags":[55],"class_list":["post-1904","post","type-post","status-publish","format-standard","hentry","category-acessibilidade","tag-web-design"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v23.6 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>10 Crimes de usabilidade que voc\u00ea n\u00e3o deve cometer<\/title>\n<meta name=\"description\" content=\"Alguns erros que voc\u00ea n\u00e3o deve cometer para ter um site com boa Usabilidade e fazer com que os visitantes do seu site permane\u00e7am por mais tempo em suas p\u00e1ginas.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.kadunew.com\/blog\/acessibilidade\/10-crimes-de-usabilidade-que-voce-nao-deve-cometer\" \/>\n<meta property=\"og:locale\" content=\"pt_BR\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"10 Crimes de usabilidade que voc\u00ea n\u00e3o deve cometer\" \/>\n<meta property=\"og:description\" content=\"Alguns erros que voc\u00ea n\u00e3o deve cometer para ter um site com boa Usabilidade e fazer com que os visitantes do seu site permane\u00e7am por mais tempo em suas p\u00e1ginas.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.kadunew.com\/blog\/acessibilidade\/10-crimes-de-usabilidade-que-voce-nao-deve-cometer\" \/>\n<meta property=\"og:site_name\" content=\"KADUNEW\" \/>\n<meta property=\"article:published_time\" content=\"2011-01-31T10:30:21+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2015-04-28T17:43:10+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.kadunew.com\/blog\/wp-content\/uploads\/2011\/01\/label-em-formularios.png\" \/>\n\t<meta property=\"og:image:width\" content=\"500\" \/>\n\t<meta property=\"og:image:height\" content=\"300\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"Kadu Oliveira\" \/>\n<meta name=\"twitter:label1\" content=\"Escrito por\" \/>\n\t<meta name=\"twitter:data1\" content=\"Kadu Oliveira\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. tempo de leitura\" \/>\n\t<meta name=\"twitter:data2\" content=\"6 minutos\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/www.kadunew.com\/blog\/acessibilidade\/10-crimes-de-usabilidade-que-voce-nao-deve-cometer\",\"url\":\"https:\/\/www.kadunew.com\/blog\/acessibilidade\/10-crimes-de-usabilidade-que-voce-nao-deve-cometer\",\"name\":\"10 Crimes de usabilidade que voc\u00ea n\u00e3o deve cometer\",\"isPartOf\":{\"@id\":\"https:\/\/www.kadunew.com\/blog\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/www.kadunew.com\/blog\/acessibilidade\/10-crimes-de-usabilidade-que-voce-nao-deve-cometer#primaryimage\"},\"image\":{\"@id\":\"https:\/\/www.kadunew.com\/blog\/acessibilidade\/10-crimes-de-usabilidade-que-voce-nao-deve-cometer#primaryimage\"},\"thumbnailUrl\":\"https:\/\/www.kadunew.com\/blog\/wp-content\/uploads\/2011\/01\/label-em-formularios.png\",\"datePublished\":\"2011-01-31T10:30:21+00:00\",\"dateModified\":\"2015-04-28T17:43:10+00:00\",\"author\":{\"@id\":\"https:\/\/www.kadunew.com\/blog\/#\/schema\/person\/07b2297c4825efbd1e9f2a1018926b05\"},\"description\":\"Alguns erros que voc\u00ea n\u00e3o deve cometer para ter um site com boa Usabilidade e fazer com que os visitantes do seu site permane\u00e7am por mais tempo em suas p\u00e1ginas.\",\"breadcrumb\":{\"@id\":\"https:\/\/www.kadunew.com\/blog\/acessibilidade\/10-crimes-de-usabilidade-que-voce-nao-deve-cometer#breadcrumb\"},\"inLanguage\":\"pt-BR\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/www.kadunew.com\/blog\/acessibilidade\/10-crimes-de-usabilidade-que-voce-nao-deve-cometer\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"pt-BR\",\"@id\":\"https:\/\/www.kadunew.com\/blog\/acessibilidade\/10-crimes-de-usabilidade-que-voce-nao-deve-cometer#primaryimage\",\"url\":\"https:\/\/www.kadunew.com\/blog\/wp-content\/uploads\/2011\/01\/label-em-formularios.png\",\"contentUrl\":\"https:\/\/www.kadunew.com\/blog\/wp-content\/uploads\/2011\/01\/label-em-formularios.png\",\"width\":\"500\",\"height\":\"300\",\"caption\":\"Label em formul\u00e1rios\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/www.kadunew.com\/blog\/acessibilidade\/10-crimes-de-usabilidade-que-voce-nao-deve-cometer#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/www.kadunew.com\/blog\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Acessibilidade\",\"item\":\"https:\/\/www.kadunew.com\/blog\/category\/acessibilidade\"},{\"@type\":\"ListItem\",\"position\":3,\"name\":\"10 Crimes de usabilidade que voc\u00ea n\u00e3o deve cometer\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/www.kadunew.com\/blog\/#website\",\"url\":\"https:\/\/www.kadunew.com\/blog\/\",\"name\":\"KADUNEW\",\"description\":\"Artigos sobre Front-End e Programa\u00e7\u00e3o web\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/www.kadunew.com\/blog\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"pt-BR\"},{\"@type\":\"Person\",\"@id\":\"https:\/\/www.kadunew.com\/blog\/#\/schema\/person\/07b2297c4825efbd1e9f2a1018926b05\",\"name\":\"Kadu Oliveira\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"pt-BR\",\"@id\":\"https:\/\/www.kadunew.com\/blog\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/780660fded589936b30467c54c99d51a?s=96&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/780660fded589936b30467c54c99d51a?s=96&r=g\",\"caption\":\"Kadu Oliveira\"},\"sameAs\":[\"https:\/\/www.kadunew.com\/blog\"],\"url\":\"https:\/\/www.kadunew.com\/blog\/author\/admin\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"10 Crimes de usabilidade que voc\u00ea n\u00e3o deve cometer","description":"Alguns erros que voc\u00ea n\u00e3o deve cometer para ter um site com boa Usabilidade e fazer com que os visitantes do seu site permane\u00e7am por mais tempo em suas p\u00e1ginas.","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:\/\/www.kadunew.com\/blog\/acessibilidade\/10-crimes-de-usabilidade-que-voce-nao-deve-cometer","og_locale":"pt_BR","og_type":"article","og_title":"10 Crimes de usabilidade que voc\u00ea n\u00e3o deve cometer","og_description":"Alguns erros que voc\u00ea n\u00e3o deve cometer para ter um site com boa Usabilidade e fazer com que os visitantes do seu site permane\u00e7am por mais tempo em suas p\u00e1ginas.","og_url":"https:\/\/www.kadunew.com\/blog\/acessibilidade\/10-crimes-de-usabilidade-que-voce-nao-deve-cometer","og_site_name":"KADUNEW","article_published_time":"2011-01-31T10:30:21+00:00","article_modified_time":"2015-04-28T17:43:10+00:00","og_image":[{"width":500,"height":300,"url":"https:\/\/www.kadunew.com\/blog\/wp-content\/uploads\/2011\/01\/label-em-formularios.png","type":"image\/png"}],"author":"Kadu Oliveira","twitter_misc":{"Escrito por":"Kadu Oliveira","Est. tempo de leitura":"6 minutos"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/www.kadunew.com\/blog\/acessibilidade\/10-crimes-de-usabilidade-que-voce-nao-deve-cometer","url":"https:\/\/www.kadunew.com\/blog\/acessibilidade\/10-crimes-de-usabilidade-que-voce-nao-deve-cometer","name":"10 Crimes de usabilidade que voc\u00ea n\u00e3o deve cometer","isPartOf":{"@id":"https:\/\/www.kadunew.com\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.kadunew.com\/blog\/acessibilidade\/10-crimes-de-usabilidade-que-voce-nao-deve-cometer#primaryimage"},"image":{"@id":"https:\/\/www.kadunew.com\/blog\/acessibilidade\/10-crimes-de-usabilidade-que-voce-nao-deve-cometer#primaryimage"},"thumbnailUrl":"https:\/\/www.kadunew.com\/blog\/wp-content\/uploads\/2011\/01\/label-em-formularios.png","datePublished":"2011-01-31T10:30:21+00:00","dateModified":"2015-04-28T17:43:10+00:00","author":{"@id":"https:\/\/www.kadunew.com\/blog\/#\/schema\/person\/07b2297c4825efbd1e9f2a1018926b05"},"description":"Alguns erros que voc\u00ea n\u00e3o deve cometer para ter um site com boa Usabilidade e fazer com que os visitantes do seu site permane\u00e7am por mais tempo em suas p\u00e1ginas.","breadcrumb":{"@id":"https:\/\/www.kadunew.com\/blog\/acessibilidade\/10-crimes-de-usabilidade-que-voce-nao-deve-cometer#breadcrumb"},"inLanguage":"pt-BR","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.kadunew.com\/blog\/acessibilidade\/10-crimes-de-usabilidade-que-voce-nao-deve-cometer"]}]},{"@type":"ImageObject","inLanguage":"pt-BR","@id":"https:\/\/www.kadunew.com\/blog\/acessibilidade\/10-crimes-de-usabilidade-que-voce-nao-deve-cometer#primaryimage","url":"https:\/\/www.kadunew.com\/blog\/wp-content\/uploads\/2011\/01\/label-em-formularios.png","contentUrl":"https:\/\/www.kadunew.com\/blog\/wp-content\/uploads\/2011\/01\/label-em-formularios.png","width":"500","height":"300","caption":"Label em formul\u00e1rios"},{"@type":"BreadcrumbList","@id":"https:\/\/www.kadunew.com\/blog\/acessibilidade\/10-crimes-de-usabilidade-que-voce-nao-deve-cometer#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.kadunew.com\/blog"},{"@type":"ListItem","position":2,"name":"Acessibilidade","item":"https:\/\/www.kadunew.com\/blog\/category\/acessibilidade"},{"@type":"ListItem","position":3,"name":"10 Crimes de usabilidade que voc\u00ea n\u00e3o deve cometer"}]},{"@type":"WebSite","@id":"https:\/\/www.kadunew.com\/blog\/#website","url":"https:\/\/www.kadunew.com\/blog\/","name":"KADUNEW","description":"Artigos sobre Front-End e Programa\u00e7\u00e3o web","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.kadunew.com\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"pt-BR"},{"@type":"Person","@id":"https:\/\/www.kadunew.com\/blog\/#\/schema\/person\/07b2297c4825efbd1e9f2a1018926b05","name":"Kadu Oliveira","image":{"@type":"ImageObject","inLanguage":"pt-BR","@id":"https:\/\/www.kadunew.com\/blog\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/780660fded589936b30467c54c99d51a?s=96&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/780660fded589936b30467c54c99d51a?s=96&r=g","caption":"Kadu Oliveira"},"sameAs":["https:\/\/www.kadunew.com\/blog"],"url":"https:\/\/www.kadunew.com\/blog\/author\/admin"}]}},"_links":{"self":[{"href":"https:\/\/www.kadunew.com\/blog\/wp-json\/wp\/v2\/posts\/1904"}],"collection":[{"href":"https:\/\/www.kadunew.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.kadunew.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.kadunew.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.kadunew.com\/blog\/wp-json\/wp\/v2\/comments?post=1904"}],"version-history":[{"count":37,"href":"https:\/\/www.kadunew.com\/blog\/wp-json\/wp\/v2\/posts\/1904\/revisions"}],"predecessor-version":[{"id":3768,"href":"https:\/\/www.kadunew.com\/blog\/wp-json\/wp\/v2\/posts\/1904\/revisions\/3768"}],"wp:attachment":[{"href":"https:\/\/www.kadunew.com\/blog\/wp-json\/wp\/v2\/media?parent=1904"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.kadunew.com\/blog\/wp-json\/wp\/v2\/categories?post=1904"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.kadunew.com\/blog\/wp-json\/wp\/v2\/tags?post=1904"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}