Jdeme stavět web
Doména běží, hosting je zřízený, e-mail funguje. Máte prázdný pozemek se zavedenou vodou. Teď na něm postavíme dům.
Celý díl stojí na jedné větě, kterou si zapamatujte: čím víc toho Claudovi dáte, tím lepší web z toho vyleze. Nedostatek podkladů nejde nahradit šikovností — ani lidskou, ani strojovou.
Rolujte dolů
Klíč od staveniště.
Aby Claude mohl web na server opravdu nahrát, potřebuje se tam dostat. Slouží k tomu FTP účet — přihlašovací jméno a heslo k místu, kde web bydlí. Najdete ho v účtu u poskytovatele, obvykle je jeden založený rovnou.
123456.w87.wedos.net.w123456.www.SFTP místo FTP, pokud ho poskytovatel nabízí. Je to totéž, jen šifrované — heslo pak neletí internetem načteno. Claude umí obojí, řekněte mu, co máte.
Heslo si do formuláře napíšete vy. Claude ho do prohlížeče nezadává. Přístupy k webu jsou klíče od dílny — neposílejte je mailem ani chatem.
Web vzniká u vás, ne na serveru.
Nestaví se přímo na internetu. Nejdřív vznikne složka u vás v počítači, kde se dá zkoušet, mazat a předělávat, aniž by to kdokoli viděl. Na server jde až hotová věc.
Claude si tu složku založí sám. Stačí mu říct, jak se projekt jmenuje. Vypadá to takhle:
Rozdělení má smysl: podklady jsou vaše, web je výsledek. Podklady na server nikdy nejdou — nikdo nemusí vidět váš původní dokument.
Seznam toho, co tam bude.
Než začnete něco psát, sepište si z čeho se web skládá. Je to pár řádků a ušetří to spoustu předělávání.
Skoro každý web má tyhle díly. Projděte si je a škrtněte, co nepotřebujete:
Tenhle seznam dejte Claudovi hned na začátku. Ví pak, kolik toho staví.
Pište surově. Uhladí to.
Nejčastější zdržení: člověk se snaží text napsat „hezky" a týden ho piluje. Není to potřeba. Napište to tak, jak byste to řekli člověku přes stůl — Claude z toho udělá text na web.
Nejrychlejší cesta je nadiktovat to do telefonu a poslat jako hlasovou zprávu nebo přepis. Dvacet minut mluvení nahradí tři večery psaní.
Zdržuje
„Ještě to učešu, pak to pošlu." Za měsíc pořád nic.
Funguje
Poslat rovnou i s překlepy. Web stojí za dva dny a text se doladí na hotovém.
Jediné, co má být přesné, jsou čísla a jména — ceny, telefon, adresa, otevírací doba. Ta si Claude nesmí domýšlet a taky nebude.
Logo a první obrázek.
Dvě věci rozhodují o tom, jak web na první pohled působí: logo a obrázek, který člověk uvidí jako první.
Logo pošlete v nejlepší kvalitě, jakou máte — čím větší, tím líp, zmenšit se dá vždycky, zvětšit ne. Když ho nemáte, není to překážka; dá se začít bez něj.
Řekněte u něj i to, co znamená. U webu, ze kterého je tenhle snímek, klientka vysvětlila, že strom je zároveň ženská silueta, kořeny znamenají mikrobiom a koruna plíce. Ta věta pak dala tvar celému webu.
Podklad, jak přišel. Z něj pak vznikla barevnost i motiv celého webu.
Fotky z mobilu jsou moc velké.
Snímek z telefonu má klidně pět megabajtů. Na webu je to problém — stránka se načítá pomalu a lidem na mobilních datech nenaběhne vůbec.
Nemusíte s tím nic dělat. Claude obrázky zmenší sám, jen mu to řekněte. Zmenšuje se rozměr i kvalita, oko rozdíl nepozná, ale soubor spadne na desetinu.
Zmenši obrázky do složky pro web: šířka do 1600 px, kvalita ať drží, ale ať mají do 300 kB. Originály nech být.
Originály si vždycky nechte. Zmenšený obrázek už nikdy nebude zase velký. Proto ta oddělená složka na podklady z druhého kroku.
1600 px na šířku, 283 kB. Na obrazovce k nerozeznání od originálu, na mobilu naskočí hned.
Řekněte, jak to má působit.
Tady se rozhoduje, jestli web bude vypadat jako váš, nebo jako každý druhý. Nemusíte umět navrhovat — stačí popsat dojem.
Vzor funguje líp než dlouhý popis. Jeden odkaz s větou „líbí se mi, jak se to postupně rozsvěcuje" řekne víc než odstavec přídavných jmen.
A nebojte se říct, že se vám něco nelíbí. První verze bude vedle — to je normální a počítá se s tím. Web se ladí, nevzniká hotový.
Čím víc dat, tím lepší web.
Tohle je jádro celého dílu. Claude nestaví z ničeho — staví z toho, co jste mu dali. Když dostane tři věty, postaví web na tři věty.
Málo podkladů
„Dělám poradenství, udělej web."
Vznikne stránka, která by mohla být kohokoli. Nic na ní není vaše.
Hodně podkladů
Texty + ceník + 10 fotek + logo + „líbí se mi tenhle web"
Vznikne web, u kterého lidi řeknou „to jsi celý ty".
Neexistuje „moc informací". Když něčeho bude přebytek, Claude to nechá stranou. Chybějící věc si ale nevymyslí — zeptá se, nebo tam prostě nebude.
Z počítače na server.
Web je hotový u vás. Teď se přesune na to místo, co jste si objednali v pátém dílu — a tady se hodí ten přístup z prvního kroku.
Claude se připojí, nahraje soubory a ověří, že tam opravdu jsou. Vy u toho nemusíte být.
Nahraj hotový web na server do složky www a pak ověř, že se stránka opravdu načítá.
Pozor na jedno: web patří do složky www, ne o úroveň výš.
Když se nahraje jinam, adresa dál ukazuje úvodní stránku poskytovatele a člověk si myslí,
že se nahrávání nepovedlo. Povedlo — jen o patro vedle.
Ten zámeček u adresy.
Web běží, ale prohlížeč u adresy píše „Nezabezpečeno". Nevypadá to dobře a některé prohlížeče lidi rovnou varují. Chybí certifikát — potvrzení, že stránka je opravdu ta, za kterou se vydává.
Dobrá zpráva: je zdarma a zapíná se jedním tlačítkem. U poskytovatele hledejte HTTPS nebo Let's Encrypt a rychlé nastavení. Claude vám to najde a nastaví.
A teď to, co málokdo řekne dopředu: certifikát nenaskočí hned. Vydává se řádově desítky minut. Ještě zrádnější je, že v účtu může svítit „aktivní", zatímco prohlížeč pořád hlásí nezabezpečeno.
Co si myslíte
„V administraci je hotovo, ale nefunguje to. Něco jsem pokazil."
Co se děje
Certifikát je vydaný, ale server ho ještě nenasadil. Chce to počkat, ne překlikávat.
U webu z tohohle návodu to trvalo třicet minut od žádosti po funkční zámeček. Dejte tomu hodinu a teprve pak řešte, že něco nehraje.
„Vypadá dobře" není hotovo.
Než web pustíte mezi lidi, projděte si ho jako návštěvník. Ne jako autor — autor vidí, co tam chtěl mít, ne co tam je.
Ten mobil myslím vážně. Většina lidí uvidí váš web na telefonu, ne na počítači. Co je na velké obrazovce hezké, může být na mobilu nečitelné — a poznáte to jedině tak, že se podíváte.
A je venku.
Pět dílů, a máte vlastní web na vlastní adrese, s vlastním e-mailem a zámečkem u adresy. Bez jediného řádku kódu a bez měsíčního poplatku za stavitele.
Web postavený přesně touhle cestou si můžete prohlédnout tady: michaelatrsova.cz. Vznikl za jedno dopoledne z dokumentu s texty a jednoho loga.
A hlavně: web nikdy není hotový. Přibude fotka, změní se ceník, napadne vás lepší věta. To je v pořádku — od téhle chvíle si to můžete kdykoli změnit.
Klikněte na obrázek a prohlédněte si ten web naživo. Výsledek celé série — z dokumentu s texty a jednoho loga za jedno dopoledne.
Co všechno sehnat, než se začne stavět
Projděte to jako nákupní seznam. Čím víc odškrtnutého, tím lepší web z toho vyleze.
Texty
| Čím se zabývám | Jednou větou, jak byste to řekli sousedovi. |
| O mně | Kdo jste, jak dlouho to děláte, čím jste prošli. |
| Co nabízím | Služby nebo zboží. Klidně po bodech, nemusí to být souvislé. |
| Jak to chodí | Co se stane, když si vás někdo objedná. Krok za krokem. |
| Ceník | Přesná čísla. Tohle si Claude nevymyslí a nemá. |
| Kontakt a doba | Telefon, mail, adresa, otevírací hodiny. Taky přesně. |
Obrázky
| Logo | V nejlepší kvalitě, jakou máte. Zvětšit později nejde. |
| Hlavní obrázek | První věc, kterou návštěvník uvidí. |
| Fotka vás | Lidé kupují od člověka. Ať je vidět obličej. |
| 5–10 fotek z práce | Prostředí, výsledky, zboží. Z mobilu stačí. |
| Co logo znamená | Jedna věta. Umí dát tvar celému webu. |
Návrh a přístupy
| Barvy | I slovy. Nebo „vezmi je z loga". |
| Vzor | Odkaz na web, který se vám líbí. Nejsilnější podklad ze všech. |
| Co nechcete | Taky se počítá. |
| FTP nebo SFTP | Server, jméno, heslo, složka. Z účtu u poskytovatele. |
Když něco nefunguje
| Adresa ukazuje stránku poskytovatele | Web je nahraný jinam než do www. |
| „Nezabezpečeno" u adresy | Certifikát ještě nenaskočil. Dejte tomu hodinu. |
| V administraci hotovo, v prohlížeči ne | Server certifikát ještě nenasadil. Počkat, ne překlikávat. |
| Stránka se načítá pomalu | Velké obrázky. Nechte je zmenšit. |
| Na mobilu to vypadá jinak | Řekněte to Claudovi i s tím, co přesně vadí. Vyfoťte to. |
| Něco na webu nesedí | Řekněte to. První verze bývá vedle, tak to má být. |
Zadání, které vám web postaví
Vložte do Claude Code, až budete mít podklady ve složce. Provede vás zbytkem sám.
Postav mi web. Podklady mám ve složce, kterou ti ukážu. Nejdřív si je projdi a řekni mi, co v nich chybí — ptej se po jedné otázce. Zajímá mě, jestli máš dost na hlavičku, o mně, nabídku, ceník a kontakt. Ceny, telefon, adresu a otevírací dobu ber doslova z podkladů. Nic si nedomýšlej. Když něco nevíš, zeptej se. Obrázky zmenši pro web, ale originály nech být. Až budeš mít první verzi, ukaž mi ji dřív, než ji dáš na server. Počítám s tím, že to napoprvé nebude sedět. Pak ji nahraj přes FTP na hosting, zapni certifikát a ověř, že web opravdu jede — i na mobilu.
Bezpečně
Přístupy k webu jsou klíče od dílny. Heslo si zadáváte sami, neposíláte ho mailem ani chatem. Kdo je má, může na webu všechno.
Používejte SFTP, když ho poskytovatel nabízí. Je to totéž co FTP, jen šifrované.
Nerozumíte něčemu? Zeptejte se svojí AI
Máte ji přímo v počítači — nemusíte nic hledat na internetu ani čekat na odpověď v diskuzi. Zkopírujte tohle a doplňte, kde jste se zasekli:
Čtu 8. díl návodu na aitop.cz — „Jdeme stavět web". Nerozumím tomu, jak … Vysvětli mi to jednoduše, jako bych to viděl poprvé, a zeptej se mě, co přesně mi nejde.
Ale ptejte se s rozumem. Claude umí mluvit stejně sebejistě i tehdy, když si vymýšlí — a pozná se to špatně, protože to zní dobře. Takže: vysvětlení „proč to tak je“ od něj berte, ale konkrétní číslo, adresu nebo cenu si ověřte u zdroje. A když si nebudete jistí, zeptejte se ho rovnou:
Tohle víš jistě, nebo hádáš?
Na tuhle otázku odpovídá překvapivě poctivě. Je to jediný návyk z celého návodu, který vám zůstane napořád — a platí u každé AI, ne jen u téhle.