---
title: "Checkout no celular: boas práticas que fazem diferença"
description: "O que priorizar no checkout para celular: layout em uma coluna, teclado correto, botões confortáveis, Pix fácil de copiar e velocidade."
url: "https://rishi.com.br/blog/checkout-no-celular-boas-praticas"
published: "2026-09-23T09:00:00+00:00"
updated: "2026-10-08T04:53:27+00:00"
author: "Equipe Rishi"
tags: ["Checkout", "Conversão", "Pix"]
reading_time: "3 min"
---

# Checkout no celular: boas práticas que fazem diferença

> Uma coluna, teclado certo em cada campo, botões fáceis de tocar e Pix com botão de copiar: o que priorizar no checkout para celular.

Na maior parte das lojas brasileiras, a maioria das visitas vem do celular. Ainda assim, muitos checkouts são desenhados e testados no computador e só depois "adaptados" para a tela pequena. O resultado são botões apertados, teclados errados e páginas que exigem zoom.

Desenhar o checkout pensando primeiro no celular muda as prioridades. Este artigo reúne as práticas que mais fazem diferença.

## Uma coluna, sem distrações

No celular, o checkout deve ter uma única coluna. Campos lado a lado ficam estreitos demais e dificultam o toque. Também vale remover o que tira o comprador do fluxo:

- Menu de navegação completo.
- Rodapé com dezenas de links.
- Banners promocionais e pop-ups.

O cabeçalho pode ter apenas o logotipo e uma indicação de compra segura.

## O teclado certo para cada campo

Um detalhe que poucos lojistas notam é o tipo de teclado que aparece em cada campo. Usar os atributos corretos evita que o comprador precise alternar entre letras e números:

- `type="email"` para e-mail.
- `type="tel"` para telefone.
- `inputmode="numeric"` para CEP, CPF, CNPJ e número do cartão.

Além disso, o atributo `autocomplete` permite que o navegador preencha nome, e-mail, telefone e endereço automaticamente.

## Toques, não precisão

Botões e campos precisam ter área de toque confortável, com altura suficiente e espaço entre eles. Caixas de seleção pequenas e links de texto colados uns nos outros geram toques errados.

O botão principal, de avançar ou finalizar, deve ocupar toda a largura da tela e ficar fácil de alcançar com o polegar.

## Resumo do pedido sempre acessível

No computador, o resumo fica numa coluna lateral. No celular, ele precisa de outro tratamento. Uma solução comum é um resumo recolhido no topo, mostrando o total e abrindo os itens com um toque. Assim, o comprador confere o valor sem rolar até o fim.

## Pix pensado para quem está no celular

Quem paga com Pix no celular precisa copiar o código e colar no aplicativo do banco. O QR Code, nesse caso, é pouco útil. Algumas práticas ajudam:

- Botão de "copiar código" grande e com confirmação visual.
- Instruções curtas sobre como pagar.
- Página de pagamento que atualiza sozinha quando o Pix é confirmado, sem o comprador precisar voltar e recarregar.

## Velocidade importa mais no celular

Conexões móveis são instáveis. Um checkout pesado, com muitos scripts de terceiros, demora a carregar e a responder. Revise:

- Scripts de rastreamento e chat que não precisam carregar no checkout.
- Imagens grandes no resumo do pedido.
- Chamadas que travam a página enquanto o frete é calculado.

## Erros visíveis

No celular, uma mensagem de erro no topo da página pode ficar fora da tela. Mostre o erro ao lado do campo e role a página até ele quando necessário.

## Teste no seu próprio aparelho

A forma mais simples de encontrar problemas é comprar na sua loja pelo celular, com 4G, de vez em quando. Teste com Android e iPhone, se possível, e com diferentes formas de pagamento.

## Perguntas frequentes

### Como fazer aparecer o teclado numérico no CEP e no CPF?

Use o atributo inputmode="numeric" nesses campos. Para telefone, use type="tel", e para e-mail, type="email".

### QR Code ou código copia e cola no celular?

No celular, o código copia e cola é mais útil, porque o comprador não consegue escanear a própria tela. Dê destaque ao botão de copiar.