{"id":259,"date":"2020-03-03T20:06:19","date_gmt":"2020-03-03T20:06:19","guid":{"rendered":"https:\/\/ramk.ee\/opikud\/veebidisain\/?post_type=chapter&#038;p=259"},"modified":"2020-05-23T16:22:59","modified_gmt":"2020-05-23T16:22:59","slug":"programmid","status":"publish","type":"chapter","link":"https:\/\/ramk.ee\/opikud\/veebidisain\/chapter\/programmid\/","title":{"rendered":"Programmid"},"content":{"raw":"T\u00e4nap\u00e4eval luuakse veebilehti tavaliselt kasutades professionaalseid tasulisi tarkvaraarendusrakendusi. K\u00fcll aga v\u00f5ib HTML, CSS ja JavaScript \u00f5ppimiseks esialgu kasutada ka lihtsamaid programme.\r\n\r\nN\u00e4iteks v\u00f5ite te kasutada juba Windowsiga kaasasolevat programmi Notepad v\u00f5i Maciga kaasasolevat programmi TextEdit.\r\n\r\nAntud veebi\u00f5piku n\u00e4idetes\u00a0 ja videojuhendites leiab kasutust vabavaraline programm Notepad++, mille k\u00f5ige uuema versiooni saate alla laadida aadressilt: <a href=\"https:\/\/notepad-plus-plus.org\/downloads\/\" target=\"_blank\" rel=\"noopener noreferrer\">https:\/\/notepad-plus-plus.org\/downloads\/<\/a> (T\u00e4helepanu: Notepad++ on saadaval ainult Windows operatsioonis\u00fcsteemile).\r\n\r\n[caption id=\"attachment_266\" align=\"aligncenter\" width=\"500\"]<img class=\"wp-image-266\" src=\"https:\/\/ramk.ee\/opikud\/veebidisain\/wp-content\/uploads\/sites\/2\/2020\/03\/notepadplusplus.png\" alt=\"Programm Notepad++\" width=\"500\" height=\"417\" \/> Programm Notepad++[\/caption]\r\n<h1>Maci kasutajatele<\/h1>\r\nMaci kasutajatele soovitan kasutada vabavaralist programmi Atom, mille saate alla laadida aadressilt: <a href=\"https:\/\/atom.io\/\" target=\"_blank\" rel=\"noopener noreferrer\">https:\/\/atom.io\/<\/a>.\r\nKlikkige veebilehel lingile \"Other platforms\" ning valige endale sobiva operatsioonis\u00fcsteemi versioon.\r\n\r\n[caption id=\"attachment_260\" align=\"aligncenter\" width=\"500\"]<img class=\"wp-image-260\" src=\"https:\/\/ramk.ee\/opikud\/veebidisain\/wp-content\/uploads\/sites\/2\/2020\/03\/atom-300x236.png\" alt=\"Tekstiredaktor Atom\" width=\"500\" height=\"394\" \/> Tekstiredaktor Atom[\/caption]\r\n<h1>Veebip\u00f5hised teenused<\/h1>\r\nLihtsamaid HTML koodijuppe v\u00f5ite kirjutada ja testida ka veebip\u00f5histes tekstiredaktorites, kus \u00fches aknas saate kirjutada koodi ning teises aknas n\u00e4ete ka kohe tulemust.\r\n\r\nN\u00e4iteks W3School veebip\u00f5hine teenus: <a href=\"https:\/\/www.w3schools.com\/html\/tryit.asp?filename=tryhtml_default\">https:\/\/www.w3schools.com\/html\/tryit.asp?filename=tryhtml_default<\/a>\r\n<h1>Esimese dokumendi loomine<\/h1>\r\nP\u00e4rast sobiliku programmi (allalaadimist, instlleerimist ja) avamist loome oma esimese HTML dokumendi. Selleks kirjutame v\u00f5i kopeerime oma dokumenti jupi koodi:\r\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"html\">&lt;!DOCTYPE html&gt;\r\n&lt;html&gt;\r\n&lt;body&gt;\r\n&lt;h1&gt;Tere, maailm!&lt;\/h1&gt;\r\n&lt;p&gt;Minu esimene peat\u00fckk.&lt;\/p&gt;\r\n&lt;\/body&gt;\r\n&lt;\/html&gt;<\/pre>\r\nP\u00e4rast seda salvestame file arvutisse (File -&gt; Save as) ning paneme faili nimeks index.html.\r\n\r\nAvame kausta, kuhu oma faili salvestasime ning teeme sellel topeltkliki. Fail avatakse meie poolt kasutatavas brauseris.\r\n\r\n<iframe src=\"https:\/\/www.youtube.com\/embed\/17A4dsl_KQQ?rel=0\" width=\"560\" height=\"315\" frameborder=\"0\" allowfullscreen=\"allowfullscreen\"><span data-mce-type=\"bookmark\" style=\"display: inline-block; width: 0px; overflow: hidden; line-height: 0;\" class=\"mce_SELRES_start\">\ufeff<\/span><\/iframe>","rendered":"<p>T\u00e4nap\u00e4eval luuakse veebilehti tavaliselt kasutades professionaalseid tasulisi tarkvaraarendusrakendusi. K\u00fcll aga v\u00f5ib HTML, CSS ja JavaScript \u00f5ppimiseks esialgu kasutada ka lihtsamaid programme.<\/p>\n<p>N\u00e4iteks v\u00f5ite te kasutada juba Windowsiga kaasasolevat programmi Notepad v\u00f5i Maciga kaasasolevat programmi TextEdit.<\/p>\n<p>Antud veebi\u00f5piku n\u00e4idetes\u00a0 ja videojuhendites leiab kasutust vabavaraline programm Notepad++, mille k\u00f5ige uuema versiooni saate alla laadida aadressilt: <a href=\"https:\/\/notepad-plus-plus.org\/downloads\/\" target=\"_blank\" rel=\"noopener noreferrer\">https:\/\/notepad-plus-plus.org\/downloads\/<\/a> (T\u00e4helepanu: Notepad++ on saadaval ainult Windows operatsioonis\u00fcsteemile).<\/p>\n<figure id=\"attachment_266\" aria-describedby=\"caption-attachment-266\" style=\"width: 500px\" class=\"wp-caption aligncenter\"><img class=\"wp-image-266\" src=\"https:\/\/ramk.ee\/opikud\/veebidisain\/wp-content\/uploads\/sites\/2\/2020\/03\/notepadplusplus.png\" alt=\"Programm Notepad++\" width=\"500\" height=\"417\" srcset=\"https:\/\/ramk.ee\/opikud\/veebidisain\/wp-content\/uploads\/sites\/2\/2020\/03\/notepadplusplus.png 834w, https:\/\/ramk.ee\/opikud\/veebidisain\/wp-content\/uploads\/sites\/2\/2020\/03\/notepadplusplus-300x250.png 300w, https:\/\/ramk.ee\/opikud\/veebidisain\/wp-content\/uploads\/sites\/2\/2020\/03\/notepadplusplus-768x641.png 768w, https:\/\/ramk.ee\/opikud\/veebidisain\/wp-content\/uploads\/sites\/2\/2020\/03\/notepadplusplus-65x54.png 65w, https:\/\/ramk.ee\/opikud\/veebidisain\/wp-content\/uploads\/sites\/2\/2020\/03\/notepadplusplus-225x188.png 225w, https:\/\/ramk.ee\/opikud\/veebidisain\/wp-content\/uploads\/sites\/2\/2020\/03\/notepadplusplus-350x292.png 350w\" \/><figcaption id=\"caption-attachment-266\" class=\"wp-caption-text\">Programm Notepad++<\/figcaption><\/figure>\n<h1>Maci kasutajatele<\/h1>\n<p>Maci kasutajatele soovitan kasutada vabavaralist programmi Atom, mille saate alla laadida aadressilt: <a href=\"https:\/\/atom.io\/\" target=\"_blank\" rel=\"noopener noreferrer\">https:\/\/atom.io\/<\/a>.<br \/>\nKlikkige veebilehel lingile &#8220;Other platforms&#8221; ning valige endale sobiva operatsioonis\u00fcsteemi versioon.<\/p>\n<figure id=\"attachment_260\" aria-describedby=\"caption-attachment-260\" style=\"width: 500px\" class=\"wp-caption aligncenter\"><img class=\"wp-image-260\" src=\"https:\/\/ramk.ee\/opikud\/veebidisain\/wp-content\/uploads\/sites\/2\/2020\/03\/atom-300x236.png\" alt=\"Tekstiredaktor Atom\" width=\"500\" height=\"394\" srcset=\"https:\/\/ramk.ee\/opikud\/veebidisain\/wp-content\/uploads\/sites\/2\/2020\/03\/atom-300x236.png 300w, https:\/\/ramk.ee\/opikud\/veebidisain\/wp-content\/uploads\/sites\/2\/2020\/03\/atom-768x605.png 768w, https:\/\/ramk.ee\/opikud\/veebidisain\/wp-content\/uploads\/sites\/2\/2020\/03\/atom-65x51.png 65w, https:\/\/ramk.ee\/opikud\/veebidisain\/wp-content\/uploads\/sites\/2\/2020\/03\/atom-225x177.png 225w, https:\/\/ramk.ee\/opikud\/veebidisain\/wp-content\/uploads\/sites\/2\/2020\/03\/atom-350x276.png 350w, https:\/\/ramk.ee\/opikud\/veebidisain\/wp-content\/uploads\/sites\/2\/2020\/03\/atom.png 993w\" \/><figcaption id=\"caption-attachment-260\" class=\"wp-caption-text\">Tekstiredaktor Atom<\/figcaption><\/figure>\n<h1>Veebip\u00f5hised teenused<\/h1>\n<p>Lihtsamaid HTML koodijuppe v\u00f5ite kirjutada ja testida ka veebip\u00f5histes tekstiredaktorites, kus \u00fches aknas saate kirjutada koodi ning teises aknas n\u00e4ete ka kohe tulemust.<\/p>\n<p>N\u00e4iteks W3School veebip\u00f5hine teenus: <a href=\"https:\/\/www.w3schools.com\/html\/tryit.asp?filename=tryhtml_default\">https:\/\/www.w3schools.com\/html\/tryit.asp?filename=tryhtml_default<\/a><\/p>\n<h1>Esimese dokumendi loomine<\/h1>\n<p>P\u00e4rast sobiliku programmi (allalaadimist, instlleerimist ja) avamist loome oma esimese HTML dokumendi. Selleks kirjutame v\u00f5i kopeerime oma dokumenti jupi koodi:<\/p>\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"html\">&lt;!DOCTYPE html&gt;\r\n&lt;html&gt;\r\n&lt;body&gt;\r\n&lt;h1&gt;Tere, maailm!&lt;\/h1&gt;\r\n&lt;p&gt;Minu esimene peat\u00fckk.&lt;\/p&gt;\r\n&lt;\/body&gt;\r\n&lt;\/html&gt;<\/pre>\n<p>P\u00e4rast seda salvestame file arvutisse (File -&gt; Save as) ning paneme faili nimeks index.html.<\/p>\n<p>Avame kausta, kuhu oma faili salvestasime ning teeme sellel topeltkliki. Fail avatakse meie poolt kasutatavas brauseris.<\/p>\n<p><iframe src=\"https:\/\/www.youtube.com\/embed\/17A4dsl_KQQ?rel=0\" width=\"560\" height=\"315\" frameborder=\"0\" allowfullscreen=\"allowfullscreen\"><span data-mce-type=\"bookmark\" style=\"display: inline-block; width: 0px; overflow: hidden; line-height: 0;\" class=\"mce_SELRES_start\">\ufeff<\/span><\/iframe><\/p>\n","protected":false},"author":1,"menu_order":1,"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":25,"_links":{"self":[{"href":"https:\/\/ramk.ee\/opikud\/veebidisain\/wp-json\/pressbooks\/v2\/chapters\/259"}],"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":14,"href":"https:\/\/ramk.ee\/opikud\/veebidisain\/wp-json\/pressbooks\/v2\/chapters\/259\/revisions"}],"predecessor-version":[{"id":595,"href":"https:\/\/ramk.ee\/opikud\/veebidisain\/wp-json\/pressbooks\/v2\/chapters\/259\/revisions\/595"}],"part":[{"href":"https:\/\/ramk.ee\/opikud\/veebidisain\/wp-json\/pressbooks\/v2\/parts\/25"}],"metadata":[{"href":"https:\/\/ramk.ee\/opikud\/veebidisain\/wp-json\/pressbooks\/v2\/chapters\/259\/metadata\/"}],"wp:attachment":[{"href":"https:\/\/ramk.ee\/opikud\/veebidisain\/wp-json\/wp\/v2\/media?parent=259"}],"wp:term":[{"taxonomy":"chapter-type","embeddable":true,"href":"https:\/\/ramk.ee\/opikud\/veebidisain\/wp-json\/pressbooks\/v2\/chapter-type?post=259"},{"taxonomy":"contributor","embeddable":true,"href":"https:\/\/ramk.ee\/opikud\/veebidisain\/wp-json\/wp\/v2\/contributor?post=259"},{"taxonomy":"license","embeddable":true,"href":"https:\/\/ramk.ee\/opikud\/veebidisain\/wp-json\/wp\/v2\/license?post=259"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}