Criar um site

Comece por descrever o que pretende criar no ChatGPT ou no Codex. Depois, reveja a primeira versão e aperfeiçoe-a à medida que avança.

Começar a utilizar sites

Abra o ChatGPT na Web ou na aplicação para computador. Inclua a palavra "website" no seu pedido ou mencione @Sites para iniciar o fluxo de trabalho de sites. Por exemplo, pode pedir um painel de pedidos de projetos para uma equipa de operações:

Pedido:

Build a project request dashboard website for my operations team. Let team members submit requests, see who owns each one, update the status, and filter the list. Require people to sign in with their workspace account, and keep the request data saved between visits.

O painel é apenas um exemplo. Pode adaptar o fluxo seguinte ao site que pretende criar.

1. Descreva o site

   Diga ao ChatGPT a quem se destina o site e o que pretende que as pessoas façam. Partilhe os documentos ou dados necessários. Para um painel de pedidos, pode incluir exemplos de pedidos, responsáveis e etiquetas de estado.

2. Reveja o site

   Experimente as ações que pediu e compare o conteúdo e os resultados com os seus materiais de origem. No caso do painel, pode submeter um pedido, alterar o respetivo estado ou filtrar por responsável. Confirme como o site utiliza e guarda as informações.

3. Aperfeiçoe o site

   Diga ao ChatGPT o que pretende alterar e partilhe uma captura de ecrã ou um site de referência, se isso ajudar. No caso do painel, pode pedir: «Coloque os filtros de responsável e de estado acima da lista de pedidos.»

4. Faça a gestão e a partilha do site

   Volte a sites para reabrir ou editar o site. Antes de publicar, siga as verificações de revisão e partilha. Escolha quem pode visitar o site e verifique a ligação publicada como um dos visitantes previstos.

Guardar registos e progresso

Guardar uma versão do site preserva o seu conteúdo, design e comportamento. Os pedidos dos visitantes, as atualizações de estado, os ficheiros carregados e o progresso pessoal precisam de armazenamento próprio. Diga ao ChatGPT ou ao Codex o que deve ser guardado e quem deve poder ler ou alterar essas informações.

Para registos partilhados ou pessoais, peça regras de acesso aplicadas no servidor. Verifique se as atualizações continuam guardadas após recarregar a página e utilize contas separadas para confirmar o acesso de cada pessoa. Ocultar um botão não protege o registo subjacente.

Para os ficheiros fornecidos, especifique se o site deve utilizar uma cópia ou atualizar os dados a partir da origem. Verifique quando as informações foram atualizadas pela última vez.

Para opções de armazenamento e início de sessão, consulte Dados e ligações.

Sugestões para criar o seu site

• Utilize os seus materiais de origem. Anexe os ficheiros, ligações, definições e fórmulas que o site deve utilizar. Peça ao ChatGPT ou ao Codex para assinalar informações em falta em vez de as inventar.
• Descreva os estados vazios e de erro. Explique o que os visitantes devem ver quando uma pesquisa não tem resultados, um formulário está incompleto ou uma aplicação ligada está indisponível. Inclua uma forma de tentar novamente ou corrigir o problema.
• Partilhe uma referência visual. Anexe uma captura de ecrã ou uma ligação para uma página e indique os detalhes que pretende utilizar, como cartões compactos ou a posição da pesquisa. Inclua as cores da marca, os tipos de letra ou as orientações de escrita aplicáveis.
• Planeie a utilização em telemóveis. Descreva como os cartões, tabelas e formulários se devem adaptar a um ecrã estreito. Verifique se a navegação, os filtros e os controlos dos formulários continuam utilizáveis sem deslocamento horizontal.
• Identifique os dados de exemplo. Se o conteúdo final ainda não estiver pronto, peça registos de exemplo identificados como tal. Substitua-os antes de partilhar o site.
• Faça alterações específicas. Peça uma alteração de cada vez e indique o que deve ser mantido. Por exemplo, mova um filtro sem alterar os registos guardados, as regras de acesso ou as ações existentes. Experimente a interação afetada após cada alteração.

A galeria de Sites apresenta exemplos de aplicações Web que pode criar com Sites.

Exemplos de pedidos

Para um centro de recursos, comece com um pedido breve:

Pedido:

Build a resource hub website where project leads can search our kickoff resources by task. Use the resource list I attach. Save a version without deploying it so I can review it.

Pode desenvolver esse pedido com ações dos visitantes, regras de pesquisa e preferências de design:

Pedido:

Build a resource hub website for project leads preparing a kickoff. Use the resource list I attach, with its titles, descriptions, task labels, and source links.

Visitor actions:

- Choose a task, such as preparing an agenda.
- Search within that task's resources.
- Select a result to open its source link.

Search rules:

- When the search is empty, show all resources for the selected task.
- If no task is selected, show the full list.
- If there are no matches, offer a way to clear the filters and show the help contact from my list.
- Flag entries with missing titles or links for my review.
- Search filters can reset when the visitor returns.

Design preferences:

- Use a white background and dark text. Keep descriptions to one sentence, with a layout that works on a phone.
- If I provide a reference screenshot, use it for the search placement and compact resource cards.
- If I provide a brand guide, use its accent color.

Save a version without deploying it so I can review the layout and try the search.

Para um projeto existente, peça ao ChatGPT para verificar a compatibilidade e prepará-lo para publicação:

Pedido:

Deploy this project with sites. Check whether it is compatible, make any required changes, and give me the deployment URL.

Quando um site precisar de guardar registos ou ficheiros carregados, inclua essa informação no seu pedido:

Pedido:

Add player scores and avatar uploads to this game. Keep the scores and uploaded avatars between visits.