- Por que meu arquivo CSS ou minha imagem não aparecem na prévia?
- Porque a prévia só enxerga o código que você colou, não a pasta de onde ele veio. Uma linha como <link href="style.css"> ou <img src="images/logo.png"> aponta para um arquivo ao lado do seu HTML no seu computador, e esse arquivo não veio junto. Caminhos relativos são resolvidos a partir deste site, onde esses arquivos não existem. Duas soluções: cole a folha de estilo dentro de uma tag <style> no head, ou troque o caminho por um endereço completo que comece com https://. Imagens pequenas também podem ir inline como URIs data:.
- É seguro colar HTML que tem JavaScript?
- Mais seguro do que abrir na maioria dos sites de visualização. A prévia roda num quadro isolado (sandbox) com origem opaca própria, o que significa que um script dentro dele não consegue ler esta página, os cookies dela ou o armazenamento dela, nem mandar a aba para outro lugar. É por isso que try{parent.document.title='x'} falha dentro da prévia. Mas o sandbox não deixa código malicioso inofensivo: um script ainda pode abrir pop-ups e carregar coisas de outros servidores. Não cole código que você nunca rodaria na sua própria máquina.
- Meu HTML é enviado para algum lugar?
- Não. O código vai da caixa de texto direto para um quadro na mesma aba, e abrir um arquivo lê o arquivo no seu aparelho. Nada é enviado aos nossos servidores nem salvo. Uma coisa a saber: se o seu HTML aponta para recursos externos, como fontes da web, um script de CDN ou um pixel de rastreamento num modelo de e-mail, o navegador busca esses recursos nos servidores deles quando a prévia renderiza, exatamente como faria se você abrisse o arquivo localmente.
- Por que meu script dá erro sobre localStorage ou cookies?
- Por causa do sandbox. Uma página com origem opaca não tem armazenamento próprio, então ler localStorage, sessionStorage, IndexedDB ou document.cookie gera um SecurityError em vez de devolver dados. É a mesma barreira que mantém o código colado longe deste site. Se a sua página depende de armazenamento, confira o layout aqui e teste a lógica de armazenamento abrindo o arquivo por um servidor local, como npx serve ou python -m http.server.
- Posso usar para conferir um e-mail em HTML antes de enviar?
- Para uma primeira olhada, sim. Cole o modelo, confira na largura Celular e pegue tabelas quebradas, imagens faltando e títulos quebrando linha. O que você vê é como um navegador moderno desenha, o que fica perto do Apple Mail e da maioria dos webmails. Não é como todas as caixas de entrada desenham. O Outlook para Windows desktop usa há tempos o motor de layout do Microsoft Word, que ignora muito CSS, e o Gmail reescreve alguns estilos. Mande um teste para você mesmo antes de um envio grande.
- O que as larguras Tablet e Celular mudam de verdade?
- Elas definem o quadro da prévia com 768 ou 375 pixels CSS de largura, o breakpoint comum de tablets em pé e a largura de muitos celulares. Dentro do quadro, a viewport tem mesmo essa largura, então regras @media (max-width: 600px) são ativadas e larguras em porcentagem encolhem. Não é um emulador completo de aparelho: o user agent continua o do seu navegador de desktop, não há eventos de toque e a densidade de pixels não muda. Quando o quadro é mais largo que a sua tela, ele rola de lado dentro da própria caixa.
- Por que a atualização ao vivo desligou sozinha?
- Seu HTML passou de 1 MB. Cada redesenho reconstrói a página inteira, e nesse tamanho fazer isso a cada pausa na digitação deixa a aba travando. A prévia passa a esperar você: edite o quanto quiser e aperte Executar. Você pode ligar a Atualização ao vivo de novo se quiser. Código colado e arquivos podem ir até 5 MB; acima disso, cole a parte em que você está trabalhando.
- Minha página travou a prévia. Como recupero?
- Provavelmente algo na página entrou num loop, como while(true){} ou um timer que fica acrescentando elementos. Aperte Limpar para descartar a página. Se a aba estiver ocupada demais para responder, recarregue, o que para todos os scripts da página. Corrija o loop antes de colar de novo. Navegadores podem rodar um quadro isolado na mesma thread desta página, então um script descontrolado pode deixar os dois lentos.
- Posso abrir um arquivo .html no celular?
- Sim. Toque em Abrir arquivo e escolha o arquivo no app Arquivos, no Google Drive ou nos downloads. Arquivos .html, .htm e .txt de até 5 MB funcionam, e o arquivo é lido no seu celular, não enviado. Isso ajuda quando alguém manda um anexo .html por e-mail e o celular só oferece mostrar como código puro. Em telas pequenas, a prévia fica abaixo do código, então role para baixo para ver a página.
