Home, menu, busca, categoria, produto, carrinho e entrada do checkout.
Auditoria independente · 04 ago 2026
Uma base forte. Quatro frentes pedem atenção.
A experiência transmite performance, mantém preços transparentes e conduz bem no desktop. No mobile, os principais riscos estão na contenção do layout, nos painéis laterais, no consentimento de cookies e no feedback acessível do checkout.
Método e recorte
Evidência antes de opinião.
O diagnóstico combina duas lentes: qualidade visual e editorial, mais clareza funcional, ética de marca e acessibilidade. Todo achado recebe impacto, confiança e um teste de aceite.
1440×900, 390×844 e 412×915 em Chromium com emulação responsiva.
Um carrinho anônimo temporário; nenhum dado pessoal, pagamento ou pedido enviado.
WCAG 2.2, orientações da ANPD e critérios oficiais de Core Web Vitals.
Matriz de maturidade
Sem nota artificial.
Os níveis descrevem o estado observado, não uma pontuação universal. “Precisa atenção” indica fricção relevante, mas não significa que toda a dimensão esteja quebrada.
Identidade visual
Turquesa, grafite, fotografia esportiva e embalagem formam um sistema reconhecível.
Arquitetura e descoberta
Categorias são legíveis; filtros e busca ainda podem orientar melhor por objetivo.
Conversão e checkout
Preço, Pix, parcelas e frete permanecem visíveis ao longo do funil.
Mobile
A primeira dobra do produto e o overflow lateral atrasam a decisão.
Acessibilidade
Painéis, controles por ícone, clones de carrossel e erros precisam de semântica.
Confiança e privacidade
Consentimento de cookies e rastreabilidade de alegações pedem mais controle.
Qualidade técnica
IDs duplicados, avisos de integrações e excesso de clones elevam a fragilidade.
Core Web Vitals
A API PageSpeed retornou HTTP 429; nenhum número foi estimado ou inventado.
O que já funciona
Preservar antes de corrigir.
Uma auditoria imparcial também protege decisões boas. Estes elementos reduzem incerteza e não devem ser perdidos durante uma evolução do tema.
Marca reconhecível
A combinação turquesa, grafite, tipografia condensada e fotografia esportiva cria presença própria.
Preço transparente
Valor atual, anterior, desconto, Pix e parcelamento aparecem juntos e de forma consistente.
Frete antecipado
O limite de frete grátis é informado desde a home e reaparece no produto e carrinho.
Catálogo escaneável
Departamentos e nomes de produtos permitem reconhecimento rápido, especialmente no desktop.
Carrinho claro
Subtotal, total, Pix, quantidade e cálculo de frete ficam reunidos no mesmo painel.
Checkout direto
A entrada solicita apenas e-mail e CEP, sem obrigar cadastro antes de mostrar a próxima etapa.
Registro de achados
Do risco à verificação.
P1 afeta acesso, confiança ou conversão e deve entrar no próximo ciclo. P2 reduz fricção relevante. P3 melhora consistência e resiliência.
13 achados exibidos.
Overflow horizontal na página de produto
A página permite deslocamento lateral de cerca de 15 px em 390 e 412 px.
Impacto
A barra horizontal transmite instabilidade e pode deslocar conteúdo importante em toque acidental.
Recomendação
Revisar contêineres em `100vw`, largura do viewport e clipping dos Swipers. Manter slides fora de tela contidos no componente.
Critério de aceite
`scrollWidth ≤ clientWidth` e nenhuma barra horizontal em 390×844, 412×915 e 200% de zoom.
Menu, filtros e carrinho não funcionam como diálogos
Não foram encontrados `role="dialog"`, `aria-modal`, `aria-expanded` ou conteúdo de fundo inerte.
Impacto
Leitores de tela e teclado podem navegar pelo conteúdo oculto atrás do painel e perder a referência de contexto.
Recomendação
Aplicar padrão de diálogo: título, `aria-modal`, foco inicial, contenção de foco, Escape, retorno ao gatilho e fundo `inert`.
Critério de aceite
Ao abrir qualquer painel, o foco entra nele, permanece contido, fecha por Escape e retorna ao controle de origem.
Cookies dependem de consentimento por continuidade
O texto informa que navegar significa aceitar, oferecendo somente “Entendi”.
Impacto
O usuário não recebe controle equivalente para rejeitar ou configurar cookies não essenciais, o que reduz confiança.
Recomendação
Separar essenciais e opcionais, explicar finalidades e oferecer “Somente essenciais”, “Configurar” e “Aceitar todos”.
Critério de aceite
Consentimento explícito, granular e revogável; nenhum opcional pré-selecionado; revisão pelo responsável de privacidade.
Erro do checkout não é anunciado
“Digite um CEP válido” aparece em um `span` sem `role="alert"`, `aria-live` ou vínculo com o campo.
Impacto
Quem não enxerga a faixa vermelha pode não saber por que o fluxo não avançou.
Recomendação
Marcar o CEP com `aria-invalid`, ligar a mensagem por `aria-describedby`, anunciar em região viva e mover foco ao primeiro erro.
Critério de aceite
NVDA/VoiceOver anuncia o resumo e a mensagem do campo após “Continuar”, mantendo conteúdo específico e acionável.
A decisão de compra chega tarde no mobile
Em 412×915, o título começa perto de 806 px; a primeira dobra é dominada pela galeria.
Impacto
Nome, preço, tamanho e CTA exigem rolagem antes que o usuário consiga decidir ou confirmar a oferta.
Recomendação
Reduzir a altura inicial da galeria, aproximar resumo comercial e manter ao menos título, preço e início das variantes na primeira dobra.
Critério de aceite
Em 390×844, produto, preço e CTA — ou um CTA fixo contextual — ficam identificáveis sem ambiguidade em uma dobra.
Estrutura de página não representa a hierarquia visual
A home não expõe `main` ou `nav` e salta de H1 para H3; o checkout usa apenas H3.
Impacto
Atalhos de leitores de tela ficam menos eficientes e a página se torna mais difícil de compreender fora do visual.
Recomendação
Adicionar landmarks nativos, link “Ir para conteúdo” e hierarquia H1→H2→H3 coerente com as seções.
Critério de aceite
Cada página possui um `main`, navegação identificada, um H1 descritivo e níveis de título sem saltos funcionais.
Imagens e clones geram ruído acessível
Na home: 143 imagens, 5 sem `alt`, 18 alternativas genéricas e 75 slides sem `aria-hidden`.
Impacto
Leitores de tela recebem nomes pouco úteis e itens duplicados que alongam a navegação.
Recomendação
Escrever alternativas por finalidade, manter `alt=""` apenas para decoração e remover clones inativos da árvore com `aria-hidden`/`inert`.
Critério de aceite
Somente o slide ativo e controles relevantes são navegáveis; nenhum `alt` genérico ou ausente em conteúdo informativo.
Alvos passam no limite, mas não no conforto
Foram encontrados 55 controles abaixo de 44 px e 2 abaixo de 24 px em pelo menos um eixo.
Impacto
Ícones de menu, carrinho, login e utilidades exigem precisão maior em movimento, sol ou uso com uma mão.
Recomendação
Ampliar a área ativa para 44×44 px sem necessariamente aumentar o desenho; garantir no mínimo 24×24 px e espaçamento AA.
Critério de aceite
Controles primários têm 44×44 px; os demais atendem 24×24 px ou uma exceção documentada de espaçamento.
Rótulos misturam produtos e objetivos
O seletor de tamanho da Creatina é anunciado como “Tamanho Nexbeef”; o filtro da categoria exibe grupos de Nexbeef e Nexmania.
Impacto
Erros de nome reduzem confiança e filtros por SKU não correspondem ao modelo mental de quem busca um objetivo.
Recomendação
Corrigir nomes gerados por variante e organizar filtros por formato, objetivo, restrição e faixa de preço — somente quando relevantes.
Critério de aceite
O nome acessível corresponde ao produto atual e nenhum grupo de filtro aparece sem itens aplicáveis na categoria.
Ações por ícone perdem seu nome
Fechar e excluir no carrinho, voltar na busca e o carrinho “0/1” não têm nomes úteis. O link do TikTok está malformado.
Impacto
A finalidade de ações críticas depende apenas do desenho; o link social pode levar a uma página inválida.
Recomendação
Usar `button` nativo com `aria-label` específico, nomear carrinho com estado e validar destinos sociais periodicamente.
Critério de aceite
Todos os controles têm nome, papel e estado anunciados; verificação automática de links retorna destinos válidos.
Apps de terceiros geram avisos recorrentes
Foram observados `loadCSS is not defined`, “Invalid template!” e uma `TypeError` em scripts externos.
Impacto
Avisos não provam falha visível, mas aumentam o risco de regressões e dificultam diagnosticar incidentes reais.
Recomendação
Revisar dependências, versões e ordem de carregamento; remover integrações sem uso e monitorar erros por release.
Critério de aceite
Navegação principal e PDP completam sem erros não tratados; exceções conhecidas são documentadas e monitoradas.
Busca aberta começa em um vazio sem orientação
A tela exibe apenas o campo; o vídeo flutuante permanece no canto e compete com o estado de busca.
Impacto
O espaço não ajuda quem ainda não sabe o nome do produto e a sobreposição distrai da tarefa principal.
Recomendação
Mostrar categorias, termos populares e histórico local; suspender widgets periféricos enquanto busca ou painéis estiverem ativos.
Critério de aceite
Antes da digitação, a busca oferece pelo menos três rotas úteis e nenhum widget cobre ou compete com seus controles.
Alegações técnicas podem ganhar rastreabilidade
A PDP menciona “grau farmacêutico”, laudos por lote e benefícios de desempenho, mas a auditoria não encontrou a evidência no mesmo ponto de decisão.
Impacto
A informação é persuasiva, porém pode parecer apenas promocional quando a fonte ou laudo não está imediatamente acessível.
Recomendação
Vincular laudo do lote, composição, modo de uso, limitações e referências independentes em uma camada de “Como verificamos”.
Critério de aceite
Cada alegação verificável aponta para fonte, data e escopo; orientações de segurança ficam próximas da promessa.
Trilho de evidências
O que foi observado.
Capturas originais, sem alteração do conteúdo. A numeração conecta imagem, viewport e achado; os arquivos também ficam incorporados para consulta offline.
Home desktop
Identidade forte, navegação horizontal e proposta comercial visível.
Home mobile
Boa adaptação visual; controles compactos e consentimento fixo.
Menu aberto
Categorias claras; painel sem semântica modal e fundo ainda navegável.
Categoria desktop
Grade enxuta e oferta legível.
Categoria mobile
Ordenação e filtros acessíveis na dobra; relação categoria/taxonomia pode melhorar.
Filtros
Grupos por produtos específicos aparecem em uma categoria de apenas três itens.
Produto · primeira dobra
Galeria domina a tela; foi observado overflow horizontal.
Produto · decisão
Oferta completa e clara, mas acessível somente após rolagem.
Produto desktop
Preço e compra aparecem juntos na primeira dobra.
Carrinho desktop
Boa síntese comercial; controles de fechar e excluir estão sem nome acessível.
Carrinho mobile
Informação de preço permanece íntegra; painel ocupa a tela inteira.
Checkout mobile
Fluxo direto, com etapas e valor preservados.
Validação do checkout
Erro visual forte, porém sem anúncio programático.
Checkout desktop
Layout limpo e resumo do pedido persistente.
Busca vazia
Falta orientação inicial; widget periférico permanece ativo.
Recomendações ilustradas
Corrigir sem perder a marca.
Wireframes de princípio, não layouts finais. Eles tornam o critério de aceite visível e reduzem decisões durante a implementação.
Painel acessível
Foco contido, Escape, retorno ao gatilho, título anunciado e controles de 44 px.
Cookies com escolha real
Finalidades claras e ações equivalentes para essenciais, configuração e aceite.
PDP mobile orientada à decisão
Galeria compacta, produto e oferta antes da dobra, sem esconder detalhes técnicos.
Carrossel contido
Viewport recorta slides, somente o ativo fica acessível e controles explicam anterior/próximo.
Roadmap proposto
Corrigir por risco, não por gosto.
A sequência protege receita e acesso primeiro; depois melhora decisão e, por fim, resiliência e confiança de longo prazo.
Estabilizar
- Conter overflow da PDP em 390 e 412 px.
- Aplicar padrão de diálogo a menu, filtros e carrinho.
- Anunciar erros e vincular mensagens aos campos.
- Nomear controles por ícone e corrigir TikTok.
- Definir solução de cookies com jurídico/privacidade.
Facilitar a decisão
- Reorganizar a primeira dobra da PDP mobile.
- Corrigir landmarks e hierarquia de títulos.
- Revisar `alt`, clones de carrossel e áreas de toque.
- Corrigir rótulos de variantes e filtros.
- Validar fluxo com NVDA, VoiceOver e teclado.
Construir confiança
- Adicionar busca orientada por objetivo.
- Ligar alegações a laudos e fontes.
- Revisar apps e erros de console.
- Instrumentar Core Web Vitals de campo.
- Testar com pessoas usuárias, incluindo PcD.
Limites e fontes
Transparência sobre a própria auditoria.
Este documento é uma fotografia técnica e heurística. Não substitui auditoria jurídica, médica, teste de segurança ou certificação formal de acessibilidade.
- Data: 04 de agosto de 2026.
- Ambiente: Chromium com emulação responsiva; sem dispositivo físico.
- Checkout: nenhum dado pessoal, pagamento ou pedido enviado.
- Core Web Vitals: não medidos; API oficial retornou HTTP 429.
- Acessibilidade: amostra técnica, sem teste formal com usuários de tecnologia assistiva.
- Cookies e alegações: riscos para validação especializada, não parecer jurídico ou de saúde.