ამ სტატიაში თქვენ შეისწავლით თუ როგორ გამოიყენოთ HTML თქვენი პირველი ვებსაიტის დასაწერად! სტატიაში მოცემულია საილუსტრაციო მაგალითები უკეთესი გაგებისთვის. მოდით დაუყოვნებლივ გავაკეთოთ დაჯავშნა, რომ სტატია თავდაპირველად შექმნილია მათთვის, ვინც ახლახან იწყებს HTML-ის სწავლას. გარდა ამისა, გპირდებით, რომ ამ სტატიის წაკითხვის ბოლოს გარანტირებული გაქვთ თქვენი პირველი ვებსაიტის შექმნა.
HTML ნიშნავს ჰიპერტექსტის მარკირების ენას, ანუ ტექსტის ორგანიზების ენას.
განსხვავებით პროგრამირების ენებისგან (JavaScript, PHP და ა.შ.), რომლებიც იყენებენ სკრიპტებს ვებსაიტებზე მოქმედებების შესასრულებლად, თანმიმდევრობის ენა (HTML) იყენებს ტეგებს ვებსაიტის შინაარსის აღსანიშნავად.
მოდით დავიწყოთ HTML-ის სწავლა ნულიდან
როგორც ინგლისური შედგება ასოებისგან A, B, C და ა.შ., ასევე HTML შედგება თავისებური "ასოებისგან":,,
და ა.შ. HTML ენის ამ თავისებურ "ასოებს" ვებმასტერები უწოდებენ ტეგებს.
შემდეგი არის HTML ტეგის მაგალითი.
ტეგები შექმენით ხაზგასმა ამ ტექსტის კიდეებზე.
HTML ტეგები დაწყვილებული CSS ენის სტილებთან გაძლევთ საშუალებას სწრაფად და ეფექტურად შექმნათ ვებსაიტები.
HTML-ის ადგილი სხვა ენებს შორის
როგორც იცით, კარგი საიტიაჩაშენებულია მინიმუმ 5 ენაზე.
თანამედროვე ვებსაიტი აგებულია ენებზე:
- HTML (სტრუქტურა და შეკვეთა).
- CSS (სტილის შინაარსი).
- JavaScript (ბრაუზერის მოქმედებები).
- PHP (სერვერის მოქმედება).
- SQL (მონაცემთა შენახვა).
HTML არის მთავარი ფუნდამენტური ენა, რომელსაც სხვები ეფუძნება. ამიტომ, HTML-ის სწავლა უნდა იყოს პირველი ნაბიჯი მათთვის, ვინც სწავლობს ვებსაიტების შექმნას.
ტეგი
HTML ენა შეიცვალა წლების განმავლობაში მისი დაარსებიდან. ამ დროისთვის ინტერნეტ საიტების უმეტესობა გადადის ენის უახლეს ვერსიაზე - HTML5. მაგრამ HTML5-შიც კი, ენის საფუძვლები უცვლელი რჩება.
HTML გვერდის სტრუქტურა სენდვიჩს ჰგავს. ისევე როგორც სენდვიჩს აქვს ორი ნაჭერი პური, HTML დოკუმენტს აქვს გახსნის და დახურვის HTML ტეგი.
ეს ტეგები, როგორც პური სენდვიჩში, აკრავს ყველაფერს შიგნით.
ტეგი
როგორც HTML-ის სწავლას განაგრძობთ, აუცილებლად უნდა გაეცნოთ ტეგს. უშუალოდ მშობლის ტეგის შიგნით არის საიტის მთელი შინაარსი, ტეგის ჩათვლით. ეს ტეგი აუცილებელია და შეიცავს საიტის გვერდის ყველა პარამეტრს, რომელზეც ის არის დაწერილი. ეს პარამეტრები არ ჩანს საიტის ვიზიტორებისთვის, მხოლოდ ბრაუზერები (Google Chrome, Mozilla Firefox და ა.შ.) ხედავენ მათ.
ვებგვერდის პარამეტრების ბლოკი შეიცავს ყველა "გაუკეთებელ" ელემენტს, რომელიც ეხმარება ბრაუზერს თქვენი საიტის სწორად ჩვენებაში ვებზე.
ყველა ვარიანტი რომშესაძლებელია ტეგის შიგნით კონფიგურაცია, ჩვენ შევხედავთ, მაგრამ ცოტა მოგვიანებით - როცა დრო მოვა.
ტეგი
თეგი, ისევე როგორც ტეგი, არის ტეგის შიგნით.
ეს ტეგი საჭიროა იმისათვის, რომ თქვენს საიტზე აჩვენოს ყველა ინფორმაცია, რომლის ჩვენებაც გსურთ.
სათაურები, აბზაცები, ცხრილები, სურათები და ბმულები მხოლოდ მცირე ნაწილია იმ ელემენტებისა, რომლებიც შეიძლება შეიცავდეს ტეგში.
HTML დოკუმენტის ძირითადი სტრუქტურა:
… …
თქვენი პირველი საიტი
ახლა თქვენ იცით, რომ შეგიძლიათ შექმნათ ვებსაიტები HTML-ის გამოყენებით და რომ ამისთვის გამოიყენება ძირითადი ტეგები:
- . ასახავს ვებ გვერდის საზღვრებს.
- . შეიცავს ბრაუზერში ვებ გვერდის ჩვენების პარამეტრებს.
- . შეიცავს ვებ გვერდის ყველა ელემენტს (სურათებს, ვიდეოებს, ტექსტს და ა.შ.), რომელთა ჩვენება გსურთ საიტის ვიზიტორებისთვის.
სხვა ტეგები, როგორიცაა,,, ჩვენ მალე ვისაუბრებთ.
კარგი იქნება, თუ მკითხველი არამარტო წაიკითხავს ამ სტატიას, არამედ მაშინვე გაიქცევა საკუთარი უნარების დახვეწაზე. თქვენი HTML უნარების დახვეწისთვის, თქვენ უნდა შექმნათ თქვენი პირველი ვებსაიტი, რომელიც გამოდგება თქვენი ახალი უნარების საცდელად.
ცნობილია, რომ მობილური ოპერატორები ("MTS", "MegaFon" და ა.შ.) გვაწვდიან მობილურ მომსახურებას. ანალოგიურად, საიტების შექმნისა და მართვის სერვისები მოწოდებულია ჰოსტინგის ოპერატორების მიერ. თქვენი ვებსაიტის შესაქმნელად გადადით ნებისმიერი უფასო ჰოსტინგის ოპერატორის საიტზე.
დამოწმებული ჰოსტინგის პროვაიდერები მოიცავს BEGET ანreg, მაგალითად. თქვენ შეგიძლიათ აირჩიოთ ნებისმიერი.
მოკლე რეგისტრაციის შემდეგ, 24 საათის შემდეგ, ავტომატურად შეიქმნება თქვენი პირველი ვებ გვერდი ინტერნეტში, რომელიც ხილული იქნება მთელი მსოფლიოსთვის და შეგიძლიათ დაიწყოთ ვარჯიში!
საიტის თანამედროვე სტრუქტურა
ახლა, როდესაც თქვენ გაქვთ თქვენი საიტი, შეამოწმეთ რა ტეგებს შეიცავს ტეგი და როგორ აწყობენ ისინი ინფორმაციას საიტებზე.
ზემოთ მოცემული სურათი არის სტრუქტურის სქემატური წარმოდგენა, რომელიც მოჰყვა HTML ენის უახლეს ვერსიას - HTML5. HTML5-თან ერთად მოვიდა არა მხოლოდ ახალი ტეგები, არამედ ვებსაიტების შექმნის მნიშვნელობაც. ყველა ტეგი, რომელსაც ხედავთ სურათზე, შეიცავს მთავარ ტეგში. ეს ტეგები დაგეხმარებათ თქვენი საიტის სტრუქტურის „გამოხაზვაში“და მის მნიშვნელოვნებაში.
მაგალითად, ტეგების შიგნით … მოსახერხებელია საიტის სათაურის (ტეგების) და საიტის აღწერილობის (ტეგების) განთავსება.
მოხერხებულია საიტის (ტეგის) მენიუს (ბმულების) განთავსება ტეგებში.
მოხერხებულია თეგების შიგნით მნიშვნელობით დაკავშირებული ინფორმაციის ნებისმიერი დიდი ბლოკის განთავსება. ეს შეიძლება იყოს რამდენიმე სტატია, რომელთაგან თითოეული "შეფუთულია" ტეგებით, ან ფოტოებით (ტეგით) ან ცხრილებით (ტეგებით.
) და სხვა.
მოხერხებულია ტეგების შიგნით ნებისმიერი ინფორმაციის მოთავსება, რომელიც არ შეესაბამება.
თეგების შიგნით, ჩვეულებრივ, განთავსდება დამატებითი ინფორმაცია, როგორიცაა საკონტაქტო ინფორმაცია, საიტის დამატებითი განყოფილებები და ა.შ.
ასე რომ, ახლა თქვენ ცოტა უფრო კომპეტენტური ხართ, თუ რისგან არის შექმნილი თანამედროვე ვებსაიტები. ავიღოთ მაგალითიჩემს თავში არეულობა შეცვალა გამჭრიახობისგან შიშმა.
ასე რომ, როცა გახსნით ფაილ მენეჯერს თქვენი ჰოსტინგის ოპერატორის საიტზე და იპოვით დოკუმენტს სახელად index.php, თავისუფლად დაწერეთ მასში, თითქოს ნულიდან, თქვენი საიტის სტრუქტურა.
ჩემი პირველი ვებსაიტი
გვერდის სათაური
გვერდის აღწერა
ბმული 1 | ლინკი 2 | ბმული 3
ზოგიერთი სტატიის სათაური
ეს არის ბლოკი, რომელიც შეიცავს ნებისმიერ ინფორმაციას და CSS-ის დახმარებით თქვენ შეგიძლიათ გააფერადოთ ეს ბლოკი და მთელი საიტი მთელი თავისი შინაარსით, როგორც გსურთ. © ყველა უფლება დაცულია
გახსოვთ, რომ ჩვენ ვთქვით, რომ არსებობს სხვადასხვა პარამეტრები საიტისთვის? აბა, აი ეს არის:
- გამოყენებით ჩვენ ვაჩვენებთ ბრაუზერებს, რომ საიტი შეიძლება შეიცავდეს როგორც რუსულ, ასევე ინგლისურ სიმბოლოებს (წინააღმდეგ შემთხვევაში, როდესაც გახსნით საიტს, დაინახავთ საშინელ კრაკოზიაბრებს).
- გამოიყენება გვერდის სახელის აღსანიშნავად, რომელიც გამოჩნდება ბრაუზერის ჩანართში და საძიებო სისტემაში ("Yandex", Google და მსგავსი).
რა თქმა უნდა, CSS სტილის გარეშე, თქვენი საიტი ძუნწი გამოიყურება (შავი ასოები თეთრ ფონზე), მაგრამ დარწმუნდით, რომ ჯერ სცადეთ დაწეროთ თქვენი პირველი გვერდი HTML-ში.
გილოცავთ! თქვენ ახლახან შექმენით თქვენი პირველი ვებ გვერდი თქვენს საკუთარ ვებსაიტზე! უფრო საინტერესო იქნება!
