Tim Berners-Lee
Tagalikha ng wikang HTML

Ang artikulong ito ay tungkol sa HTML Isang maikling pangkalahatang-ideya ng wika, istraktura, katangian, at kasaysayan nito. Ang artikulong ito ay tungkol sa HTML na wika ay nilayon na basahin para sa pangkalahatang pag-unlad at sa paunang yugto ng pag-aaral ng HTML, maaari mo itong laktawan at bumalik dito mamaya, pagkatapos basahin.

HTML (Hyper Text Markup Language)- Hyper Text Markup Language. Ang mga website ay nilikha gamit ang HTML na wika.

Ang lumikha ng wikang HTML ay isang natatanging British scientist - Tim Berners-Lee.

Mga bersyon ng HTML

Bago ang 1995, walang opisyal na pamantayan para sa wikang HTML, ngunit mayroong ilang hindi pamantayang bersyon ng wikang HTML. Noong Setyembre 22, 1995, nilikha ang unang opisyal na pamantayan ng wikang HTML, agad nitong natanggap ang numerong 2.0 (HTML 2.0).

Noong Enero 14, 1997, lumitaw ang bersyon ng HTML 3.2,
Disyembre 18, 1997 HTML 4.0,
Disyembre 24, 1999 HTML 4.01

Noong 00s, mayroon din XHTML markup language(katulad ng HTML, ngunit may mas mahigpit na syntax). Ang XHTML ay nilayon upang ihanda ang mga webmaster para sa mahigpit na mga panuntunan sa markup XML na wika. Dahil sa mahigpit na markup, ang iba't ibang mga programa at serbisyo na nakakaunawa sa XML ay maaaring epektibong magproseso ng data sa mga site na nakasulat sa XHTML ay may kakayahan din ang wikang ito na ipatupad ang SVG, MathML, CML at iba pang mga derivative ng XML na wika.

Umiral ang XHTML sa tatlong bersyon: mahigpit, transisyonal, at frameset sa transisyonal na bersyon, maaari kang gumamit ng mga legacy na tag tulad ng center o font. Sa kasalukuyan, pag-unlad XHTML na wika sarado.

Ang modernong bersyon ng wikang HTML ay HTML5, ang bersyon na ito ang pag-aaralan natin sa tutorial na ito. Ang HTML5 ay mas maginhawa kaysa sa mga nakaraang wika at nakuha ang lahat ng kanilang mga pakinabang;

Wika CSS at HTML

Simula sa bersyon 4 ng wikang HTML, inirerekumenda na baguhin ang hitsura ng mga HTML tag gamit lamang ang wikang CSS. Samakatuwid, ipinapayong pag-aralan ang HTML at CSS na mga wika nang magkatulad. Sa HTML na tutorial na ito para sa mga nagsisimula, titingnan din natin ang mga panimulang aspeto ng wikang CSS, ngunit para magpatuloy sa pag-aaral, maaari mo itong basahin mismo

Kasaysayan ng HTML

Ang wikang HTML ay nilikha noong 1991 ng British scientist na si Tim Berners-Lee. Noong panahong iyon, nagtatrabaho si Tim sa CERN (European Organization for Nuclear Research) at wala pang mga website. Ang mga siyentipiko na nagtatrabaho sa sentrong ito ay nangangailangan ng maaasahan at mahusay na paraan upang makipagpalitan ng impormasyon.

Ang pagpili ay nahulog sa wika ng SGML, ngunit ito ay masyadong kumplikado at pagkatapos ay si Tim, batay sa SGML, ay lumikha ng isang pinasimpleng pagkakaiba-iba nito - HTML, salamat sa kung saan ang sinumang siyentipiko ay maaaring lumikha ng isang simpleng dokumento na may impormasyon, na binabalangkas ito ng iba't ibang mga tag: mga talata, heading, link, at i-post ito sa Internet, at sa parehong oras ay maaaring basahin ng iba pang mga siyentipiko ang impormasyong ito.

Sa una, ang impormasyon ng teksto lamang ang maaaring ilagay sa mga dokumento ng HTML (sa mga pahina ng website ang kakayahang magdagdag ng mga file ng media: lumitaw ang mga larawan, video at audio sa ibang pagkakataon.

Sa ngayon, suporta at pag-unlad HTML na wika ikakasal W3C (World Wide Web Consortium)- World Wide Web Consortium. Ang W3C ay binubuo ng iba't ibang grupong nagtatrabaho na nagpapatupad at bumuo ng mga pamantayan at teknolohiya sa Internet.

Talaan ng pamamahagi ng browser

Karaniwang mayroong .html o .htm na extension ang mga HTML file. Maaaring matingnan ang mga file na ito gamit ang mga Internet browser.

Talahanayan ng mga pangalan ng browser at ang bilang ng kanilang pamamahagi sa mundo, noong Enero 2016, sa pababang pagkakasunud-sunod.

Upang maunawaan kung ano ang HTML at kung bakit ito kailangan, buksan natin ang anumang pahina sa browser at tingnan ang source code nito.

Halimbawa, bubuksan ko ang pahina ng search engine ng Yandex.

Ang lahat ng mga graphics at teksto na nakikita mo sa pahina ay nabuo gamit ang HTML code.

HTML– ito ang link sa pagitan ng web page at ng mga karagdagang teknolohiya na gagamitin dito.

Sa pangkalahatan, ang lahat ng HTML na command na nakikita mo sa larawan sa itaas ay payak na text na maaaring isulat sa anumang text editor. Sa pamamagitan ng pagpapalit ng extension ng text file sa *.html (pag-uusapan natin kung paano ito gagawin sa ibang pagkakataon), nakakakuha tayo ng ganap na web page na maaaring iproseso ng browser.

Ngayon tingnan natin ang kahulugan mismo at isaalang-alang kung ano ang ibig sabihin nito.

HTML ay isang abbreviation na kumakatawan sa HyperText Markup Language o isinalin sa Russian bilang "Hypertext Markup Language".

Upang maunawaan kung ano ang ibig sabihin ng lahat ng ito, tingnan natin ang bawat salita sa abbreviation na ito nang hiwalay.

Wika.

Ang HTML ay, una sa lahat, wika kung saan maaari mong sabihin sa browser ang impormasyon tungkol sa kung anong mga elemento ang nasa web page at kung ano ang kahulugan ng mga ito.

Tulad ng anumang wika, ang HTML ay may mga salita (mga utos) at mga panuntunan para sa pagsulat ng mga salitang ito (language syntax).

Pagmamarka.

Pakitandaan na ang pangunahing gawain ng HTML ay ipaalam sa browser ang kahulugan na dala ng mga elemento sa isang web page.

Binibigyang-daan ka ng HTML code na "hatiin" ang isang web page sa mga indibidwal na elemento at sabihin sa browser kung aling elemento ang kung ano.

Halimbawa, itong recording form:

Sinasabi sa browser na ito ay nakikitungo sa isang talata.

At ito ang recording form:

Heading

Isinasaad na ang elemento ay isang heading.

Ito ay sumusunod na ang HTML ay hindi responsable para sa hitsura at disenyo ng dokumento.

Upang makita ito, kunin natin ang isang web page bilang isang halimbawa at huwag paganahin ang mga istilo na responsable para sa disenyo dito at tingnan kung paano ito nagbabago.

Pahina na may mga istilo ng disenyo:

Ang parehong pahina, ngunit may mga istilong hindi pinagana (isang HTML code lang ang ginagamit):

Gayundin, ang HTML ay hindi isang programming language at hindi responsable para sa pagsasagawa ng lohikal at programming operations sa page at pagproseso ng data. Madali mong mabe-verify ito kung hindi mo pinagana ang suporta sa wika ng programming sa web ng kliyente sa iyong browser.

Kadalasan ay nakakalimutan ng mga nagsisimula ang panuntunang ito at sinusubukang gumamit ng HTML upang pilitin ang isang elemento na ipakita sa isang paraan o iba pa o upang pilitin itong magsagawa ng ilang aksyon sa pahina gamit ang HTML, ngunit hindi ito tama. Ang bawat aksyon sa isang elemento ay may sariling mga teknolohiya.

Hypertext.

At sa wakas, ang huling salita sa kahulugan ng wikang HTML ay ang hyperlink. Mayroong elemento sa mga web page na ginagawang espesyal ang mga pahinang ito at nakikilala ang mga ito sa ordinaryong teksto na may mga larawan. Ang elementong ito ay mga link.

Ang prefix na "hyper" ay nangangahulugan na kapag nag-click ka sa isang link, ang isa pang mapagkukunan (pahina) sa Internet ay maaaring magbukas, na maaaring matatagpuan sa ibang server.

Ang HTML ay isang wika na partikular na binuo para sa paglikha ng mga pahina na naglalaman ng mga hyperlink.

Upang buod, maaari nating sabihin na ang HTML ay isang wika na nilikha upang matulungan ang browser na maunawaan kung anong mga bahagi ang binubuo ng isang web page, at kung ano ang kahulugan ng mga elementong ito.

Iyon lang ang may teorya sa ngayon. Lumipat tayo sa susunod na praktikal na hakbang. Ngayon ang aming gawain ay maghanda ng mga programa na gagamitin namin upang gumana sa HTML.

Hindi kami pupunta sa mga detalye at kasaysayan ng kung ano ang HTML, ngunit agad na magpapatuloy sa mga pangunahing punto. Ang HTML ay ang batayan para sa pagbuo ng anumang website! Kapag pinag-aaralan ang paksa ng pagbuo ng website, kailangan mong magsimula dito. Walang mabigat dito. LUBOS NA LAHAT ay maaaring makabisado ang teknolohiyang ito!

Gusto kong tandaan kaagad na HINDI ito isang programming language, ngunit isang markup language.

Bakit madaling matuto ng HTML?

Upang magsalita ng matatas na Ingles, hindi mo kailangang malaman ang lahat ng mga salita sa wikang Ingles. Kaya dito, kailangan mo lang matutunan ang ilan sa mga pangunahing tag at matutunan kung paano gamitin ang mga ito. At pagkatapos ang kailangan mo lang gawin ay magsanay at bumuo ng kasanayan.

Simulan natin ang pag-aaral nitong kamangha-manghang, at sa parehong oras simple, teknolohiya.

Isang maliit na teorya...

Ang anumang pahina ay binubuo ng mga tag. Iyon ay, ang pahina ay hindi talaga katulad ng kung ano ang nakasanayan nating makita, ngunit binubuo ng maraming mga tag, na ang bawat isa ay gumaganap ng isang partikular na papel.

Para itong malaking pader na gawa sa ladrilyo. Kung ang lahat ng mga brick dito ay inilatag nang maayos, kung gayon ang buong dingding ay mukhang maganda. Samakatuwid, kapag isinusulat ang istraktura ng pahina, kinakailangang bigyang-pansin ang bawat tag, dahil ito ang "building block" para sa aming hinaharap na pahina.

Ngunit ano ang isang tag sa HMTL?

Isa itong elemento ng HTML page na kahit papaano ay nakakaapekto sa display at layout ng page. Ito ay medyo mahirap na maunawaan ito sa mga salita, kaya kailangan mong agad na tingnan ang lahat sa pagsasanay at masanay sa code. Tingnan ang larawan sa ibaba:

Ito ang istraktura ng pinakasimpleng pahina. Ngunit ang mga paulit-ulit na salitang ito sa mga triangular na bracket ay mga tag. Kung bubuksan mo ang iyong text editor at isulat ang code na ito, at pagkatapos ay i-save ito sa format na HTML, makakakuha ka ng isang HTML na pahina. Hindi pa malinaw kung ano ang HTML? 🙂

Mula sa istrukturang ito makikita mo ang mga tag na iyon na dapat naroroon. Ito ang mga tag:

• at pagsasara
• at pagsasara
• at pagsasara

Upang gawing mas malinaw, na-highlight ko ang mga ito sa orange sa larawan sa ibaba:

Lahat ng isusulat namin sa pagitan ng mga tag At hindi natin makikita sa page natin. Maaaring sabihin ng mga tag na ito sa browser ang tungkol sa pag-encode, tungkol sa pamagat ng aming pahina, iba't ibang estilo, script, at iba pa ay maaaring ikonekta dito. Makikita mo ang lahat ng ito sa mga susunod na aralin.

At narito ang lahat ng mga tag na isusulat namin sa pagitan ng mga tag At, depende sa layunin nito, ay makakaapekto sa istruktura ng aming HTML page.

Well, naging mas malinaw ba kung ano ang HTML? 😉 Pero hindi tayo tumitigil at nagpapatuloy...

Ang ilang mga tag ay maaaring may pansarang tag at ang ilan ay maaaring wala. Halimbawa tag may closing tag. Tulad ng maaaring nahulaan mo na, ang mga tag ay isinasara gamit ang isang slash.

Napakahalaga na igalang ang pagbubukas at pagsasara ng mga tag. Para walang magkamali. Maaaring hindi ipakita ng browser ang error, ngunit ang istraktura ng iyong mga pahina ay magiging mali at magkakaroon ng malalaking problema kapag nagtatrabaho pa sa mga istilo (kung saan haharapin natin ang hitsura). Samakatuwid, kung ang isang tag ay may pansarang tag, dapat itong nasa tamang lugar.

Tingnan natin ang isang halimbawa kung paano HINDI isara ang mga tag at sa anong pagkakasunud-sunod ito dapat gawin. Halimbawa ng dalawang tag:

Tamang HTML CODE

Ang nakikita mo sa itaas ay ito ang tamang pagkakasunod-sunod ng pagsulat ng mga closing tag. Ngunit maaaring may ganoong sitwasyon

ERROR SA HTML CODE

Kaya malapit na mga tag ay mahigpit na ipinagbabawal!

Magsanay upang maunawaan kung ano ang HTML...

Maaari ka lamang matuto nang higit pa tungkol sa kung ano ang HTML sa pamamagitan ng pagsasanay. Maaari kang gumamit ng anumang text editor para dito. Kahit notepad. Ngunit inirerekumenda ko ang paggamit ng Notepad++, dahil marami pang mga function para sa pagtatrabaho sa HTML. Maaari mong i-download ito mula sa link na I-download ang Notepad++. Ang editor na ito ay may lahat ng mga kakayahan para sa paglikha at pag-edit ng mga pahina ng HTML.

Magsimula tayo. Pagkatapos buksan ang programa makikita mo ang sumusunod na window:

Upang lumikha ng isang HTML na pahina, kailangan mong ilagay ang "katawan" ng pahina sa kahon na ito. Maaari mong kopyahin ang teksto sa ibaba at i-paste lang ito. Ngunit mas mahusay na ipasok ang lahat nang manu-mano. Sa ganitong paraan mabilis mong maaalala at masanay sa mga tag.

Kaya, dapat mong makuha ang sumusunod:

Susunod, kailangan mong i-save ang pahinang ito sa HTML na format. Upang gawin ito, mag-click sa menu na "File", pagkatapos ay i-click ang "I-save bilang...". Ilagay ang pangalan ng HTML page. Pinangalanan ko itong index.html. Pagkatapos ay i-save lang namin ito sa isang maginhawang lugar sa aming computer. Pagkatapos nito, mai-highlight ang mga HTML tag, dahil mauunawaan ng Notepad++ editor na ito ay isang HTML na dokumento. At mas kaaya-aya na magtrabaho sa backlighting.

HTML(Hyper Text Markup Language) ay isang espesyal na markup language ng dokumento. Mahalagang tandaan na ang pinag-uusapan natin ay tungkol sa electronic at hindi naka-print na mga dokumento dito.

Ang isang naka-print na dokumento ay may mahigpit na tinukoy na mga laki at margin ng pahina. Ito ay tiyak na tumutukoy sa mga parameter ng font. Ang mga elektronikong dokumento at mga Web page ay hindi inilaan para sa pag-print sa isang printer, ngunit para sa pagtingin sa isang screen. Hindi alam nang maaga kung saang computer titingnan ang dokumento. Hindi alam ang laki ng window ng browser at hindi alam kung anong mga font ang available.

Espesyal na nilikha ang wikang HTML upang magdisenyo ng mga dokumento sa screen na ire-reproduce sa pamamagitan ng hindi kilalang paraan. Ang HTML ay orihinal na inilaan hindi para sa pag-format ng dokumento, ngunit para dito functional markup. Halimbawa, ang "heading" ay isang katangian ng nilalaman, hindi disenyo. Pinipili ng programa para sa pagtingin sa isang dokumento sa screen (browser, browser, explorer) ang paraan nito sa pagpapakita ng bahagi ng dokumentong inilarawan bilang header.

Ang paglikha ng isang dokumento sa HTML ay katulad ng programming. Ang may-akda ng isang dokumento ay kumukuha ng plain text at naglalagay ng mga espesyal na code dito (tinatawag silang mga tag). Kapag ang isang dokumento ay tiningnan, ang mga tag ay nagsisilbing mga utos. Halimbawa, kung sa simula ng isang talata ay may tag