Como hospedar trabalho da faculdade online

Final do semestre, prazo apertado, e o professor pediu para entregar o trabalho de Desenvolvimento Web com um link funcional. Você fez o site no VS Code, testou no navegador, está tudo bonito. Mas como transforma isso num link que o professor consegue acessar?

Se essa é sua situação, respira fundo. Em 2 minutos você resolve. E se quiser saber mais sobre hospedagem para estudantes, temos um guia completo.

O que você precisa ter

Antes de começar, confirme que você tem:

• Os arquivos do seu projeto (HTML, CSS, JS, imagens)
• Um arquivo chamado index.html como página principal
• Tudo funcionando quando você abre o index.html no navegador

Se o site funciona local, ele vai funcionar online. Simples.

Passo a passo: do VS Code ao link

1. Organize seus arquivos

Sua pasta de projeto provavelmente tem essa estrutura:

meu-trabalho/
  index.html
  style.css
  script.js
  images/
    logo.png
    banner.jpg

Confirme que o index.html está na raiz da pasta (não dentro de uma subpasta).

2. Compacte em ZIP

Selecione todos os arquivos e pastas dentro do projeto, clique com o botão direito e escolha "Compactar para arquivo ZIP" (ou "Enviar para > Pasta compactada" no Windows).

Atenção: compacte o conteúdo da pasta, não a pasta em si. O index.html deve estar na raiz do ZIP.

3. Suba no Htmly

Acesse htmly.com.br e arraste o arquivo ZIP para a área de upload.

Nem precisa criar conta para testar — o upload anônimo publica seu site por 1 hora. Mas se quiser um link permanente para a entrega, crie uma conta grátis (leva 10 segundos com Google).

4. Copie o link e entregue

Você recebe um link tipo meutrabalho.htmly.com.br. Cole no formulário de entrega, mande por e-mail pro professor, ou compartilhe onde for necessário.

Usando IA para criar o trabalho

Se o professor não proibiu explicitamente, ferramentas de IA podem acelerar (muito) a criação do seu projeto. Veja como estudantes estão usando:

ChatGPT e Claude para gerar HTML

Você pode pedir para o ChatGPT ou Claude criar a estrutura inteira do site. Um prompt eficiente para trabalhos acadêmicos:

"Crie um site HTML/CSS responsivo sobre [tema do trabalho]. Inclua: header com título e menu de navegação, seção de introdução, 3 seções de conteúdo com texto e imagens placeholder, seção de referências bibliográficas, e footer com meu nome e RA. Use design moderno com fontes do Google Fonts. Tudo em um único arquivo HTML."

A IA entrega o código pronto. Você revisa, ajusta o conteúdo com as informações reais do trabalho, e sobe no Htmly. O processo inteiro leva menos de 30 minutos.

Dica importante: revise e personalize

Não entregue o código cru da IA. Professores experientes reconhecem patterns genéricos. Personalize as cores, troque os textos placeholder pelo conteúdo real, adicione imagens relevantes e ajuste o layout para refletir o tema do seu trabalho. A IA é o ponto de partida, não o produto final.

Ferramentas visuais como Bolt e v0

Se você não quer mexer em código, ferramentas como Bolt.new e v0.dev geram projetos visuais completos. Exporte os arquivos estáticos e suba no Htmly. Confira também nossos templates prontos — muitos servem como base para trabalhos acadêmicos.

Para mais detalhes sobre como publicar sites criados com IA, leia nosso guia O ChatGPT criou meu site — e agora?.

Dicas para um trabalho nota 10

Teste em outro dispositivo

Antes de entregar, abra o link no celular. Muitos professores testam responsividade. Se o site não funciona bem no mobile, volte e ajuste.

Verifique os caminhos dos arquivos

O erro mais comum: caminhos absolutos no código. Se no seu HTML tem algo como:

<link rel="stylesheet" href="C:\Users\Fulano\Desktop\trabalho\style.css">

Isso não vai funcionar online. Use caminhos relativos:

<link rel="stylesheet" href="style.css">

Visualize antes de publicar

Use o HTML Preview para testar seu código antes de subir. Cole o HTML, veja o resultado, corrija se precisar. Temos outras ferramentas gratuitas que podem ajudar no desenvolvimento.

Escolha um slug descritivo

Com uma conta gratuita, você pode personalizar o endereço. Em vez de a7f3x9.htmly.com.br, use algo como portfolio-joao.htmly.com.br. Fica mais profissional na entrega.

Valide o HTML no W3C Validator

Antes de entregar, passe seu código pelo W3C Markup Validator. Muitos professores verificam se o HTML é válido e semântico. Erros como tags não fechadas, atributos inválidos ou estrutura incorreta podem custar pontos.

Adicione comentários no código

Professores gostam de ver que você entende o que fez. Adicione comentários explicando as seções principais:

<!-- Seção de navegação principal -->
<nav class="navbar">
  ...
</nav>

<!-- Grid de produtos com Flexbox -->
<section class="produtos">
  ...
</section>

Inclua uma seção de referências

Se o trabalho exige fundamentação, adicione um footer ou seção final com as referências bibliográficas formatadas em ABNT. Isso mostra capricho e atenção aos detalhes acadêmicos.

Construindo um portfólio com seus trabalhos

Cada trabalho da faculdade que você publica é uma peça de portfólio. Em vez de deixar os projetos morrerem no disco local depois da nota, mantenha-os online e use como vitrine profissional.

Por que isso importa

Quando você sair da faculdade e começar a buscar estágio ou emprego, recrutadores vão perguntar: "me mostra algo que você fez". Ter 5 ou 10 projetos publicados com links funcionais é muito mais convincente do que dizer "fiz uns trabalhos na faculdade mas não tenho mais os arquivos".

Como organizar

Crie um site principal que funcione como índice do seu portfólio. Use um dos nossos templates como base — tem opções de portfólio prontas para personalizar. Nesse site, coloque links para cada trabalho publicado:

• portfolio-joao.htmly.com.br (site principal)
• trabalho-webdev.htmly.com.br (projeto de Desenvolvimento Web)
• trabalho-ihc.htmly.com.br (projeto de IHC)
• trabalho-mobile.htmly.com.br (projeto de Mobile)

Evolua os projetos antigos

Depois que receber a nota, continue melhorando os projetos. Adicione funcionalidades, melhore o design, corrija bugs. Isso mostra evolução para recrutadores e te dá prática real de desenvolvimento.

Com o plano gratuito do Htmly, você pode manter 1 site ativo. Para manter vários projetos simultaneamente, confira os planos pagos — o Starter (R$ 12/mês) suporta até 5 sites com editor inline para editar direto no navegador.

Perguntas frequentes

Preciso pagar para hospedar meu trabalho?

Não. O plano gratuito do Htmly permite hospedar 1 site com subdomínio .htmly.com.br, SSL e CDN inclusos — tudo que você precisa para entregar seu trabalho com link funcional.

O link expira?

Upload anônimo (sem conta): expira em 1 hora. Com conta gratuita: o site fica no ar enquanto sua conta existir. Para entrega de trabalho, crie a conta — é grátis.

O professor vai ver alguma propaganda?

No plano gratuito, aparece um pequeno badge "Made with Htmly" no canto do site. Não interfere no conteúdo do trabalho. Nos planos pagos, o badge é removível.

Posso editar depois de publicar?

Sim. Suba uma nova versão do ZIP e o site é atualizado no mesmo link. Nos planos pagos, você pode editar direto no navegador com o editor inline.

Funciona com React, Vue ou outro framework?

Se o projeto gera arquivos estáticos (HTML/CSS/JS), sim. Faça o build (npm run build), compacte a pasta de output (geralmente dist/ ou build/) e suba no Htmly.

Posso usar IA para criar o trabalho e hospedar aqui?

Sim. Você pode gerar o HTML/CSS/JS com qualquer IA (ChatGPT, Claude, Gemini), salvar como arquivo .html e subir direto no Htmly. O fluxo é o mesmo de qualquer projeto estático. Só lembre de revisar e personalizar o conteúdo antes de entregar.

Por que não usar GitHub Pages?

GitHub Pages funciona, mas exige que você:

1. Crie uma conta no GitHub
2. Crie um repositório
3. Faça commit e push dos arquivos
4. Configure o Pages nas settings

Se você já sabe Git, ótimo. Se não sabe, são 20 minutos aprendendo algo que não faz parte da entrega. Com o Htmly, são 30 segundos.

Publique seu trabalho agora: acesse a melhor hospedagem de sites, suba o ZIP e entregue com link funcionando.

Leia também:

• Como publicar um site HTML em 10 segundos
• Upload HTML e ganhe um link em 10 segundos
• O ChatGPT criou meu site — e agora?