Monte Carlo

Explore

Análise geral

Acessibilidade
Acessibilidade

Em nossa análise verificamos se as cores estão adequadas para todos os tipos de percepção da cor ou para a ausência dela, como a discromatopsia hereditária, também conhecida por daltonismo; se o tipo de fonte (serifada ou sem serifa) e texto (justificado, por ex) estão adequados; se o peso da fonte está possibilitando uma boa leitura para todos os tipos de pessoas, como jovens e idosos, bem como àqueles com algum tipo de deficiência visual (miopia, astigmatismo ou da idade mesmo).

⁠

Página Inicial / Header / Banners

Pontos observados:

Ícones + descrição e, número de itens da “sacola” com tamanhos pequenos (14x13, 10px e 9px, respectivamente), bem como sem contraste - como as categorias, dificultando a leitura pelo usuário.

As informações contidas no banner “sale” estão sem contraste, impossibilitando a leitura pelo usuário.

⁠

Sugestões de melhoria:

Aumentar o tamanho dos ícones + descrição e, número de itens da “sacola”, com o devido contraste também para as categorias, facilitando a leitura pelo usuário.

Corrigir o contraste das informações do banner “sale”, melhorando a leiturabilidade.

Heurísticas de Nielsen atendidas: 1ª, dando visibilidade do status do sistema ao usuário; 4ª, dando consistência e padronização ao design.

Impacto: Baixo

⁠

Alto

⁠

Página Inicial / Barra de Busca

Pontos observados:

A cor da frase “O que você procura?” está muito clara, quase ilegível.

Opções de resultado com tamanho de fonte pequeno, sem contraste, dificultando a leitura.

⁠

Sugestões de melhoria:

Melhorar o contraste da frase “O que você procura?” ou deixar o espaço em branco com o ícone de lupa do lado direito.

Deixar as opções de resultado mais legíveis, com contraste, e tamanhos maiores, além de destacar as imagens, deixando mais atrativas.

Heurísticas de Nielsen atendidas: 1ª, dando visibilidade do status do sistema ao usuário; 3ª, dando controle e liberdade para o usuário; 5ª, prevenindo eventual equívoco por parte do usuário; 8ª, com estética e design minimalista que ajuda o usuário.

Impacto: Baixo

⁠

Alto

Referências:

⁠

Página Inicial / Vitrine “Coleções Jolie”

Pontos observados:

Banners da coleção com textos sem contraste, dificultando a leitura.

Botões “confira a coleção>” sem contraste, prejudicando a leitura pelo usuário.

⁠

Sugestão de melhoria:

Aumentar o contraste dos textos dentro dos banners, bem como do botão “confira a coleção>”.

Heurísticas de Nielsen atendidas: 1ª, dando visibilidade do status do sistema ao usuário; 4ª, dando consistência e padronização ao design.

Impacto: Baixo

⁠

Alto

⁠

Página Inicial / Informações

Ponto observado:

Informações relevantes dos cards em tamanho 12px, dificultando a leitura - no desktop utilizado apenas para informações não tão importantes abaixo do banner, apesar de serem clicáveis não têm estado de hover, não sendo intuitivo para o usuário clicar.

⁠

Sugestão de melhoria:

Aumentar o tamanho da fonte das informações, facilitando a leitura do usuário, em especial que está buscando aquelas informações para realizar a compra.

Heurísticas de Nielsen atendidas: 1ª, dando visibilidade do status do sistema ao usuário; 4ª, dando consistência e padronização ao design.

Impacto: Baixo

⁠

Alto

⁠

Página Inicial / Footer

Pontos observados:

Newsletter sem contraste, com placeholders nos inputs quase ilegíveis de tão clara que está a fonte.

Alguns selos não estão legíveis.

⁠

Sugestões de melhoria:

Melhorar o contraste e pensar em outra cor para os placeholders, facilitando a leitura pelo usuário.

Deixar os selos mais legíveis.

Heurísticas de Nielsen atendidas: 1ª, dando visibilidade do status do sistema ao usuário; 4ª, dando consistência e padronização ao design; 8ª, com estética e design minimalista que ajuda o usuário.

Impacto: Baixo

⁠

Alto

⁠

Páginas de Categoria

Pontos observados:

Breadcrumbs sem contraste, dificultando a leitura.

Cards de produtos com fundo igual ao background, informações com tamanhos pequenos e sem contraste e, dependendo da tela do desktop dificulta muito a visualização pelo usuário.

⁠

Sugestões de melhoria:

Aumentar o contraste dos breadcrumbs.

Melhorar o design dos cards de produtos, aumentando a visibilidade e melhorando a experiência do usuário.

Heurísticas de Nielsen atendidas: 1ª, dando visibilidade do status do sistema ao usuário; 3ª, dando controle e liberdade para o usuário; 4ª, dando consistência e padronização ao design; 8ª, com estética e design minimalista que ajuda o usuário.

Impacto: Baixo

⁠

Alto

⁠

Páginas de produto

Ponto observado:

Breadcrumb sem contraste, dificultando a leitura.

Imagens com fundo igual ao do background, e por serem muito finas (em alguns casos) não têm contraste, dificultando a visibilidade pelo usuário.

Card com título, modelo e preço do produto, bem como descrição e informações com tamanho de fonte pequena (12px) e sem contraste e, dependendo da tela de desktop dificulta a leitura.

⁠

Sugestões de melhoria:

Aumentar o contraste do breadcrumb, facilitando a leitura.

Ideal é trazer imagens de diferentes ângulos do produto e com fundo de outra tonalidade ou cor, em modelos, em 360 graus e, em realidade aumentada, melhorando a experiência do usuário.

Ideal é ajustar a hierarquia no card com título, modelo e preço, aumentando a fonte, dando mais contraste para o título e preço, e para detalhes e informações do produto, facilitando a jornada do usuário que busca saber as informações.

Heurísticas de Nielsen atendidas: 1ª, dando visibilidade do status do sistema ao usuário; 2ª, apresentando compatibilidade entre o sistema e o mundo real (com imagens que refletem a realidade do produto); à 3ª, dando controle e liberdade para o usuário; 4ª, dando consistência e padronização ao design; 7ª, apresentando eficiência e dando flexibilidade de uso; à 8ª, com estética e design minimalista que ajuda o usuário.

Impacto: Baixo

⁠

Alto

Referências:

⁠