Botões Archives | Camaraux®️

Wireframe de um editor que compara alterações individuais salvas automaticamente com um conjunto de mudanças aguardando uma ação explícita.

Autosave ou botão Salvar: qual usar?

Lucas Camara 30/08/2026

Autosave e botão Salvar resolvem problemas diferentes. Use o contexto, o risco e a necessidade de revisão para escolher o comportamento mais claro.

Wireframe de uma linha de carrinho com controle de quantidade, remoção e recuperação.

Carrinho de compras: como alterar quantidade e remover itens

Lucas Camara 25/08/2026

Como permitir que clientes alterem quantidades e removam itens do carrinho com atualização imediata, feedback, desfazer e acessibilidade.

Wireframe de uma interface com uma ação de exclusão destacada e indicação de recuperação

Como tratar ações destrutivas

Lucas Camara 13/08/2026

Combine risco, reversibilidade e alcance para decidir quando confirmar, desfazer ou executar uma ação destrutiva.

Interface com cartões de conteúdo e um único botão flutuante posicionado em uma área segura

Quando usar botão flutuante

Lucas Camara 13/08/2026

Use botão flutuante apenas para uma ação primária, frequente e claramente identificável, sem cobrir conteúdo nem competir com a navegação.

Botão em estado de processamento dentro de um formulário wireframe

Como evitar múltiplos cliques durante o carregamento

Lucas Camara 13/08/2026

Mostre que a primeira ação foi recebida, evite reenvios durante o processamento e proteja o servidor contra efeitos duplicados.

Wireframe com uma ação principal destacada e duas ações secundárias menos enfatizadas.

Onde posicionar ações primárias e secundárias?

Lucas Camara 13/08/2026

Posicione a ação principal onde ela seja mais percebida e mantenha as ações secundárias próximas, mas visualmente subordinadas e consistentes.

Ilustração minimalista comparando um botão com ícone e rótulo visual a um botão compacto somente com ícone

Botões devem ter ícone e texto?

Lucas Camara 13/08/2026

Combine ícone e texto quando a ação precisar de clareza. Use apenas ícone quando o significado for reconhecível, consistente e acessível.

Wireframe de formulário com botão de ação destacado e fluxo concluído

Como escrever textos de botões

Lucas Camara 13/08/2026

Aprenda a escrever rótulos de botões claros: use verbos, nomeie o resultado, diferencie ações e preserve a acessibilidade.

Ilustração minimalista comparando um controle com ícone familiar e uma ação que precisa de explicação contextual.

Ícones sem texto: quando podem ser usados

Lucas Camara 12/08/2026

Ícones sem texto podem economizar espaço, mas só funcionam quando a ação é reconhecível, nomeada para tecnologias assistivas e fácil de testar. Veja quando usar e quando manter um rótulo visível.

Ilustração minimalista mostrando a decisão entre um link que leva a outro destino e um botão que executa uma ação local.

Link ou botão: qual usar?

Lucas Camara 12/08/2026

Link navega para um destino; botão executa uma ação. Veja como escolher o elemento certo, preservar acessibilidade e evitar interfaces com semântica enganosa.

Wireframe 2D com um controle neutro e outro com contorno azul de foco de teclado.

Como indicar foco de teclado

Lucas Camara 12/08/2026

Todo controle operável por teclado precisa de um foco visível, contrastante e não encoberto. Veja como indicar esse estado em botões e links.

Miniatura 2D minimalista com três controles de ícone dentro de áreas de toque amplas e separadas.

Alvos de toque: qual deve ser o tamanho mínimo

Lucas Camara 12/08/2026

Alvos de toque precisam combinar tamanho e espaçamento para evitar erros de acionamento. Entenda o mínimo da WCAG e quando projetar áreas interativas maiores.

Interface genérica com botão primário destacado e botão secundário em contorno

Botão primário e secundário: como definir a hierarquia

Lucas Camara 08/08/2026

A hierarquia entre botões primários e secundários ajuda a indicar a ação principal sem transformar toda a tela em chamada para ação. Escolha a ênfase pela prioridade da tarefa, limite o destaque e mantenha as alternativas reconhecíveis.