Služba inPage – instantní webové stránky

Přestože nabídka profesionálních webdesignérů je velmi široká, ne vždy jí lze využít. Profesionál nemusí být právě k dispozici nebo jeho služby nemusí být finančně dostupné – v takový okamžik přicházejí na řadu různá instantní řešení, s jejichž pomocí může web vytvořit i laik. Jedno z nich vám chci předvést v této případové studii.

Na stránkách Intervalu jste si již mohli přečíst čláky o různých pokročilejších systémech pro tvorbu webu, jako je například Drupal, který používají i profesionálové a poloprofesionálové, aby nemuseli každý web vytvářet úplně od nuly. Pro amatéra však může být i takový systém příliš komplikovaný. Pak nezbývá než sáhnout pro nějaký jednoduchý redakční systém, který se o většinu práce potará sám, například inPage.

Než začneme s inPage…

Tato případová studie popisuje použití systému inPage při tvorbě webové prezentace neziskové organizace Myslivecké sdružení Viničné Šumice – Kovalovice. Úkolem prezentace bude především informovat o aktivitách tohoto sdružení, přičemž většinu obsahu budou tvořit laici, nikoli IT profesionálové. Časem snad přibudou také další sekce se speciálními informacemi, například seriál o zvěři, soutěže s mysliveckou tématikou a podobně, to už ale bude záležet na aktivitě sdružení.

Nejprve se hledalo vhodné doménové jméno. Padaly různé návrhy, například myslivci.cz, msvsk.cz, myslivecky-hospodar.cz nebo myslivecky-zpravodaj.cz. Tento návrh byl však hned zamítnut, zpravodaj v pravém slova smyslu znamená občasník, specializovaný odborný neperiodický časopis, o který se v tomto případě skutečně nejedná. Nakonec jsme se rozhodli pro www.myslivci-vsk.cz.

Doménové jméno bylo registrováno na webu Czechia, což mi usnadnilo práci, protože zároveň s objednávkou domény byl objednán i webhostingový program inPage Standard (za 990 korun na rok), který zahrnuje kromě redakčního systému inPage také FTP a e-mailové služby. Výhodou je, že po zaplacení jsou všechny služby okamžitě dostupné a předem nakonfigurované, není třeba se trápit nějakou složitou instalací nebo nastavováním různých podivných parametrů, o kterých člověk předem ani neví, k čemu vlastně budou sloužit.

Poslední přípravnou prací byla tvorba stručného přehledu obsahu budoucí prezentace. Na základě prvotní představy o zaměření webu vznikla základní struktura a návrhy jednotlivých sekcí (Aktivity, Seriál o zvěři, O nás), přičemž byly vzaty v úvahu základní doporučení ohledně SEO.

Kvalitní web v sedmi krocích

Práce s inPage je skutečně jednoduchá. S pomocí tohoto jednoduchého nástroje lze vytvořit vlastní web skutečně velmi rychle – než tento článek dočtete, bude už hotový!

1. Výběr šablony

Abychom nemuseli navrhovat kompletn vzhled webu sami, poskytuje inPage několik předem připravených šablon (momentálně pět, přičemž v budoucnu by měly přibýt další). Rozhodla jsem se pro šablonu s horizontálním menu. Původně jsme také chtěli mít zelený podklad, ale šablona se zcela zeleným podkladem byla nakonec vyloučena, přestože s ní stránky začaly. Postupem vývoje jsme poznali, že mít celé stránky komplet v zelené by nebylo vůbec pěkné. Vybrala jsem tedy šablonu se zeleným pozadím, ale textové pole zůstalo bílé. Základní vzhled stránek byl hotový.

2. Vytvoření stránek

Všechny stránky webu se tvoří stejným způsobem, který vám předvedu na příkladu úvodní stránky sdružení.

Po zadání hesla jsem se přihlásila do centra administrace služby inPage a přede mnou se zobrazila stránka s hlavním menu. Pro vytvoření první stránky bylo potřeba jít na odkaz v menu „Stránky“. Toto je základ pro vytváření každé nové stránky v inPage.

Hlavní menu systému inPage (plná velikost, cca 45 kB)

Zobrazila se mi krátká informace o tom, že stránky tvoří základ obsahu prezentace, že jednoduchý web si lze vytvořit pouze pomocí několika stránek bez použití rubrik a že stránky lze jednoduše přidávat, editovat a nastavovat jejich zobrazení v menu. Pod tímto textem se zobrazil odkaz „Přidat stránku“, kterým jsem pokračovala ve vytváření první stránky.

Zde jsem začala vkládat základní údaje o stránce. Při přípravě textů jsme rozhodli, že úvodní stránka zůstane nazvána „Úvodní stránka“, protože každý web by měl mít svou úvodní stránku, svůj počátek. Název byl tedy jasný. Do titulků jsme se rozhodli vepsat krátkou informaci s uvítáním na stránkách Mysliveckého sdružení Viničné Šumice – Kovalovice. (Adresu stránky nebylo nutné vyplňovat, tato se vyplní automaticky po uložení stránky.)

Příklad vyplnění údajů o stránce

Dále bylo potřeba na stránce zaškrtnout políčko „Zobrazit v hlavním menu“ a „Nastavit jako titulní stránku“, tím se zajistí, že se vždy zobrazí tato stránka jako úvodní. U ostatních stránek toto není nutné.

Do textového editoru jsem následovně nakopírovala předem předpřipravený text stránky. (Samozřejmě, když někdo stránky předpřipravené nemá, může začít psát text od samého začátku, nezapomeňte si ale práci často ukládat, abyste o ni nepřišli třeba při výpadku vašeho připojení). Pro vložení textu jsem použila ikonku „Vložit neformátovaný text“. Vyskočilo malé okénko, do kterého jsem text zkopírovala, změny se uložily, okno zavřelo a text se zobrazil v hlavním okně editoru. Potom už stačilo jen stránku uložit odkazem „Přidat“.

Vložení neformátovaného textu

Mimochodem, inPage vám zobrazí popis jednotlivých ikon, pokud nad ně najedete kurzorem myši, což usnadňuje orientaci a šetří čas.

3. Formátování nadpisů a textu

Chtěli jsme dosáhnout toho, aby webové stránky mysliveckého sdružení byly co nejpřehlednější, aby je vyhledávače považovaly za kvalitní a stránky se umístily na dobré pozici ve výsledcích hledání podle zvolených klíčových slov. Správné použití nadpisů je jedním z nejdůležitějších kroků na cestě k tomuto cíli.

Jako hlavní nadpis („Nadpis 1“) úvodní stránky jsem použila celý název Mysliveckého sdružení Viničné Šumice – Kovalovice. Později bude tento název patřit mezi hlavní klíčová slova, podle kterých uživatelé internetu najdou internetové stránky tohoto sdružení nejsnáze. Výsledkem bylo mimo jiné i zvětšení tohoto nadpisu do požadovaného formátu.

Formátování hlavného nadpisu (plná velikost, cca 130 kB)

Další text již sděluje úvodní informace o tomto mysliveckém sdružení a obsahuje pouze jedu zvlášť důležitou větu, kterou jsem ještě označila tučně, k čemuž slouží ikona „B“. Tato věta se stala heslem tohoto mysliveckého sdružení.

Pravidlem je, že na každé stránce používáme pouze jeden hlavní nadpis. Pokud chcete mít na svých stránkách nějaký podtitulek, označte ho podle svého významu jako „Nadpis 2“ nebo „Nadpis 3“.

4. Formátování odstavců

O formátování odstavců jen krátce. Pokud do editoru vkládáte nezformátovaný text, je výsledná podoba textu velmi nepřehledná a čtenáři nepříjemná. Proto je lepší text rozdělit do odstavců a tyto případně dále naformátovat (příliš to ale nepřekombinujte), aby hezky zapadaly do stránky a hlavně aby se dobře četly. K dispozici jsou přitom stejné nástroje jako pro úpravu a formátování nadpisů, i postup je obdobný.

5. Vkládání obrázků – nahrávání obrázků na web

Už během přípravy prezentace sdružení bylo jasné, že pouze holé texty na vytvoření kvalitního a pěkného webu nestačí. Stánky bylo potřeba oživit nějakými dalšími prvky. Obrázky, to je to pravé!

Pokud chcete mít možnost vkládat obrázky přímo do textového editoru, je potřeba si obrázky nejdříve do inPage nahrát. K tomu slouží menu „Obrázky“ v hlavní nabídce. Přes odkaz „+Přidat obrázek“ se postupně nahraje jeden obrázek za druhým.

Než s nahráváním začnete, doporučuji mít vše dobře pojmenované, ušetříte si pozdější komplikace. Také v editoru je dobré dát obrázku přesný a výstižný název, ale to už je na vás. Po vyplnění popisu obrázku se pomocí odkazu „Procházet“ obrázek vyhledá na lokálním disku a po uložení se obrázky zobrazí v menu jako miniatury.

Miniaturní náhledy obrázků (plná velikost, cca 85 kB)

6. Vkládání obrázků – vkládání obrázků do stránek

Na některých stránkách, třeba v „Seriálu o zvěři“, jsme chtěli docílit toho, aby se na stránce kromě krátkého informačního textu zobrazovaly také miniatury s obrázky konrétního zvířete, případně i jeho obrázek v plné velikosti. Obrázky byly předem připravené a postupem uvedeným výše jsem je uložila na web – zbývalo zařídit, aby se zobrazovaly na správném místě ve stránkách.

V menu editoru jsem tedy vyhledala stránku s názvem „Seriál o zvěři“ a dala jsem jí upravit. Zobrazil se opět editor s textem, ovšem zatím bez obrázků.

Příklad vkládání obrázků do textu (plná velikost, cca 100 kB)

V záložce „Obecné“ jsem vybrala „náhled“ fotografie. Náhled fotografie je skutečně pouze zmenšenina obrázku. Kromě toho je zde ještě možnost zvolit „normální“, což je velikost obrázku přizpůsobená velikosti šablony, kterou právě v inPage používáte. (Položka označená „originál“ je obrázek v původní velikosti, jak jste jej nahráli, bez jakýchkoli úprav. Takový obrázek může přesahovat velikost zvolené šablony, což může někdy kazit celkový dojem.)

V záložce „Vzhled“ lze nastavit obrázku vlastní rozměry, upravit polohu obrázku tak, aby ladila s textem vpravo či vlevo, nebo přidat obrázku rámeček. Záložka „Pokročilé“ je vhodná pro zvláštní nastavení obrázku, například aby se po najetí myší zobrazil alternativní obrázek a podobně.

Po vložení obrázku do editoru je nutné výsledek znovu uložit, aby se provedené úpravy neztratily!

7. Přidání fotogalerie do menu stránky

Kromě fotografií vložených přímo do textu jsme chtěli mít na webu sdružení také klasickou fotogalerii. I to je v inPage možné, přičemž postup je stejný jako při vytváření nové stránky.

Když už jsem měla obrázky uložené na webu, v administraci webu jsem prošla znovu do menu „Obrázky“ a vpravo se zobrazila možnost přidat svoji vlastní fotogalerii. Stejně jako u vytváření nové stránky nebo přidávání nového obrázku, i u přidávání nové fotogalerie bylo potřeba vyplnit vlastní název fotogalerie a zaškrtnout zobrazení fotogalerie v hlavním menu. (Pro některé uživatele je zde možnost chránit svou fotogalerii heslem, tu jsem však nepoužila, protože galerie měla být veřejná.) Nakonec jsem novou fotogalerii uložila odkazem „Přidat“.

Závěr

Jak vidíte, základní tvorba webu v inPage není nijak složitá a s malou pomocí nápovědy ji zvládne opravdu každý. Samozřejmě jsou k dispozici i další možnosti ladění stránek, ale o tom až jindy.