O que causa a grande discrepância entre o que alguns desenvolvedores de WordPress cobram em comparação com outros? A resposta a esta pergunta requer consideração pela razão por detrás da qual você quer um website em primeiro lugar.
Alguns desenvolvedores se concentram no produto final literal: a combinação de código que resulta em um design de site agradável o suficiente.
Mas os desenvolvedores com conhecimento de marketing se preocupam com mais do que apenas construir algo que pareça legal. Eles atuam como consultores para clientes que buscam atingir objetivos específicos com seus websites.
Com isto em mente, contratar alguém para construir um website que não pareça interessado em/não faça perguntas sobre os seus objetivos finais é uma bandeira vermelha. É importante chamar a atenção para o fato de que mesmo o mais belo web design pode não ser o ideal quando se trata de conseguir que os visitantes se convertam em clientes.
Dito isto, 94% das pessoas julgam a sua credibilidade com base no design do seu site.
Portanto, em vez disso, você precisa se concentrar no uso do seu design para oferecer a experiência de usuário ideal. Você deve facilitar aos visitantes a busca de informações, visitando seu site em primeiro lugar, enquanto os orienta para atividades de conversão de objetivos.
Estas melhores práticas de web design focam-se na interseção entre a criação de um belo website e um que serve o seu negócio.
Prefere assistir à versão em vídeo?
O que define as Melhores Práticas de Web Design?
Para ter certeza, todos e sua mãe têm opiniões sobre o que constitui um site bem desenhado.
Mas vamos controlar as opiniões de todos, adiando para os especialistas.
De acordo com a Orbit Media, você pode agrupar as melhores práticas de web design nestas três categorias básicas de padrões:
- Padrões de marca: Você pode estar mais familiarizado referindo-se a este mesmo conceito como “branding”, “guias de estilo”, ou “quadros de humor”. Estes padrões incluem tudo o que tem a ver com o aspecto de um website e envolve o uso de cores, tipografia e elementos que são específicos para o negócio em particular.
- Normas de codificação: Os sites devem ser construídos de acordo com os padrões de programação acordados pelo W3C, a comunidade internacional que trabalha em conjunto para desenvolver padrões web.
- Padrões de acessibilidade: O acesso à informação é um direito humano básico, que foi reconhecido pela Convenção das Nações Unidas sobre os Direitos das Pessoas com Deficiência. Além disso, tornar o seu site acessível tem efeitos positivos – não apenas nas vendas, mas também na SEO. O W3C compartilha uma lista básica de padrões que você precisa seguir para projetar um site acessível. Mais adiante neste artigo, detalharemos as melhores práticas de web design relacionadas.
Vamos ver como desenvolver práticas de web design com base em cada um destes padrões:
Padrões de marca
Os sites que não têm uma marca consistente podem ser estressantes para interagir e causar confusão. Como tal, não deve ser surpresa que cerca de 38% dos visitantes tenham dito que deixarão de se envolver com um website se o conteúdo ou layout não for atrativo.
Tendo em mente que a aparência não é tudo, aqui estão alguns princípios básicos de design a considerar para criar um website que as pessoas queiram usar:
Saldo
O equilíbrio é o princípio do design que prescreve como distribuir eficazmente os elementos visuais. Em geral, um design equilibrado parece limpo e natural e tem boa simetria (embora isso não seja necessariamente uma condição de equilíbrio).
Você pode incorporar equilíbrio no web design em termos de layout da página.
Centrar texto ou outros elementos em toda a página é uma forma fácil de o fazer. Em geral, as páginas web são construídas sobre um sistema de grade, o que cria uma forma de equilíbrio. Você pode usar a propriedade de flutuação CSS para posicionar elementos e equilibrá-los ao longo da página.
O equilíbrio pode ser alcançado de 3 maneiras:
1. Desenho simétrico
Arranjando elementos de forma uniforme em toda a página web. Por exemplo, se você tem um elemento pesado à esquerda, você deve ter um elemento pesado à direita. Como mencionado, a centralização é a forma mais fácil de alcançar a simetria, mas por vezes pode parecer plana ou aborrecida.
Para evitar fazer a página parecer monótona, você pode criar equilíbrio usando diferentes elementos, como o equilíbrio de uma imagem grande com um bloco de texto. Existe também um tipo de equilíbrio simétrico chamado equilíbrio radial, onde os objetos irradiam a partir de um ponto central.
2. Design assimétrico
Mais desafiador de fazer bem, o design assimétrico envolve a distribuição desigual dos elementos em uma página. Por exemplo, você pode ter um elemento grande no centro, que é equilibrado por um elemento menor mais distante.
Você pode usar outros elementos de design, como cor ou textura, para equilibrar um design assimétrico.
3. Off-balance
Esses tipos de desenhos sugerem movimento e ação, o que pode deixar as pessoas desconfortáveis. Se o seu site pretende fazer as pessoas pensarem, então um design fora do equilíbrio é para si.
Composição
O termo composição refere-se à colocação e organização de elementos de design.
A Regra dos Terços é comumente usada para criar uma composição equilibrada, especialmente com fotos.
Espaçamento
Os elementos devem ser espaçados uniformemente para que os usuários possam diferenciar seções ou blocos.
Você também deve introduzir o espaço negativo ou o espaço entre e em torno do tema de uma imagem. O espaço negativo pode reduzir o ruído visual, aumentar a legibilidade e trazer equilíbrio.
Você pode introduzir espaço negativo adicionando margens e acolchoamento em torno de seus elementos de design.
Ponto Focal
Crie uma área de foco onde você quer chamar a atenção. Deve ser a parte mais importante da sua página e, idealmente, cada página deve focar apenas um ponto focal importante.
Cor
A cor é um elemento de design importante quando se trata de branding. Idealmente, você está entrando no processo de web design com um entendimento das cores que você quer associar à sua marca.
Para web design especificamente, ajuda a começar com um quadro de humor para a sua marca.
Escolha uma cor primária e secundária (a cor secundária pode complementar ou contrastar a cor primária), e uma tonalidade mais clara e escura para cada uma. Limite o uso de cores para que vários sotaques não se tornem desagradáveis.
Adobe Color fornece uma excelente ferramenta gratuita para testar várias combinações de cores para criar uma paleta de trabalho para os elementos do site.
Além disso, ao decidir sobre cor, é importante considerar aqueles que são daltônicos, o que inclui até 4,5% da população mundial.
Existem três tipos de daltonismo (daltonismo total, visão bicolor e visão cromática deficiente), por isso certifique-se de que o seu design ainda é utilizável em consideração àqueles que podem não ser capazes de diferenciar as cores.
Contraste
Ao escolher a cor, é importante estar consciente das proporções de cor e contraste.
O contraste de cores refere-se à diferença de luz entre o primeiro plano e o segundo plano. O uso de cores suficientemente contrastantes permite que a visibilidade do site seja facilmente distinguida. Em geral, use opções de cores de alto contraste – como texto preto sobre fundo branco – para tornar o seu site legível.
A razão de contraste é o valor numérico atribuído à diferença em contraste entre os elementos da página.
O World Content Accessibility Guidelines (WCAG) 2.0 recomenda uma relação de contraste de 4.5:1 para texto normal. WebAIM compartilha algumas combinações pré-determinadas que se ajustam à relação de contraste ideal para ajudá-lo a visualizar esta melhor prática de web design.
Para ajudar a navegar usando esta relação, certifique-se de que ao desenhar o seu website, está a visualizar todos os públicos (incluindo aqueles com problemas de acessibilidade). É mais fácil fazer isto do que planear para resolver estes problemas depois do fato.
Considere todos os aspectos do site com os quais as pessoas irão interagir, incluindo cabeçalhos, rodapés, menus – todos os quais precisam ser facilmente visíveis para serem utilizáveis.
Algumas ferramentas que você pode usar para verificar as relações de contraste de cor incluem:
- Verificador de contraste de cor por acesso de nível.
- Relação de Contraste.
- WCAG 2.0 AA & AAA ferramenta de verificação de contraste de cor, que é baseada nas diretrizes do WCAG 2.0.
Tipografia
A tipografia do site é outra consideração importante para a marca.
Embora existam muitas fontes diferentes para encontrar fontes potenciais para usar em seu site, você vai querer primeiro considerar as opções que serão exibidas de forma consistente, independentemente das fontes que o usuário final tenha instalado em seu computador.
O Google Fonts oferece uma grande variedade de fontes gratuitas seguras para a web com as quais você pode contar para exibir corretamente, independentemente das fontes/programas instalados pelo usuário. Certifique-se de incluir as fontes no seu quadro de humor para ver se elas combinam com a sua estética de cor.
Se você estiver tendo problemas para fazer combinações, o Google Fonts pode sugerir emparelhamentos populares. Você também pode usar um site como o FontPair para obter sugestões.
Tente limitar os pesos da fonte que você usa, pois ter que carregar muitos arquivos pode contribuir para a velocidade lenta da página. Nesse sentido, considere a hospedagem local do Google Fonts para introduzir benefícios adicionais de desempenho.
Quando se trata de selecionar elementos tipográficos baseados nas melhores práticas de web design, como regra geral, use fontes sem serifas para os cabeçalhos e fontes serifas para o conteúdo. No mínimo, não use fontes decorativas para o conteúdo corporal, pois será difícil de ler.
Além disso, não se sinta tentado a usar uma grande variedade de fontes diferentes no seu website. Uma boa regra é usar uma fonte para o seu logotipo, outra para os seus menus/cabeçalhos e mais uma para o conteúdo corporal. Nesse sentido, tente emparelhar fontes que se complementam, tais como as da mesma família de fontes.
Hierarquia de Elementos
Hierarquia refere-se à disposição dos elementos de design que mostram a importância relativa. Isto é conseguido através da manipulação de elementos como contraste visual, tamanho e posicionamentos para chamar a atenção.
Por exemplo, o conteúdo deve ser dividido em blocos lógicos para que os usuários possam distinguir as seções umas das outras.
Você pode fazer isso através do uso de cabeçalhos de conteúdo, o que não só facilita aos usuários saltar para as partes que eles querem ler, mas também quebrar grandes quantidades de texto em pedaços legíveis para que os leitores de tela sejam capazes de determinar o contexto de cada seção.
Se você está procurando algumas ilustrações visuais úteis desses conceitos de design e muito mais, o blog da Tilda Publishing cobre alguns dos erros mais comuns de design de páginas da web e como corrigi-los.
Melhores Práticas de Design/Formatação na Web
De acordo com a pesquisa da Orbit Media, existem alguns padrões comuns de web design observados nos 50 principais sites de marketing.
Por “padrões”, eles significam que 80% dos sites utilizam uma abordagem de design semelhante:
- Logotipo no canto superior esquerdo.
- Navegação horizontal principal através do topo de cada página.
- Proposta de valor elevada na página inicial localizada “acima da dobra”. Note que a maioria dos web designers lhe dirá que não há uma altura de pixel padrão para os navegadores, e tecnicamente não há “dobra”. Mas, em geral, elementos importantes do design devem aparecer no alto das páginas que são geralmente visíveis para a maioria dos visitantes, mesmo sem rolagem.
Aqui estão algumas das melhores práticas de web design para elementos comuns do site:
Imagens
As melhores práticas de web design para o uso de imagens podem inspirar muitos volumes de conselhos, mas vamos focar no mínimo nesta discussão das melhores práticas de web design:
- Adicionando texto ALT. As imagens não podem ser processadas utilizando leitores de ecrã, a menos que seja utilizado texto ALT. Adicionar texto ALT também contribui para SEO, mas algumas pessoas usam o texto ALT apenas para complementar a sua estratégia de palavras-chave. Um uso mais útil do texto ALT seria descrever a imagem – embora você pudesse certamente satisfazer as aranhas de busca e os leitores de tela ao mesmo tempo com a abordagem correta.
- O uso de imagens com rostos humanos tende a ser mais eficaz do que outros gráficos ou animações. Isso torna as pessoas mais propensas a se envolverem com a imagem, pois os humanos são atraídos pelo que percebem como verdadeira empatia e emoções.
- Use imagens responsivas, que crescem ou encolhem, dependendo do tamanho do navegador. Isto ajuda tanto na velocidade do site como na SEO.
- Nunca se esqueça dos favicons. Os favicons são os pequenos ícones que aparecem ao lado do título do site e também nos resultados das pesquisas. Ele ajuda no reconhecimento da marca e melhora o UX do site.
Navegação do site
Os usuários esperam poder encontrar facilmente o conteúdo que estão procurando em um site. Portanto, é importante que a navegação no site seja simples e direta.
Navegação de website é um termo geral que se refere à arquitetura de link interno de um website. Não se esqueça que o principal objetivo da navegação é ajudar os utilizadores a encontrar facilmente conteúdos relevantes no seu website.
A arquitetura de links internos do seu site constitui a base do seu mapa do site, o que ajuda os motores de busca a acederem mais facilmente ao seu conteúdo. Descobriu-se que ter um site bem desenhado onde o conteúdo é fácil de encontrar afeta positivamente o tráfego do site que você receberá dos mecanismos de busca (juntamente com uma maior chance de obter links para o site do Google).
Navegação por menus
Existem vários aspectos que compõem a navegação no website, mas o seu menu principal deve ser um foco principal, pois será uma das primeiras coisas com que os utilizadores interagem quando visitam o seu website.
Existem diferentes heurísticas de design do menu do site, mas as mais populares incluem:
Menu de navegação
O ideal é que este esteja localizado na frente e no centro de um website. Isto pode envolver o uso de um menu dropdown se houver várias categorias. No entanto, os menus dropdown não são recomendados, especialmente quando se trata de SEO técnico (eles são mais difíceis de rastejar). Além disso, foi descoberto que a maioria das pessoas não gosta de menus dropdown.
Isto porque o olho humano trabalha mais rápido que a mão, e por isso as pessoas acham irritante quando já decidiram o que clicar e algo mais cai – o que pode levar a uma diminuição nas visitas às páginas.
Menu de Hambúrgueres
Usado principalmente para um design otimizado para celular, um menu de hambúrgueres é normalmente localizado no lado superior esquerdo ou direito da página. Ele aparece como um quadrado com três linhas que podem ser expandidas com um clique. No entanto, muitos designers desprezam o menu de hambúrgueres, que inspirou os desenvolvedores web a considerar novas formas de tornar a navegação em sites móveis divertidos e funcionais.
Aqui estão algumas dicas para projetar a navegação com base nas melhores práticas de web design:
- Adicione uma barra de pesquisa para ajudar os usuários a encontrar facilmente o conteúdo (aqui está como melhorar a funcionalidade de pesquisa do WordPress). Isto é especialmente útil para sites que têm muito conteúdo, como um blog de notícias.
- Desenhe seu site seguindo a regra dos três cliques, que diz que os usuários devem ser capazes de encontrar a informação desejada com não mais do que três cliques do mouse. Isto porque os utilizadores preferem realmente navegar num site em vez de procurar nos resultados da pesquisa, quando possível.
- Faça seus títulos de menu descritivos (com palavras-chave em mente), o que ajuda os usuários a encontrar itens mais facilmente e também contribui positivamente para SEO.
- A posição dos itens do menu é importante. Coloque as páginas mais importantes na frente do seu menu para que sejam de fácil acesso.
- Mantenha os itens de menu em um máximo de 7, não só para manter o design do site limpo, mas também porque ter muitas categorias de itens de menu pode potencialmente afetar sua capacidade de classificação na pesquisa. O Google pode interpretar estas categorias aparentemente não relacionadas como um sinal de que o seu site não decidiu sobre um nicho específico.
Para um formato mais conveniente, aqui está um prático infográfico:
Normas de Codificação
Com tantos sites criados e consumidos globalmente, há certamente a necessidade de um conjunto padronizado de princípios de codificação. Alguns aspectos destas normas web incluem:
SEO
SEO pode ser usado para aumentar o número de visitantes do seu site organicamente (sem o uso de anúncios). Uma vez que é demasiado complicado escavar adequadamente em SEO numa pequena subseção de um artigo, consulte a nossa lista de verificação de SEO e as nossas dicas para os melhores plugins de SEO para WordPress para se familiarizar com este aspecto das melhores práticas de web design.
Note que as seguintes dicas de padrões de codificação funcionam em conjunto com SEO.
Capacidade de resposta móvel
O design responsivo está preocupado em criar uma grande experiência de usuário, independentemente do dispositivo ou navegador utilizado para acessar o seu site.
É mais importante hoje do que nunca projetar seu site para ser responsivo, pois mais de 60% dos usuários de internet acessam a internet através de seus telefones celulares, e metade das transações de comércio eletrônico são feitas através de plataformas móveis. Para além disso, o novo algoritmo de pesquisa do Google também dá prioridade aos sites amigos dos telemóveis.
Ter um site responsivo não só ajuda os usuários a navegar no seu site mais facilmente, mas também contribui para aumentar o envolvimento e as conversões. Os usuários recomendam marcas com as quais eles têm uma experiência positiva de site móvel-responsivo e, inversamente, não só parariam de comprar de marcas com uma má experiência de site móvel, mas também desencorajariam ativamente outras marcas de o fazer.
No entanto, apesar da demanda por um local receptivo, estima-se que 91% das pequenas empresas não têm um. Eles devem – como projetar um site móvel-responsivo certamente compensa. 62% das empresas relataram um aumento nas vendas depois de projetar um site móvel-responsivo.
Leia o recurso da Kinsta sobre como tornar o seu site mais amigável ao celular, que inclui uma lista dos melhores plugins móveis WordPress para download, e certifique-se de verificar esta lista curada dos melhores temas WordPress, onde você poderia navegar através de muitos temas responsivos.
O Google também oferece algumas dicas de como projetar um site que responda.
Segurança do site
Outra prática de codificação importante? Criar programas e websites seguros em que os utilizadores possam confiar as suas informações pessoais sensíveis. Ao contrário da crença popular, os hackers não procuram ativamente sites específicos para hackear, e é por isso que mesmo sites pequenos são vulneráveis a ataques.
Como um todo, o WordPress é geralmente seguro, mas ajuda a tomar precauções extras para manter o seu site seguro contra ataques.
Aqui estão algumas das melhores práticas de segurança do site:
- Obtenha um certificado SSL, que é especialmente importante para sites que lidam com pagamentos e informações pessoais. O certificado SSL encripta a informação enviada através das redes para que os hackers tenham dificuldade em descodificá-la. Além disso, é um padrão da indústria. O Chrome alerta os visitantes quando o site que eles estão visitando não tem um certificado SSL. Além disso, o Chrome está agora a depreciar as versões antigas do TLS e começou a mostrar avisos adicionais.
A ativação do HTTPS (parte da instalação de um certificado SSL) é também um fator oficial de classificação no Google. - Mantenha as suas credenciais de login seguras. Vários ataques são causados por hackers que tentam ganhar acesso a um site à força. Ele ajuda a ter uma página de login separada/ocultada (use o plugin WP Hide Login) e a limitar o número de tentativas de login. Use o plugin Login LockDown, que grava o endereço IP e o timestamp de cada tentativa de login falhada e bloqueia a função de login se o número de tentativas falhadas a partir do mesmo intervalo de IP for atingido em um curto período de tempo. Além disso, crie uma senha segura com mais de 6 caracteres e que seja uma mistura de letras maiúsculas e minúsculas, números e caracteres especiais. Mude sua senha frequentemente. Você também pode usar autenticação de dois fatores para fazer login se você estiver procurando por segurança extra.
- Mantenha o núcleo, plugins e temas do WordPress atualizados. Não se esqueça de descarregar plugins ou temas a partir de uma fonte respeitável. Um bom sinal é se o plugin/tema tem múltiplas instalações e foi atualizado recentemente. Você também deve ler revisões para decidir por si mesmo se o plugin é de confiança (certifique-se de verificar os listados aqui). Nesse ponto, baixe um plugin de segurança WordPress, como Wordfence, Sucuri ou Defender, pois 73,2% das instalações mais populares do WordPress que são vulneráveis podem ser detectadas usando ferramentas automatizadas gratuitas. Aqui está uma lista mais aprofundada dos melhores plugins de segurança.
- Use um servidor web seguro. Para aqueles que não sabem, pode não parecer que o seu web host tenha algo a ver com a segurança do site, mas 41% dos ataques ocorrem através de uma vulnerabilidade de segurança na plataforma de hospedagem. Procure um provedor de hospedagem que inclua recursos como: criptografia e firewall do lado do servidor, servidores web NGINX ou Apache, antivírus e software anti-malware, sistemas de segurança no local, e a disponibilidade de certificados SSL e um CDN.
Para mais informações sobre segurança do WordPress, confira nosso abrangente recurso sobre como manter seu site WordPress seguro.
Velocidade da página
Cerca de metade dos usuários espera que um site seja carregado em 2 segundos ou menos, e se demorar mais do que isso, 40% das pessoas não hesitarão em saltar da página, (provavelmente) nunca mais retornarão.
Além das visitas ao site, a velocidade da página é importante, pois também afeta a conversão e a receita. Para cada segundo de velocidade de carregamento de páginas adicionada, as vendas cairão até 27%. O aumento da velocidade do site pode evitar a perda de 7% das possíveis conversões.
Aqui estão algumas formas de fazer com que as suas páginas web sejam carregadas mais rapidamente:
- Use uma rede de entrega de conteúdo (CDN), que leva arquivos estáticos como imagens, CSS e JavaScript, e os entrega nos servidores mais próximos da localização física do usuário.
- Considere como você usa as imagens. O site usa em média 1,8MB de imagens, o que representa 60% do tamanho de um site. Para ajudar com isso, reconsidere a forma como você configura a sua página web. Se você quiser manter a velocidade da página rapidamente, tente reduzir o número de imagens grandes usadas em seu design e certifique-se de otimizá-las.
- Se o seu site precisa usar muitas imagens grandes, use plugins que incluem funcionalidades para compressão GZIP, cache ou otimização de imagens, como WP Rocket and Imagify. Eles podem ajudar a tornar os seus arquivos menores (sem sacrificar a qualidade) para que eles carreguem mais rápido.
- Considere o número de plugins e arquivos que você mantém em seu banco de dados WordPress, pois eles também podem afetar a velocidade de carregamento da página. Limpa aqueles que não usas. Enquanto estiver nisso, mantenha seu PHP, núcleo do WordPress e plugins atualizados para suas últimas versões.
Confira nosso abrangente recurso para otimização da velocidade do site.
Padrões de Acessibilidade
A Internet foi concebida para funcionar para todas as pessoas, independentemente do hardware, software, linguagem que utilizam, da sua capacidade ou localização. No entanto, muitos sacrificam a acessibilidade por um belo design.
Acessibilidade refere-se à prática de tornar o seu site utilizável por todos.
Além daqueles com deficiências que afetam o acesso, o W3 diz que a acessibilidade do site também é benéfica:
- Aqueles que utilizam dispositivos com telas pequenas, diferentes modos de entrada, etc.
- Os idosos.
- Pessoas com “deficiências temporárias”, incluindo um membro quebrado, óculos perdidos, ou uma condição médica.
- Usuários com “limitações situacionais”, como aqueles que acessam a Internet em dispositivos sob a luz solar intensa ou em um ambiente onde não podem ouvir áudio, como o transporte público.
- Indivíduos com uma conexão lenta à Internet.
A acessibilidade deve ser uma preocupação de todos, pois todos nós somos afetados por ela de alguma forma.
Razões para tornar o seu Site Acessível
Ainda não sabe se vale a pena gastar o seu tempo em acessibilidade nesta discussão sobre as melhores práticas de web design?
Considere estas razões:
- É um requisito da ADA. A Lei dos Americanos Portadores de Deficiência (ADA) foi aprovada em 1990 para proteger os direitos civis das pessoas com deficiência contra a discriminação. Abrange coisas como transporte, telecomunicações, emprego e até códigos de construção. Como esta lei foi aprovada quase 30 anos antes – uma época em que a internet não era tão onipresente – os legisladores estão procurando alterá-la.
- Promove a inclusividade. Uma pesquisa do Pew Research Center mostra que as pessoas com deficiência três vezes menos probabilidade de entrar na internet do que as suas contrapartes sem deficiência, o que é uma pena, uma vez que as estatísticas mostram que cerca de 30% dos profissionais têm uma deficiência, sendo que 62% das pessoas com deficiência “voam por baixo do radar” por medo de enviesamento negativo.
- Vai ajudá-lo a ganhar mais negócios. Ao ser mais inclusivo, você trará uma rede de pessoas com deficiência, o que representa 7 trilhões de dólares em renda disponível.
- Benefícios de SEO. Os motores de busca recompensam os sites que são compatíveis com a acessibilidade, a fim de incentivar mais sites a serem acessíveis.
Como tornar o seu site mais acessível
Uma maneira fácil de tornar o seu site mais acessível é instalar o plugin WP Accessibility, que acrescenta funcionalidades de acessibilidade, incluindo:
- Uma barra de ferramentas onde os usuários podem redimensionar as fontes e visualizar seu site em alto contraste e em escala de cinza.
- Comparar o contraste de cores para verificar se ele se encaixa no padrão do ADA.
- Remoção de atributos de título de imagens inseridas no conteúdo. A maioria dos leitores de ecrã não consegue sentir isto e ler o texto de âncora em vez disso.
- Habilitando links de pular, que são links de páginas internas que permitem aos usuários pular diretamente para o conteúdo, o que é útil para as pessoas que usam leitores de tela.
Alguns passos adicionais a tomar:
- Adicione legendas ou uma transcrição se o seu site produz mídia como áudio, audiolivros, vídeos, podcasts, etc., para beneficiar os surdos/mudos, assim como as pessoas que querem consumir o seu conteúdo, mas não podem consumir mídia em público.
- Crie links e menus acessíveis por teclado para pessoas com deficiências motoras e só pode utilizar um teclado (não um rato) para navegar no seu site. Os menus dropdown são desencorajados, mas você pode corrigir isso atribuindo atalhos para cada item dropdown (tais como: pressione “1” para a página inicial, “2” para a página about, etc.).
- Por fim, teste o seu site para verificar a acessibilidade do mesmo. A Iniciativa de Acessibilidade na Web não endossa nenhuma ferramenta específica, mas oferece uma lista de ferramentas que você pode usar para auditar seus esforços.
Reflexões finais: Melhores Práticas de Web Design para o seu Próximo Projeto de Website
Bons sites não devem ser definidos por um design objetivamente bom. Igualmente importante é a usabilidade do site, a facilidade de navegação e a acessibilidade. Armado com estas melhores práticas de web design, você tem tudo o que precisa para criar algo que pareça e funcione bem.
Tenha em mente que estas são as melhores práticas de web design. É provável que você não consiga seguir cada um deles exatamente, dependendo da natureza do seu site. Mas antes que você possa quebrar as regras, ajuda ao menos estar ciente do porquê elas existem.
Perdemos alguma coisa importante? Partilhe as suas melhores práticas de web design nos comentários abaixo!
Sugestão de leitura: Melhores Cursos de Web Design Online
Maddy Osman creates engaging content with SEO best practices for marketing thought leaders and agencies that have their hands full with clients and projects. Learn more about her process and experience on her website, The Blogsmith and read her latest articles on Twitter: @MaddyOsman.
Deixe um comentário