Práce s webem přes MCP

Přes napojení Claude přes MCP můžete web stavět a spravovat tak, že Claudovi zadáváte úkoly česky — kód psát nemusíte. Tahle kapitola shrnuje doporučené pořadí kroků, co po Claudovi chtít (příklady promptů) a na co si dát pozor.

Jak to funguje

• Web se skládá ze stránek; každá má verzi preview a published a změna se projeví až po publikaci.
• Styleguide drží barvy, fonty a typografii centrálně.
• Assety jsou obrázky a soubory v knihovně médií.
• Symboly jsou znovupoužitelné bloky (hlavička, patička).

Vy Claudovi řeknete, co chcete; on to přes MCP provede a výsledek by měl ověřit screenshotem.

1. Ověřte, na kterém webu jste

Vždy první krok. Účet vidí víc webů, ale MCP je připojené k jednomu — kdyby to byl špatný, upravovali byste cizí web.

„Na jakém webu jsem teď připojený? Vypiš název a doménu.“

Než pokračujete, potvrďte, že je web správný.

2. Založení webu

„Založ nový web s názvem [Název].“

Nový web dostane náhledovou adresu *.web.solidpixels.com a výchozí paletu barev, kterou většinou nahradíte vlastní. Vlastní doménu řešte až po naplnění obsahu.

3. Styleguide (barvy, fonty, typografie)

Nastavte co nejdřív, ať se obsah rovnou staví na váš design. Připravte si barvy v hex kódu, nadpisový a textový font a velikosti písma.

„Nastav styleguide: primární #…, akcent #…, pozadí #…, text #…. Nadpisový font …, textový …. Ať jsou to design tokeny.“

Upozornění

U nového webu nechte Clauda nejdřív smazat výchozí barvy a teprve pak nastavit vaše. U existujícího klientského webu naopak nic nemažte — jen doplňte chybějící. Po nastavení si nechte ověřit uložené hodnoty („Vypiš aktuální barevné tokeny.“).

4. Assety (obrázky, loga)

Assety musí být na webu dřív než stránky, které je používají.

• Loga a fotky od klienta nahrajte v administraci (Média/Assets) a pak řekněte: „V assetech je logo logo.svg, vlož ho do patičky.“
• Obrázky z webu klienta: „Stáhni loga z těchto URL a nahraj je do médií: […].“

Obrázky vkládejte odkazem na soubor, ne natvrdo. Checklist: logo (SVG), inverzní logo, hero fotky, favicon, OG obrázek (1200×630).

5. Stránky a obsah

U složitějších webů si nechte nejdřív udělat návrh v HTML (rychlá iterace) a po schválení ho Claude přenese na stránku.

„Založ stránku ‚Služby’ na /sluzby a přidej hero sekci s nadpisem …, podnadpisem … a tlačítkem ‚Kontakt’.“

SEO: „Nastav u stránky titulek, popis a OG náhled.“

6. Hlavička, patička a opakující se bloky

Udělejte z nich symboly, ať je spravujete z jednoho místa.

„Udělej z hlavičky a patičky symboly.“

Poznámka

Po úpravě symbolu publikujte celý web — propíše se na všechny stránky.

7. Formuláře

Formulář se vloží jako blok a každé odeslání se ukládá jako submission (viz Data z odeslaných formulářů).

Upozornění

Když formulář přestavíte, může se změnit interní název pole a navázané napojení pak píše špatnou hodnotu. Po úpravě si nechte ověřit reálné hodnoty v odeslání („Zkontroluj u posledních registrací, jestli se ukládá správný název akce.“).

8. Publikace a kontrola

• Jedna stránka: „Publikuj stránku [X].“
• Celý web (po změně designu, symbolu nebo kódu): „Publikuj celý web.“

Vždy si nechte ověřit výsledek — a to i na mobilu, ne jen na desktopu:

„Udělej screenshot [URL] a zkontroluj, že to sedí.“

9. Přesměrování a skrytí stránek

„Skryj stránku /registrace/xyz a přesměruj tu URL na homepage.“

Skrytí = odpublikování stránky; přesměrování je 301 redirect. Nechte si potvrdit, že se stav opravdu změnil.

Časté úpravy — hotové prompty

Chci…	Řekněte Claudovi
Změnit text	„Na stránce [X] změň text ‚…’ na ‚…’.“
Přidat logo do mřížky	„Přidej logo logo.svg z assetů do partnerské mřížky.“
Změnit barvu značky všude	„Změň akcentovou barvu na #… v tokenech.“
Přerovnat mřížku	„Uprav partnerskou mřížku na 7 log na řádek.“
Uzavřít registraci	„Zastav registraci na [akci]: text ‚obsazeno’, skryj formulář, přesměruj URL na homepage.“
Zkontrolovat formuláře	„Vypiš posledních 20 odeslání a jejich hodnoty.“
Ověřit vzhled	„Udělej screenshot [URL].“

Tip

Buďte konkrétní — uveďte URL stránky, přesný text a jak prvek poznat („tlačítko pod hero sekcí“). Čím přesnější zadání, tím míň iterací.

Na co si dát pozor

• „Změna se neprojevila.“ Skoro vždy chybí správná publikace: design, symbol nebo code block → publikujte celý web, ne jen stránku.
• Barvy jen jako tokeny, nikdy natvrdo do obsahu — jinak je klient nemůže měnit z panelu.
• Kontrolujte i mobil — nejen desktop; některé chyby jsou vidět jen na jednom z nich.
• Nevratné akce (mazání stránek, přepis obsahu) si nechte nejdřív popsat a potvrďte je. Redirecty a odpublikování jsou vratné, mazání ne.
• Ověřujte screenshotem, nespoléhejte jen na „hotovo“.

Co MCP zatím neumí

• Hromadný import celého HTML webu naráz — stránky se staví po blocích.
• Nahrání souborů z disku přímo přes chat — assety nahrajte v administraci, nebo dejte Claudovi veřejnou URL ke stažení.
• Nastavení DNS u registrátora — Claude doménu přidá a řekne záznamy, DNS nastaví člověk nebo IT.
• Placení, účty, hesla a platební údaje — vždy člověk ve svém rozhraní, nikdy Claude.
• Finální napojení na externí služby (Google Sheet, e-mailing, platby) — přihlášení a autorizaci účtu odklikne člověk.

Checklist nového webu

1. Ověřit správný web.
2. Smazat výchozí barvy → nastavit vlastní tokeny (barvy, fonty, typografie).
3. Nahrát assety (loga, hero, favicon).
4. Hlavička + patička jako symboly.
5. Homepage → klíčové podstránky → doplňkové.
6. Formuláře + napojení (a ověřit reálná data).
7. SEO a OG u stránek, favicon.
8. Publikovat celý web + screenshot (desktop i mobil).
9. Doména + DNS + primární doména.