{"id":19863,"date":"2019-01-31T09:24:10","date_gmt":"2019-01-31T08:24:10","guid":{"rendered":"https:\/\/annaf34.sg-host.com\/?p=19863"},"modified":"2021-12-03T12:17:32","modified_gmt":"2021-12-03T11:17:32","slug":"czym-jest-html","status":"publish","type":"post","link":"https:\/\/codecool.com\/pl\/czym-jest-html\/","title":{"rendered":"Czym jest HTML?"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-post\" data-elementor-id=\"19863\" class=\"elementor elementor-19863\" data-elementor-post-type=\"post\">\n\t\t\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-2a7ee9e elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"2a7ee9e\" data-element_type=\"section\" data-settings=\"{&quot;jet_parallax_layout_list&quot;:[]}\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-9d41795\" data-id=\"9d41795\" data-element_type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-f524fed elementor-widget elementor-widget-text-editor\" data-id=\"f524fed\" data-element_type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<p><strong>Ka\u017cdy, kto my\u015bli o rozpocz\u0119ciu kariery jako programista front-end, musi dobrze go pozna\u0107, a nawet polubi\u0107. HTML to podstawowy j\u0119zyk, s\u0142u\u017c\u0105cy do tworzenia stron www. Dzi\u015b korzysta si\u0119 z niego r\u00f3wnie\u017c, by programowa\u0107 appki na smartfony i desktopowe aplikacje. Ucz si\u0119 HTML! <\/strong><\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-fa33ddf elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"fa33ddf\" data-element_type=\"section\" data-settings=\"{&quot;jet_parallax_layout_list&quot;:[]}\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-f718484\" data-id=\"f718484\" data-element_type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-cbe624e elementor-widget elementor-widget-image\" data-id=\"cbe624e\" data-element_type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img fetchpriority=\"high\" decoding=\"async\" width=\"540\" height=\"540\" src=\"https:\/\/codecool.com\/wp-content\/uploads\/2021\/12\/naukaprogramowania-540x540-1.jpg\" class=\"attachment-large size-large wp-image-19818\" alt=\"\" srcset=\"https:\/\/codecool.com\/wp-content\/uploads\/2021\/12\/naukaprogramowania-540x540-1.jpg 540w, https:\/\/codecool.com\/wp-content\/uploads\/2021\/12\/naukaprogramowania-540x540-1-300x300.jpg 300w, https:\/\/codecool.com\/wp-content\/uploads\/2021\/12\/naukaprogramowania-540x540-1-150x150.jpg 150w\" sizes=\"(max-width: 540px) 100vw, 540px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-355786e elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"355786e\" data-element_type=\"section\" data-settings=\"{&quot;jet_parallax_layout_list&quot;:[]}\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-30be4af\" data-id=\"30be4af\" data-element_type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-82a7f07 elementor-widget elementor-widget-text-editor\" data-id=\"82a7f07\" data-element_type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<p>HTML to skr\u00f3t od nazwy Hypertext Markup Language &#8211; czyli hipertekstowy j\u0119zyk znacznik\u00f3w. J\u0119zyk HTML powsta\u0142 w 1993 roku. Obecnie w u\u017cytku jest <strong>HTML 5<\/strong>, czyli pi\u0105ta wersja tego j\u0119zyka programowania.<\/p><p>HTML to j\u0119zyk opisuj\u0105cy struktur\u0119 strony internetowej. Poniewa\u017c okre\u015bla tylko struktur\u0119, a nie wygl\u0105d strony, to jest swoistym \u201eszkieletem\u201d strony. Co mamy na my\u015bli? Ot\u00f3\u017c sam HTML nie wystarczy nam, by zbudowa\u0107 funkcjonaln\u0105 i estetyczn\u0105 stron\u0119 www.<\/p><p>Potrzebujemy u\u017cy\u0107:<\/p><ul><li><strong>HTML<\/strong> &#8211; okre\u015bla, gdzie na stronie znajduje si\u0119 menu, nag\u0142\u00f3wek, stopka, galeria itp.,<\/li><li><strong>CSS <\/strong><b>&#8211; <\/b>okre\u015bla ich szeroko\u015bci, wysoko\u015bci, kolory strony, fonty, marginesy, efekty graficzne, odpowiada za responsywno\u015b\u0107 strony.<\/li><li><strong>JavaScript<\/strong> &#8211; odpowiada za funkcjonalno\u015bci strony.<\/li><\/ul><p>Dowiedz si\u0119 wi\u0119cej: artyku\u0142 <a href=\"https:\/\/codecool.com\/pl\/wiedza\/javascript-gdzie-wykorzystuje-sie-js-codecool-pl\/\">Java Script: co to jest?<\/a><\/p><p>J\u0119zyk programowania HTML kiedy\u015b s\u0142u\u017cy\u0142 tylko do tworzenia stron internetowych. Dzi\u015b nie jest to takie oczywiste. Kiedy\u015b osobno pisa\u0142o si\u0119 stron\u0119 internetow\u0105, aplikacj\u0119 desktopow\u0105 i aplikacj\u0119 na telefon kom\u00f3rkowy. Potrzebne by\u0142y do tego trzy zespo\u0142y programist\u00f3w \u2013 ka\u017cdy z nich robi\u0142 de facto t\u0119 sam\u0105 prac\u0119, tyle \u017ce w swojej specyfikacji. Poniewa\u017c czas to pieni\u0105dz, a trzy teamy to potr\u00f3jne koszty, trzeba by\u0142o co\u015b z tym zrobi\u0107. Wymy\u015blono, \u017ce mo\u017cna napisa\u0107 stron\u0119 HTMLow\u0105, a nast\u0119pnie osadzi\u0107 j\u0105 jako program i aplikacj\u0119 na telefon. Jest to mo\u017cliwe dzi\u0119ki zastosowaniu Java Script. Zewn\u0119trzne programy emuluj\u0105 kod napisany w HTML w taki spos\u00f3b, by wygl\u0105da\u0142 on jak natywna aplikacja, napisana na iPhone lub Androida. Zwyk\u0142y u\u017cytkownik nawet nie zauwa\u017cy r\u00f3\u017cnicy i nie domy\u015bli si\u0119, \u017ce by\u0142a ona tworzona w HTMLu. Pozwala to znacznie obni\u017cy\u0107 koszty tworzenia aplikacji mobilnych.<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-3d2b308 elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"3d2b308\" data-element_type=\"section\" data-settings=\"{&quot;jet_parallax_layout_list&quot;:[]}\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-c808b8d\" data-id=\"c808b8d\" data-element_type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-9a90a9f elementor-widget elementor-widget-heading\" data-id=\"9a90a9f\" data-element_type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">Popularne znaczniki w HTML<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-9fbb873 elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"9fbb873\" data-element_type=\"section\" data-settings=\"{&quot;jet_parallax_layout_list&quot;:[]}\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-2375f08\" data-id=\"2375f08\" data-element_type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-cda9a46 elementor-widget elementor-widget-text-editor\" data-id=\"cda9a46\" data-element_type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<p>Jak ju\u017c wiecie, HTML jest j\u0119zykiem znacznik\u00f3w. Znacznik (inaczej zwane tagami) to konkretny znak lub s\u0142owo kluczowe, otoczony nawiasami ostrymi. W kodzie od razu zauwa\u017cycie komendy uj\u0119te w ostre nawiasy, podw\u00f3jne lub pojedyncze. Znaczniki prawie zawsze wystepuj\u0105 parami, m\u00f3wimy w\u00f3wczas o znacznikach podw\u00f3jnych.<\/p><p>Przyk\u0142ad podw\u00f3jnego znacznika (otwieraj\u0105cy i zamykaj\u0105cy):<\/p><pre>&lt;a href=\u201d&gt; &lt;\/a&gt;&lt;b&gt;&lt;\/b&gt;&lt;p&gt; &lt;\/p&gt;&lt;H1&gt;&lt;\/H1&gt;<\/pre><p>Przyk\u0142ad pojedynczego znacznika:<\/p><pre>&lt;br \/&gt;&lt;img&gt;&lt;hr&gt;<\/pre><p>Ka\u017cdy znacznik mo\u017ce mie\u0107 swoje <strong>atrybuty<\/strong>(np. href, \u00a0alt) \u2013 s\u0105 to cechy opisuj\u0105ce ka\u017cdy taki znacznik.<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-36915ca elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"36915ca\" data-element_type=\"section\" data-settings=\"{&quot;jet_parallax_layout_list&quot;:[]}\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-884ca9b\" data-id=\"884ca9b\" data-element_type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-bbafcc3 elementor-widget elementor-widget-heading\" data-id=\"bbafcc3\" data-element_type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">Jak tworzy\u0107 strony w HTML?<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-a5fd6bb elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"a5fd6bb\" data-element_type=\"section\" data-settings=\"{&quot;jet_parallax_layout_list&quot;:[]}\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-e80cdd1\" data-id=\"e80cdd1\" data-element_type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-c1d8d55 elementor-widget elementor-widget-text-editor\" data-id=\"c1d8d55\" data-element_type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<p>Aby m\u00f3c zacz\u0105\u0107 tworzy\u0107 strony w HTML, mo\u017cemy skorzysta\u0107 nawet z notatnika. Najlepiej jednak uczy\u0107 si\u0119 pracy z HTML, korzystaj\u0105c z jednego z dost\u0119pnych na rynku edytor\u00f3w. Kt\u00f3ry wybra\u0107? To kwestia gustu. Nasi studenci korzystaj\u0105 z edytor\u00f3w Atom albo Visual Studio Code. Dlaczego naj\u0142atwiej pisa\u0107 kod w edytorze? Ot\u00f3\u017c dlatego, \u017ce ka\u017cdy dobry edytor HTML zapewni nam:<\/p><p><strong>Kolorowanie sk\u0142adni<\/strong> &#8211; oznacza to, \u017ce je\u015bli wpiszemy poprawny znacznik, jego sk\u0142adnia przyjmie okre\u015blony kolor. Dzi\u0119ki temu od razu zobaczysz wszystkie b\u0142\u0119dy &#8211; najcz\u0119\u015bciej proste &#8222;liter\u00f3wki&#8221;. Jest to chyba najwa\u017cniejsza zaleta stosowania edytor\u00f3w HTML. Dlatego w\u0142a\u015bnie nie poleca si\u0119 u\u017cywania notatnika czy zwyk\u0142ych edytor\u00f3w tekstu do tworzenia stron www.<\/p><p><strong>Automatyczne zamykanie znacznik\u00f3w<\/strong> &#8211; polega na automatycznym dopisaniu przez program odpowiedniego znacznika zamykaj\u0105cego, zaraz po tym jak wpiszemy znacznik otwieraj\u0105cy. Bardzo usprawnia to prac\u0119, a dodatkowo nie zapomnimy o zamykaniu znacznik\u00f3w, poniewa\u017c program robi to automatycznie za nas.<\/p><p><strong>Generatory<\/strong> (lub inaczej kreatory &#8211; ang. wizards) pomagaj\u0105 przy tworzeniu r\u00f3\u017cnorodnych znacznik\u00f3w (poprzez specjalne okna dialogowe).<\/p><p><strong>Podgl\u0105d efekt\u00f3w<\/strong> &#8211; koduj\u0105c w edytorze, mo\u017cemy co chwil\u0119 sprawdza\u0107, jak zmienia si\u0119 wygl\u0105d tworzonej przez nas strony. To kolejne u\u0142atwienie, jakie daj\u0105 nam edytory.<\/p><p>Najprostsza strona w HTML w edytorze wygl\u0105da\u0107 b\u0119dzie tak:<\/p><pre>&lt;html&gt;\n&lt;head&gt;\n\t&lt;title&gt;Tytu\u0142 strony&lt;\/title&gt;\n&lt;\/head&gt;\n&lt;body&gt;Tre\u015b\u0107 strony&lt;\/body&gt;\n&lt;\/html&gt;<\/pre><p>Jak wida\u0107 powy\u017cej, ka\u017cda strona w HTML powinna posiada\u0107 dwie cz\u0119\u015bci \u2013 head i body. Head to nag\u0142\u00f3wek, znajduje si\u0119 w nim informacja o tytule strony (czyli to, co zobaczymy na zak\u0142adce przegl\u0105darki), kodowaniu strony (w jakim j\u0119zyku zosta\u0142a napisana), co ta strona zawiera (metadane, informacje dla bot\u00f3w wyszukuj\u0105cych). Body to miejsce na zawarto\u015b\u0107 strony, czyli informacje, co si\u0119 na tej stronie znajduje \u2013 nag\u0142\u00f3wki, akapity, menu, listy, odno\u015bniki, zdj\u0119cia.<\/p><p>W edytorze HTML, opr\u00f3cz samej struktury strony, mo\u017cemy te\u017c umie\u015bci\u0107 komendy i odno\u015bniki do plik\u00f3w CSS. Kaskadowe arkusze styl\u00f3w (CSS) opisuj\u0105 wygl\u0105d strony.<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-f4c883f elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"f4c883f\" data-element_type=\"section\" data-settings=\"{&quot;jet_parallax_layout_list&quot;:[]}\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-8364a35\" data-id=\"8364a35\" data-element_type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-685a566 elementor-widget elementor-widget-heading\" data-id=\"685a566\" data-element_type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">Zasady sk\u0142adni<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-d75f1cf elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"d75f1cf\" data-element_type=\"section\" data-settings=\"{&quot;jet_parallax_layout_list&quot;:[]}\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-f07c50c\" data-id=\"f07c50c\" data-element_type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-87ae712 elementor-widget elementor-widget-text-editor\" data-id=\"87ae712\" data-element_type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<p><strong>J\u0119zyk HTML sk\u0142ada si\u0119 z kilku kluczowych komponent\u00f3w:<\/strong><\/p><ul><li>znacznik\u00f3w (i ich atrybut\u00f3w),<\/li><li>typ\u00f3w danych,<\/li><li>referencji znakowych,<\/li><li>odwo\u0142a\u0144 w postaci encji,<\/li><li>deklaracji typu dokumentu.<\/li><\/ul><p><strong>Znaczniki <\/strong>opisali\u015bmy ju\u017c powy\u017cej. S\u0105 to inaczej tagi, kt\u00f3re umo\u017cliwiaj\u0105 nam sterowanie wygl\u0105dem strony. Aby zapisa\u0107 znacznik w HTML, trzeba uj\u0105\u0107 tag w ostre nawiasy. Niekt\u00f3rym znacznikom mo\u017cemy nadawa\u0107 <b>atrybuty<\/b>. Dzi\u0119ki atrybutom mo\u017cna okre\u015bli\u0107 np. <i>href, id, style, type, value, width, height <\/i>itp. Do sk\u0142adni HTML wchodzi tak\u017ce ponad 250<a href=\"https:\/\/en.wikipedia.org\/wiki\/List_of_XML_and_HTML_character_entity_references#Character_entity_references_in_HTML\"> referencji znakowych i odwo\u0142a\u0144 w postaci encji.<\/a> To oczywi\u015bcie sporo, ale pe\u0142na dokumentacja i ich spis dost\u0119pne s\u0105 w ka\u017cdym momencie w Internecie. Ka\u017cdy dokument powinien rozpoczyna\u0107 si\u0119 deklaracj\u0105 typu dokumentu (DOCTYPE), co s\u0142u\u017cy poprawnej walidacji utworzonej strony a tak\u017ce pozwoli nam unikn\u0105\u0107 dzia\u0142ania przegl\u0105darek w trybie quirks.<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-9b89631 elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"9b89631\" data-element_type=\"section\" data-settings=\"{&quot;jet_parallax_layout_list&quot;:[]}\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-0220591\" data-id=\"0220591\" data-element_type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-b5dcfa1 elementor-widget elementor-widget-heading\" data-id=\"b5dcfa1\" data-element_type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">Podsumowanie<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-39b6869 elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"39b6869\" data-element_type=\"section\" data-settings=\"{&quot;jet_parallax_layout_list&quot;:[]}\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-6b6f44f\" data-id=\"6b6f44f\" data-element_type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-6b49ddd elementor-widget elementor-widget-text-editor\" data-id=\"6b49ddd\" data-element_type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<p>J\u0119zyk programowania HTML to opisowy j\u0119zyk znacznik\u00f3w, wykorzystywany przy tworzeniu stron Internetowych. Dla wielu os\u00f3b jest to pierwszy j\u0119zyk, z jakim zetkn\u0119li si\u0119 w \u017cyciu, pr\u00f3buj\u0105c stworzy\u0107 w Internecie swoj\u0105 wizyt\u00f3wk\u0119, stron\u0119 czy bloga. W sieci dost\u0119pnych jest ca\u0142a masa poradnik\u00f3w, samouczk\u00f3w i kurs\u00f3w HTML. Pojawia si\u0119 tak\u017ce w programie nauczania na naszym <a href=\"https:\/\/codecool.com\/pl\/okursach\/\">kursie programowania<\/a>, poniewa\u017c jest przydatn\u0105 umiej\u0119tno\u015bci\u0105 dla ka\u017cdego wszechstronnego programisty.<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Ka\u017cdy, kto my\u015bli o rozpocz\u0119ciu kariery jako programista front-end, musi dobrze go pozna\u0107, a nawet polubi\u0107. HTML to podstawowy j\u0119zyk, s\u0142u\u017c\u0105cy do tworzenia stron www. Dzi\u015b korzysta si\u0119 z niego r\u00f3wnie\u017c, by programowa\u0107 appki na smartfony i desktopowe aplikacje. Ucz si\u0119 HTML! HTML to skr\u00f3t od nazwy Hypertext Markup Language &#8211; czyli hipertekstowy j\u0119zyk znacznik\u00f3w. [&hellip;]<\/p>\n","protected":false},"author":4,"featured_media":19818,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[133],"tags":[],"class_list":["post-19863","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-wiedza"],"yoast_head":"<!-- This site is optimized with the Yoast SEO Premium plugin v24.4 (Yoast SEO v24.4) - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Czym jest HTML? - Codecool<\/title>\n<meta name=\"description\" content=\"HTML to hipertekstowy j\u0119zyk znacznik\u00f3w, wykorzystywany do tworzenia dokument\u00f3w hipertekstowych. Przeczytaj artyku\u0142 i dowiedz si\u0119 wi\u0119cej o HTML\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/codecool.com\/pl\/czym-jest-html\/\" \/>\n<meta property=\"og:locale\" content=\"pl_PL\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Czym jest HTML?\" \/>\n<meta property=\"og:description\" content=\"HTML to hipertekstowy j\u0119zyk znacznik\u00f3w, wykorzystywany do tworzenia dokument\u00f3w hipertekstowych. Przeczytaj artyku\u0142 i dowiedz si\u0119 wi\u0119cej o HTML\" \/>\n<meta property=\"og:url\" content=\"https:\/\/codecool.com\/pl\/czym-jest-html\/\" \/>\n<meta property=\"og:site_name\" content=\"Codecool\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/CodecoolOfficial\/\" \/>\n<meta property=\"article:published_time\" content=\"2019-01-31T08:24:10+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2021-12-03T11:17:32+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/codecool.com\/wp-content\/uploads\/2021\/12\/naukaprogramowania-540x540-1.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"540\" \/>\n\t<meta property=\"og:image:height\" content=\"540\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"Dora Hoffman\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@Codecool_global\" \/>\n<meta name=\"twitter:site\" content=\"@Codecool_global\" \/>\n<meta name=\"twitter:label1\" content=\"Napisane przez\" \/>\n\t<meta name=\"twitter:data1\" content=\"Dora Hoffman\" \/>\n\t<meta name=\"twitter:label2\" content=\"Szacowany czas czytania\" \/>\n\t<meta name=\"twitter:data2\" content=\"4 minuty\" \/>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"Czym jest HTML? - Codecool","description":"HTML to hipertekstowy j\u0119zyk znacznik\u00f3w, wykorzystywany do tworzenia dokument\u00f3w hipertekstowych. Przeczytaj artyku\u0142 i dowiedz si\u0119 wi\u0119cej o HTML","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:\/\/codecool.com\/pl\/czym-jest-html\/","og_locale":"pl_PL","og_type":"article","og_title":"Czym jest HTML?","og_description":"HTML to hipertekstowy j\u0119zyk znacznik\u00f3w, wykorzystywany do tworzenia dokument\u00f3w hipertekstowych. Przeczytaj artyku\u0142 i dowiedz si\u0119 wi\u0119cej o HTML","og_url":"https:\/\/codecool.com\/pl\/czym-jest-html\/","og_site_name":"Codecool","article_publisher":"https:\/\/www.facebook.com\/CodecoolOfficial\/","article_published_time":"2019-01-31T08:24:10+00:00","article_modified_time":"2021-12-03T11:17:32+00:00","og_image":[{"width":540,"height":540,"url":"https:\/\/codecool.com\/wp-content\/uploads\/2021\/12\/naukaprogramowania-540x540-1.jpg","type":"image\/jpeg"}],"author":"Dora Hoffman","twitter_card":"summary_large_image","twitter_creator":"@Codecool_global","twitter_site":"@Codecool_global","twitter_misc":{"Napisane przez":"Dora Hoffman","Szacowany czas czytania":"4 minuty"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/codecool.com\/pl\/czym-jest-html\/#article","isPartOf":{"@id":"https:\/\/codecool.com\/pl\/czym-jest-html\/"},"author":{"name":"Dora Hoffman","@id":"https:\/\/codecool.com\/pl\/#\/schema\/person\/622e226c942203940586ef2dceca8365"},"headline":"Czym jest HTML?","datePublished":"2019-01-31T08:24:10+00:00","dateModified":"2021-12-03T11:17:32+00:00","mainEntityOfPage":{"@id":"https:\/\/codecool.com\/pl\/czym-jest-html\/"},"wordCount":1018,"commentCount":0,"publisher":{"@id":"https:\/\/codecool.com\/pl\/#organization"},"image":{"@id":"https:\/\/codecool.com\/pl\/czym-jest-html\/#primaryimage"},"thumbnailUrl":"https:\/\/codecool.com\/wp-content\/uploads\/2021\/12\/naukaprogramowania-540x540-1.jpg","articleSection":["Wiedza"],"inLanguage":"pl-PL","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/codecool.com\/pl\/czym-jest-html\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/codecool.com\/pl\/czym-jest-html\/","url":"https:\/\/codecool.com\/pl\/czym-jest-html\/","name":"Czym jest HTML? - Codecool","isPartOf":{"@id":"https:\/\/codecool.com\/pl\/#website"},"primaryImageOfPage":{"@id":"https:\/\/codecool.com\/pl\/czym-jest-html\/#primaryimage"},"image":{"@id":"https:\/\/codecool.com\/pl\/czym-jest-html\/#primaryimage"},"thumbnailUrl":"https:\/\/codecool.com\/wp-content\/uploads\/2021\/12\/naukaprogramowania-540x540-1.jpg","datePublished":"2019-01-31T08:24:10+00:00","dateModified":"2021-12-03T11:17:32+00:00","description":"HTML to hipertekstowy j\u0119zyk znacznik\u00f3w, wykorzystywany do tworzenia dokument\u00f3w hipertekstowych. Przeczytaj artyku\u0142 i dowiedz si\u0119 wi\u0119cej o HTML","breadcrumb":{"@id":"https:\/\/codecool.com\/pl\/czym-jest-html\/#breadcrumb"},"inLanguage":"pl-PL","potentialAction":[{"@type":"ReadAction","target":["https:\/\/codecool.com\/pl\/czym-jest-html\/"]}]},{"@type":"ImageObject","inLanguage":"pl-PL","@id":"https:\/\/codecool.com\/pl\/czym-jest-html\/#primaryimage","url":"https:\/\/codecool.com\/wp-content\/uploads\/2021\/12\/naukaprogramowania-540x540-1.jpg","contentUrl":"https:\/\/codecool.com\/wp-content\/uploads\/2021\/12\/naukaprogramowania-540x540-1.jpg","width":540,"height":540},{"@type":"BreadcrumbList","@id":"https:\/\/codecool.com\/pl\/czym-jest-html\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/codecool.com\/pl\/"},{"@type":"ListItem","position":2,"name":"Czym jest HTML?"}]},{"@type":"WebSite","@id":"https:\/\/codecool.com\/pl\/#website","url":"https:\/\/codecool.com\/pl\/","name":"Codecool","description":"Next gen coding school &amp; career hub","publisher":{"@id":"https:\/\/codecool.com\/pl\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/codecool.com\/pl\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"pl-PL"},{"@type":"Organization","@id":"https:\/\/codecool.com\/pl\/#organization","name":"Codecool","alternateName":"Codecool","url":"https:\/\/codecool.com\/pl\/","logo":{"@type":"ImageObject","inLanguage":"pl-PL","@id":"https:\/\/codecool.com\/pl\/#\/schema\/logo\/image\/","url":"https:\/\/codecool.com\/wp-content\/uploads\/2023\/09\/Codecool-logo-app.svg","contentUrl":"https:\/\/codecool.com\/wp-content\/uploads\/2023\/09\/Codecool-logo-app.svg","width":1,"height":1,"caption":"Codecool"},"image":{"@id":"https:\/\/codecool.com\/pl\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/CodecoolOfficial\/","https:\/\/x.com\/Codecool_global","https:\/\/www.instagram.com\/codecool_official\/","https:\/\/www.linkedin.com\/school\/codecool\/"]},{"@type":"Person","@id":"https:\/\/codecool.com\/pl\/#\/schema\/person\/622e226c942203940586ef2dceca8365","name":"Dora Hoffman","image":{"@type":"ImageObject","inLanguage":"pl-PL","@id":"https:\/\/codecool.com\/pl\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/13d568fb246033721321e216b8f5f06457e373d046558ceccec33b2e0dc025bc?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/13d568fb246033721321e216b8f5f06457e373d046558ceccec33b2e0dc025bc?s=96&d=mm&r=g","caption":"Dora Hoffman"}}]}},"_links":{"self":[{"href":"https:\/\/codecool.com\/pl\/wp-json\/wp\/v2\/posts\/19863","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/codecool.com\/pl\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/codecool.com\/pl\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/codecool.com\/pl\/wp-json\/wp\/v2\/users\/4"}],"replies":[{"embeddable":true,"href":"https:\/\/codecool.com\/pl\/wp-json\/wp\/v2\/comments?post=19863"}],"version-history":[{"count":0,"href":"https:\/\/codecool.com\/pl\/wp-json\/wp\/v2\/posts\/19863\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/codecool.com\/pl\/wp-json\/wp\/v2\/media\/19818"}],"wp:attachment":[{"href":"https:\/\/codecool.com\/pl\/wp-json\/wp\/v2\/media?parent=19863"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/codecool.com\/pl\/wp-json\/wp\/v2\/categories?post=19863"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/codecool.com\/pl\/wp-json\/wp\/v2\/tags?post=19863"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}