Úvod » Jak vytvořit webové stránky

Jak vytvořit webové stránky – podrobný návod krok za krokem

Chcete vlastní web s vlastní doménou a bez programování, ale nejste si jistí, jak začít a co všechno je potřeba udělat. Tento detailní návod vás provede celým procesem tvorby webu od úplných základů až po spuštění hotového a funkčního webu.

Kdo si zvládne udělat svůj web?

Všichni kdo máte chuť a čas si vytvořit webové stránky se do tvorby webu můžete pustit. Pomocí redakčního systému si svůj web hravě zvládnete vytvořit. Jestli začínáte a těch peněz na web moc nemáte, za to chuť mít svůj vlastní web máte velikou, doporučuji jít cestou tohoto návodu, kde právě popisuji krok za krokem jak si vytvořti web v redakčním systému WordPress.

Věřím, že nebudete litovat, já tvořím webové stránky s WordPressem od roku 2013 a jsem z něho stále nadšená.

Druhy webových stránek

Základní druhy webových stránek popisuji níže. Jasně, všichni asi víte jaký je rozdíl mezi firemním webem a eshopem, tak si asi myslíte jestli jsem nespadla z višně, že to zde vůbec uvádím, ale co je landing page nebo mikrosite to také víte? V tom totiž často mí klienti tápou a tak jsem si říkala, že když budu tvořit návod jak vytvořit web, tak že to udělám opravdu podrobně a musím to tu tedy zmínit. Mohlo by pro vás být užitečné zjistit co je co a k čemu se to vlastně hodí, tak se na to pojďme podívat.

  • Firemní web – prezentuje firmu, služby a reference. Je to základní komunikační kanál s klienty a ideální prostor pro SEO optimalizaci, získávání poptávek i budování důvěry.
  • Osobní web nebo portfolio – prezentace jednotlivce, vhodný pro freelancery, fotografy, konzultanty či grafiky a další. Umožňuje prezentovat projekty, zkušenosti a kontakty
  • Onepage web/jednostránkový web - vše je uvedeno na jedné stránce např. Hero sekce (úvod, slogan, tlačítko k akci), O mně / O firmě, Služby nebo nabídka, Reference / ukázky, Ceník / FAQ nejčastější dotazy / kontaktní formulář
  • Eshop – katalog produktů nebo online obchod, který umožňuje objednávky a platby. Lze ho snadno postavit například pomocí WordPressu a pluginu WooCommerce.
  • Blog nebo magazín – zaměřený na články, návody a aktuality. Výborně podporuje SEO a přivádí organickou návštěvnost.
  • Landing page – jednostránkový web vytvořený s jasným cílem: registrace/přihlášení, poptávka nebo prodej.
  • Mikrosite – menší web pro konkrétní produkt, službu nebo marketingovou kampaň.
  • Online vizitka – nejjednodušší web, který obsahuje jen kontakty, krátký text s nabídkou služby a třeba odkazy na sociální sítě.

Všechny tyto výše popsané druhy webů zvládnete vytvořit pomocí systému WordPress

Proč tady píšu o WordPressu a uvádím druhy webových stránek, které jsou nejčastější? Protože vám chci vysvětlit, že všechny ty druhy webů, si můžete pomocí WordPressu vytvořit a to i bez kódů, nemusíte tedy umět programovat což je druhá skvělá výhoda WordPressu, ke všemu se dostaneme. Důležité je, abyste pochopili, že je WordPress univerzální nástroj, kterým si vytvoříte jako laici téměř jakýkoli web.

Způsoby jak vytvořit webové stránky

Webové stránky můžete vytvořit několika způsoby – liší se v náročnosti, ceně i svobodě úprav. Základní možnosti jsou:

  1. Online nástroje (buildery) – např. Webnode, Shoptet nejsou moc vhodné pro podnikání, omezené funkce, web nemusí mít vlastní název, na webu se mohou zobrazovat reklamy
  2. WordPress nebo jiný systém – nejrozšířenější varianta pro firmy i jednotlivce, je levný a lze web postavit a upravovat bez programování
  3. Ručně kódovaný web (HTML, CSS, JS) – vhodný pro zkušené vývojáře, takový výsledný web bývá drahý a časově náročný

Jaký systém pro web vybrat?

Způsobů jak vytvořit web je spousta, to vám nebudu nalhávat a podívejte se na internet kolik toho najdete, ale jestli si chcete vytvořit vlastní webové stránky na vlastní doméně a neumíte zrovna programovat (což je skvělé, protože právě pro vás nadšence co si chtějí sami vytvořit svůj web píši tento návod) tak doporučuji vytvořit web v redakčním systému WordPress.

Co je WordPress a jaké jsou jeho výhody si podrobně vysvětlíme níže a věnuji se mu podrobně i v dalších krocích. Informace budou postupně přibývat, abyste o něm věděli vše a naučili se ho plně ovládat, teto návod je právě pro web na WordPressu. Co je důležité u WordPressu, že je to systém který můžete mít zcela zdarma, neplatí se žádné měsíční poplatky a nepotřebujete umět programovat. Jeho vyzkoušení vás tedy nic nestojí (ano musíte si koupit doménu a hosting, abyste si WordPress dali na svůj hosting a tím ten svůj web mohli stavět, ale to jsou jen dvě věci, které k vlastnímu webu potřebujete, bez toho vlak prostě nejede). Navíc hosting můžete pouze "vyzkoušet" vybrala jsem společnost, která nabízí možnost i jen na zkoušku, takže když ho budete objednávat, tak sice si ho musíte zaplatit, ale je možné když byste ho nechtěli, tak jej zrušit a nechat si vrátit peníze.

My si ukážeme nejjednodušší cestu jak mít vlastní web s vlastní doménou a bez programování, takže si vysvětlíme jak postavit web na WordPressu

Co je redakční systém WordPress

WordPress je jednak nejrozšířenější systém pro tvorbu webů bez programování na světě. Používá ho aktuálně více než 40% všech webů. Je zdarma, snadno ovladatelný a umožňuje tvořit a upravovat web právě bez programátorských znalostí.

Vytvoříte s ním téměř jakýkoli web, ať to bude firemní web, osobní web, portfolio, ale i eshop. K WordPressu existuje navíc spousta rozšíření, které seženete zcela zdarma. Já na WordPressu tvořím 99% všech webů co si u mě klienti objednají, protože to teď frčí a je to výhodné. Když si někdo ode mě nechá vytvořit web, tak chce mít tu možnost si web sám/a upravovat. Jednoduše to šetří peníze. Což dříve když se tvořili weby jen, že se to programovalo v HTML, tak jste si jako laik na webu neudělali bez programátora ani ťuk, žádné změny, dnes je to úplně jinak a právě za to může jeden z nejlepších systému a to je WordPress.

Výhody WordPressu:

  • Má snadné ovládání přes webové rozhraní bez programování si naklikáte vlastní web
  • Lehce upravujete web, přidáváte a upravujete texty, obrázky, stránky i menu
  • Zcela bez omezení můžete upravovat vzhled, funkce, počet stránek, nejsou zde omezení jako u jiných platforem
  • Tisíce rozšíření zdarma (pluginů = funkce webu) a šablon (vzhled webu)
  • WordPress je zdarma a je zde dlouhodobá podpora komunity, která WordPress neustále vyvíjí a vylepšuje, když si jej zvolíte máte jistotu, že váš web bude fungovat dlouhodobě

Instalaci WordPressu si podrobně ukážeme v dalších krocích.

Co vše potřebujete k vlastnímu webu

  • Doménu = název webu
  • Hosting = místo kde budou soubory webu uloženy
  • SSL certifikát = zabezpečení webu
  • WordPress = abychom web mohli upravovat bez kódů
  • Vlastní email shodný s názvem domény
  • Texty a obrázky = obsah co bude na webu zobrazen

Co je k webu potřeba a kde to všechno snadno sehnat si ukážeme v dalších krocích, ale ty texty si budete muset vymyslet sami 🙂

Kolik stojí vlastní web

Zajímá vás kolik bude stát vytvoření webu, že? Když byste měli dostatek financí na začátku, tak tady vůbec nejste a nečtete tenhle návod, nebudete se chtít lopotit sami s webem, ale vše si necháte připravit pod nos od někdo, kdo se weby zabývá. S cenou za web, který bude váš a budete si jej moci sami vytvořit a upravovat to není zase tak hrozné, ale něco do toho vložit musíte s tím se smiřte jestli nechcete nějaký pronájem a mít web pod nějakou cizí doménou, což nedoporučuji.

Vybrala jsem nejsnazší cestu a co nejlevnější jak si vytvořit vlastní web svépomocí. Hosting je to nejdůležitější a také nejdražší na celém webu. Ale vlastní web, když neumíte zrovna programovat bez něj nevytvoříte, protože my použijeme k webu WordPress a ten potřebuje kvalitní hosting. Hosting má zásadní vliv na to, jak vám web bude fungovat, jak bude rychlý, jestli bude chod webu bezproblémový a tak na hostingu rozhodně nešetřete, je to naprostý základ a vy na něm budete stavět web a v tom webu budete následně pracovat, takže se vám web nesmí hroutit na jeho základech, kterým je hosting. Ten musí být stabilní a připravený pro web s WordPressem.

Samozřejmě jsou levnější hostingy, ale jestli chcete perfektní hosting pro WordPress, aby vám na něm web šlapal bezproblémově jako hodinky, tak vyberte to co je už ověřené. Předejdete tak spoustě problémů s webem jen kvůli špatnému hostingu, je to zbytečné.

  • Doména stojí 193,60 Kč
  • Za hosting zaplatíte aktuálně 856,68 Kč
  • SSL certifikát dostanete k hostingu zdarma
  • WordPress je zdarma, snadnou instalaci si ukážeme na klik
  • K hostingu, který jsem vybrala získáte neomezeně vlastních emailových schránek
  • Texty, fotky a váš čas

Jak vytvořit vyhledatelný web

Co znamená vyhledatelný web? Je to web, který Google nebo jiný vyhledávač snadno pochopí, zaindexuje (zařadí si ho do své databáze) a nabídne ho lidem, kteří hledají to, co na webu nabízíte. Jak dosáhnout dobré vyhledatelnosti a co promyslet před tvorbou webu? Na všechno se podrobně podíváme během tvorby webu, ale přečtěte si pár základních rad níže ve kterých často chybujete:

Nekopírujte texty, myslete na to, že když budete tvořit texty na web, tak je nesmíte vzít z jiných stránek (zkopírovat je) a dát si je na svůj web. Ne tohle nefunguje. Samozřejmě se můžete jinde inspirovat, ale je třeba psát originálně a pro vaše zákazníky.

Web by měl mít responzivní design, to znamená, že se musí umět správně zobrazit na počítači, tabletu i mobilním telefonu - musí podle velikosti obrazovky upravit vzhled webu. Pokud tomu tak není, tak máte mínusové body. V tohle je WordPress perfektní, protože podporuje responzivní zobrazení.

URL názvy stránek a produktů, než se pustíte do webu je dobré si určit jaké stránky na webu budete mít (např. Úvod, O nás, Služby, Galerie, Reference, FAQ - nejčastější dotazy, Kontakt). A jak se budou stránky nazývat, také jak se budou jednotlivé služby jmenovat, doporučuji nad tím pořádně přemýšlet a zjistit si jak ty služby nebo kategorie výrobků lidé hledají a podle toho si určit název dané stránky. Říká se tomu čisté URL jsou to názvy stránek jako např. https://udelam-web.cz/jak-vytvorit-webove-stranky/ čistá URL je zde /jak-vytvorit-webove-stranky/ dříve se to jmenovalo /p162/ a to už se dnes nedělá, WordPress je na tohle pašák a dokážete s ním snadno ovlivnit jaké URL bude daná stránka mít.

Zmenšujte obrázky, jde to už i online. Když budete na web nahrávat obrázky, tak buď si obrázky předem zmenšete nebo si nastavíte na WordPressu určité rozšíření, aby za vás obrázky zmenšovalo automaticky, zase je to velká výhoda WordPressu, že to jde i automaticky. Proč obrázky nenahrávat ve velké velikosti? Protože ty obrázky pak zpomalují web a to nechceme, pomalý web nemají vyhledávače rádi, ale ani zákazníci.

Jednotlivé stránky na webu mezi sebou propojujte tlačítky nebo odkazy v textech, má to dobrý vliv. Web musí fungovat se SSL certifikátem, je to nutnost, nechcete přeci, aby se lidem místo webu zobrazila hláška typu "spojení s tímto webem není bezpečné" nebo "vase pripojeni neni soukrome problém se zabezpečením", to zákazníky i vyhledávače zaručeně odradí. Jak SSL aktivovat si povíme až budeme objednávat doménu a hosting a instalovat WordPress.

Těch postupů co udělat, aby byl web vyhledatelný je mnoho, postupně k tomu dojdeme v návodu.

Proč nezvolit onepage web?

Hodně lidí chce vytvořit onepage web, tedy jednostránkový web, kdy všechny informace jsou uvedeny na jedné stránce. Jenže já onepage weby nemám moc ráda. Proč je nesnáším? Protože nejsem jen tvůrkyně webů, ale zabývám se i SEO, tedy, aby když už web udělám, tak aby byl dohledatelný zákazníky. No a čím více stránek web má, tak tím více zákazníků najde váš web. Každou stránku můžete cílit na jiné klíčové slovo/téma a jednostránkový web a vícestránkový web vám tedy získá hodně různý počet lidí co se na váš web dostane.

Tak a je to venku, já vím, měla bych onepage weby propagovat, když tvořím weby, ano je to celkem dobrá varianta do začátku, když člověk nemá tolik peněz tak onepage web je OK, ale časem to chce určitě rozšířit. Tak jen si dejte pozor na to, že když už budete tvořit web, tak se vybodněte na jednostránkový, ale udělejte rovnou normální vícestránkový web s blogem, kde budete psát pro lidi témata, která je zajímají a která vám ty zákazníky přivedou.

Proč mít na webu i blog? Snadno a zdarma dostanete lidi na svůj web

Jste škrti a nechcete utrácet hned za reklamu na Google nebo Seznamu? Kdo po téhle větě neodešel, udělal mi radost a teď vážně. Předpokládám, že když vás zajímá jak si vytvořit svůj vlastní web, tak asi nebudete nadšeni, když vám tu budu říkat jak po vytvoření webu si koupit hned reklamu na Googlu a Seznamu. Ne nebudu vás přesvědčovat, abyste vynakládali peníze na to, že se bude váš web zobrazovat ve vyhledávačích na lepších pozicích, když to jde udělat i jinak. (Ne vždy samozřejmě, PPC reklama má i své výhody, abych ji jen nehanila, ale o PPC reklamě si povíme jindy.)

Jak tedy získat zákazníky zdarma, když nechci platit reklamu? Zákazníky můžete získat různě, základem je perfektní web, jednotlivé stránky upravit tak, aby přiváděly vhodné návštěvníky. Na jednotlivých stránkách mít relevantní informace pro vaše zákazníky. No a co když chcete, aby váš web našlo ještě více lidí? Od toho je na webu blog, tedy články, které si budete psát na různá témata a budete jimi web plnit. Každý článek vám přivádí na web určitý počet návštěvníků, na webu je musíte vhodně proměnit v zákazníky a tím získáváte nové a nové poptávky.

Sepsala jsem tento návod na vlastní web, pomocí systému, který má v sobě již zabudován blog. Tedy vlastní stránku se seznamem článků, které budete psát nebo si necháte psát od někoho kdo umí psát (copywriter se této profesi říká) pro vaše zákazníky.

Jak založit webové stránky zdarma

Pokud chcete založit webové stránky zdarma a chcete opravdu úplně nějjednodušší cestu, jak založit web, tak doporučuji vybrat službu Webnode. Není to úplně ideální, protože tarif pro webové stránky je opravdu zdarma a webové stránky si s Webnode zdarma opravdu vytvoříte, má to svá ale.. Takže já tento systém úplně nedoporučuji, ale jestli si stijíte za tím, že chcete web zdarma, pak ějděte cestou přes Webnode. Web si vytvoříte velice snadno, v podstatě za den máte hotovoý web.

Proč nejít do webu zdarma? Pojďte si o tom trochu počíst

Sepsala jsem návod na vlastní web, nebude to žádný pronájem, ale vlastní web s vlastní doménou a hostingem a systémem WordPress, ono totiž záleží a tom v čem nebo jak je web vytvořen. Jasně můžete mi na to říci, že i hosting nebo doména je jakýsi "jen pronájem", ano je, ale je v tom rozdíl, je to přímo váš pronájem domény a hostingu a můžete si s webem dělat cokoli, ne web vytvořený přes třetí stranu jako jsou weby nabízené zdarma, které nakonec vyjdou draze. Přečtěte si jak to chodí.

Já vím, je to opravdu lákavé, ale hned vás z toho chtění webu zdarma rychle vyvedu, protože nic není zdarma tak proč si myslíte, že by zrovna vám někdo jen tak zdarma dával web? Ano nějaký "web" je zdarma, to zase nechci kecat, ale výdělečný web?? To asi ne, že? Víte jaká je práce udělat web výdělečným? Snad si nemyslíte, že si vytvoříte web zdarma a ten se ihned dostane k těm správným zákazníkům a hned budou poptávat.. to opravdu ne. Kdyby to tak fungovalo, tak já nemám práci. A všichni co máme web jsme milionáři. Webu se musíte věnovat, aby fungoval a rozhodně nepostavíte dobrý web na službě zdarma.

A proč si nemáte teda zřídit web úplně zadarmo přes třetí stranu? Vždyť když jste hledali návod, tak jste určitě narazili na služby typu web zdarma, no jo ale je v tom vždycky nějaký ten háček. U webu zdarma nebudete mít vlastní doménu, tedy samostatný a čistý název webu a vytvořený web vám nebude ani patřit. Takže výsledek? Pachtíte se s webem měsíc, pak zjistíte, že tam ještě něco potřebujete, ale ejhle, to už je nadstandartní služba a už váš webíček nebude zdarma, ale těžce za něj budete muset platit. Jóó, když ptáčka lapají, pěkně mu zpívají, to je realita..

Další problém a to je haluz, web není váš. Vy si jen pronajímáte nějaký nástroj, přes který si vytvoříte web, ale když u té služby už nebudete chtít být, tak si ho nikam nemůžete přenést, prostě a jednoduše to nejde. Třetí strana vás nepustí na jejich server kde jsou tisíce takový zdarma webů, abyste si data vašeho webu stáhli. Mám spousty nešťastných klientů, co mají web u těchto jak je správně nazvat – zdarma-webo-poskytujících-firem a ten jejich web nejde přesunout, takže jsou nuceni buď u služby zůstat a zaplatit si vyšší tarif nebo si vytvořit web jinde ale znovu.

Weby zdarma jsou trik, uděláte si u nich web a ten nejde jen tak přenést na WordPress ani na jiný hosting. Takže než plakat nad ztrátou těžce vytvořeného webu a nemít jinou možnost než web stavět znovu celý od začátku, popřemýšlejte předem a nedělejte začátečnické chyby, já vím, zní to opravdu lákavě, ale vždyť nikde nic nedostanete jen tak zadarmo, vždycky je v tom něco.

Takže jestli někde vidíte služby jako web zdarma, tak je to lákadlo a kvalitní web si tím nevytvoříte, raději se tou vyhněte obloukem. Jinak, když to vezmu z pohledu jiné strany, ano něco jako web si s tím vytvoříte, ale nakonec zjistíte, že jsou to hodně omezené služby a že to co vy chcete a to je web, který vás má kvalitně prezentovat a přinášet vám poptávku, tak si tam nevytvoříte a nebo jak jsem už napsala, za těžký prachy, protože si ten web budete měsíčně pronajímat.

A proč nestačí jen web, vždyť hlavně, že budu mít web ne? Nespadli jste z hrušky? Z višně jsem už totiž spadla já na začátku článku, tak proto ta hruška.. Takhle to nefunguje, webů je jak zrnek máku a jak má jako vyhledávač poznat který web má zrovna tomu co si něco ve vyhledávači na internetu hledá zobrazit? No a k tomu má takové pomyslné síto a tím některé weby pěkně propadnou někam na konec, kde zůstanou ležet a nikdo je nenajde, žádný zákazník a naopak jsou weby, které sítem nepropadnou a zobrazí se ve výsledcích vyhledávání potenciálnímu zákazníkovi (tomu co něco hledá). Prostě vyhledávač si weby třídí a vybírá jen ty nejlepší, proč? Protože jeho záměr je dát hledajícímu správný web, který mu dá ty informace co on zrovna hledá. Když by nám vyhledávač nedával to co hledáme, tak bychom ty vyhledávače nepoužívali.

No a jak udělat web, který bude suprový a tím sítem nepropadne? To si povíme dále v návodu a hlavně si z toho vezměte to, že to nebude web zdarma na nějaké doméně, která v sobě má i název té třetí strany. Prostě s webem zdarma díru do světa neuděláte. Tak se nenechte zlanařit na nabídky webu zdarma, je to bohužel vaše ztráta času, která vám nepřinese užitek. Jo možná pro začátek si to můžete zkusit udělat takový web zdarma, jestli na to máte čas..

Ale jestli nechcete ztrácet čas, něčím co by nemělo užitek, ale chcete web, který má potenciál vám něco vydělat, tak můžete v klidu studovat tento návod, protože já vám budu vysvětlovat tvorbu vlastního webu s vlastní doménou a hostingem, abyste nebyli závislí na třetí straně.

V jakém programu vytvořit webové stránky

Nejde úplně o program. Dnes se na tvorbu webu používají v podstatě 3 cesty: online webové editory, to je opravdu asi nejjednodušší cesta jak mít webové stránky zdarma, ale je to vykoupeno tím, že máte často omezené funkce nebo si musíte připlatit lepší tarif, takže pak už to není úplně web zdarma. Dále jsou tu redakční systémy (WordPress, Joomla, Drupal, Prestashop a další) jsou to podle mě špičkové nástroje, pomocí kterých si zvládnete vytvořit webové stránky jaké potřebujete. A třetí možnost je si web naprogramovat, ale to nezvládne každý.

Co je Webnode

Webnode je rychlý a jednoduchý nástroj pro vytvoření vlastního webu bez potřeby programování. Stačí si zvolit šablonu, přepsat texty, doplnit obrázky a upravit si vzhled podle svých představ. Web můžete mít hotový během pár minut a díky přehlednému editoru hned vidíte, jak bude finální verze vypadat. Základní verze je zdarma, pokud vám ale vadí doména ve tvaru nazevwebu.webnode.cz nebo omezení prostoru a dat, vyplatí se přejít na placený tarif už od 90 Kč měsíčně.

Proces tvorby je velmi intuitivní: promyslíte si koncept, vyberete šablonu z více než stovky designů, upravíte jednotlivé sekce a po dokončení kliknete na „Publikovat“. O technické věci jako hosting se stará Webnode automaticky. Jedinou pravidelnou povinností pak zůstává hlídat platnost domény a předplatného.

Co jsou redakční systémy

Redakční systémy (zkratka je CMS – content management system) jsou nástroje, které vám umožní vytvářet, upravovat a spravovat obsah webu bez znalosti programování. Místo práce s kódem používáte přehledné administrační rozhraní, ve kterém si můžete psát texty, nahrávat obrázky, měnit strukturu webu nebo spravovat eshop, vypadá to např. jako administrace v emailu.

Nejznámější redakční systémy jsou WordPress, Joomla nebo Drupal. Jejich hlavní výhodou je rychlost, jednoduchost a možnost kdykoli obsah aktualizovat. Každý systém má svou specializaci – například WordPress je univerzální a extrémně flexibilní. Vytvoříte s ním firemní web i eshop. Joomla či Drupal jsou zase vhodnější pro velice složité struktury: rozsáhlé katalogy, databáze, firemní portály, produktové listy.

Kdo píše tyto texty:

Jmenuji se Radka Jiránková, specialistka na WordPress a online marketing s praxí od roku 2013. Tvořím webové stránky pro firmy i podnikatele, často opravuji nefunkční weby a propojuji techniku, grafiku a marketing tak, aby weby skutečně přiváděly nové zákazníky.

Firmám pomáhám nejen s tvorbou webových stránek, ale také s tím, aby je zákazníci našli – díky SEO, PPC reklamě a chytrému obsahu. Učila jsem tvorbu webových stránek na SŠ a nadále se WordPress kurzům pro firmy i jednotlivce aktivně věnuji.

Více jak 15 let píši pro vás návody, abyste mohli snadno tvořit a upravovat vaše webové stránky. Některé odkazy na tomto webu mohou být partnerské. Když je využijete, nic vás to nestojí a podpoříte tím tvorbu dalších článků a návodů. Děkuji, že pomáháte udržovat tento web bez agresivních a rušivých reklam.

Více o mně | Kurzy WordPress | Opravy webů | Kontakt