Logo

Úvod do tvorby webových stránok, webových sídiel, web stránok, www stránok, internetových stránok, webových aplikácií

Obsah:

 

Tvorba webových stránok

Čo je webový prehliadač?

Webový prehliadač (Web browser) je softvér, ktorý umožňuje prehliadanie (prezeranie) webových stránok užívateľmi. Webové prehliadače sú napríklad Chrome, Firefox, Opera, Safari, Edge a ďalšie. Pre webový prehliadač sa používajú aj ekvivalentné výrazy ako internetový prehliadač alebo prehliadač webových stránok. V súčasnosti dokážu zobraziť webové prehliadače aj dokumenty vo formáte pdf, takže by sme mohli upresniť definíciu na webový prehliadač a prehliadač pdf dokumentov. Uvidíme aký bude ďalší vývoj prehliadačov.

Čo je webová stránka?

Webová stránka (Web Page) je to, čo sa zobrazí v jednej karte (liste) webového prehliadača. Pre webovú stránku sa používajú aj ekvivalentné výrazy ako web stránka, www stránka alebo internetová stránka.

Čo je webová stránka z hľadiska počítačových súborov?

Aby webový prehliadač mohol zobraziť kompletnú webovú stránku, musí najskôr načítať súbor (dokument) obsahujúci kód HTML z webového sídla. Tento kód prehliadaču okrem iného určuje, čo má zobraziť a aké ďalšie súbory má ešte načítať. Týmito ďalšími súbormi môžu byť štýly, skripty, fonty, obrázky, animácie, videá, zvuky. Takže kompletná webová stránka vznikne (zobrazí sa) v jednej karte (liste) webového prehliadača až po načítaní všetkých potrebných súborov.

Čo je webová stránka z hľadiska užívateľa (čo vidí užívateľ)?

Je to dvojrozmerná obdĺžniková plocha, na ktorej sa zobrazujú jednotlivé prvky stránky. Prvkami stránky môže byť text, logo, navigácia, vyhľadávacie pole, posúvač obrázkov, reklamný baner, formulár, galéria obrázkov, oddelovač, ikony sociálnych sietí, video atď. Každá jedna webová stránka na internete musí mať jedinečnú internetovú adresu.

Čo je web?

Web alebo presnejšie World Wide Web je celosvetová sieť vzájomne prepojených hypertextových dokumentov. Okrem pojmu „World Wide Web” sa používa i jeho skrátený výraz „WWW” alebo aj jednoducho „web”. Niektorí ľudia nesprávne používajú pojem „Internet” v tom istom význame ako pojem „World Wide Web”, čo nie je správne, pretože ide o dve rozdielne veci.

Pojem „Internet” predstavuje celosvetový systém vzájomne prepojených počítačových sietí, naproti tomu pojem „World Wide Web” predstavuje len jednu zo služieb bežiacu na Internete (dnes už gigantické množstvo webových stránok a ďalších rôznych súborov prepojených hypertextovými odkazmi). WWW je najznámejšou a najpoužívanejšou celosvetovou internetovou službou.

World Wide Web používa architektúru klient-server. Pod pojmom klient rozumieme počítač, ale aj softvér, ktorý posiela cez sieť požiadavky na server. Klientskym softvérom môže byť webový prehliadač, prostredníctvom ktorého zadáva užívateľ požiadavky na zobrazenie webovej stránky serveru prostredníctvom siete. Pod pojmom server rozumieme počítač, ale aj softvér, ktorý tieto požiadavky plní. Server odošle klientovi požadované informácie prostredníctvom siete a vyžiadaná webová stránka sa zobrazí v prehliadači užívateľa po načítaní všetkých potrebných súborov. Takáto komunikácia medzi klientom (webovým prehliadačom na počítači užívateľa) a webovým serverom (počítačovým programom na počítači webhostingovej spoločnosti) sa realizuje prostredníctvom hypertextového prenosového protokolu HTTP (Hypertext Transfer Protocol).

Čo je webové sídlo?

Webové sídlo (Website) je skupina počítačových súborov vytvárajúca vzájomne prepojené webové stránky + internetová doménová adresa k priečinku, v ktorom sú tieto súbory uložené.

Webové sídlo je lokalizované v priečinku pamäťového média webového servera (počítača) webhostingovej spoločnosti s internetovou doménovou adresou napríklad: https://nazovdomeny.sk

Každé webové sídlo má z hľadiska štruktúry jednu domovskú stránku (Homepage) a všetky ostatné stránky nazývame podstránkami. Existujú aj jednostránkové webové sídla (OnePage), kde jediná stránka je súčasne i domovskou stránkou. Pre domovskú stránku sa používajú aj ekvivalentné výrazy ako hlavná stránka alebo úvodná stránka.

Keď zadáme do adresného riadku webového prehliadača adresu webového sídla napríklad https://nazovdomeny.sk (stačí aj bez toho https://) tak sa načíta domovská stránka tohto webového sídla. Na ďalšie stránky toho istého webového sídla sa dostaneme pomocou navigácie na stránke.

Všetky webové stránky toho istého webového sídla majú dva charakteristické prvky, čím sa odlišujú od iných webových stránok iných webových sídiel.
1. Majú rovnakú prvú časť internetovej adresy (doménovú časť adresy) napríklad https://nazovdomeny.sk/
2. Majú rovnakú grafiku (vzhľad).

Webové stránky na webovom sídle môžu byť statické alebo dynamické. Statické webové stránky sú také, kde ich obsah sa nemení a ani neumožňujú interaktivitu s užívateľom. Dynamické webové stránky sú také, ktoré často a automaticky menia svoj obsah alebo ho prispôsobujú požiadavkám užívateľa.

Webovým sídlom môže byť napríklad webový portál, e-shop, sociálna sieť, firemná prezentácia, internetový magazín, blog, osobná stránka, mikrosite atď.

Porovnanie pojmov v anglickom a slovenskom jazyku

Web browser = webový prehliadač
Web Page = webová stránka (webového sídla)
Homepage = domovská stránka (webového sídla)
Website = webové sídlo
OnePage = jednostránkové webové sídlo

Správne a nesprávne pomenovanie

V súčasnosti sa používa aj slovo web vo význame webové sídlo. Je to nesprávne, pretože ako by ste potom chápali výraz „web na webe“ web (webové sídlo) na webe (World Wide Web). Správne je webové sídlo na webe.

V súčasnosti sa používa aj slovo stránka vo význame webové sídlo. Je to nesprávne, pretože ako by ste potom chápali výraz „stránka na stránke“ stránka (jedna webová stránka) na stránke (webové sídlo). Správne je webová stránka na webovom sídle.

Čo je URL

URL (Uniform Resource Locator) v preklade z anglického jazyka znamená jednoznačný lokátor zdroja. Modrým písmom vyznačené písmená tvoria skratku URL.

V súvislosti s webovými stránkami to presnejšie znamená: Internetová adresa konkrétnej jedinej webovej stránky. Skrátene sa hovorí o URL adrese stránky. Ešte skrátenejšie o adrese stránky. Takže adresa stránky je URL adresa stránky a tiež jedinečná internetová adresa webovej stránky. Je to to, čo sa zobrazí v adresnom riadku prehliadača webových stránok (webovom prehliadači) predtým ako sa načíta (načítava) celá webová stránka ako aj po jej úplnom načítaní.

Adresu každej webovej stránky netvorí nič inšie ako reťazec znakov. Každá webová stránka musí mať jedinečnú internetovú adresu (URL adresu), to znamená jedinečný (neopakovateľný) reťazec znakov. Na internete teda nemôžu mať dve alebo viaceré webové stránky tú istú URL adresu.

URL adresa webovej stránky môže vyzerať napríklad takto:
https://www.nazovdomeny.sk

Čo je HTTP a HTTPS?

HTTP je protokol slúžiaci na prenos pôvodne HTML dokumentov, no dnes už aj ďalších súborov medzi klientmi a servermi služby World Wide Web. Informácie prenášané cez HTTP nie sú šifrované, čo predstavuje určité riziká, hlavne pri platbách prostredníctvom webových stránok.

Skratka HTTP znamená hypertextový prenosový protokol. Z anglického jazyka Hypertext Transfer Protocol (modrým písmom vyznačené písmená tvoria túto skratku).

HTTPS je zabezpečený protokol slúžiaci na šifrovaný prenos HTML dokumentov a iných súborov medzi klientmi a servermi služby World Wide Web.

Skratka HTTPS znamená zabezpečený hypertextový prenosový protokol. Z anglického jazyka Hypertext Transfer Protocol Secure (modrým písmom vyznačené písmená tvoria túto skratku).

Čo všetko môže obnášať práca v súvislosti s tvorbou webových stránok?

Pri tvorbe webových stránok webových sídiel môže ísť o tieto činnosti:

  • Úvodné konzultácie o projekte webového sídla
  • Prieskum konkurencie
  • Konzultácia a dodanie podkladov na výrobu webového sídla
  • Vypracovanie projektu webového sídla
  • Výber a registrácia domény, webhosting
  • Tvorba grafického návrhu
  • Fotenie pre doplnenie obsahu webových stránok webového sídla
  • Natáčanie videí pre doplnenie obsahu webových stránok webového sídla
  • Tvorba a úprava grafických prvkov jednotlivých stránok webového sídla
  • Kódovanie (HTML, CSS)
  • Programovanie (JavaScript, PHP...)
  • Tvorba a úprava textov (Copywriting a Copyediting)
  • Optimalizácia webových stránok pre vyhľadávače (SEO)
  • Audit webových stránok webového sídla
  • Testovanie webových stránok webového sídla
  • Internetový marketing
  • Správa webových stránok webového sídla
  • prípadne i ďalšie vyššie nešpecifikované činnosti

Koľko odborníkov sa môže podieľať na práci v súvislosti s tvorbou webových stránok?

Na tvorbe webových stránok webových sídiel sa môžu podieľať napríklad títo špecialisti:

  • webový konzultant
  • webový projektový manažér
  • webový architekt
  • webový grafik
  • webový kóder
  • UX/UI dizajnér
  • webdizajnér – je webový grafik + webový kóder v jednej osobe
  • webový programátor (webový vývojár)
  • SEO špecialista
  • copywriter
  • SEO copywriter – je SEO špecialista + copywriter v jednej osobe
  • auditor webových stránok
  • tester webových stránok
  • špecialista na internetový marketing
  • špecialista na sociálne siete
  • správca webového sídla
  • ale aj fotograf, kameraman a ďalší

Aký môže byť postup pri tvorbe webových stránok?

Postupy tvorby webových stránok webových sídiel môžu byť rôzne v závislosti od zadania a ďalších okolností. Aj tu platí, že k tomu istému výsledku je možné sa dopracovať rôznymi postupmi. Preto uvádzame ako príklad len jeden z možných postupov.

Pred samotnou tvorbou webových stránok je potrebné oboznámiť sa s predstavami a požiadavkami zákazníka formou konzultácií. Na základe získaných informácií môže nasledovať vstupná marketingová analýza, v rámci ktorej sa vykonáva napríklad analýza produktov, analýza konkurencie, definovanie cieľov webového sídla, či návrh vhodnej stratégie. Nevyhnutný je aj návrh vhodných vlastností a funkcií, ktoré by mali webové stránky webového sídla obsahovať, návrh štruktúry a rozmiestnenia jednotlivých prvkov obsahu na jednotlivé webové stránky ako aj cenová kalkulácia projektu.

Tvorba grafického návrhu stránok webového sídla je ďalším z krokov, ktorý je potrebné vykonať. Grafický návrh vytvára grafik na základe podkladov vyhotovených v predchádzajúcej etape tvorby webového sídla (štruktúra a rozloženie informácií na webstránke) a po obdržaní všetkých potrebných podkladov od zákazníka. Pokiaľ zákazník má firemný dizajn manuál, grafický návrh webového sídla bude z neho vychádzať (farby, logo a pod.). Grafika (vzhľad) webových stránok webového sídla sa významne podieľa na vytváraní prvého dojmu užívateľa, preto je potrebné sa tomuto kroku náležite venovať. Hotový grafický návrh (zvyčajne domovskej stránky webového sídla) sa predkladá zákazníkovi na schválenie a pripomienkovanie.

Návštevníkov webových stránok síce zaujme pekná grafika, ale sú to práve texty, ktoré informujú a predávajú. Najdôležitejšou súčasťou webových stránok je práve text. Písanie pre web sa nazýva web copywriting alebo všeobecnejšie copywriting. Správny copywriter by mal mať predovšetkým chuť tvorivo pracovať s textom. Mal by byť dostatočne kreatívny, empatický, mal by mať dobré vyjadrovacie schopnosti, znalosti gramatiky, typografie a tiež aj aspoň čiastočné znalosti optimalizácie webových stránok pre vyhľadávače (SEO). Jeho texty by mali byť pútavé, zaujímavé, atraktívne a originálne, ale pritom stručné, jasné a výstižné, správne členené a snáď niekedy aj trošku provokačné, aby zaujali.

Nasleduje programovanie webových stránok a ich plnenie obsahom. Je to práca kóderov a programátorov. Schválený grafický návrh stránok webového sídla sa môže pretransformovať do kódu šablón (technológie HTML a CSS). Následne hotové šablóny môžu programátori implementovať do webovej aplikácie. Po ďalších potrebných programátorských činnostiach a naplnení jednotlivých stránok webového sídla obsahom (texty, obrázky a pod.) nasleduje overovanie validity kódu ako aj kontrola funkčnosti webového sídla.

Ďalším krokom je umiestnenie webového sídla na dočasnej internetovej adrese, kvôli testovaniu webového sídla a náprave chýb, ktoré sa ešte môžu vyskytnúť. Ak ešte nebola urobená voľba a registrácia doménového mena a voľba webhostingových služieb, tak sa teraz urobia. Otestované webové sídlo sa presunie z jeho dočasného umiestnenia na cieľové so zakúpenou doménou, nachádzajúce sa na webovom serveri webhostingovej spoločnosti.

Webové sídlo je hotové, otestované a presunuté na webový server. Tým to však nekončí, nasleduje jeho správa. Do správy webového sídla môžeme zahrnúť činnosti aktualizácie textového alebo grafického obsahu, aktualizáciu odkazov, rôzne zmeny na stránkach týkajúce sa štruktúry, grafiky, popiskov, ďalšej optimalizácie ako aj budovania spätných odkazov. Netreba zabúdať aj na analýzy a ďalšie testovanie webových stránok.

Pre zlepšovanie pozície vo výsledkoch vyhľadávania je okrem optimalizácie kódu webových stránok a optimalizácie obsahu webových stránok potrebné ešte robiť budovanie spätných odkazov. Treba však zabezpečiť aj patričnú propagáciu webového sídla na internete ďalšími internetovými marketingovými prostriedkami ako napríklad prostredníctvom PPC reklamy, banerovej reklamy, newsletterov, PR článkov, diskusných fór, sociálnych sietí...

Webové technológie HTML a CSS – základné technológie na vytváranie webových stránok

HTML je hypertextový značkovací jazyk a CSS je jazyk kaskádových štýlov. Sú to dve základné technológie na vytváranie webových stránok. HTML sa používa na štruktúru a obsah stránok. CSS sa používa na formátovanie tohoto obsahu a jeho umiestnenia na ploche stránky, a to pre rôzne zariadenia.

HTML je z anglického jazyka Hypertext Markup Language skratka pre hypertextový značkovací jazyk (modrým písmom vyznačené písmená tvoria túto skratku).

CSS je z anglického jazyka Cascading Style Sheets skratka pre jazyk kaskádových štýlov (modrým písmom vyznačené písmená tvoria túto skratku).

Webové technológie HTML a CSS sú spolu s grafikou a skriptovaním základom vytvárania statických webových stránok a dynamických webových stránok. Statické webové stránky sú vytvárané prostredníctvom HTML editorov. Dynamické webové stránky sú vytvárané prostredníctvom webových aplikácií.

Pokračovanie v ďalšom článku:
Začíname vytvárať webové stránky