ურთიერთდაკავშირებული ტექსტების მონიშვნის ენა (HyperText Markup Language) შემოკლებით HTML წარმოადგენს ვებგვერდის უპირველეს შემადგენელს. მისი საშუალებით ხდება საიტის შიგთავსის განსაზღვრა და პირველადი სახით განლაგება. დანარჩენი ვებტექნოლოგიები კი გამოიყენება საიტის იერსახის აწყობისა და წარმოდგენისთვის (CSS) ან სხვადასხვა შესაძლებლობებისა და მოქმედებების მინიჭებისთვის (Javascript).

ტერმინი „HyperText“ მიანიშნებს ვებგვერდების ურთიერთკავშირზე ბმულების საშუალებით, როგორც ერთი საიტის შიგნით, ასევე სხვადასხვა საიტებს შორის. ბმულები ვებსამყაროს ძირითად საფუძველს წარმოადგენს. მასალის ინტერნეტში ატვირთვითა და სხვების მიერ უკვე შექმნილ გვერდებთან მისი დაკავშირებით, თქვენ ხდებით მსოფლიო ქსელის (World Wide Web) მოქმედი მონაწილე.

HTML იყენებს ერთგვარ „მონიშვნებს“ ჩვეულებრივი ტექსტის, სურათებისა და სხვა სახის შიგთავსის ვებბრაუზერში გამოსაჩენად. HTML-ის მონიშვნები შეიცავს საგანგებო დანიშნულების „ელემენტებს“, როგორიცაა <img>, <title>, <p>, <div>, <picture> და ა.შ.

ამ ნიშნებს უწოდებენ „ჭდეებს“ (ინგლისურად „Tag“; იკითხება „ტეგი“). ჭდეები არაა რეგისტრზე (დიდ და პატარა ასონიშნებზე) დამოკიდებული. მაგალითად <title>, <Title>, <TITLE> და ნებისმიერი მსგავსი სახესხვაობა იმუშავებს ერთნაირად.

ქვემოთ მოცემული სტატიები დაგეხმარებათ, უკეთ გაეცნოთ HTML-ს.

  • HTML შესავალი

    თუ თქვენ ახალბედა ხართ ვებშემუშავების საკითხებში, აუცილებად გაეცანით HTML-ის საფუძვლებს რომ უკეთ გაიგოთ, რას წარმოადგენს HTML და როგორ გამოიყენება.

  • HTML გზამკვლევი

    HTML გამოყენების შესახებ სტატიებისთვის, ასევე გაკვეთილებისა და სრული მაგალითებისთვის, იხილეთ ჩვენი სასწავლო განყოფილება HTML-ის შესახებ.

  • HTML ცნობარი
    ჩვენს ვრცელ მასალებში, თქვენ იპოვით დაწვრილებით ინფორმაციას HTML-ის თითოეული ელემენტისა და თვისების, შესახებ.

გაკვეთილები დამწყებთათვის

ჩვენს სასწავლო განყოფილებაში წარმოდგენილია მრავალი მოდული, რომელიც შეგასწავლით HTML-ს ნულიდან — ყოველგვარი წინაპირობების გარეშე.

შესავალი HTML-ში
ეს მოდული წარმოადგენს მოსამზადებელ საფეხურს, HTML-ის სინტაქსსა და ძირითად საკითხებში უკეთ გასარკვევად, თუ როგორ ხდება ტექსტის HTML-ად ქცევა, ურთიერთდამაკავშირებელი ბმულების შექმნა და HTML-ის საშუალებით ვებგვერდის აგება.
ფაილები და მათი განთავსება
ამ მოდულში ახსნილია, თუ როგორ არის შესაძლებელი მულტიმედიური ფაილების HTML-ში ჩართვა, მათ შორის სურათების განთავსების სხვადასხვა გზები და ასევე ნაჩვენებია როგორ ხდება ვიდეოს, ხმოვანი ფაილის ან სხვა საიტის სრულად ჩასმა, მოცემულ გვერდზე.
HTML-ის ცხრილები
მონაცემების ცხრილის სახით წარმოდგენა, ახსნილი მარტივი და გასაგები ენით. ეს მოდული მოიცავს როგორც ცხრილების შექმნის საფუძვლებს, ამასთან დამატებით შესაძლებლობებს, როგორიცაა დასათაურება, შეჯამება და ა.შ.
HTML-ის შესავსები ველები
ველებს ვებგვერდის გამოყენებაში მნიშვნელოვანი ადგილი უჭირავს — ისინი უზრუნველყოფს მომხმარებლის საიტთან ურთიერთქმედებას, ანუ რეგისტრაციასა და ანგარიშზე შესვლას, გამოხმაურების გაგზავნას, ნივთების ყიდვას და ა.შ. ამ მოდულში მოცემულია შესავსები ველების მომხმარებლის მხარეს არსებული ნაწილის შექმნის საწყისები.
HTML-ის გამოყენება ხშირად წარმოქმნილი ხარვეზების მოსაგვარებლად
გაწვდით მასალების იმ განყოფილებების ბმულებს, სადაც ახსნილია თუ როგორ ხდება HTML-ის გამოყენება იმ ამოცანების გადასაწყვეტად, რომლებიც თან ახლავს ვებგვერდის შექმნას: სათაურების მორგება, სურათებისა და ვიდეოების დამატება, შიგთავსის გაუმჯობესება, შესავსები ველების განთავსება და ა.შ.

სიღრმისეული საკითხები

CORS-ით სურათების გამოყენება
crossorigin მახასიათებელი, შესაბამის CORS-თავსართით, საშუალებას იძლევა სურათები განისაზღვროს <img> ელემენტად განსხვავებული წარმომავლობის შემთხვევაში და გამოყენებული იყოს <canvas> ელემენტში ისე, თითქოს შიდა წყაროდანაა.
CORS-პარამეტრების მახასიათებლები
HTML-ელემენტების ნაწილს, რომლებიც მხარს უჭერს CORS, მათ შორის <img> ან <video> გააჩნია crossorigin-მახასიათებელი (crossOrigin-თვისება), რომელიც საშუალებას გაძლევთ გამართოთ CORS-მოთხოვნები, ელემენტების გადაცემულ მონაცემებზე.
ფოკუსირების მართვა HTML-ში
activeElement DOM-ის მახასიათებელი და hasFocus() DOM-ის მეთოდი საშუალებას გაძლევთ თვალი ადევნოთ მომხმარებლის ვებგვერდის ცალკეულ ნაწილებთან ურთიერთქმედებას.
პროგრამის კეშის გამოყენება
პროგრამის კეშირება საშუალებას იძლევა ვებპროგრამა გაეშვას ინტერნეტკავშირის გარეშე. შეგიძლიათ გამოიყენოთ პროგრამის კეშის (AppCache) გარსი იმ მასალების განსაზღვრისთვის, რომლებიც უნდა შეინახოს ბრაუზერმა კეშში, კავშირგარეშე ხელმისაწვდომობისთვის. პროგრამები, რომლებიც იყენებს კეშს იმ შემთხვევაშიც იმუშავებს, თუ მომხმარებელი გვერდის ხელახლა ჩატვირთვის ღილაკს დააწვება, კავშირგარეშე რეჟიმში.
შიგთავსის წინასწარი ჩატვირთვა rel="preload"
preload მნიშვნელობა <link> ელემენტის rel მახასიათებელი, საშუალებას გაძლევთ განსაზღვრული მოთხოვნები გადაეცეს თქვენი HTML-ის <head> ელემენტს, მიეთითოს ის მასალები, რომლების ჩატვირთვაც მეტად სასწრაფოა, გვერდის გახსნისას და შესაბამისად გსურთ უფრო ადრე დაიწყოს მათი ჩატვირთვა, ვიდრე გვერდს სრულად დამუშავებს ბრაუზერის ძრავი. ეს ხელს შეუწყობს მათ სწრაფ ხელმისაწვდომობას და გააუმჯობესებს წარმადობას. ამ სტატიაში მოცემულია ძირითადი ინფორმაცია, თუ როგორ მუშაობს preload.

ცნობარი

HTML-ის ცნობარი
HTML შედგება ელემენტებისგან, რომელთა გარდაქმნაც შესაძლებელია მრავალი სახის თვისებების მეშვეობით. HTML-დოკუმენტები ერთმანეთთან დაკავშირებულია ბმულებით.
HTML-ის ელემენტების ცნობარი
იხილეთ HTML-ის ელემენტების სრული ჩამონათვალი.
HTML-ის თვისებების ცნობარი
ელემენტებს HTML-ში გააჩნია თვისებები. ამ დამატებითი მნიშვნელობების შერჩევით შესაძლებელია განისაზღვროს ელემენტების მახასიათებლები ან მათი მოქმედება სხვადასხვა გზით.
გლობალური თვისებები
გლობალური თვისებები შეიძლება განესაზღვროს ყველა HTML-ელემენტს, მათ შორის იმათ, რომლებიც სტანდარტით არაა განსაზღვრული. ეს ნიშნავს, რომ ნებისმიერი არასტანდარტული ელემენტი მიიღებს ამ მახასიათებლებს, მათ შორის ისინი, რომლებიც HTML5-დოკუმენტს სრულად შეუსაბამოს ხდის სტანდარტებთან.
ხაზოვანი და ბლოკური ელემენტები
HTML-ის ელემენტები ჩვეულებრივ არის „ხაზოვანი“ ან „ბლოკური“. ხაზოვანი ელემენტები იკავებს სივრცის მხოლოდ იმ ნაწილს, რომელიც მოქცეულია მის ჭდეებს შორის. ბლოკური ელემენტი კი სრულად ავსებს მისი მშობელი (შემომსაზღვრელი) ელემენტის სივრცეს, შესაბამისად ქმნის ერთგვარ „ბლოკს“.
ბმულის სახეები
HTML-ში, მრავალი სახის ბმული გამოიყენება ორი დოკუმენტის დასაკავშირებლად. ბმულის ჭდეებია  <a>, <area> და <link>.
ფაილის სახეობები, რომლებიც მხარდაჭერილია HTML-ის ხმოვან და ვიდეოელემენტებში
<audio> და <video> ელემენტები იძლევა ხმოვანი და ვიდეოფაილების გაშვების საშუალებას. ისინი წარმოადგენს ბრაუზერში ჩაშენებულ შესაძლებლობებს, Adobe Flash-ისა და სხვა დამატებითი მოდულების ჩასანაცვლებლად.
HTML-ის შიგთავსის სახეები
HTML შედგება მრავალი სახის შიგთავსისგან, რომლებიც გამოიყენება გარკვეულ შემთხვევებში, სხვა შემთხვევებში კი არა. აგრეთვე, თითოეულ მათგანს გააჩნია კატეგორიების სხვა ნაკრებები და ელემენტები, რომელთა გამოყენებაც დაშვებული ან დაუშვებელია მათ შიგთავსში. ეს სახელმძღვანელო ამ კატეგორიებს ეხება.
მოძველებული და თანამედროვე სტანდარტის რეჟიმები
ისტორიული მიმოხილვა მოძველებული და სტანდარტის შესაბამისი რეჟიმების.

დაკავშირებული საკითხები

HTML-ის ელემენტებისთვის ფერების მინიჭება CSS-ის გამოყენებით
სტატია მოიცავს საკითხებს, CSS-ის გამოყენებით HTML-ის შიგთავსზე ფერების მინიჭების შესახებ, ასევე ჩამონათვალს, თუ რომელი ნაწილებისთვისაა შესაძლებელი HTML-დოკუმენტში ფერების განსაზღვრა და რომელი CSS-თვისებების გამოყენებაა ამისთვის საჭირო. თან ახლავს მაგალითები, ფერების შესარჩევი საშუალებების ბმულები და ა.შ.

იხილეთ ყველა...

Join the Web layout community

Choose your preferred method for joining the discussion:

დოკუმენტების ჭდეები და წვლილის შემტანები

ამ გვერდის შექმნაში, წვლილის შემტანები: G12r, levanijincharadze, Levani_Jincharadze, Silovan, kiknag, stephaniehobson, SergoKarakozov
ბოლო განახლების ავტორი: G12r,