Prancha 02 / 06
Linha de serviço 01
Design, construção e lançamento
Estático por padrão

Sites corporativos

Um site corporativo é a primeira coisa que um comprador sério verifica. Construímos o seu da mesma forma que uma empresa de produto constrói o próprio: desenhado do zero para a sua marca, compilado em HTML estático, servido a partir de uma rede global de borda, testado em cada tamanho de tela e escrito para ser encontrado.

Iniciar um projeto

ou escreva para [email protected]

Renderização

HTML estático, sem servidor em tempo de execução

Entrega

Rede global de borda da Cloudflare

Acessibilidade

WCAG 2.2 AA, verificado em cada página

Idiomas

Tantos quantos você precisar

Rastreamento

Nenhum script de terceiros por padrão

Hospedagem

Nós hospedamos e operamos, por mês

Entregáveis

O que um site da Whitewater inclui

Todo projeto entrega a mesma substância. O design e as palavras mudam de cliente para cliente; o piso de engenharia não muda.

Um design system construído para a sua marca

Se você já tem uma marca, é dali que o design parte. Um logotipo, uma paleta, um manual de marca, uma tipografia licenciada: trabalhamos a partir do que existe e o estendemos para tudo o que um site precisa e que um manual de marca nunca cobre, como uma escala tipográfica de verdade, um ritmo de espaçamento, uma grade de layout, um estado para cada elemento interativo e um esquema escuro que combina com a marca em vez de brigar com ela. Se ainda não existir um sistema de marca, desenhamos um do zero.

De qualquer forma, o resultado é autoral, feito para você, e registrado como código: sem tema, sem construtor de páginas, sem kit de componentes reaproveitado do último projeto. É por isso que dois sites que construímos nunca se parecem.

O esquema de cores escuro é desenhado junto com o claro, e não invertido no final, para que um visitante que usa o celular no modo escuro veja uma página bem pensada, não uma versão desbotada.

Páginas escritas para a busca que um comprador realmente faz

Uma página por intenção, nas palavras que o seu mercado usa. Os títulos respondem perguntas em vez de apenas decorar o layout, e os links internos deixam a hierarquia clara tanto para quem lê quanto para os robôs de busca. Páginas rasas não ranqueiam e não convertem, então cada página carrega a substância que a sua função exige e para por aí.

Um caminho de contato que realmente funciona

O formulário é HTML simples que envia para um endpoint serverless no mesmo domínio. Ele é protegido por um desafio Cloudflare Turnstile, um campo honeypot oculto e uma checagem de tempo de preenchimento, e envia a partir de um domínio verificado, para que o contato chegue à caixa de entrada, não à pasta de spam.

Um visitante cujo envio é rejeitado vê um erro honesto e um endereço de e-mail, nunca uma página de agradecimento para uma mensagem que foi descartada silenciosamente.

Toda página em todo idioma que você atende

Cada idioma recebe rotas de verdade e texto de verdade, com o conjunto de hreflang, a URL canônica autorreferente e a direção de texto correta tratados em cada página. Este próprio site é a prova: ele existe em oito idiomas.

Imagens e tipografia resolvidas em tempo de build

As fotos são redimensionadas, convertidas para um formato moderno e identificadas por hash de conteúdo durante o build, e então servidas a partir do seu próprio domínio. As fontes da marca são recortadas para os alfabetos que os seus idiomas exigem e hospedadas no próprio site, sem pedidos a fontes de terceiros e sem deslocamento de layout enquanto a fonte carrega.

Hospedagem, deploys e uma suíte de testes que os controla

Nós hospedamos e operamos o site finalizado por uma mensalidade: a plataforma de borda, os certificados, o domínio de envio, os deploys e o monitoramento. O site é código padrão, guardado em um repositório com checagens automatizadas e um deploy em um único comando, e os testes não são decoração: acessibilidade, paridade entre idiomas, cabeçalhos de segurança, higiene de metadados e integridade de links rodam a cada mudança, e uma checagem que falha bloqueia o deploy.

Relançamento

Substituindo um site que você já tem

A maioria dos sites corporativos não é um primeiro site. O seu já ranqueia para algo, já reúne links de lugares que você já esqueceu, e já tem páginas que um cliente marcou como favorita. Um relançamento que ignora isso pode desfazer anos de tráfego acumulado em uma tarde, então a migração é planejada como parte da construção, não improvisada no dia do lançamento.

Um inventário antes de qualquer coisa ser desenhada

Listamos toda URL que o site atual publica, tirada do seu sitemap, dos seus links internos, dos logs do servidor ou do CDN, e do histórico do Search Console quando você o tem. Cada URL recebe então uma decisão: mantida no mesmo endereço, movida, fundida a uma página mais forte, reescrita ou aposentada de propósito.

As páginas que já conquistaram atenção são protegidas primeiro. Se uma página rasa e esquecida é secretamente a razão de metade dos seus contatos chegarem, isso aparece no inventário, não depois de já ter sido apagada.

Conteúdo migrado com o sentido intacto

Textos, imagens, documentos e downloads passam página por página. Onde o volume justifica, roteirizamos a importação, e ainda assim lemos o resultado depois: uma migração automatizada que bagunça uma tabela, perde um nível de título ou derruba um texto alternativo custa mais para consertar do que economizou. Onde as palavras ainda funcionam, nós as mantemos, porque um relançamento não é uma licença para reescrever tudo só por reescrever.

O trabalho independe da plataforma. Seja o site atual rodando em WordPress, em um construtor de sites hospedado, em um sistema de conteúdo sob medida que ninguém mais mantém, ou em HTML escrito à mão há uma década, o conteúdo é tratado como conteúdo e reconstruído na nova estrutura em seus próprios termos.

Um mapa de redirecionamentos, escrito e testável

Todo endereço que muda recebe um redirecionamento permanente para a página equivalente mais próxima. Nunca um redirecionamento genérico para a página inicial, que os buscadores leem como uma exclusão silenciosa de tudo o que você tinha. Páginas fundidas apontam para a página que as absorveu, e uma página aposentada aponta para o pai mais próximo que seja genuinamente útil para quem seguiu o link antigo.

O mapa é um arquivo revisável no repositório, para que você possa lê-lo antes da virada em vez de confiar que ele existe. Depois do corte, solicitamos toda URL antiga e confirmamos tanto o código de status quanto o destino, e os redirecionamentos permanecem para sempre, não só por uma temporada.

O que aproveitamos, e o que descartamos de propósito

Aproveitado: o domínio, o conteúdo que ainda funciona, as imagens que você possui, o seu sistema de marca, o endereço para onde vai o e-mail do formulário, as contas de analytics ou anúncios que você realmente usa, e toda URL que conseguimos manter sem forçar a nova estrutura.

Descartado de propósito: páginas duplicadas competindo entre si pela mesma busca, páginas que ninguém abre há um ano, embeds e scripts de rastreamento cujos relatórios você não lê mais, e plugins cuja única função era remendar a plataforma antiga. Toda remoção é uma linha no inventário com uma razão ao lado, então nada desaparece por acidente e você pode vetar qualquer uma delas.

A virada, e as semanas depois dela

O novo site fica no ar em um endereço de prévia bem antes da virada, então nada é visto pela primeira vez no dia do lançamento. No corte, movemos o DNS, deixamos o host antigo acessível até a mudança se propagar por completo, verificamos o mapa de redirecionamentos, confirmamos que o e-mail do formulário está chegando, enviamos o novo sitemap e notificamos os endpoints de indexação instantânea para que os buscadores rastreiem de novo em dias, não na próxima vez que passarem por aqui.

Depois, observamos. Os resultados de busca se movem por algumas semanas depois de qualquer relançamento, enquanto os buscadores rastreiam e reavaliam o site de novo: algumas buscas se estabilizam mais altas, outras caem antes de se recuperar. Acompanhamos os fundamentos com você, ou seja, páginas indexadas, saúde dos redirecionamentos, Core Web Vitals e as buscas que realmente importam para o negócio, e dizemos o que vemos, incluindo quando a resposta honesta é que nada precisa ser feito.

O que não vamos fazer é prometer um número. Uma migração cuidadosa protege o que você já conquistou e dá ao conteúdo melhor uma chance justa de competir. Quem garante o resultado de um relançamento está apostando com o seu tráfego.

Engenharia

Como é construído

A stack é deliberadamente enxuta. Menos peças em movimento significa menos coisas quebrando às duas da manhã, e um site que outro desenvolvedor ainda vai entender daqui a três anos.

Estático por padrão

As páginas são compiladas em HTML antes de qualquer visitante chegar. Não há servidor de aplicação no caminho da requisição, nem consulta a banco de dados bloqueando a primeira renderização. Conteúdo, navegação e metadados vivem no próprio HTML, então um robô de busca e uma pessoa com uma conexão móvel fraca recebem a mesma página.

Reforço, não dependência

O JavaScript é adicionado onde ele se justifica, restrito ao único componente que precisa dele. Desligue-o e a página ainda se lê, a navegação ainda funciona e o formulário ainda envia.

Recursos tratados uma única vez

Imagens, fontes e estilos são processados em tempo de build e servidos com cabeçalhos de cache imutável sob um hash de conteúdo. Visitas repetidas quase não baixam nada, e um novo deploy nunca serve um recurso desatualizado.

Deploys que podem ser revertidos

Cada mudança é um commit. A integração contínua constrói o site, roda toda a suíte de testes e só então publica na borda. Se algo estiver errado, a versão anterior está a um revert de distância.

Fig. 1 A página como um desenho: viewport, título, ação principal, meta de contraste.

Busca

Construído para ser encontrado

Para a maioria das empresas, a busca orgânica é a principal forma pela qual um novo cliente chega. Isso torna a busca um requisito de construção, não algo pensado depois por uma agência separada.

Estrutura em primeiro lugar. Uma página por intenção de busca, com títulos que respondem à pergunta que o usuário digitou e links internos que deixam a hierarquia legível.
Higiene do cabeçalho em toda página. Um título e uma meta descrição únicos, exatamente uma URL canônica, e cartões sociais que aparecem corretamente quando alguém cola o link em uma conversa.
Dados estruturados a partir do conteúdo visível. As marcações de organização, serviço e trilha de navegação são geradas a partir da mesma fonte que a página renderiza, então o que um buscador lê nunca diverge do que uma pessoa vê.
Índice legível por máquina. Um índice de sitemap cobrindo todo idioma, um arquivo robots que aponta para ele, e um llms.txt para os robôs que hoje resumem sites para pessoas.
Indexação instantânea. Todo deploy em produção notifica o endpoint do IndexNow com as URLs alteradas, para que os buscadores que o suportam saibam de uma mudança em minutos, não apenas na próxima varredura.
Core Web Vitals por construção. Entrega estática, recursos imutáveis com hash e nenhum script de terceiros são o caminho mais curto para bons dados de campo, que são, eles próprios, um fator de ranqueamento.
O que não prometemos. Ninguém pode vender uma posição no ranking. Construímos a base técnica e editorial que permite que um bom conteúdo compita, medimos os resultados depois do lançamento e dizemos claramente quais partes estão fora do nosso controle.

Acessibilidade

Usável por todos, não só pela maioria

Acessibilidade é, ao mesmo tempo, uma exposição legal, um sinal de busca e um sinal de qualidade. Tratamos o WCAG 2.2 nível AA como o piso mínimo e o verificamos de forma mecânica, em vez de apenas afirmar isso em um folheto.

Auditado por página, por tamanho de tela, por esquema de cores. Uma auditoria automatizada roda em toda página construída nas larguras de celular, tablet e desktop, nos modos claro e escuro, e qualquer violação reprova o build.
Suporte real a teclado. Um link de pular navegação como primeira parada, um indicador de foco visível em todo lugar, e uma ordem de tabulação que segue a página.
Contraste nos dois esquemas. As cores de texto e de interface são verificadas contra seus fundos reais, no modo escuro com o mesmo rigor do claro.
Movimento que pede permissão. Tudo que se move é desativado para um visitante cujo sistema pede movimento reduzido, e um quadro estático é mostrado no lugar.
Marcação semântica. Landmarks, um título por nível em ordem, campos de formulário rotulados e texto alternativo descritivo em toda imagem.
Alvos confortáveis. Todo elemento interativo ultrapassa o mínimo de 24 pixels, verificado por medição, não a olho nu.
Mãos no teclado também. As checagens automatizadas pegam muita coisa, mas não tudo, então também navegamos o site pelo teclado e o lemos em telas pequenas antes de publicar.

Idiomas

Um site, todo idioma que você atende

Um widget de tradução colocado sobre uma página em inglês é invisível para os buscadores e desagradável de ler. Suporte multilíngue de verdade é uma decisão de roteamento e de redação, tomada desde o início.

Uma rota por idioma. Toda página existe em sua própria URL em cada idioma, para que cada uma possa ser indexada, referenciada e compartilhada.
Sinais corretos. Um conjunto de hreflang com um x-default em toda página, além de uma URL canônica que aponta para a própria página, não para o original em inglês.
Direita para a esquerda tratada no layout. A folha de estilo usa propriedades lógicas do início ao fim, para que o árabe espelhe toda a composição em vez de remendá-la.
Escrito, não traduzido por máquina. O texto é redigido em cada idioma na voz da marca. Texto gerado automaticamente soa como texto gerado automaticamente, e o comprador percebe.
Fontes dimensionadas com honestidade. As fontes são recortadas por alfabeto, e texto fora do latino usa a fonte do sistema em vez de enviar megabytes a um celular.
Um seletor de idioma que não precisa de JavaScript. Links simples entre a mesma página em cada idioma, sem cookie e sem redirecionamento por suposição.

Segurança e e-mail

Protegido, e o e-mail chega

Um site institucional é uma superfície de ataque pequena que vale a pena manter pequena, e um formulário de contato não serve para nada se o e-mail cair na caixa de spam.

Uma política de segurança de conteúdo de verdade. Nenhuma permissão para script embutido sem controle: cada script embutido é fixado por hash e todo o resto é recusado, o que impede que um script injetado sequer seja executado.
Cabeçalhos de transporte e de navegador desde o primeiro dia. HSTS, bloqueio de detecção de tipo de conteúdo, política de referenciador e proteção contra enquadramento já vêm no primeiro deploy.
Defesas em camadas no formulário. Um desafio Turnstile para confirmar que é humano, um honeypot para bots ingênuos, uma checagem de tempo de preenchimento para os rápidos, e validação no servidor com limite de tamanho em cada campo.
Entregabilidade verificada no deploy. O domínio de envio é verificado como parte da publicação, para que um formulário que parou de entregar seja detectado por nós, não por um cliente que nunca recebeu resposta.
Nenhum rastreador por padrão. Nada de terceiros carrega a menos que você peça, e a única analítica que instalamos é sem cookies, o que também significa nenhum banner de consentimento.
Segredos ficam fora do repositório. As chaves vivem em um cofre de segredos e chegam ao site em produção como variáveis de ambiente, nunca como um arquivo no git.

Hospedagem e mudanças

Quem opera, quem escreve, e como isso muda

Desde o lançamento, nós hospedamos e operamos o site por uma mensalidade: a plataforma de borda, os certificados, o domínio de envio pelo qual o e-mail do seu formulário viaja, os deploys, e o monitoramento que nos avisa quando algo precisa de atenção. As mesmas pessoas que desenharam e construíram o site são as que cuidam da sua operação, então uma dúvida sobre uma página e uma dúvida sobre a hospedagem vão para o mesmo lugar e recebem a mesma resposta.

O que isso não é: nenhum construtor de páginas proprietário, nenhuma licença por usuário e nenhum editor no qual você aluga assentos. O site é código padrão com seus próprios testes, o seu domínio continua sendo seu domínio, e o seu conteúdo e a sua marca são seus. Quando o seu contrato inclui essa opção, você pode levar o software e hospedá-lo por conta própria, e a forma como ele é construído torna isso um movimento direto, não um resgate. É uma opção que colocamos por escrito quando você quer, não o combinado padrão.

Para a maioria das empresas, o padrão é o melhor negócio: uma única equipe que conhece o código, uma única linha mensal na fatura, e nenhum terceiro no meio de um problema. Se você preferir operar por conta própria, nos diga enquanto o escopo ainda está sendo escrito, não depois do lançamento.

Quem escreve as palavras

Nós escrevemos, a menos que você prefira o contrário. A redação faz parte da construção: rascunhamos a estrutura das páginas, os títulos e o texto a partir do material que você já tem e da forma como você mesmo descreve o seu trabalho, em propostas, em e-mails comerciais e em conversas.

O que você fornece é a substância e a aprovação: serviços, as afirmações que você está disposto a sustentar, nomes, endereços, qualquer coisa que precise ser exata. Não vamos inventar uma estatística, um depoimento ou um estudo de caso para preencher um espaço. Se você tem um redator, ou prefere escrever você mesmo, envie as palavras e nós desenhamos em torno delas.

Mudando o conteúdo depois do lançamento

Uma mudança de conteúdo é uma edição em um arquivo de texto no repositório, seguida do mesmo ciclo que toda mudança percorre: uma branch, um endereço de prévia para conferir, toda a suíte de testes, e um deploy que reverte em uma única etapa. Nada é digitado direto no site em produção, então uma edição ruim não consegue derrubar uma página.

Na prática, você nos envia a mudança e ela passa por esse ciclo, o que costuma ser o caminho mais rápido para as pequenas. Quando o seu contrato coloca os seus próprios desenvolvedores dentro do código, eles trabalham exatamente da mesma forma, que é para isso que servem a configuração documentada e os testes. E se a sua equipe genuinamente precisa publicar várias vezes por semana sem um desenvolvedor, diga isso logo: essa é uma construção diferente, com uma camada de edição, e preferimos definir esse escopo do que fingir que um site estático é um jornal.

O ciclo pós-lançamento, etapa por etapa Software além do site

Comece um projeto de site [email protected]

Conte o que o site precisa fazer e quem ele precisa convencer. Fale conosco pelo formulário de contato ou em [email protected], e você vai ouvir de volta alguém que constrói de verdade.