{"id":19872,"date":"2020-06-30T10:27:59","date_gmt":"2020-06-30T08:27:59","guid":{"rendered":"https:\/\/www.websupport.sk\/blog\/?p=19872"},"modified":"2025-03-11T21:07:45","modified_gmt":"2025-03-11T20:07:45","slug":"ako-setrit-cas-pri-praci-s-html-a-css","status":"publish","type":"post","link":"https:\/\/www.websupport.sk\/blog\/2020\/06\/ako-setrit-cas-pri-praci-s-html-a-css\/","title":{"rendered":"Ako \u0161etri\u0165 \u010das pri pr\u00e1ci s HTML a CSS"},"content":{"rendered":"Doba \u010d\u00edtania:<\/b><\/span> 4<\/span> min.<\/span><\/span>\n

Cel\u00fd svet sa za\u010dal v\u00a0posledn\u00fdch mesiacoch pres\u00fava\u0165 do online priestoru. Ak c\u00edtite va\u0161u \u0161ancu, vid\u00edte sa ako bud\u00faci front-end developer a HTML s\u00a0CSS<\/a> v\u00e1m u\u017e nie je a\u017e tak cudzie, prin\u00e1\u0161ame v\u00e1m nieko\u013eko tipov, ako si niektor\u00e9 \u010dasti pr\u00e1ce u\u013eah\u010di\u0165, aby ste mali viac \u010dasu sa venova\u0165 t\u00fdm zlo\u017eitej\u0161\u00edm.<\/p>\n\n\n\n

Mozilla developer network<\/a><\/h2>\n\n\n\n

MDN patr\u00ed celosvetovo k najre\u0161pektovanej\u0161\u00edm open webom pre web dizajn\u00e9rov, kde n\u00e1jdete ve\u013emi dobre spracovan\u00e9 tutori\u00e1ly k r\u00f4znym technol\u00f3gi\u00e1m ako napr\u00edklad HTML, CSS alebo JavaScript aj s praktick\u00fdm vysvetlen\u00edm a mo\u017enos\u0165ou si niektor\u00e9 veci vysk\u00fa\u0161a\u0165. Ve\u013emi obdobn\u00fdm a taktie\u017e \u010dasto vyu\u017e\u00edvan\u00fdm webom je  w3schools.com<\/a>.<\/p>\n\n\n\n

Stack Overflow<\/a><\/h2>\n\n\n\n

Je to najv\u00e4\u010d\u0161ia online komunita zdru\u017euj\u00faca v\u00fdvoj\u00e1rov z cel\u00e9ho sveta, navy\u0161e ochotn\u00fdch pom\u00f4c\u0165 ke\u010f treba. Nenahradite\u013en\u00fdm zdrojom inform\u00e1ci\u00ed je Stack Overflow f\u00f3rum. Ak toti\u017eto naraz\u00edte na probl\u00e9m, u\u017e ho tam ur\u010dite pred vami niekto rie\u0161il.<\/p>\n\n\n\n

Jak ps\u00e1t web<\/a><\/h2>\n\n\n\n

OK, toto nie je celosvetovo uzn\u00e1van\u00fd web, ale m\u00e1 svoje opodstatnenie. Pri n\u00e1v\u0161teve tohto webu nedajte na prv\u00fd dojem. Za \u0161tandardn\u00fdch okolnost\u00ed obal s\u00edce pred\u00e1va, ale t\u00e1to str\u00e1nka je typick\u00fdm pr\u00edkladom toho, \u017ee pr\u00e1ve obsah je d\u00f4le\u017eit\u00fd. Najm\u00e4 za\u010diato\u010dn\u00edci tu n\u00e1jdu ve\u013ea u\u017eito\u010dn\u00fdch r\u00e1d ako funguje HTML alebo CSS. V\u00fdhodou pre menej zdatn\u00fdch v anglickom jazyku je, \u017ee v\u0161etko je p\u00edsan\u00e9 a vysvet\u013eovan\u00e9 v \u010de\u0161tine.<\/p>\n\n\n\n

BRM<\/a><\/h2>\n\n\n\n

Kde by v\u0161etci za\u010d\u00ednaj\u00faci program\u00e1tori na Slovensku boli bez Yablka. Na jeho blogu n\u00e1jdete ve\u013ea kurzov, alebo u\u017eito\u010dn\u00fdch inform\u00e1ci\u00ed, ako napr\u00edklad aj CSS tipy a triky<\/a>. Tento konkr\u00e9tny \u010dl\u00e1nok je s\u00edce tro\u0161ku star\u0161ieho d\u00e1tumu, ale v\u00e4\u010d\u0161ina jeho obsahu je st\u00e1le aktu\u00e1lna. <\/p>\n\n\n\n

VS CODE EXTENSIONS<\/a><\/h2>\n\n\n\n

Extensions… Ak ste siahli po vo\u013ene dostupn\u00fdch code editoroch ako napr\u00edklad Sublime Text<\/a>, alebo v s\u00fa\u010dasnosti ve\u013emi ob\u013e\u00faben\u00fd Visual Studio Code<\/a>, je dobr\u00e9 ma\u0165 nain\u0161talovan\u00fd aspo\u0148 z\u00e1kladn\u00fd bal\u00edk roz\u0161\u00edren\u00ed odpor\u00fa\u010dan\u00fdch pre web develop\u00e9rov. N\u00e1jdete tu ve\u013ea zoznamov, pri ktor\u00fdch zist\u00edte, \u017ee sa v nich opakuje 5-6 MUST HAVE roz\u0161\u00edren\u00ed.<\/p>\n\n\n\n

Reset.css<\/a><\/h2>\n\n\n\n

Reset.css je overen\u00e1 klasika aktualizovan\u00e1 na HTML5. Alternat\u00edvou je pr\u00edpadne normalize.css. Jeden z t\u00fdchto s\u00faborov chcete ma\u0165 ur\u010dite nalinkovan\u00fd vo va\u0161om HTML. Aj ke\u010f na to ide ka\u017ed\u00fd inak, ich cie\u013eom je eliminova\u0165 rozdielnosti v zobrazovan\u00ed v\u00e1\u0161ho webu v r\u00f4znych prehliada\u010doch. Zatia\u013e \u010do reset.css doslova v\u0161etko vynuluje a je potrebn\u00e9 si vo vlastnom stylesheet<\/em> pod\u013ea va\u0161ich potrieb v\u0161etko na\u0161t\u00fdlova\u0165. Normalize.css u\u017e obsahuje preddefinovan\u00e9, \u0161tandardne zau\u017e\u00edvan\u00e9 \u0161t\u00fdly jednotliv\u00fdch HTML elementov.<\/p>\n\n\n\n

Bootstrap<\/a><\/h2>\n\n\n\n

Bezpochyby je to najpopul\u00e1rnej\u0161\u00ed front-end framework alebo ak chcete kni\u017enica komponentov a open source projekt na svete. U\u017e d\u00e1vno sa zistilo, \u017ee netreba vym\u00fd\u0161\u013ea\u0165 to, \u010do je u\u017e vymyslen\u00e9, \u017ee aj tak v\u0161etci v\u0161etko kop\u00edruj\u00fa a ono to prekvapivo funguje. Bootstrap pon\u00faka mno\u017estvo vo\u013ene dostupn\u00fdch komponentov pre v\u00e1\u0161 web v r\u00f4znych vari\u00e1ci\u00e1ch, ktor\u00fdch dostupn\u00fd HTML k\u00f3d sta\u010d\u00ed skop\u00edrova\u0165 a prida\u0165 tam, kde ho chcete na va\u0161ej webke ma\u0165. <\/p>\n\n\n\n

K\u00f3d si sta\u010d\u00ed upravi\u0165 pod\u013ea va\u0161ich potrieb a ma\u0165 vo va\u0161om HTML nalinkovan\u00e9 zdrojov\u00e9 CSS a JavaScript s\u00fabory. Nie je to ni\u010d zlo\u017eit\u00e9, bootstrap v\u00e1s t\u00fdm prevedie. Ka\u017ed\u00fd jeden komponent viete \u0161t\u00fdlovan\u00edm vo va\u0161om stylesheet.css privies\u0165 k vizu\u00e1lnej dokonalosti. Tu plat\u00ed len to, \u017ee v\u00e1\u0161 CSS s\u00fabor mus\u00ed by\u0165 nalinkovan\u00fd v HTML pod bootstrap CSS s\u00faborom. To skuto\u010dn\u00e9 \u010daro bootstrapu ale je, \u017ee v\u0161etky komponenty s\u00fa vytvoren\u00e9 Mobile-first pr\u00edstupom a s\u00fa 100%  responz\u00edvne.<\/p>\n\n\n\n

Ak preferujete vytv\u00e1ranie layoutu flexbox<\/em> sp\u00f4sobom, potom ide\u00e1lnym miestom pre h\u013eadanie komponentov je obdoba Bootstrapu \u2013 Bulma.io<\/a><\/p>\n\n\n\n

FlexBox Cheatsheet<\/a><\/h2>\n\n\n\n

Ke\u010f u\u017e spom\u00edname flexbox. FlexBox Cheatsheet v\u00e1s prevedie ve\u013emi jednoduch\u00fdmi krokmi ako nastavi\u0165 hodnoty CSS vlastnost\u00ed flexovan\u00fdch elementov tak, aby ste sa dopracovali k vami po\u017eadovan\u00e9mu layoutu.<\/p>\n\n\n\n

Boxshadow CSS generator<\/a><\/h2>\n\n\n\n

Tak\u00e9to gener\u00e1tory s\u00fa skvel\u00ed pomocn\u00edci na vytv\u00e1ranie tie\u0148ov\u00e9ho efektu oba\u013eovac\u00edch elementov.  U\u0161etria ve\u013ea \u010dasu s h\u013eadan\u00edm ide\u00e1lnych box-shadow <\/em>hodn\u00f4t. Dnes s\u00fa u grafikov ve\u013emi ob\u013e\u00faben\u00e9 long shadow<\/em> gener\u00e1tory.<\/p>\n\n\n\n

Tinypng<\/a><\/h2>\n\n\n\n

Pou\u017e\u00edvate ve\u013ea obr\u00e1zkov s vysok\u00fdm rozl\u00ed\u0161en\u00edm na va\u0161om webe a za\u010dalo sa to odr\u00e1\u017ea\u0165 na r\u00fdchlosti na\u010d\u00edtania str\u00e1nky? Neocenite\u013en\u00fd n\u00e1stroj na zmen\u0161ovanie ich ve\u013ekosti tak, aby rozdiel v kvalite bol \u201enepostrehnute\u013en\u00fd\u201c, je Tinypng. Tento pomocn\u00edk selekt\u00edvne zn\u00ed\u017ei po\u010det farieb v obr\u00e1zku. V\u00fdsledok je skoro nepostrehnute\u013en\u00fd, no sprav\u00ed obrovsk\u00fd rozdiel v jeho v\u00fdslednej ve\u013ekosti.<\/p>\n\n\n\n

PIXLR<\/a><\/h2>\n\n\n\n

Ak predsa len potrebujete spravi\u0165 r\u00fdchlu \u00fapravu obr\u00e1zkov a v\u00e1\u0161 grafik na v\u00e1s nem\u00e1 \u010das, m\u00f4\u017eete vysk\u00fa\u0161a\u0165 tento bezplatn\u00fd online editor. Dok\u00e1\u017ee otvori\u0165 a pracova\u0165 s r\u00f4znymi form\u00e1tmi a pon\u00faka \u0161irok\u00fa \u0161k\u00e1lu mo\u017enost\u00ed.<\/p>\n\n\n\n

MDN Color Picker<\/a> alebo<\/strong> Adobe Color<\/a><\/h2>\n\n\n\n

Obidva tieto n\u00e1stroje v\u00e1m pom\u00f4\u017eu r\u00fdchlo n\u00e1js\u0165 vhodn\u00fa farbu pre v\u00e1\u0161 HTML element a pon\u00faknu v\u00e1m jej CSS hodnotu v RGB alebo hexadecim\u00e1lnom tvare.  Adobe Color navy\u0161e pon\u00faka ve\u013ea zauj\u00edmav\u00fdch features.<\/p>\n\n\n\n

Social media Icons<\/a><\/h2>\n\n\n\n

Ak h\u013ead\u00e1te ikony, ktor\u00e9 zapadn\u00fa do v\u00e1\u0161ho dizajnu, vysk\u00fa\u0161ajte tento web. Pon\u00faka ich r\u00f4zne vari\u00e1cie a grafick\u00e9 spracovanie.<\/p>\n\n\n\n

Ale…!<\/strong><\/h2>\n\n\n\n

Aj ke\u010f je na\u0161ou snahou u\u013eah\u010di\u0165<\/em> v\u00e1m pr\u00e1cu s HTML a CSS, d\u00f4le\u017eit\u00e9 je sk\u00fa\u0161a\u0165, vym\u00fd\u0161\u013ea\u0165 a p\u00edsa\u0165 vlastn\u00e9 veci. Ka\u017ed\u00fd jeden program\u00e1tor v\u00e1m povie, \u017ee za \u00faspechom s\u00fa schovan\u00e9 kilometre zbyto\u010dn\u00e9ho alebo nefunguj\u00faceho k\u00f3du. Najm\u00e4 zo za\u010diatku. Nakoniec, nie je lep\u0161ieho pocitu, ako si svojpomocne dokon\u010di\u0165 po dvoch d\u0148och p\u00edsania k\u00f3du a preplakanej noci napr\u00edklad vlastn\u00fd responz\u00edvny navigation bar s animovan\u00fdm hamburger menu a pri tom sa e\u0161te nau\u010di\u0165 \u010do to o JavaScripte a JQuery.<\/em><\/p>\n","protected":false},"excerpt":{"rendered":"

Cel\u00fd svet sa za\u010dal v\u00a0posledn\u00fdch mesiacoch pres\u00fava\u0165 do online priestoru. Ak c\u00edtite va\u0161u \u0161ancu, vid\u00edte sa ako bud\u00faci front-end developer a HTML s\u00a0CSS v\u00e1m u\u017e nie je a\u017e tak cudzie, prin\u00e1\u0161ame v\u00e1m nieko\u013eko tipov, ako si niektor\u00e9 \u010dasti pr\u00e1ce u\u013eah\u010di\u0165, aby ste mali viac \u010dasu sa venova\u0165 t\u00fdm zlo\u017eitej\u0161\u00edm. Mozilla developer network MDN patr\u00ed celosvetovo […]<\/p>\n","protected":false},"author":151,"featured_media":19875,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[8],"tags":[175,352,2172,1002],"class_list":["post-19872","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-tipy-a-triky","tag-css","tag-html","tag-setrenie-casu","tag-zdroje"],"yoast_head":"\nAko \u0161etri\u0165 \u010das pri pr\u00e1ci s HTML a CSS - Websupport blog<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.websupport.sk\/blog\/2020\/06\/ako-setrit-cas-pri-praci-s-html-a-css\/\" \/>\n<meta property=\"og:locale\" content=\"sk_SK\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Ako \u0161etri\u0165 \u010das pri pr\u00e1ci s HTML a CSS - Websupport blog\" \/>\n<meta property=\"og:description\" content=\"Cel\u00fd svet sa za\u010dal v\u00a0posledn\u00fdch mesiacoch pres\u00fava\u0165 do online priestoru. Ak c\u00edtite va\u0161u \u0161ancu, vid\u00edte sa ako bud\u00faci front-end developer a HTML s\u00a0CSS v\u00e1m u\u017e nie je a\u017e tak cudzie, prin\u00e1\u0161ame v\u00e1m nieko\u013eko tipov, ako si niektor\u00e9 \u010dasti pr\u00e1ce u\u013eah\u010di\u0165, aby ste mali viac \u010dasu sa venova\u0165 t\u00fdm zlo\u017eitej\u0161\u00edm. Mozilla developer network MDN patr\u00ed celosvetovo […]\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.websupport.sk\/blog\/2020\/06\/ako-setrit-cas-pri-praci-s-html-a-css\/\" \/>\n<meta property=\"og:site_name\" content=\"Websupport blog\" \/>\n<meta property=\"article:published_time\" content=\"2020-06-30T08:27:59+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2025-03-11T20:07:45+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.websupport.sk\/blog\/app\/uploads\/sites\/2\/2020\/06\/Timesavers.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"1200\" \/>\n\t<meta property=\"og:image:height\" content=\"628\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"Vlado Zaic\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Autor\" \/>\n\t<meta name=\"twitter:data1\" content=\"Vlado Zaic\" \/>\n\t<meta name=\"twitter:label2\" content=\"Predpokladan\u00fd \u010das \u010d\u00edtania\" \/>\n\t<meta name=\"twitter:data2\" content=\"5 min\u00fat\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/www.websupport.sk\/blog\/2020\/06\/ako-setrit-cas-pri-praci-s-html-a-css\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/www.websupport.sk\/blog\/2020\/06\/ako-setrit-cas-pri-praci-s-html-a-css\/\"},\"author\":{\"name\":\"Vlado Zaic\",\"@id\":\"https:\/\/www.websupport.sk\/blog\/#\/schema\/person\/beb61a1cbe9b898152cd9a916d90a7b8\"},\"headline\":\"Ako \u0161etri\u0165 \u010das pri pr\u00e1ci s HTML a CSS\",\"datePublished\":\"2020-06-30T08:27:59+00:00\",\"dateModified\":\"2025-03-11T20:07:45+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/www.websupport.sk\/blog\/2020\/06\/ako-setrit-cas-pri-praci-s-html-a-css\/\"},\"wordCount\":1165,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\/\/www.websupport.sk\/blog\/#organization\"},\"image\":{\"@id\":\"https:\/\/www.websupport.sk\/blog\/2020\/06\/ako-setrit-cas-pri-praci-s-html-a-css\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/www.websupport.sk\/blog\/app\/uploads\/sites\/2\/2020\/06\/BP-timesavers.jpg\",\"keywords\":[\"css\",\"HTML\",\"setrenie casu\",\"zdroje\"],\"articleSection\":[\"Tipy a triky\"],\"inLanguage\":\"sk-SK\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/www.websupport.sk\/blog\/2020\/06\/ako-setrit-cas-pri-praci-s-html-a-css\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/www.websupport.sk\/blog\/2020\/06\/ako-setrit-cas-pri-praci-s-html-a-css\/\",\"url\":\"https:\/\/www.websupport.sk\/blog\/2020\/06\/ako-setrit-cas-pri-praci-s-html-a-css\/\",\"name\":\"Ako \u0161etri\u0165 \u010das pri pr\u00e1ci s HTML a CSS - Websupport blog\",\"isPartOf\":{\"@id\":\"https:\/\/www.websupport.sk\/blog\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/www.websupport.sk\/blog\/2020\/06\/ako-setrit-cas-pri-praci-s-html-a-css\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/www.websupport.sk\/blog\/2020\/06\/ako-setrit-cas-pri-praci-s-html-a-css\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/www.websupport.sk\/blog\/app\/uploads\/sites\/2\/2020\/06\/BP-timesavers.jpg\",\"datePublished\":\"2020-06-30T08:27:59+00:00\",\"dateModified\":\"2025-03-11T20:07:45+00:00\",\"breadcrumb\":{\"@id\":\"https:\/\/www.websupport.sk\/blog\/2020\/06\/ako-setrit-cas-pri-praci-s-html-a-css\/#breadcrumb\"},\"inLanguage\":\"sk-SK\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/www.websupport.sk\/blog\/2020\/06\/ako-setrit-cas-pri-praci-s-html-a-css\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"sk-SK\",\"@id\":\"https:\/\/www.websupport.sk\/blog\/2020\/06\/ako-setrit-cas-pri-praci-s-html-a-css\/#primaryimage\",\"url\":\"https:\/\/www.websupport.sk\/blog\/app\/uploads\/sites\/2\/2020\/06\/BP-timesavers.jpg\",\"contentUrl\":\"https:\/\/www.websupport.sk\/blog\/app\/uploads\/sites\/2\/2020\/06\/BP-timesavers.jpg\",\"width\":1920,\"height\":1080},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/www.websupport.sk\/blog\/2020\/06\/ako-setrit-cas-pri-praci-s-html-a-css\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/www.websupport.sk\/blog\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Ako \u0161etri\u0165 \u010das pri pr\u00e1ci s HTML a CSS\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/www.websupport.sk\/blog\/#website\",\"url\":\"https:\/\/www.websupport.sk\/blog\/\",\"name\":\"Websupport blog\",\"description\":\"Websupport blog\",\"publisher\":{\"@id\":\"https:\/\/www.websupport.sk\/blog\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/www.websupport.sk\/blog\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"sk-SK\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/www.websupport.sk\/blog\/#organization\",\"name\":\"Websupport\",\"url\":\"https:\/\/www.websupport.sk\/blog\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"sk-SK\",\"@id\":\"https:\/\/www.websupport.sk\/blog\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/www.websupport.sk\/blog\/app\/uploads\/sites\/2\/2021\/08\/websupport-logo.svg\",\"contentUrl\":\"https:\/\/www.websupport.sk\/blog\/app\/uploads\/sites\/2\/2021\/08\/websupport-logo.svg\",\"width\":153,\"height\":48,\"caption\":\"Websupport\"},\"image\":{\"@id\":\"https:\/\/www.websupport.sk\/blog\/#\/schema\/logo\/image\/\"}},{\"@type\":\"Person\",\"@id\":\"https:\/\/www.websupport.sk\/blog\/#\/schema\/person\/beb61a1cbe9b898152cd9a916d90a7b8\",\"name\":\"Vlado Zaic\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"sk-SK\",\"@id\":\"https:\/\/secure.gravatar.com\/avatar\/2c362e6f631f835bf8fe92f9c61ab602f49d22f762f9c45229b1dc73b0316aee?s=96&d=mm&r=g\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/2c362e6f631f835bf8fe92f9c61ab602f49d22f762f9c45229b1dc73b0316aee?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/2c362e6f631f835bf8fe92f9c61ab602f49d22f762f9c45229b1dc73b0316aee?s=96&d=mm&r=g\",\"caption\":\"Vlado Zaic\"},\"description\":\"Konten\u0165\u00e1k, ktor\u00fd a\u017e po rokoch zistil, \u017ee m\u00e1 celkom bl\u00edzko k marketingu. P\u00e4\u0165 rokov zodpovedn\u00fd za obsahov\u00fa \u010das\u0165 najv\u00e4\u010d\u0161ieho kari\u00e9rneho podujatia na Slovensku a v \u010cech\u00e1ch. Cit\u00e1t Wayna Gretzkeho \\\"You miss 100% of the shots you don't take\\\" bol pre\u0148ho life-changing...\",\"url\":\"https:\/\/www.websupport.sk\/blog\/author\/vlado\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Ako \u0161etri\u0165 \u010das pri pr\u00e1ci s HTML a CSS - Websupport blog","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.websupport.sk\/blog\/2020\/06\/ako-setrit-cas-pri-praci-s-html-a-css\/","og_locale":"sk_SK","og_type":"article","og_title":"Ako \u0161etri\u0165 \u010das pri pr\u00e1ci s HTML a CSS - Websupport blog","og_description":"Cel\u00fd svet sa za\u010dal v\u00a0posledn\u00fdch mesiacoch pres\u00fava\u0165 do online priestoru. Ak c\u00edtite va\u0161u \u0161ancu, vid\u00edte sa ako bud\u00faci front-end developer a HTML s\u00a0CSS v\u00e1m u\u017e nie je a\u017e tak cudzie, prin\u00e1\u0161ame v\u00e1m nieko\u013eko tipov, ako si niektor\u00e9 \u010dasti pr\u00e1ce u\u013eah\u010di\u0165, aby ste mali viac \u010dasu sa venova\u0165 t\u00fdm zlo\u017eitej\u0161\u00edm. Mozilla developer network MDN patr\u00ed celosvetovo […]","og_url":"https:\/\/www.websupport.sk\/blog\/2020\/06\/ako-setrit-cas-pri-praci-s-html-a-css\/","og_site_name":"Websupport blog","article_published_time":"2020-06-30T08:27:59+00:00","article_modified_time":"2025-03-11T20:07:45+00:00","og_image":[{"width":1200,"height":628,"url":"https:\/\/www.websupport.sk\/blog\/app\/uploads\/sites\/2\/2020\/06\/Timesavers.jpg","type":"image\/jpeg"}],"author":"Vlado Zaic","twitter_card":"summary_large_image","twitter_misc":{"Autor":"Vlado Zaic","Predpokladan\u00fd \u010das \u010d\u00edtania":"5 min\u00fat"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.websupport.sk\/blog\/2020\/06\/ako-setrit-cas-pri-praci-s-html-a-css\/#article","isPartOf":{"@id":"https:\/\/www.websupport.sk\/blog\/2020\/06\/ako-setrit-cas-pri-praci-s-html-a-css\/"},"author":{"name":"Vlado Zaic","@id":"https:\/\/www.websupport.sk\/blog\/#\/schema\/person\/beb61a1cbe9b898152cd9a916d90a7b8"},"headline":"Ako \u0161etri\u0165 \u010das pri pr\u00e1ci s HTML a CSS","datePublished":"2020-06-30T08:27:59+00:00","dateModified":"2025-03-11T20:07:45+00:00","mainEntityOfPage":{"@id":"https:\/\/www.websupport.sk\/blog\/2020\/06\/ako-setrit-cas-pri-praci-s-html-a-css\/"},"wordCount":1165,"commentCount":0,"publisher":{"@id":"https:\/\/www.websupport.sk\/blog\/#organization"},"image":{"@id":"https:\/\/www.websupport.sk\/blog\/2020\/06\/ako-setrit-cas-pri-praci-s-html-a-css\/#primaryimage"},"thumbnailUrl":"https:\/\/www.websupport.sk\/blog\/app\/uploads\/sites\/2\/2020\/06\/BP-timesavers.jpg","keywords":["css","HTML","setrenie casu","zdroje"],"articleSection":["Tipy a triky"],"inLanguage":"sk-SK","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/www.websupport.sk\/blog\/2020\/06\/ako-setrit-cas-pri-praci-s-html-a-css\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/www.websupport.sk\/blog\/2020\/06\/ako-setrit-cas-pri-praci-s-html-a-css\/","url":"https:\/\/www.websupport.sk\/blog\/2020\/06\/ako-setrit-cas-pri-praci-s-html-a-css\/","name":"Ako \u0161etri\u0165 \u010das pri pr\u00e1ci s HTML a CSS - Websupport blog","isPartOf":{"@id":"https:\/\/www.websupport.sk\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.websupport.sk\/blog\/2020\/06\/ako-setrit-cas-pri-praci-s-html-a-css\/#primaryimage"},"image":{"@id":"https:\/\/www.websupport.sk\/blog\/2020\/06\/ako-setrit-cas-pri-praci-s-html-a-css\/#primaryimage"},"thumbnailUrl":"https:\/\/www.websupport.sk\/blog\/app\/uploads\/sites\/2\/2020\/06\/BP-timesavers.jpg","datePublished":"2020-06-30T08:27:59+00:00","dateModified":"2025-03-11T20:07:45+00:00","breadcrumb":{"@id":"https:\/\/www.websupport.sk\/blog\/2020\/06\/ako-setrit-cas-pri-praci-s-html-a-css\/#breadcrumb"},"inLanguage":"sk-SK","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.websupport.sk\/blog\/2020\/06\/ako-setrit-cas-pri-praci-s-html-a-css\/"]}]},{"@type":"ImageObject","inLanguage":"sk-SK","@id":"https:\/\/www.websupport.sk\/blog\/2020\/06\/ako-setrit-cas-pri-praci-s-html-a-css\/#primaryimage","url":"https:\/\/www.websupport.sk\/blog\/app\/uploads\/sites\/2\/2020\/06\/BP-timesavers.jpg","contentUrl":"https:\/\/www.websupport.sk\/blog\/app\/uploads\/sites\/2\/2020\/06\/BP-timesavers.jpg","width":1920,"height":1080},{"@type":"BreadcrumbList","@id":"https:\/\/www.websupport.sk\/blog\/2020\/06\/ako-setrit-cas-pri-praci-s-html-a-css\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.websupport.sk\/blog\/"},{"@type":"ListItem","position":2,"name":"Ako \u0161etri\u0165 \u010das pri pr\u00e1ci s HTML a CSS"}]},{"@type":"WebSite","@id":"https:\/\/www.websupport.sk\/blog\/#website","url":"https:\/\/www.websupport.sk\/blog\/","name":"Websupport blog","description":"Websupport blog","publisher":{"@id":"https:\/\/www.websupport.sk\/blog\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.websupport.sk\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"sk-SK"},{"@type":"Organization","@id":"https:\/\/www.websupport.sk\/blog\/#organization","name":"Websupport","url":"https:\/\/www.websupport.sk\/blog\/","logo":{"@type":"ImageObject","inLanguage":"sk-SK","@id":"https:\/\/www.websupport.sk\/blog\/#\/schema\/logo\/image\/","url":"https:\/\/www.websupport.sk\/blog\/app\/uploads\/sites\/2\/2021\/08\/websupport-logo.svg","contentUrl":"https:\/\/www.websupport.sk\/blog\/app\/uploads\/sites\/2\/2021\/08\/websupport-logo.svg","width":153,"height":48,"caption":"Websupport"},"image":{"@id":"https:\/\/www.websupport.sk\/blog\/#\/schema\/logo\/image\/"}},{"@type":"Person","@id":"https:\/\/www.websupport.sk\/blog\/#\/schema\/person\/beb61a1cbe9b898152cd9a916d90a7b8","name":"Vlado Zaic","image":{"@type":"ImageObject","inLanguage":"sk-SK","@id":"https:\/\/secure.gravatar.com\/avatar\/2c362e6f631f835bf8fe92f9c61ab602f49d22f762f9c45229b1dc73b0316aee?s=96&d=mm&r=g","url":"https:\/\/secure.gravatar.com\/avatar\/2c362e6f631f835bf8fe92f9c61ab602f49d22f762f9c45229b1dc73b0316aee?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/2c362e6f631f835bf8fe92f9c61ab602f49d22f762f9c45229b1dc73b0316aee?s=96&d=mm&r=g","caption":"Vlado Zaic"},"description":"Konten\u0165\u00e1k, ktor\u00fd a\u017e po rokoch zistil, \u017ee m\u00e1 celkom bl\u00edzko k marketingu. P\u00e4\u0165 rokov zodpovedn\u00fd za obsahov\u00fa \u010das\u0165 najv\u00e4\u010d\u0161ieho kari\u00e9rneho podujatia na Slovensku a v \u010cech\u00e1ch. Cit\u00e1t Wayna Gretzkeho \"You miss 100% of the shots you don't take\" bol pre\u0148ho life-changing...","url":"https:\/\/www.websupport.sk\/blog\/author\/vlado\/"}]}},"_links":{"self":[{"href":"https:\/\/www.websupport.sk\/blog\/wp-json\/wp\/v2\/posts\/19872","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.websupport.sk\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.websupport.sk\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.websupport.sk\/blog\/wp-json\/wp\/v2\/users\/151"}],"replies":[{"embeddable":true,"href":"https:\/\/www.websupport.sk\/blog\/wp-json\/wp\/v2\/comments?post=19872"}],"version-history":[{"count":5,"href":"https:\/\/www.websupport.sk\/blog\/wp-json\/wp\/v2\/posts\/19872\/revisions"}],"predecessor-version":[{"id":30659,"href":"https:\/\/www.websupport.sk\/blog\/wp-json\/wp\/v2\/posts\/19872\/revisions\/30659"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.websupport.sk\/blog\/wp-json\/wp\/v2\/media\/19875"}],"wp:attachment":[{"href":"https:\/\/www.websupport.sk\/blog\/wp-json\/wp\/v2\/media?parent=19872"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.websupport.sk\/blog\/wp-json\/wp\/v2\/categories?post=19872"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.websupport.sk\/blog\/wp-json\/wp\/v2\/tags?post=19872"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}