- PDF Free Download

INTERNET, internetová média a tvorba pro Internet

Co se na této přednášce dozvíte? Na jakých principech a technologiích funguje Internet jako (nejen) komunikační médium Jakou roli hrají na Internetu webové stránky Jak vyhledávače zprostředkovávají informace na webových stránkách při vyhledávání

OSNOVA Internet Webové stránky tvorba, aplikace Webové stránky a internetové vyhledávače

Internet Co je to Internet? Celosvětový systém navzájem propojených počítačových sítí Umožňuje sdílení informací a zdrojů Významné komunikační médium I marketingový prostředek a distribuční kanál

Internet Princip komunikace Sítě se skládají z jednotlivých počítačů a síťových propojovacích prvků Počítačové sítě navzájem spojeny přes tzv. uzly Komunikační protokoly = konvence nebo standardy pro komunikaci mezi 2 koncovými body (uzly počítači, atd.) (TCP/IP) Dílčí sítě: akademické, privátní, firemní, vládní Páteřní síť Internetu hlavní linky spojující různé části Internetu (dílčí sítě a klíčové uzly)

Síťové propojovací prvky (switch, router, kabelový modem)

Páteřní síť českého provozovatele CESNET

Internet Trocha významných historických fakt 1969 vytvořena experimentální síť ARPANET 1972 Ray Tomlinson vyvíjí první e-mailový program 1980 specifikace principu IP adresy 1984 vyvinut DNS (Domain Name System) 1987 vzniká pojem Internet 1989 Tim Berners-Lee publikuje návrh konceptu WWW 1990 Tim Berners-Lee a Robert Cailliau publikují koncept hypertextu 2000 250 milionů uživatelů 2011 2,267 miliard uživatelů

Internet IP adresa Každý počítač na Internetu má přiřazenu tzv. IP adresu IP adresa = unikátní identifikátor zařízení v síti IPv4-32 bitové číslo (2 32 možných kombinací) - např. 77.75.72.3 Nová verze: IPv6 (2 128 možných kombinací) např. 2002:0:0:0:0:0:4d4b:4803 Překlad IP adresy do zapamatovatelné podoby => DNS servery (lokální + světové kořenové - 13)

Internet Služby Internetu a používané komunikační protokoly /1 Zprostředkování komunikace uživatelů a sdílení informací = služby Internetu Klíčové služby Internetu: WWW (HTTP, HTTPS) e-mail (SMTP, POP3, IMAP) instant messaging (ICQ, Jabber, MSN, AIM) VoIP (Skype) streamované video (HTTP, RTCP)

Internet Služby Internetu a používané komunikační protokoly /2 přenos souborů (FTP, HTTP) sdílení souborů (BitTorrent) připojení ke vzdálenému počítači (Telnet, SSH) DNS obslužné protokoly (DHCP, SNMP) ostatní služby (např. online hry)

Internet Druhy a formáty informací sdílených v prostředí Internetu Služby Internetu zprostředkují sdílení informací Informace v různých formátech: Text Obrazový materiál (rastry) (GIF, PNG, JPEG, SVG vektorová grafika) Videa (WMV, MPG, AVI, MP4, H.264, WebDL) Zvuk (MP3, WAV)

Co už víme? Internet = systém propojených počítačových sítí Sítě = počítače a síťové propojovací prvky Komunikace = protokoly Identifikace v síti = IP adresa Internet = komunikace uživatelů + sdílení informací v různých formátech prostřednictvím služeb

Webové stránky tvorba, aplikace Význam značkovacích jazyků Informace nejčastěji nacházíme na webových stránkách Informace na stránkách umístěny, popsány a strukturovány pomocí tzv. značkovacího jazyka Hlavní značkovací jazyk pro webové stránky = HTML Značky (tagy) ohraničují jednotlivé části obsahu Další významné zn. jazyky: XML, WSDL, FBML

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8"> <meta name="generator" content="pspad editor, www.pspad.com"> <title>ahoj světe!</title> </head> <body> <p> <div>ahoj světě!</div> </p> <p> <div> Lorem ipsum dolor sit amet consectetuer aliquet vestibulum feugiat egestas sapien. Adipiscing volutpat elit et malesuada neque vel pede non id laoreet. Donec metus et Quisque laoreet Nullam adipiscing leo Quisque elit habitasse. Cum pretium vitae Donec euismodnisl scelerisque tempor laoreet dapibus et. Dolor adipiscing aliquam porttitor et sem eu eros risus eu In. Id condimentum Praesent vitae orci ac. </div> </p> <p> <div><img src="smajlik.jpg"></div> </p> </body> </html> Ukázka webové stránky napsané v jazyce HTML

Stejná webová stránka jak ji vykreslí webový prohlížeč

<SHOP> <SHOPITEM> <PRODUCT> Hlavní motor stejnosměrný </PRODUCT> <DESCRIPTION> Hlavní stejnosměrný motor pro Honey Bee CP 3, s pastorkem </DESCRIPTION> <URL> http://www.airheli-shop.cz/honey-bee-cp3-k250/hlavni-motorstejnosmerny-p888 </URL> <IMGURL> http://www.airheli-shop.cz/prod_obr_m/1075.jpg </IMGURL> <DUES> 0 </DUES> <PRICE_VAT> 300 </PRICE_VAT> </SHOPITEM> </SHOP> Použití jazyka XML k popisu produktů v katalogu e-shopu

Webové stránky tvorba, aplikace Dynamický obsah stránek /1 HTML pouze definice struktury a vlastností NELZE: pracovat s databází, dynamicky měnit části stránky, pracovat se soubory apod. Tzv. skripty toto umožňují Standardní HTML + skripty = pokročilé webové stránky (webové aplikace) Např. e-shopy, vyhledávače, rezervační systémy knihoven, kin, letenek, sociální sítě, srovnávače cen, mapové aplikace )

Webové stránky tvorba, aplikace Dynamický obsah stránek /2 Hlavní programovací jazyky v prostředí Internetu: PHP, ASP, ASP.NET, Flash nebo Silverlight Podpůrné jazyky - specifické funkce: např. Javascript, Python, PERL Webový server musí instrukcím jazyka rozumět (umět je přeložit a zpracovat)

Webové stránky tvorba, aplikace Standardy v prostředí WWW Tvorba na Internetu podřízena standardizaci (W3C www.w3.org) Standardizace = systém omezení, ale i doporučení Smysl standardizace = informační obsah chápán (uživateli) a zpracováván (prohlížeči atd.) jednotně Standardy se publikují v tzv. specifikacích Moderní specifikace standardu HTML: HTML 4.01; HTML 5; XHTML 1.0; XHTML 1.1 Standardizace umožňuje zobrazit obsah stejně i na mobilních zařízeních

Webové stránky tvorba, aplikace Kaskádové styly stránek (CSS) CSS = jazyk (standard) pro formátování obsahu stránek Nahrazuje zastaralé formátování pomocí HTML CSS dokument vymezuje způsob formátování libovolné části stránky (nadpisy, odstavce, odkazy, atd.) CSS = vytváření i řady zajímavých efektů na stránce (především moderní verze CSS 3) Současná nejpoužívanější specifikace: CSS 2.1

Webové stránky tvorba, aplikace WEB 2.0 Pomyslný stupeň vývoje využití Internetu Zahrnuje inovativní principy, technologie a metody práce se stránkami a informačním obsahem v nich: obsah ihned dynamicky tvořený přímo v zobrazené webové stránky (metoda AJAX), syndikace informací (RSS, social bookmarking), sociální sítě (Facebook, Twitter, MySpace, Google+, LinkedIn, Youtube), blogy (blogosféra), wiki systémy, fóra

Našeptávač vyhledávání na Seznam.cz názorná ukázka důmyslnosti technologie AJAX

Co už víme? Informace = povětšinou webové stránky Webové stránky = značkovací jazyk HTML + další podobné = značkovací jazyky Dynamika stránek = skriptovací jazyky Tvorba stránek = standardy WEB 2.0 = vývojový stupeň užívání Internetu = moderní technologie, metody práce s obsahem, sdílení informací apod.

Webové stránky a internetové vyhledávače Vyhledávání informací Informace hlavně v různých formátech Provázány hypertextovými odkazy (linky) Uživatelé buď přesně ví, kde je najít (přesné adresy) nebo využijí služeb internetového vyhledávače Vyhledávače ví o spoustě informací v různých formátech a kde se nacházejí

Webové stránky a internetové vyhledávače Internetové autority Nejznámější internetové autority: Google, W3C Hlídají a ovlivňují relevanci a kvalitu obsahu prostřednictvím standardů a doporučení Tvůrci stránek se jimi musí (v dobrém) řídit Proč? Aby informace na jejich stránkách byly snadno a efektivně dostupné těm, kteří je hledají a potřebují

Webové stránky a internetové vyhledávače Efektivita webových stránek z hlediska vyhledávání Základním nástrojem zvýšení efektivity - SEO (Search Engine Optimization) Techniky zviditelnění obsahu webových stránek Cíl: umístění webové stránky co nejvýše ve výsledcích vyhledávání klíčové fráze nebo slov (vyhledávač) Klíčová slova / fráze = to co uživatelé nejčastěji hledají v rámci nějaké domény reálného světa

Webové stránky a internetové vyhledávače Efektivita webových stránek z hlediska vyhledávání Příklady klíčových slov a frází: zájemci o zahradní služby budou hledat slova a fráze: zahrada, zahradní služby zájemci o dovolenou v zahraničí budou hledat slova a fráze: dovolená, nejlevnější letenky, ubytování student se učící na zkoušku bude hledat slova a fráze: tipovky, vypracované otázky, jak neusnout při učení...

Webové stránky a internetové vyhledávače Katalogový, fulltextový a specializovaný vyhledávač Katalogový vyhledávač elektronický ekvivalent papírového katalogu Stránky zapisují (registrují) autoři ručně do konkrétní tematické sekce Největší katalogy u nás: Najisto.cz, Firmy.cz V zahraniční např.: Yahoo!, DMOZ

Katalogový vyhledávač Firmy.cz

Webové stránky a internetové vyhledávače Katalogový, fulltextový a specializovaný vyhledávač Fulltextový vyhledávač automaticky prohledává Internet Hledá stránky, textové dokumenty, obrázky, které indexuje (stahuje do databáze) Umožňuje uživatelům vyhledat stránku s požadovanými informacemi O prohledávání Internetu se stará tzv. pavouk (crawler) např. Googlebot, Seznambot ad. Nejznámější fulltextové vyhledávače: Google, Seznam.cz, Jyxo, Centrum, Morfeo, Bing, Alexa

Webové stránky a internetové vyhledávače Katalogový, fulltextový a specializovaný vyhledávač Specializovaný vyhledávač zaměřuje se na úzce specializované vyhledávací dotazy Příklady specializovaných vyhledávačů: práce (Jobs.cz, Práce.cz) zboží (Heureka.cz, Zboží.cz srovnávače cen) mapy (Mapy.cz, Google Maps) videa (YouTube.com, Stream.cz) autobazar (Sauto.cz)

1996 IvoLukačovič zakládá Seznam.cz (1. katalogový a vyhledávací server v ČR) LarryPage asergeybrin vytváří v rámci výzkumného Ph.D. projektu vyhledávač GOOGLE 2004

Webové stránky a internetové vyhledávače Faktory ZVYŠUJÍCÍ úspěšnost webových stránek Ovlivnění tzv. on-page a off-page faktorů (SEO) Důležité vždy: klíčová slova a fráze + zajímavý a unikátní obsah na stránce (zajímavý pro návštěvníky = i pro vyhledávače) On-pagefaktory vše co lze ovlivnit na dané stránce (forma a struktura obsahu) Off-page faktory působí zvenčí 2 základní: zpětné odkazy rank stránek

Webové stránky a internetové vyhledávače Nevhodné techniky OMEZUJÍCÍ úspěšnost stránek /1 Nadměrné obchodování s odkazy Tzv. poison words Optimalizace na nesouvisející klíčová slova SEO-not-friendly-URL www.novinky.cz?rubrika=32&clanek=226523 SEO-friendly-URL: www.novinky.cz/vedaskoly/226523-ceske-stredni-skoly-by-melynadchnout-studenty-pro-vedu-shoduji-seodbornici.html

Webové stránky a internetové vyhledávače Nevhodné techniky OMEZUJÍCÍ úspěšnost stránek /2 Příliš mnoho automatického přesměrování Závažné chyby ve zdrojovém kódu Časté změny v adresách na webu Použití nestandardní navigace a další

Webové stránky a internetové vyhledávače ZAKÁZANÉ techniky ( Black hat SEO ) /1 Made for money stránky a odkazové farmy Podvodné odkazy a klamavé přesměrování Opakovaný, nesmyslný text a klíčová slova

Typická odkazová farma (http://www.linkfarm.info/sa/images/splada_closeup.jpg)

Webové stránky a internetové vyhledávače ZAKÁZANÉ techniky ( Black hat SEO ) /2 Mirroring Doménový spam Skrytý text na stránkách Cloaking a další

Webové stránky a internetové vyhledávače Rank webových stránek /1 Ukazatel relativní významnosti stránky Každý vyhledávač má vlastní ukazatel (počítá se obdobným vzorcem) Jeden z hlavních ukazatelů kvality webových stránek Ukazuje správné využití SEO (hlavně ale atraktivní a relevantní obsah) Nejběžnější ranky : Google PageRank (stupnice 0 10) Seznam Rank (S-rank; stupnice 0 10) Jyxorank (stupnice 0 255) Alexa Rank (hlavně v anglosaských zemích; 1 -?)

Webové stránky a internetové vyhledávače Rank webových stránek /2 Celosvětově nejvýznamnější a nejvlivnější je Google Pagerank(PR) Výpočet se po určité době mění PR je v praxi jedním z více než 100 faktorů, ovlivňujících umístění stránky ve výsledcích vyhledávání Často slouží k určení ceny webové domény, dle logiky: vysoký PR = vysoká kvalita = vysoká návštěvnost = vysoké zisky z reklamy

Jak funguje Google PageRank(zjednodušeně)

Shrnutí Internet = významné médium (komunikační, ) Internet = především sdílení informací Informace v různém formátu na webových stránkách Stránky = jazyk HTML + standardy, skripty, technologie Vyhledávání důležitá je kvalita obsahu stránek Umístění stránky = kvalitní obsah i správně použité SEO SEO = pozitivní i negativní výsledky užití technik Ukazatel úspěšnosti stránek = rank (+ další faktory) Nejvýznamnější je Google Pagerank PageRank je používán k určení ceny webové domény

Děkuji za pozornost a uvítám vaše otázky Ing. Radek Němec Katedra systémového inženýrství radek.nemec@vsb.cz Odkaz na přednášku naleznete v mém fakultním profilu