Mobirise návod na rýchlu tvorbu webov

Mobirise je zaujímavý a z veľkej časti bezplatný softvér na tvorbu jednoduchých, aj graficky príťažlivých webov. Je ideálny na tvorbu „Landing Page“, teda jednostránkový web s obsahom na jednu dlhú stránku. Mobirise je vhodný aj pre menšie weby, ktoré majú zhruba do 10 podstránok. Výhoda Mobirise je, že jeho export je HTML kód stránky a javascript skripty, ktorý dokážete iba prekopírovať na hosting. Preto sa nestaráte o databázu, inštaláciu servera, prihlasovacie mená atď. Preto často používam Mobirise na tvorbu webov namiesto Wordpress.

Zhrnutie Výhod Mobirise

• Jednoduchý a prehľadný softvér
• Softvér sa inštaluje priamo do PC (Windows, Mac)
• Výborný na tvorbu landing page a malých webov
• Weby sú responzívne, teda často dobre vyzerajú aj v PC, aj v mobile
• Vytvára HTML Export kódu, ktorý si iba nakopírujete na hosting
• Výsledný web má veľkosť iba zopár MB (Väčšinu veľkosti tvoria obrázky)
• Neriešite žiadne prihlasovačky administrátorov, heslá, databázy, inštalácie
• Mobirise web vytvoríte pomocou kombinovania Blokov, podobne ako v iných softvéroch
• Web v Mobirise urobíte aj bez platenej licencie Mobirise
• Nemáte žiadne mesačné poplatky, platforma vás nevydiera ako WIX, že ak nezaplatíte, WIX vám zruší web
• Za už vyexportované weby neplatíte. Výsledný HTML kód iba prekopírujete na webhosting

Zhrnutie nevýhod Mobirise

• Nečakajte od neho Blog. Mobirise NIE JE blogová platforma
• Nie je tam 100% flexibilita
• Potrebujete vedieť, ako Mobirise nastaviť a používať
• Mobirise sa v posledných rokoch iba veľmi málo vyvíja

Základné tipy pre Mobirise

• Držte sa iba základnej šablóny MOBIRISE 5
• Platenú verziu obvykle nepotrebujete
• Prejdite si body v návode nižšie, aby ste nastavili všetko k vášmu webu

Výber témy Mobirise 5

• Mobirise ponúka dve základné šablóny, konkrétne
• MOBIRISE 5 a MOBIRISE AMP
• Tieto šablóny sú najviac flexibilné, aj najviac dokončené. Dokážete si v nich nájsť takmer všetky potrebné stavebné bloky pre Grafiky
• V rámci platených verzií Mobirise ponúka aj iné šablóny. Nie sú však nejako zaujímavé. Najväčší rozdiel medzi platenými šablónami a základnou MOBIRISE 5 je vo farbe, veľkostí písiem, fontu písiem. A všetky tieto časti si viete nastaviť aj v základnej Mobirise 5
• Platených tém sú desiatky, témy ponúkajú aj bloky s mierne iným výzorom. Je to zanedbateľná výhoda. Zároveň veľa z platených tém je „nedokončených“, chýbajú im rôzne používané bloky, aj rôzne nastavenia blokov, ktoré sú už v základnej Mobirise 5
• Preto ak chcete používať platené témy, vždy nakoniec skončíte

Potrebujem Platený Mobirise?

• Obvykle Nie (Najmä ak tvoríte iba jednoduché weby)
• Platený Mobirise má iba dve významné výhody
• HTML code editor – editor vbudovaný v Mobirise, vďaka ktorému máte prístup k celému HTML kódu stránky
• HTML code block – blok, do ktorého môžete vložiť akýkoľvek, aj vlastný HTML kód

Ako začať s tvorbou webov v Mobirise

Získajte predstavu aký web chcete

• Pozrite si rôzne weby, a rozvrhnite si, čo na vašom webe chcete
• Rozdeľte si web na Grafickú časť (Farby, písmo, vzhľad) a Obsahovú časť (Stránky, podstránky, a obsah článkov)
• KRESLITE!!!
• VYUŽÍVAJTE PERO A PAPIER!!!
• Prečo navrhnúť prvé časti na papieri? Doteraz neexistuje nič flexibilnejšie ako pero a papier. Preto kreslením dokážete získať vhľad, čo na webe chcete mať. Neskôr tieto papiere spoznámkujete a vytvoríte z nich podklady pre web, alebo aj celý web.
  

Tipy pre obsahovú časť

• Ujasnite si, či chcete jednostránkový web (One-Page), alebo viacstránkový (s podstránkami)
• Navrhnite si, na ktorej stránke by mal byť aký obsah
• Neskôr si podklady pre web, najmä štruktúru článkov aj obsah článkov, prepíšete do wordu
• Zamerajte sa na hlavné časti, a to:
• o Zoznam článkov / stránok
• o Hlavná myšlienka a hlavné body každého článku
• o Text článku
• Takýto podklad už viete poslať webovému vývojárovi, alebo vytvoriť si web sami

Tipy pre grafickú časť

• Pozrite si, aké weby sa vám páčia, a inšpirujte sa nimi
• Farby si vyberajte už pri prvom návrhu vašej prvej stránky
• Pri fontoch a textoch sa držte tých základných a otvorených fontov. Skontrolujte si, že použitý fond má aj Slovenskú / Českú diakritiku!!!
• Jednotlivé grafické bloky aj s textami budete často meniť, preto toto je hravá práca
• Na konci si vyberiete vizuál stránky, aký sa vám najviac páči
• Pre kontrolu grafickej časti si vašu stránku pozrite aj na počítači, aj na mobile

Ako má vyzerať názov a link stránky

• Pri názve máte flexibilitu, a môžete používať diakritiku
• Vytvorte názov stránky, aby zaujal (Ako použiť xy), alebo bol jasný (Kontakt)
• Pri názvoch linkov sa držte základného webového štandardu
• Konkrétne pravidlá:
• o Vždy iba malé písmená v názve webu
• o Namiesto medzier použite iba pomlčky (tento znak: - )
• o Vyhnite sa iným znakom, napríklad podtržník (tento znak: _ )
• o Nepoužite diakritiku. Držte sa iba základných anglických písmen
• Váš link bude vyzerať napríklad:
• o mobirise-navod
• o ako-vytvorit-web-v-mobirise
• Následne tento článok nájdete na webe ako
• o vasweb.sk/mobirise-navod
• o www.21wiki.com/mobirise-navod
• Určite sa vyhnite generickým názvom linkov, ako napríklad page1
  

Pri prerábaní webov z inej platformy

• Ak už máte web v inej platforme (Napr. Wix, Wordpress), uložte si jednotlivé stránky do počítača a využite ich ako podklad k tvorbe nového webu
• Vypýtajte si spätnú väzbu na váš pôvodný web, a tak rýchlejšie nájdete, čo môžete v druhej „Mobirise verzii“ vylepšiť
• Viete ušetriť čas pri tvorbe webu napríklad tým, že viete využiť farebnosť, rozloženie, aj typy písma starého webu. Veľa času ušetríte aj tým, že texty vášho starého webu nepotrebujete prepisovať. Budete ich iba kopírovať

Zlaté tipy:

• Vždy si pýtajte spätnú väzbu na váš web
• Váš web má PREDÁVAŤ!!!
• Preto predáva ten web, ktorý sa páči iným, a málokedy iba taký, ktorý sa páči vám
  

Postup práce v MOBIRISE

Prvé kroky

• Nainštalujte si Mobirise softvér
• Pre prvý web si vyberte tému MOBIRISE 5
• Ako základný vizuál stránky si viete vybrať buď úplne prázdnu stránku, alebo prednastavené rozloženia na Mobirise 5 téme, ako Finance, Fotography, a iné rozloženia
• Začnite tvorbou prvej stránky – Hlavnej stránky – HomePage
• Keď využijete jedno z prednastavených nastavení, pozrite si, ktoré z blokov využijete

Výstavba prvej stránky

• Predpokladám, že už máte predstavu, ako má vyzerať vaša prvá stránka
• Pozrite si, ako prehadzovať poradie blokov medzi sebou
• Bloky z prednastavených tém si preusporiadajte
• Rozdeľte si bloky na
• o Prvé budú bloky, ktoré použijete na začiatok vašej stránky
• o Nižšie budú bloky, ktoré použijete na neskorších častiach vašej stránky
• o Úplne naspodku budú bloky, ktoré ste našli ako použiteľné, a radi by ste ich využili na iných stránkach vášho webu
• o Nechajte si na stránke aj bloky, ktoré sú dostatočne flexibilné, viete na nich vypnúť rôzne prvky (Napr. Nadpisy, Podnadpisy, Buttons, Ikony) a preto viete ich použiť aj v iných častiach webu
• o Najpoužívanejšie bloky si uložte ako custom user block (Vaše obľúbené bloky), aby ste si ich vedeli ľahko vložiť
• o Pre zvyšné bloky je tu DELETE

Tip z praxe:

• Vytvorte si aj jednu stránku ALL BLOCKS, kde si vložíte všetky zaujímavé bloky vášho webu
• Táto stránka môže byť kópia vašej prvej HomePage, kedy si vašu HomePage vytvoríte na ostrú verziu bez zbytočných blokov, a stránku ALL BLOCKS
  

Zoznamy najpoužívanejších blokov sú:

• ÚVOD STRÁNKY (Má obrázok, nadpis, a obvykle dve tlačidlá)
• NADPIS (Blok iba s nadpisom a podnadpisom)
• TEXT S NADPISOM (Základný textový blok, do ktorého budete dávať články)
• TLAČIDLÁ (použiteľné aj zvlášť mimo iných blokov)
• STĹPCE S IKONAMI (ideálne aby ste vedeli zmeniť počet stĺpcov a vizuál ikon)
• OBRÁZKOVÉ BLOKY
• BLOKY S ODKAZMI na iné stránky (Aby sa váš návštevník vedel ľahko prekliknúť na iné časti webu)
• MENU (Menu ako obsah stránky, je rovnaké na každej stránke, nahadzujete iba raz)
• FOOTER (Úplný spodok stránky, je rovnaký na každej stránke, nahadzujete iba raz ideálne ako poslednú časť webu)

Export prvej stránky

• Celú stránku si vyexportujte na disk (IBA VÁŠ VLASTNÝ DISK), vyhnite sa exportu na Mobirise server, či na FTP.
• Otvorte si vašu stránku z vášho disku cez prehliadač
• Pozrite si, ako vaša stránka vyzerá pri rôznej veľkosti okna prehliadača
• Na FTP budete exportovať stránku až vtedy, keď bude buď úplne, alebo celkom hotová, a budete potrebovať spätnú väzbu

Grafika prvej stránky

• Výber farieb – nájdete v Settings celej stránky
• Výber fontov – tiež nájdete v Setting celej stránky
• Úprava medzier medzi blokmi – Nájdete ju v nastaveniach každého bloku

Tvorba ďalších stránok

Postupne si podľa plánu vášho webu vytvoríte aj ďalšie stránky

• Pre urýchlenie tvorby využite možnosť ukladania user blocks, teda vašich vlastných blokov
• Nepoužívané user blocks zmažte
• Menu sa vám vždy nakopíruje ako prvý blok na každej stránke
• Footer (päta stránky) sa vám tiež nakopíruje na každú stránku, ale často nie ako posledný blok stránky. Preto ho budete musieť pravidelne prehadzovať ako posledný blok. Môžete sa tomu vyhnúť tak, že časť Footer stránky urobíte ako úplne poslednú časť webu

Dokončenie stránky

Posledné časti pred odovzdaním stránky sú

• Skontrolovanie a prepísanie všetkých názvov stránok do dobre znejúceho formátu (aby daný človek chcel na článok kliknúť
• Skontrolovanie a prepísanie všetkých názvov linkov stránok do webového formátu – teda všetky písmená malé, a namiesto medzier pomlčky (napr. navod-mobirise, ako-vytvorit-web-v-mobirise)
• Skontrolovanie prelinkovania
• o všetkých linkov a názvov v Menu
• o odkazov na stránky v článkoch
• o odkazoch v časti FOOTER (Päta stránky)
• Pridanie FAVICON (malá ikona stránky, ktorá sa vám v prehliadači objaví v riadku úplne naľavo od adresy článku)
• Pridanie GOOGLE ANALYTICS kódu (aby ste vedeli sledovať návštevnosť webu. Kód pridáte v nastaveniach)
• Pridanie COOKIE BAR (Že využívate cookies, opäť v nastaveniach)
• Pridanie GDPR BAR (Ak potrebujete)

Export dokončenej stránky

• Aby ste mohli stránku meniť, využite export stránky cez MOBIRISE nastavenia s názvom EXPORT PAGE
• Takýto export obsahuje iba súbor s príponou .mobirise a priečinok assets, kde sa nachádzajú najmä obrázky
• Tento export stránky následne viete prekopírovať a upravovať aj v iných počítačoch

Upload na web

Export Mobirise vytvorí súbory

• HTML kódy stránok aj s názvami stránok podľa linkov
• Priečinok ASSETS so skriptami, obrázkami, a inými nastaveniami stránky

Následné kroky

• Všetky tieto súbory si viete prekopírovať z disku na váš webhosting, často cez grafické menu správy súborov od vášho webhosting poskytovateľa
• Tieto súbory si viete prekopírovať aj priamo použítím FTP pripojenia. Vtedy potrebujete nastaviť vaše FTP propojenie na hosting
• Pre kontrolu webu môžete ale nemusíte vložiť váš web aj na mobirise server
• Skontrolujte si grafiku webu, ako vyzerá na počítači aj mobile

Späť na hlavnú stránku BlueNumbers