{"id":103,"date":"2020-02-28T20:48:51","date_gmt":"2020-02-28T20:48:51","guid":{"rendered":"https:\/\/ramk.ee\/opikud\/veebidisain\/?post_type=chapter&#038;p=103"},"modified":"2020-05-18T13:33:00","modified_gmt":"2020-05-18T13:33:00","slug":"veebimaailma-areng","status":"publish","type":"chapter","link":"https:\/\/ramk.ee\/opikud\/veebidisain\/chapter\/veebimaailma-areng\/","title":{"rendered":"Veebimaailma areng"},"content":{"raw":"Veebimaailm on l\u00e4bi teinud tohutu arengu. Algselt vaid tekstip\u00f5hisest s\u00fcsteemist on arenenud erinevaid tehnoloogiaid rakendav, praeguseks praktiliselt interneti s\u00fcnon\u00fc\u00fcmiks kujunenud keskkond.\r\n\r\nAlgselt staatilisest veebist (Veeb, mille sisu paikneb valmis HTML-failides. Sellised lehek\u00fcljed tuleb k\u00e4sitsi kodeerida, nende muutmiseks on vaja muuta HTML-koodi. Sobib eelk\u00f5ige v\u00e4he teksti sisaldavate veebisaitide jaoks, mida ei ole vaja kuigi tihti muuta.) on arenetud kiiresti d\u00fcnaamilise veebini (Veeb, mille sisulehed genereeritakse hetkel, mil kasutaja klikib linki v\u00f5i sisestab aadressi. Sellise veebi sisu hoitakse andmebaasis ning monteeritakse lehek\u00fclgedeks programmimootori abil. D\u00fcnaamilist veebi saab hallata l\u00e4bi mugava kasutajaliidese, n\u00f5nda et kasutajatel ei pea olema mingeid tehnilisi teadmisi. Samuti on lihtne vahetada kujundust, luua keeleversioone jne. D\u00fcnaamilist veebi genereerivaid valmistooteid nimetatakse sisuhaldustarkvaraks.), mis on saanud v\u00f5imalikuks l\u00e4bi mitmete programmeerimiskeelte arengu ning on toonud kaasa m\u00f5iste veebiprogrammeerimine. Klassikalist veebi nimetatakse praegu ka \u201eWeb 1.0\u201c.\r\n\r\nOn j\u00f5utud juba m\u00f5isteni Web 2.0, mis v\u00f5imaldab inimestevahelist infovahetust ja koost\u00f6\u00f6d sotsiaalv\u00f5rgustike, vikide (Wiki), veebip\u00e4evikute (ajaveeb ehk blog), RSS-voogude (RSSfeed), \u00fchisj\u00e4rjehoidjate, \u00fchism\u00e4rgendamise, \u00fchistarkvara, veebi-programmiliideste ning mitmesuguste veebiteenuste kaudu. \"Web 2.0\" terminit mainiti esmakordselt O'Reilly Media poolt 2004. aasta konverentsil ja see kannab endas nn. WWW uue versiooni m\u00f5tteviisi.\r\n\r\nPead on t\u00f5stmas ka m\u00f5iste \u201eWeb 3.0\u201c ehk \u201esemantiline veeb\u201c (semantic web), mille puhul sisaldab veeb andmeid, mida arvutid saavad t\u00f6\u00f6delda ja millest uut sisu luua. Tim BernersLee ja Ora Lassila kirjutasid juba 2001. aastal, et senine veeb areneb kohe-kohe semantiliseks veebiks kuid on praeguseks tunnistanud, et areng pole toimunud oodatud kiirusega.\r\n\r\nVeebi arengust saab \u00fclevaate n\u00e4iteks interneti arhiivilehelt <a href=\"http:\/\/www.archive.org\/\" target=\"_blank\" rel=\"noopener noreferrer\">http:\/\/www.archive.org\/<\/a>\r\n\r\nVeeb kui selline hakkab samas oma t\u00e4htsust minetama. Olulisemaks muutub side erinevate seadmete vahel (telefonid, televiisorid, k\u00e4ekellad jms). Asjade omavahelist suhtlust Interneti vahendusel nimetatakse eesti keeles nutistuks (Internet of things).\r\n<h1>Veebidisaini esimene p\u00f5lvkond<\/h1>\r\nEsimese p\u00f5lvkonna veebilehtedeks loetakse 1991 \u2013 1994 loodud lehti. M\u00e4rks\u00f5naks oli: \"Tee leht valmis ja kasutajad tulevad\". Selle aja veebilehed olid peamiselt staatilised - nende struktuur oli primitiivne, koosnes vaid pealkirjadest ning tekstil\u00f5ikudest. Navigeerimiseks kasutati peamiselt tekstiviiteid. Tol ajal olid v\u00e4ga levinud inimeste isiklikud kodulehed (t\u00e4nap\u00e4eval on nende asemel ajaveebid (blog).\r\n\r\nTolle aja veebilehtede kasutajamugavuse suurimaks piiranguks oli tehnoloogia. Turvalisus ja privaatsus olid suureks probleemiks, kuna n\u00f5udsid tehnoloogiat, mis ei olnud veel saadaval. Veebilehtede loomine k\u00e4is s\u00f5na otseses m\u00f5ttes k\u00e4sitsi HTML koodi kirjutades\r\n\r\nEsimese p\u00f5lvkonna veebilehti iseloomustavad k\u00f5ige paremini j\u00e4rgnevad omadused:\r\n<ul>\r\n \t<li>V\u00e4he v\u00e4rve, kuvarid olid v\u00e4ikesed ja n\u00e4itasid sageli ainult mustvalget pilti.<\/li>\r\n \t<li>Andmemahud olid v\u00e4ikesed, lehed lihtsad. Internetiga \u00fchendumiseks kasutati modemeid ja telefoniliine.<\/li>\r\n \t<li>V\u00e4ga palju kasutati kolmandate osapoolte standardiseerimata laiendeid. Seet\u00f5ttu paljud lehed erinevate veebilehitsejatega ei t\u00f6\u00f6tanud.<\/li>\r\n \t<li>Vormidesse salvestatud informatsiooni edastati e-posti abil, kuna puudus v\u00f5imalus info salvestamiseks andmebaasidesse.<\/li>\r\n<\/ul>\r\n[caption id=\"attachment_99\" align=\"aligncenter\" width=\"491\"]<img class=\"wp-image-99 size-full\" src=\"https:\/\/ramk.ee\/opikud\/veebidisain\/wp-content\/uploads\/sites\/2\/2020\/02\/Microsoft-Old-Website.gif\" alt=\"Microsoft esimene koduleht.\" width=\"491\" height=\"553\" \/> Microsoft esimene koduleht (1994).[\/caption]\r\n\r\nTolle aja veebilehtedel oli halvaks tavaks sisu uuendamata j\u00e4tmine, kuna see oli ebamugav. V\u00e4heseid tehnoloogilisi v\u00f5imalusi \"kompenseeriti\" kirjude taustapiltide jms abil.\r\n<h1>Veebidisaini teine p\u00f5lvkond<\/h1>\r\nM\u00e4rks\u00f5naks: \"Reklaami seda, mida m\u00fc\u00fcd, veebis, ning kasutajad tulevad!\". Veebikujunduse strateegia hakkas keskenduma sisule. Suured ja v\u00e4iksed ettev\u00f5tted pidid olema veebis esindatud, kuna see oli interaktiivne, alati ja globaalselt k\u00e4ttesaadav, ning pakkus v\u00f5imaluse esitada tooteinformatsiooni. Hakkas levima h\u00fc\u00fcdlause: \"Kui sind pole internetis, siis pole sind olemas!\".\r\n\r\nVeebilehed kasutasid tavaliselt j\u00e4rgmiseid elemente:\r\n<ul>\r\n \t<li>Intuitiivne ja kasutajas\u00f5bralik navigatsioon.<\/li>\r\n \t<li>Vormide kasutamine.<\/li>\r\n \t<li>Keskendumine sisu peal.<\/li>\r\n \t<li>Tabelid, nupud.<\/li>\r\n \t<li>V\u00e4rvid.<\/li>\r\n \t<li>B\u00e4nnerid, vilkuv tekst ja muud sarnased efektid.<\/li>\r\n \t<li>K\u00fclalisteraamatud.<\/li>\r\n \t<li>K\u00fclastuste arvu loendurid.<\/li>\r\n<\/ul>\r\nTeise p\u00f5lvkonna veebilehtede peamiseks probleemiks oli standardite puudumine. T\u00e4iesti tavap\u00e4rane oli see, et lehed ei t\u00f6\u00f6tanud erinevate veebilehitsejatega \u00fchtemoodi. Selline olukord tekkis Internet Exploreri ja Netscape-i, mis tol hetkel olid brauserite turu liidrid, erinevate t\u00f6\u00f6p\u00f5him\u00f5tete ja laienduste toe t\u00f5ttu.\r\n\r\n[caption id=\"attachment_106\" align=\"aligncenter\" width=\"493\"]<img class=\"wp-image-106 size-full\" src=\"https:\/\/ramk.ee\/opikud\/veebidisain\/wp-content\/uploads\/sites\/2\/2020\/02\/microsoft-web2.gif\" alt=\"microsoft old webpage second wave\" width=\"493\" height=\"555\" \/> Teise p\u00f5lvkonna Microsofti veebilehe n\u00e4ide (1996).[\/caption]\r\n<h1>Veebidisaini kolmas p\u00f5lvkond<\/h1>\r\nKolmanda p\u00f5lvkonna veebilehtede kujundus ja struktuur s\u00f5ltus lehe eesm\u00e4rgist. Kujundus muutus kasutajakeskseks (user centered). Interaktiivsuse ja p\u00f5nevuse lisamiseks v\u00f5eti kasutusele Flash. V\u00e4ga levinud olid portaalid, mis siiamaani pakuvad infot erinevate toodete ja teenuste kohta.\r\n\r\nKolmanda p\u00f5lvkonna veebikujunduse tunnusm\u00e4rgid:\r\n<ul>\r\n \t<li>Veebileht m\u00f5eldud kindlale sihtr\u00fchmale.<\/li>\r\n \t<li>Keskenduti sisule ja mitte tehnoloogiale.<\/li>\r\n \t<li>Intuitiivne, kasutajas\u00f5bralik navigatsioon.<\/li>\r\n \t<li>Tulpade kasutamine.<\/li>\r\n \t<li>Vormide kasutamine.<\/li>\r\n \t<li>Tervituse leht (intro).<\/li>\r\n \t<li>CSS (Cascading Style Sheets) stiililehed.<\/li>\r\n \t<li>Portaalid.<\/li>\r\n<\/ul>\r\n[caption id=\"attachment_108\" align=\"aligncenter\" width=\"500\"]<img class=\"wp-image-108\" src=\"https:\/\/ramk.ee\/opikud\/veebidisain\/wp-content\/uploads\/sites\/2\/2020\/02\/microsoft-website^2002^homepage-290x300.jpg\" alt=\"microsoft webpage 2002\" width=\"500\" height=\"517\" \/> Kolmanda p\u00f5lvkonna Microsofti leht (2002).[\/caption]\r\n<h1>Veebidisaini neljas p\u00f5lvkond<\/h1>\r\nNeljanda p\u00f5lvkonna veebilehtede hulka kuuluvad Web 2.0 rakendused. Neljanda p\u00f5lvkonna kujundus on t\u00f5epoolest interaktiivne. V\u00e4ga palju m\u00f5eldakse kasutamise ja juurdep\u00e4\u00e4setavuse peale. H\u00e4sti kujundatud lehed \u00fcritavad infot visuaalselt struktureerida, ning kasutada intuitiivset navigatsiooni igal lehel. T\u00e4htis on kirjastiili valik ja vastavus standartidele. Veebilehed pole enam staatilised ressursid. K\u00fclastajad saavad muuta lehtede sisu. Wikid ja ajaveebid annavad igale inimesele v\u00f5imaluse avaldada oma arvamust, ning jagada oma\r\nm\u00f5tteid.\r\n\r\nSotsiaalsed v\u00f5rgustikud tekitavad veebip\u00f5hiseid kogukondi (Rate.ee aastast 2002, Facebook aastast 2004, Twitter 2006, Orkut jt).\r\n\r\nSellised tehnoloogiad nagu AJAX (Asynchronous JavaScript and XML) t\u00e4iendavad veebilehtede kujundust. AJAX v\u00f5imaldab info edastamist ilma lehe uuendamata. AJAX-i kasutatakse n\u00e4iteks Windows Live Maps teenuse juures selleks, et v\u00f5imaldada kaartide manipuleerimist ja sisse\/v\u00e4lja suumimist. Lisaks AJAX-ile on laialt kasutusel sellised tehnoloogiad nagu Flash. Neid kasutatakse peamiselt RIA (Rich Internet Applications \u2013 rikka sisuga veebirakendused) rakenduste loomiseks.\r\n\r\n[caption id=\"attachment_110\" align=\"aligncenter\" width=\"500\"]<img class=\"wp-image-110\" src=\"https:\/\/ramk.ee\/opikud\/veebidisain\/wp-content\/uploads\/sites\/2\/2020\/02\/microsoft-website^2009^homepage-windows7.jpg\" alt=\"Neljanda p\u00f5lvkonna Microsofti leht.\" width=\"500\" height=\"405\" \/> Neljanda p\u00f5lvkonna Microsofti leht (2009).[\/caption]\r\n<h1>Praegune aeg<\/h1>\r\nTinglikult v\u00f5iks ehk isegi \u00f6elda, et k\u00e4es on viies p\u00f5lvkond. M\u00e4rks\u00f5nadeks on mobiilsed seadmed, tundlik disain (responsive design) ja avatud kood.\r\n\r\nMobiilne internet v\u00f5imaldab info edastamist mobiiltelefonidele ja teistele kaasaskantavatele nutiseadmetele. \u00dcks mobiilse veebikujunduse peamistest v\u00e4ljakutsetest on see, et v\u00e4ike ekraani suurus tekitab kasutusmugavuse probleeme. Teine v\u00e4ljakutse on lehe korraliku t\u00f6\u00f6 tagamine erinevate seadmetega, mis v\u00f5ivad k\u00e4ituda erinevat moodi. Lahenduseks on standardiseerimine, millega tegeleb W3C.\r\n\r\nV\u00e4ga oluline on HTML5 arendus, v\u00f5imalus veebilehele ilma kolmandate osapoolte tehnoloogiaid kasutamata meediat (heli, video) lisada. Samuti CSS3, mis sisaldab muuhulgas ka vahendeid animatsioonide loomiseks.\r\n\r\nSeni animatsioonide ja interaktiivsete lahenduste loomiseks domineerinud vahend Flash on kaotanud oma t\u00e4htsuse. Flashile esimeseks l\u00f6\u00f6giks oli Apple otsus mitte lisada selle tuge iPhone'ile ja iPad'ile. Sarnaselt ei toetata Flashi Android platvormi uuemates versioonides.\r\n\r\n[caption id=\"attachment_111\" align=\"aligncenter\" width=\"500\"]<img class=\"wp-image-111\" src=\"https:\/\/ramk.ee\/opikud\/veebidisain\/wp-content\/uploads\/sites\/2\/2020\/02\/microsoft-website^2019^homepage.jpg\" alt=\"Microsoft veebileht (2019)\" width=\"500\" height=\"425\" \/> Microsoft veebileht (2019).[\/caption]","rendered":"<p>Veebimaailm on l\u00e4bi teinud tohutu arengu. Algselt vaid tekstip\u00f5hisest s\u00fcsteemist on arenenud erinevaid tehnoloogiaid rakendav, praeguseks praktiliselt interneti s\u00fcnon\u00fc\u00fcmiks kujunenud keskkond.<\/p>\n<p>Algselt staatilisest veebist (Veeb, mille sisu paikneb valmis HTML-failides. Sellised lehek\u00fcljed tuleb k\u00e4sitsi kodeerida, nende muutmiseks on vaja muuta HTML-koodi. Sobib eelk\u00f5ige v\u00e4he teksti sisaldavate veebisaitide jaoks, mida ei ole vaja kuigi tihti muuta.) on arenetud kiiresti d\u00fcnaamilise veebini (Veeb, mille sisulehed genereeritakse hetkel, mil kasutaja klikib linki v\u00f5i sisestab aadressi. Sellise veebi sisu hoitakse andmebaasis ning monteeritakse lehek\u00fclgedeks programmimootori abil. D\u00fcnaamilist veebi saab hallata l\u00e4bi mugava kasutajaliidese, n\u00f5nda et kasutajatel ei pea olema mingeid tehnilisi teadmisi. Samuti on lihtne vahetada kujundust, luua keeleversioone jne. D\u00fcnaamilist veebi genereerivaid valmistooteid nimetatakse sisuhaldustarkvaraks.), mis on saanud v\u00f5imalikuks l\u00e4bi mitmete programmeerimiskeelte arengu ning on toonud kaasa m\u00f5iste veebiprogrammeerimine. Klassikalist veebi nimetatakse praegu ka \u201eWeb 1.0\u201c.<\/p>\n<p>On j\u00f5utud juba m\u00f5isteni Web 2.0, mis v\u00f5imaldab inimestevahelist infovahetust ja koost\u00f6\u00f6d sotsiaalv\u00f5rgustike, vikide (Wiki), veebip\u00e4evikute (ajaveeb ehk blog), RSS-voogude (RSSfeed), \u00fchisj\u00e4rjehoidjate, \u00fchism\u00e4rgendamise, \u00fchistarkvara, veebi-programmiliideste ning mitmesuguste veebiteenuste kaudu. &#8220;Web 2.0&#8221; terminit mainiti esmakordselt O&#8217;Reilly Media poolt 2004. aasta konverentsil ja see kannab endas nn. WWW uue versiooni m\u00f5tteviisi.<\/p>\n<p>Pead on t\u00f5stmas ka m\u00f5iste \u201eWeb 3.0\u201c ehk \u201esemantiline veeb\u201c (semantic web), mille puhul sisaldab veeb andmeid, mida arvutid saavad t\u00f6\u00f6delda ja millest uut sisu luua. Tim BernersLee ja Ora Lassila kirjutasid juba 2001. aastal, et senine veeb areneb kohe-kohe semantiliseks veebiks kuid on praeguseks tunnistanud, et areng pole toimunud oodatud kiirusega.<\/p>\n<p>Veebi arengust saab \u00fclevaate n\u00e4iteks interneti arhiivilehelt <a href=\"http:\/\/www.archive.org\/\" target=\"_blank\" rel=\"noopener noreferrer\">http:\/\/www.archive.org\/<\/a><\/p>\n<p>Veeb kui selline hakkab samas oma t\u00e4htsust minetama. Olulisemaks muutub side erinevate seadmete vahel (telefonid, televiisorid, k\u00e4ekellad jms). Asjade omavahelist suhtlust Interneti vahendusel nimetatakse eesti keeles nutistuks (Internet of things).<\/p>\n<h1>Veebidisaini esimene p\u00f5lvkond<\/h1>\n<p>Esimese p\u00f5lvkonna veebilehtedeks loetakse 1991 \u2013 1994 loodud lehti. M\u00e4rks\u00f5naks oli: &#8220;Tee leht valmis ja kasutajad tulevad&#8221;. Selle aja veebilehed olid peamiselt staatilised &#8211; nende struktuur oli primitiivne, koosnes vaid pealkirjadest ning tekstil\u00f5ikudest. Navigeerimiseks kasutati peamiselt tekstiviiteid. Tol ajal olid v\u00e4ga levinud inimeste isiklikud kodulehed (t\u00e4nap\u00e4eval on nende asemel ajaveebid (blog).<\/p>\n<p>Tolle aja veebilehtede kasutajamugavuse suurimaks piiranguks oli tehnoloogia. Turvalisus ja privaatsus olid suureks probleemiks, kuna n\u00f5udsid tehnoloogiat, mis ei olnud veel saadaval. Veebilehtede loomine k\u00e4is s\u00f5na otseses m\u00f5ttes k\u00e4sitsi HTML koodi kirjutades<\/p>\n<p>Esimese p\u00f5lvkonna veebilehti iseloomustavad k\u00f5ige paremini j\u00e4rgnevad omadused:<\/p>\n<ul>\n<li>V\u00e4he v\u00e4rve, kuvarid olid v\u00e4ikesed ja n\u00e4itasid sageli ainult mustvalget pilti.<\/li>\n<li>Andmemahud olid v\u00e4ikesed, lehed lihtsad. Internetiga \u00fchendumiseks kasutati modemeid ja telefoniliine.<\/li>\n<li>V\u00e4ga palju kasutati kolmandate osapoolte standardiseerimata laiendeid. Seet\u00f5ttu paljud lehed erinevate veebilehitsejatega ei t\u00f6\u00f6tanud.<\/li>\n<li>Vormidesse salvestatud informatsiooni edastati e-posti abil, kuna puudus v\u00f5imalus info salvestamiseks andmebaasidesse.<\/li>\n<\/ul>\n<figure id=\"attachment_99\" aria-describedby=\"caption-attachment-99\" style=\"width: 491px\" class=\"wp-caption aligncenter\"><img class=\"wp-image-99 size-full\" src=\"https:\/\/ramk.ee\/opikud\/veebidisain\/wp-content\/uploads\/sites\/2\/2020\/02\/Microsoft-Old-Website.gif\" alt=\"Microsoft esimene koduleht.\" width=\"491\" height=\"553\" \/><figcaption id=\"caption-attachment-99\" class=\"wp-caption-text\">Microsoft esimene koduleht (1994).<\/figcaption><\/figure>\n<p>Tolle aja veebilehtedel oli halvaks tavaks sisu uuendamata j\u00e4tmine, kuna see oli ebamugav. V\u00e4heseid tehnoloogilisi v\u00f5imalusi &#8220;kompenseeriti&#8221; kirjude taustapiltide jms abil.<\/p>\n<h1>Veebidisaini teine p\u00f5lvkond<\/h1>\n<p>M\u00e4rks\u00f5naks: &#8220;Reklaami seda, mida m\u00fc\u00fcd, veebis, ning kasutajad tulevad!&#8221;. Veebikujunduse strateegia hakkas keskenduma sisule. Suured ja v\u00e4iksed ettev\u00f5tted pidid olema veebis esindatud, kuna see oli interaktiivne, alati ja globaalselt k\u00e4ttesaadav, ning pakkus v\u00f5imaluse esitada tooteinformatsiooni. Hakkas levima h\u00fc\u00fcdlause: &#8220;Kui sind pole internetis, siis pole sind olemas!&#8221;.<\/p>\n<p>Veebilehed kasutasid tavaliselt j\u00e4rgmiseid elemente:<\/p>\n<ul>\n<li>Intuitiivne ja kasutajas\u00f5bralik navigatsioon.<\/li>\n<li>Vormide kasutamine.<\/li>\n<li>Keskendumine sisu peal.<\/li>\n<li>Tabelid, nupud.<\/li>\n<li>V\u00e4rvid.<\/li>\n<li>B\u00e4nnerid, vilkuv tekst ja muud sarnased efektid.<\/li>\n<li>K\u00fclalisteraamatud.<\/li>\n<li>K\u00fclastuste arvu loendurid.<\/li>\n<\/ul>\n<p>Teise p\u00f5lvkonna veebilehtede peamiseks probleemiks oli standardite puudumine. T\u00e4iesti tavap\u00e4rane oli see, et lehed ei t\u00f6\u00f6tanud erinevate veebilehitsejatega \u00fchtemoodi. Selline olukord tekkis Internet Exploreri ja Netscape-i, mis tol hetkel olid brauserite turu liidrid, erinevate t\u00f6\u00f6p\u00f5him\u00f5tete ja laienduste toe t\u00f5ttu.<\/p>\n<figure id=\"attachment_106\" aria-describedby=\"caption-attachment-106\" style=\"width: 493px\" class=\"wp-caption aligncenter\"><img class=\"wp-image-106 size-full\" src=\"https:\/\/ramk.ee\/opikud\/veebidisain\/wp-content\/uploads\/sites\/2\/2020\/02\/microsoft-web2.gif\" alt=\"microsoft old webpage second wave\" width=\"493\" height=\"555\" \/><figcaption id=\"caption-attachment-106\" class=\"wp-caption-text\">Teise p\u00f5lvkonna Microsofti veebilehe n\u00e4ide (1996).<\/figcaption><\/figure>\n<h1>Veebidisaini kolmas p\u00f5lvkond<\/h1>\n<p>Kolmanda p\u00f5lvkonna veebilehtede kujundus ja struktuur s\u00f5ltus lehe eesm\u00e4rgist. Kujundus muutus kasutajakeskseks (user centered). Interaktiivsuse ja p\u00f5nevuse lisamiseks v\u00f5eti kasutusele Flash. V\u00e4ga levinud olid portaalid, mis siiamaani pakuvad infot erinevate toodete ja teenuste kohta.<\/p>\n<p>Kolmanda p\u00f5lvkonna veebikujunduse tunnusm\u00e4rgid:<\/p>\n<ul>\n<li>Veebileht m\u00f5eldud kindlale sihtr\u00fchmale.<\/li>\n<li>Keskenduti sisule ja mitte tehnoloogiale.<\/li>\n<li>Intuitiivne, kasutajas\u00f5bralik navigatsioon.<\/li>\n<li>Tulpade kasutamine.<\/li>\n<li>Vormide kasutamine.<\/li>\n<li>Tervituse leht (intro).<\/li>\n<li>CSS (Cascading Style Sheets) stiililehed.<\/li>\n<li>Portaalid.<\/li>\n<\/ul>\n<figure id=\"attachment_108\" aria-describedby=\"caption-attachment-108\" style=\"width: 500px\" class=\"wp-caption aligncenter\"><img class=\"wp-image-108\" src=\"https:\/\/ramk.ee\/opikud\/veebidisain\/wp-content\/uploads\/sites\/2\/2020\/02\/microsoft-website^2002^homepage-290x300.jpg\" alt=\"microsoft webpage 2002\" width=\"500\" height=\"517\" srcset=\"https:\/\/ramk.ee\/opikud\/veebidisain\/wp-content\/uploads\/sites\/2\/2020\/02\/microsoft-website^2002^homepage-290x300.jpg 290w, https:\/\/ramk.ee\/opikud\/veebidisain\/wp-content\/uploads\/sites\/2\/2020\/02\/microsoft-website^2002^homepage-768x794.jpg 768w, https:\/\/ramk.ee\/opikud\/veebidisain\/wp-content\/uploads\/sites\/2\/2020\/02\/microsoft-website^2002^homepage-65x67.jpg 65w, https:\/\/ramk.ee\/opikud\/veebidisain\/wp-content\/uploads\/sites\/2\/2020\/02\/microsoft-website^2002^homepage-225x233.jpg 225w, https:\/\/ramk.ee\/opikud\/veebidisain\/wp-content\/uploads\/sites\/2\/2020\/02\/microsoft-website^2002^homepage-350x362.jpg 350w, https:\/\/ramk.ee\/opikud\/veebidisain\/wp-content\/uploads\/sites\/2\/2020\/02\/microsoft-website^2002^homepage.jpg 770w\" \/><figcaption id=\"caption-attachment-108\" class=\"wp-caption-text\">Kolmanda p\u00f5lvkonna Microsofti leht (2002).<\/figcaption><\/figure>\n<h1>Veebidisaini neljas p\u00f5lvkond<\/h1>\n<p>Neljanda p\u00f5lvkonna veebilehtede hulka kuuluvad Web 2.0 rakendused. Neljanda p\u00f5lvkonna kujundus on t\u00f5epoolest interaktiivne. V\u00e4ga palju m\u00f5eldakse kasutamise ja juurdep\u00e4\u00e4setavuse peale. H\u00e4sti kujundatud lehed \u00fcritavad infot visuaalselt struktureerida, ning kasutada intuitiivset navigatsiooni igal lehel. T\u00e4htis on kirjastiili valik ja vastavus standartidele. Veebilehed pole enam staatilised ressursid. K\u00fclastajad saavad muuta lehtede sisu. Wikid ja ajaveebid annavad igale inimesele v\u00f5imaluse avaldada oma arvamust, ning jagada oma<br \/>\nm\u00f5tteid.<\/p>\n<p>Sotsiaalsed v\u00f5rgustikud tekitavad veebip\u00f5hiseid kogukondi (Rate.ee aastast 2002, Facebook aastast 2004, Twitter 2006, Orkut jt).<\/p>\n<p>Sellised tehnoloogiad nagu AJAX (Asynchronous JavaScript and XML) t\u00e4iendavad veebilehtede kujundust. AJAX v\u00f5imaldab info edastamist ilma lehe uuendamata. AJAX-i kasutatakse n\u00e4iteks Windows Live Maps teenuse juures selleks, et v\u00f5imaldada kaartide manipuleerimist ja sisse\/v\u00e4lja suumimist. Lisaks AJAX-ile on laialt kasutusel sellised tehnoloogiad nagu Flash. Neid kasutatakse peamiselt RIA (Rich Internet Applications \u2013 rikka sisuga veebirakendused) rakenduste loomiseks.<\/p>\n<figure id=\"attachment_110\" aria-describedby=\"caption-attachment-110\" style=\"width: 500px\" class=\"wp-caption aligncenter\"><img class=\"wp-image-110\" src=\"https:\/\/ramk.ee\/opikud\/veebidisain\/wp-content\/uploads\/sites\/2\/2020\/02\/microsoft-website^2009^homepage-windows7.jpg\" alt=\"Neljanda p\u00f5lvkonna Microsofti leht.\" width=\"500\" height=\"405\" srcset=\"https:\/\/ramk.ee\/opikud\/veebidisain\/wp-content\/uploads\/sites\/2\/2020\/02\/microsoft-website^2009^homepage-windows7.jpg 962w, https:\/\/ramk.ee\/opikud\/veebidisain\/wp-content\/uploads\/sites\/2\/2020\/02\/microsoft-website^2009^homepage-windows7-300x243.jpg 300w, https:\/\/ramk.ee\/opikud\/veebidisain\/wp-content\/uploads\/sites\/2\/2020\/02\/microsoft-website^2009^homepage-windows7-768x623.jpg 768w, https:\/\/ramk.ee\/opikud\/veebidisain\/wp-content\/uploads\/sites\/2\/2020\/02\/microsoft-website^2009^homepage-windows7-65x53.jpg 65w, https:\/\/ramk.ee\/opikud\/veebidisain\/wp-content\/uploads\/sites\/2\/2020\/02\/microsoft-website^2009^homepage-windows7-225x182.jpg 225w, https:\/\/ramk.ee\/opikud\/veebidisain\/wp-content\/uploads\/sites\/2\/2020\/02\/microsoft-website^2009^homepage-windows7-350x284.jpg 350w\" \/><figcaption id=\"caption-attachment-110\" class=\"wp-caption-text\">Neljanda p\u00f5lvkonna Microsofti leht (2009).<\/figcaption><\/figure>\n<h1>Praegune aeg<\/h1>\n<p>Tinglikult v\u00f5iks ehk isegi \u00f6elda, et k\u00e4es on viies p\u00f5lvkond. M\u00e4rks\u00f5nadeks on mobiilsed seadmed, tundlik disain (responsive design) ja avatud kood.<\/p>\n<p>Mobiilne internet v\u00f5imaldab info edastamist mobiiltelefonidele ja teistele kaasaskantavatele nutiseadmetele. \u00dcks mobiilse veebikujunduse peamistest v\u00e4ljakutsetest on see, et v\u00e4ike ekraani suurus tekitab kasutusmugavuse probleeme. Teine v\u00e4ljakutse on lehe korraliku t\u00f6\u00f6 tagamine erinevate seadmetega, mis v\u00f5ivad k\u00e4ituda erinevat moodi. Lahenduseks on standardiseerimine, millega tegeleb W3C.<\/p>\n<p>V\u00e4ga oluline on HTML5 arendus, v\u00f5imalus veebilehele ilma kolmandate osapoolte tehnoloogiaid kasutamata meediat (heli, video) lisada. Samuti CSS3, mis sisaldab muuhulgas ka vahendeid animatsioonide loomiseks.<\/p>\n<p>Seni animatsioonide ja interaktiivsete lahenduste loomiseks domineerinud vahend Flash on kaotanud oma t\u00e4htsuse. Flashile esimeseks l\u00f6\u00f6giks oli Apple otsus mitte lisada selle tuge iPhone&#8217;ile ja iPad&#8217;ile. Sarnaselt ei toetata Flashi Android platvormi uuemates versioonides.<\/p>\n<figure id=\"attachment_111\" aria-describedby=\"caption-attachment-111\" style=\"width: 500px\" class=\"wp-caption aligncenter\"><img class=\"wp-image-111\" src=\"https:\/\/ramk.ee\/opikud\/veebidisain\/wp-content\/uploads\/sites\/2\/2020\/02\/microsoft-website^2019^homepage.jpg\" alt=\"Microsoft veebileht (2019)\" width=\"500\" height=\"425\" srcset=\"https:\/\/ramk.ee\/opikud\/veebidisain\/wp-content\/uploads\/sites\/2\/2020\/02\/microsoft-website^2019^homepage.jpg 1844w, https:\/\/ramk.ee\/opikud\/veebidisain\/wp-content\/uploads\/sites\/2\/2020\/02\/microsoft-website^2019^homepage-300x255.jpg 300w, https:\/\/ramk.ee\/opikud\/veebidisain\/wp-content\/uploads\/sites\/2\/2020\/02\/microsoft-website^2019^homepage-1024x870.jpg 1024w, https:\/\/ramk.ee\/opikud\/veebidisain\/wp-content\/uploads\/sites\/2\/2020\/02\/microsoft-website^2019^homepage-768x652.jpg 768w, https:\/\/ramk.ee\/opikud\/veebidisain\/wp-content\/uploads\/sites\/2\/2020\/02\/microsoft-website^2019^homepage-1536x1304.jpg 1536w, https:\/\/ramk.ee\/opikud\/veebidisain\/wp-content\/uploads\/sites\/2\/2020\/02\/microsoft-website^2019^homepage-65x55.jpg 65w, https:\/\/ramk.ee\/opikud\/veebidisain\/wp-content\/uploads\/sites\/2\/2020\/02\/microsoft-website^2019^homepage-225x191.jpg 225w, https:\/\/ramk.ee\/opikud\/veebidisain\/wp-content\/uploads\/sites\/2\/2020\/02\/microsoft-website^2019^homepage-350x297.jpg 350w\" \/><figcaption id=\"caption-attachment-111\" class=\"wp-caption-text\">Microsoft veebileht (2019).<\/figcaption><\/figure>\n","protected":false},"author":1,"menu_order":3,"template":"","meta":{"_mi_skip_tracking":false,"pb_show_title":"on","pb_short_title":"","pb_subtitle":"","pb_authors":[],"pb_section_license":""},"chapter-type":[],"contributor":[],"license":[],"part":3,"_links":{"self":[{"href":"https:\/\/ramk.ee\/opikud\/veebidisain\/wp-json\/pressbooks\/v2\/chapters\/103"}],"collection":[{"href":"https:\/\/ramk.ee\/opikud\/veebidisain\/wp-json\/pressbooks\/v2\/chapters"}],"about":[{"href":"https:\/\/ramk.ee\/opikud\/veebidisain\/wp-json\/wp\/v2\/types\/chapter"}],"author":[{"embeddable":true,"href":"https:\/\/ramk.ee\/opikud\/veebidisain\/wp-json\/wp\/v2\/users\/1"}],"version-history":[{"count":8,"href":"https:\/\/ramk.ee\/opikud\/veebidisain\/wp-json\/pressbooks\/v2\/chapters\/103\/revisions"}],"predecessor-version":[{"id":876,"href":"https:\/\/ramk.ee\/opikud\/veebidisain\/wp-json\/pressbooks\/v2\/chapters\/103\/revisions\/876"}],"part":[{"href":"https:\/\/ramk.ee\/opikud\/veebidisain\/wp-json\/pressbooks\/v2\/parts\/3"}],"metadata":[{"href":"https:\/\/ramk.ee\/opikud\/veebidisain\/wp-json\/pressbooks\/v2\/chapters\/103\/metadata\/"}],"wp:attachment":[{"href":"https:\/\/ramk.ee\/opikud\/veebidisain\/wp-json\/wp\/v2\/media?parent=103"}],"wp:term":[{"taxonomy":"chapter-type","embeddable":true,"href":"https:\/\/ramk.ee\/opikud\/veebidisain\/wp-json\/pressbooks\/v2\/chapter-type?post=103"},{"taxonomy":"contributor","embeddable":true,"href":"https:\/\/ramk.ee\/opikud\/veebidisain\/wp-json\/wp\/v2\/contributor?post=103"},{"taxonomy":"license","embeddable":true,"href":"https:\/\/ramk.ee\/opikud\/veebidisain\/wp-json\/wp\/v2\/license?post=103"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}