Preencha antes de enviar
[nome do servidor][nome completo][especialização, ex.: consultor de exportação][região que atendo, ou "online"][serviços][experiência real e os setores em que trabalhei; não invente][telefone][e-mail][domínio][tema 1][tema 2][endereço ou "nenhum"]
Use minha conexão com o Opus Growth para isso. Se você não encontrar a ferramenta de que precisa, procure entre as ferramentas do Opus Growth (com search_tools, se estiver na sua lista); se não conseguir acessar as ferramentas de forma alguma, não adivinhe, me avise.
Crie para mim um site de especialista em estilo editorial no meu servidor de hospedagem Opus Growth [nome do servidor]. Eu: [nome completo], [especialização, ex.: consultor de exportação], [região que atendo, ou "online"]. Serviços: [serviços]. Experiência: [experiência real e os setores em que trabalhei; não invente]. Telefone: [telefone], e-mail: [e-mail], domínio: [domínio]. Temas dos dois primeiros guias: [tema 1], [tema 2]. Se meu escritório recebe visitas, o endereço: [endereço ou "nenhum"].
O site deve parecer uma publicação que comprova expertise por meio da escrita, não um folheto. Os guias ficam no centro do site, porque são o que os leitores e as respostas de IA citam.
A direção de design é editorial:
1. Tipografia: uma serifa com personalidade da Fontshare para os títulos (ex.: Zodiak 700 e 400 itálico) e uma sans tranquila para a interface e os textos curtos (ex.: Author 400 e 600). Corpo do artigo na serifa a 19 pixels, entrelinha 1,7, no máximo 68 caracteres por linha.
2. Cor: fundo em papel creme, texto em tinta escura, um cinza quente secundário e um único destaque escuro (ex.: vinho). O destaque aparece apenas nos kickers, na letra capitular e nos filetes das citações em destaque.
3. Grade: 12 colunas; uma capa assimétrica 7 para 5 na página inicial, com filetes verticais finos entre as colunas. Sem sombras nem cantos arredondados.
4. Elemento de assinatura: um cabeçalho com filete duplo como o título de um jornal (com uma linha fina de data acima) e, nos artigos, uma grande letra capitular na cor de destaque mais uma citação em destaque na margem.
5. Movimento: nenhum.
Páginas e seus schemas:
1. index.html (capa): um título e um resumo cujo primeiro parágrafo responde "quem é você, quem você ajuda e com o quê", a imagem e o título do artigo principal, uma coluna lateral com o outro artigo, caixas de serviços e de autor, uma citação em destaque e uma faixa "como eu trabalho". WebPage e Person.
2. hizmetler.html: uma seção por serviço; o primeiro parágrafo diz para quem é e quando, seguido de etapas numeradas e da entrega escrita. Um Service por serviço, com o Person autor como provider.
3. hakkimda.html: experiência real, princípios de trabalho (sem resultados garantidos), como os artigos são produzidos e a política de fontes. ProfilePage com mainEntity Person (jobTitle, knowsAbout, worksFor #org).
4. rehber/index.html: artigos do mais recente ao mais antigo, com data e autor. CollectionPage e ItemList (numberOfItems).
5. rehber/[artigo].html: pelo menos 700 palavras, um primeiro parágrafo que responde diretamente à pergunta, uma hierarquia de H2, uma tabela com thead e th scope onde ajudar, pelo menos uma citação em destaque, de dois a quatro links internos e fontes no final. No topo, um link do autor e as datas de publicação e de última atualização em <time>. Article (headline, image, datePublished, dateModified, author via @id para o Person, publisher #org). Se usar valores de exemplo, diga que são fictícios.
6. iletisim.html: ContactPage. 7. kvkk.html (aviso de privacidade) e 404.html.
Se o escritório não recebe visitas, defina localBusiness: false em site.config.js; Organization mais Person bastam.
Regras técnicas. Siga-as à risca, porque os gates abaixo medem exatamente isto:
1. Configuração. Execute scaffold_site primeiro como prévia, mostre-me a lista de arquivos e instale com confirm=true depois que eu aprovar. Em seguida, leia site_design_guide e site_seo_guide por inteiro. Antes de escrever qualquer código, escreva a direção em _kaynak/ART.md (sensação, combinação de fontes, cores com taxas de contraste, grade, elemento de assinatura, decisão sobre movimento, lista de páginas) e mostre-me.
2. Elimine o JavaScript. Nenhuma página deste site carrega JavaScript. Remova de todas as páginas o script cdn.tailwindcss.com, a linha tailwind.config, as tags GSAP, ScrollTrigger, SplitText, Lenis e Swiper e as tags de script motion.js, chrome.js e site.config.js; apague assets/chrome.js e assets/motion.js. Mantenha assets/site.config.js, mas apenas como fonte de marca, contato e seo para o seo-stamp.mjs; ele nunca é carregado no navegador.
3. Menu e rodapé são HTML estático. Os componentes <site-nav> e <site-footer> são desenhados por JavaScript, então rastreadores de busca e de IA não conseguem ver o menu, os links internos nem os dados de contato. Escreva o cabeçalho em _kaynak/ust.inc e o rodapé (nome, endereço, telefone, e-mail, todos os links das páginas, aviso de privacidade, "Web: Opus Growth") em _kaynak/alt.inc. Use a extensão .inc para que seo-stamp e html-validate não tratem os fragmentos como páginas. Toda página leva os marcadores <!-- ust:bas --><!-- ust:son --> e <!-- alt:bas --><!-- alt:son -->. Depois escreva um script Node sem dependências com site_write_file em _kaynak/parca-bas.mjs: ele carimba os dois fragmentos entre os marcadores em cada arquivo HTML, adiciona aria-current="page" ao link do menu da página atual e reescreve o sitemap.xml usando o dateModified do JSON-LD de cada página como lastmod (ignorando 404 e páginas noindex). Construa o menu mobile sem JavaScript usando <details><summary>Menu</summary>; os menus de desktop e mobile são dois elementos <nav> separados com aria-labels diferentes.
4. Hospede as fontes você mesmo. Este site usa duas famílias e no máximo cinco arquivos; as fontes do título, do resumo em itálico e do corpo aparecem todas na primeira tela, então faça preload das quatro. Na demonstração, o preload de apenas duas empurrou o CLS de um artigo longo para 0,24 e o Performance mobile para 86; o preload das quatro deu CLS 0 e Performance 99. Baixe o CSS da Fontshare (https://api.fontshare.com/v2/css?f[]=family@400,600&display=swap, código de peso 401 para itálico) com site_fetch para _kaynak/fontshare.css, leia-o com site_read_file e pegue apenas as URLs woff2 da família que você pediu; o serviço às vezes acrescenta uma família que você não solicitou. Baixe cada woff2 com site_fetch para assets/fonts/. Coloque as regras @font-face (font-display: swap) dentro de assets/app.css, porque o design-check.mjs só procura uma fonte personalizada nesse arquivo. Não use as padrão Inter, Roboto, Poppins ou Montserrat.
5. Compile o Tailwind. O assets/app.css vira a fonte do Tailwind: @tailwind base; @tailwind components; @tailwind utilities; no topo, depois @font-face, o anel de foco, o skip link, uma regra prefers-reduced-motion e suas próprias classes de componente dentro de @layer components. Nunca dê a uma classe de componente o nome de um utilitário do Tailwind (list-item, table, grid, container, hidden e assim por diante), porque o conflito quebra o layout silenciosamente após a compilação. Escreva tailwind.config.js na raiz (content: ["./*.html", "./**/*.html", "./_kaynak/*.inc"], cores e fontFamily). Execute "npx --yes tailwindcss@3 -i assets/app.css -o assets/site.css --minify" com site_run_command e background=true, e aguarde com site_command_status. O <head> de toda página contém, nesta ordem: um único <link rel="stylesheet" href="/assets/site.css">, depois uma linha de preload para cada arquivo de fonte usado na primeira tela (título, destaque e corpo; as="font" type="font/woff2" crossorigin). Linhas de preload colocadas antes da folha de estilo atrasam o CSS e aumentam o LCP; uma fonte da primeira tela sem preload troca tarde, desloca a página e aumenta o CLS, e <link rel="icon" href="/assets/img/favicon.svg" type="image/svg+xml">. A linha do favicon é obrigatória: sem ela o navegador pede /favicon.ico, recebe um 404, e o erro no console reduz o Best Practices.
6. Imagens. Baixe as fotos com site_fetch usando resize e image_format="webp" em várias larguras (480, 800, 1200 e 1600 para a imagem da primeira tela, 480, 800 e 1200 para as demais; qualidade entre 60 e 75, menor para fotos detalhadas). Toda <img> tem srcset, sizes compatíveis com o layout real, width e height (CLS zero) e um texto alt significativo e honesto. fetchpriority="high" vai apenas na imagem que o Lighthouse aponta como elemento LCP, e essa imagem não é lazy; todas as outras imagens usam loading="lazy". Se o elemento LCP for texto, nenhuma imagem recebe fetchpriority. Prepare também assets/img/logo.png, um assets/img/og.jpg de 1200x630 e assets/img/favicon.svg.
7. Regras de HTML (padrões do html-validate). <!DOCTYPE html> em maiúsculas; nenhum atributo style inline (incluindo o style="background:var(--brand)" do kit, use uma classe); em vez de espaços simples no texto dos links tel:; um type em todo <button>; sem espaços no fim das linhas; tabelas com <thead>, <tbody> e th scope. Links dentro de parágrafos são sublinhados; links de menu, rodapé, breadcrumb e botões têm área de toque de pelo menos 44x44 pixels (min-h-[44px] min-w-[44px]).
8. Dados estruturados. Preencha o bloco seo em site.config.js (siteUrl, description, logo, imagem og, tipo de negócio, campos de endereço) e execute "node seo-stamp.mjs" com site_run_command; ele carimba Organization, WebSite e, quando couber, um subtipo de LocalBusiness, além de tags canonical e OG. Adicione à mão o schema específico de cada página: em toda página um nó WebPage com @id (ou AboutPage, ContactPage, CollectionPage, ProfilePage), datePublished e dateModified, isPartOf #site, about #business ou #org, e breadcrumb apontando para um BreadcrumbList; mais um Service por serviço, Person e ProfilePage para o autor, ItemList no índice de guias e Article em cada guia. Escreva cada nó em seu PRÓPRIO bloco <script type="application/ld+json"> e não use um wrapper @graph, porque o seo-check.mjs só lê o @type de nível superior e não enxerga um BreadcrumbList dentro de @graph. Ligue os nós com @id. Nunca invente horário de funcionamento, coordenadas, avaliações, comentários, prêmios, número de clientes ou certificados; deixe de fora os campos desconhecidos.
9. Acesso para IA. Escreva o robots.txt: o site inteiro aberto, apenas /_kaynak/ fechado; Allow: / para GPTBot, OAI-SearchBot, ChatGPT-User, ClaudeBot, Claude-User, Claude-SearchBot, PerplexityBot, Perplexity-User, Google-Extended, Applebot-Extended e Bingbot; sua decisão sobre o CCBot com o motivo como comentário; a linha Sitemap por último. Adicione llms.txt na raiz: um resumo correto do negócio em duas frases, as páginas importantes com uma linha cada e os dados de contato. Escreva o 404.html (noindex, com os marcadores de cabeçalho e rodapé).
10. Redação. Cada página tem pelo menos 150 palavras de texto original dentro de <main>, e o primeiro parágrafo responde diretamente à pergunta principal da página. Os títulos têm de 48 a 60 caracteres, as descrições de 145 a 158, únicos em cada página. Sem travessões longos nem curtos, sem slogans batidos, sem promessas vazias. Se algo no site não for real, diga claramente que é fictício.
Gates. Após cada alteração, execute estes com site_run_command nesta ordem e só avance quando cada um estiver limpo:
1. node _kaynak/parca-bas.mjs, node seo-stamp.mjs, a compilação do Tailwind (de novo se você adicionou classes).
2. node seo-check.mjs: 0 erros e 0 avisos. Se avisar "gövde kısa" (corpo curto demais), acrescente texto real, não enrolação.
3. node design-check.mjs: 0 erros. O único aviso permitido é "Hiç hareket yok" (sem movimento); é uma escolha deliberada para a experiência de leitura, então explique o motivo no relatório.
4. npx --yes html-validate "**/*.html": 0 erros.
5. Veja todas as páginas com site_preview em view="mobile" e view="desktop", e confira também a página inicial em 360 e 768 pixels. Corrija qualquer overflow horizontal, título apertado ou alvo de toque menor que 44 pixels e confira de novo.
6. Meça todas as páginas com core_web_vitals em strategy="mobile" e strategy="desktop", depois audite a página inicial e a página mais longa com seo_audit. Meta: no mobile, Accessibility, Best Practices e SEO 100 e Performance de pelo menos 95; no desktop, as quatro de pelo menos 95. Nenhuma requisição pode sair do site. Se o LCP estiver alto, use resources=true para achar o arquivo que o está atrasando: geralmente linhas de preload colocadas antes da folha de estilo, ou fetchpriority dado a uma imagem que não é o elemento LCP. Se o CLS passar de 0,1, procure uma fonte da primeira tela sem preload.
Não dê o trabalho por concluído até que tudo isso passe.
Depois de publicar, envie https://[domínio]/sitemap.xml com gsc_submit_sitemap e verifique a página inicial com gsc_url_inspect. Se não houver uma propriedade do Search Console, avise-me; não tente conectar uma por conta própria.
Relatório de entrega: uma tabela com as quatro pontuações do Lighthouse e o LCP por página no mobile e no desktop, o resultado dos quatro gates, o motivo de qualquer aviso do design-check, uma lista das informações do site que são fictícias ou estão faltando e o que ainda preciso fazer (Business Profile, fotos reais, horário de funcionamento e assim por diante).