რა არის Bootstrap მოდალი და რისთვის არის ის? რა არის მისი კომპონენტები, მახასიათებლები, დადებითი და უარყოფითი მხარეები? გრაფიკულ ინტერფეისში გამოყენებულია "მოდალური ფანჯრის" კონცეფცია. ხშირად მისი დახმარებით შეგიძლიათ ყურადღება მიიპყროთ რომელიმე მნიშვნელოვან მოვლენაზე. მოდალური ფანჯრები გამოიყენება ზოგიერთი ინფორმაციის, მონაცემების შესაყვანად, პარამეტრების შესაცვლელად. ისინი ბლოკავს მომხმარებლის სამუშაო პროცესს პრობლემის ან მოქმედების დასრულებამდე. Windows ასევე გამოიყენება ვებ გვერდების დასამუშავებლად.
რა არის ეს
ადვილად კონფიგურირებადი და საპასუხო დიზაინი, ეს არის ის, რასაც Bootstrap გთავაზობთ დღეს. მოდალური ფანჯარა, ფორმა, რომელიც შეიძლება გამოყენებულ იქნას ვებსაიტების შესაქმნელად, ეხმარება სურათების, ვიდეოების და სხვა ელემენტების ჩვენებას. ამომხტარი ფანჯარა შედგება ჩამოტვირთვის გამორჩეული ნაწილებისგან: სათაური, ტექსტი დაქვედა კოლონტიტული. თითოეულ ამ ელემენტს აქვს თავისი მნიშვნელობა. Bootstrap მოდალური ფანჯრის მთავარი მიზანია გამოიყენონ დამწყები დიზაინერები ვებ გვერდების შესაქმნელად დამატებითი კოდების დაწერის გარეშე. მოდალური ფანჯარა არის ერთგვარი კონტეინერი, რომელშიც ნაჩვენებია დაწერილი შინაარსი. მოდალური კომპონენტი წყვეტს მიზნების ფართო სპექტრს.
როგორ გავაკეთოთ?
მოდალური ფანჯარა იქმნება და კონტროლდება JavaScript, მონაცემთა და css მეთოდების გამოყენებით. პირველ რიგში, თქვენ უნდა გააკეთოთ მარკირება. იგი შედგება ჩარჩოს, სათაურის, ძირითადი შინაარსისა და ქვედა კოლონტიტულისგან. აქ სავალდებულო ელემენტებია სარდაფი (ბლოკი) და ჩარჩო. მარკირების შემდეგ, თქვენ უნდა გადახვიდეთ მოდალური ფანჯრის ზარის განხორციელებაზე. ხშირად მას უწოდებენ ვებ გვერდის ჩატვირთვისა და შესაბამისი ღილაკის დაჭერის შემდეგ. ზარი ხდება მონაცემთა და JavaScript-ის გამოყენებით. Bootstrap მოდალის დახურვა ხურავს ადრე შექმნილ და შენახულ ამოცანებს.
გაითვალისწინეთ, რომ მოდალურ ფანჯარას აქვს თავისი მახასიათებლები. მრავალი მოდალური ფანჯრის გასახსნელად, თქვენ უნდა დაწეროთ დამატებითი კოდი. უმჯობესია html კოდი მოათავსოთ დოკუმენტის ზედა ნაწილში, სხეულის ტეგის შემდეგ. ეს ხელს უწყობს ფანჯრის ფუნქციონალურობისა და გარეგნობის შენარჩუნებას. მობილურ მოწყობილობებზე, არსებობს გაფრთხილებები მოდალური ფანჯრის კომპონენტის გამოყენებასთან დაკავშირებით. ისინი ზღუდავენ მის სრულ გამოყენებას. Bootstrap 3 იძლევა ფანჯრების მორგებულ ზომებს, ასევე ბადეებს.
კომპონენტები
ადრეBootstrap-თან მუშაობის დასაწყებად, თქვენ უნდა გაარკვიოთ რისგან შედგება. პროგრამა მოიცავს მზა ხელსაწყოების კომპლექტს, რომლებიც გამოიყენება ვებსაიტების შესაქმნელად. მზა JavaScript, CSS და HTML სტილები ქმნიან ადაპტირებულ ბადეს, ჩვენების ღილაკებს, მენიუებს, ხატებს, ხელსაწყოების რჩევებს და სხვა. განლაგებისთვის საჭიროა პროგრამული უზრუნველყოფის ძირითადი სტილები. ბეჭდვისა და ტექსტის სტილის არსებობა საშუალებას გაძლევთ მოამზადოთ ბრაუზერი გვერდის დასაბეჭდად და შექმნათ საიტის ტექსტური შინაარსის დიზაინი. Bootstrap კომპონენტებით შეგიძლიათ შექმნათ ფორმები, ღილაკები და სხვა ელემენტები. პროგრამას აქვს ინსტრუმენტების სრული ნაკრები, რომლებიც სწრაფად და მოხერხებულად ქმნიან გვერდებს მობილური მოწყობილობებისთვის. Bootstrap შედგება მრავალი სხვა დეტალისგან, ისევე როგორც JavaScript. მათი დაუფლება საკმაოდ მარტივია დამწყებთათვისაც კი. თეორიულად, Bootstrap პროგრამის საფუძვლების გაგება საკმარისად ადვილი არ არის. პრაქტიკაში, ეს განვითარება ამარტივებს დიზაინერის და განლაგების დიზაინერის მუშაობას მრავალი მზა კომპონენტის არსებობის გამო.
ფუნქციები
Bootstrap მოდალს აქვს განსაკუთრებული უპირატესობები. მისი დახმარებით, ვებსაიტებისთვის გვერდის განლაგების შემუშავება ხდება მაღალი სიჩქარით. ფანჯარაში შედის ელემენტების დიდი ნაკრები და მზა გადაწყვეტილებები. Bootstrap ხდის თქვენს ვებსაიტს უფრო საპასუხო. ჩარჩო (პროგრამული უზრუნველყოფა) შესაფერისია ყველა ბრაუზერისთვის და სწორად არის ნაჩვენები მათში. ეს მოდალური ფანჯარა მარტივი გამოსაყენებელია. Bootstrap საშუალებას გაძლევთ შექმნათ ვებ გვერდები დამწყებთათვისაც კი, რომლებსაც აქვთ CSS და HTML საბაზისო ცოდნა.
მოდალური ფანჯრის თავისებურება ისაარომ მომხმარებლებს ადვილად შეეგუონ მას. უამრავი მზა კოდის მაგალითი და შესანიშნავი დოკუმენტაცია გაადვილებს Bootstrap-ით სიჩქარის ამაღლებას. მისი ხარისხის შესახებ შეიძლება იყოს დიზაინის თემების უზარმაზარი არჩევანის არსი. Wordpress, CMS, Joomla შეიქმნა ამ მოდალური ფანჯრით. Bootstrap არის ვებ ჩარჩო, რომელიც შეიცავს აუცილებელ კომპონენტებს და დაჯილდოებულია საკუთარი ხატის შრიფტით. მასში შედის ორასზე მეტი ხატი, მათ შორის ძირითადი.
მინუსები
Bootstrap-ის მოდალს აქვს თავისი ნაკლი.
- საიტები, რომლებიც მას იყენებენ, კარგავენ ინდივიდუალურ სტილს. ისინი წყვეტენ უნიკალურობას, რადგან გარეგნულად და სტრუქტურაში ჰგვანან ერთმანეთს.
- მოქნილობის ნაკლებობა; ხშირად მოითხოვს საკუთარი სტილის შექმნას და დამატებით სამუშაოს.
- ჩატვირთული კოდის შეცვლამ შეიძლება გამოიწვიოს სამუშაო საათები.
- მომხმარებლები ხშირად არასწორად იყენებენ Bootstrap კომპონენტებს.
გამოიყენეთ ეს ინსტრუმენტი ასევე ფრონტის განვითარებისთვის. მიუხედავად ნაკლოვანებებისა, რომლებიც აშკარა იქნება ფრეიმერის მომხმარებლებისთვის, Bootstrap-ით განლაგება შესანიშნავი გამოსავალია ვებ დეველოპერებისთვის. ის საშუალებას გაძლევთ შექმნათ მარტივი და ინტუიციური ინტერფეისი მოკლე დროში და დიდი ძალისხმევის გარეშე.
საპასუხო დიზაინი
ერთ-ერთი ყველაზე პოპულარული ჩარჩო, რომელიც დიზაინერს საშუალებას აძლევს შექმნას მაღალი ხარისხის ვებსაიტები და აპლიკაციები მასზე დროისა და ძალისხმევის გარეშე, არის Bootstrap 3. მოდალური ფანჯარა მომხმარებელს ინსტრუმენტების ძირითად კომპლექტს უფასოდ აძლევს.მასთან ერთად შეგიძლიათ გამოიყენოთ JavaScript, CSS, html. ეს პროგრამა შეიქმნა Twitter-ის მიერ და აქვს მთელი რიგი ფუნქციები და უპირატესობები. ჩარჩო შეიქმნა მობილური მოწყობილობებისთვის, ამიტომ მისი ბადე განკუთვნილია პატარა ეკრანებისთვის. დღეს Bootstrap 3 ასევე გამოიყენება ფართოეკრანიანი მოწყობილობებისთვის. პროგრამაში არის მხოლოდ ერთი საპასუხო ბადის სისტემა, რომელიც გაფართოვდა მწარმოებლების მიერ.
ჩარჩო მოყვება შრიფტები. ისინი გამოიყენება როგორც ხატები. ამ პროგრამაში დიზაინერებს უკვე აქვთ საქმე ვექტორულ შრიფტებთან და სურათებთან, რომელთა შეცვლა შესაძლებელია სურვილისამებრ. Bootstrap 3-ის თავისებურება ის არის, რომ ის არ უჭერს მხარს ძველ ბრაუზერებს. საპასუხო დიზაინის კონცეფცია მარტივია: საიტი ავტომატურად ადაპტირდება ეკრანის ზომასთან, განურჩევლად იმისა, თუ რა მოწყობილობიდან მიუწვდებოდა მომხმარებელი მას. საპასუხო დიზაინი მოითხოვს სპეციალისტ ცოდნას და უნარებს.
მუშაობა Bootstrap
სანამ Bootstrap-ის შესწავლას დაიწყებთ, ჩამოტვირთეთ ის უფასოდ. ჩამოტვირთვისა და შემდგომი გახსნის შემდეგ მომხმარებელი მიიღებს სამ საქაღალდეს, რომელიც შეიცავს სტილებს, სკრიპტებს და ხატულას შრიფტებს. ეს ყველაფერი არის Bootstrap. თქვენ შეგიძლიათ გახსნათ მოდალური ფანჯარა ფრეიმერის სახელწოდებით საქაღალდის შექმნის შემდეგ. მასში თქვენ უნდა შექმნათ ცარიელი ფაილი "ndex.html". გადმოწერილ პროგრამულ უზრუნველყოფაში აირჩიეთ მთელი "fonts" საქაღალდე და "bookstrap.css" სტილი შესაბამისი საქაღალდედან. არ დაგავიწყდეთ "bootstrap.js" სკრიპტიც. შექმენით მსგავსი საქაღალდე სახელწოდებით "css" არსებულ საქაღალდეში, მოათავსეთ მასში "bootstrap.min.css".შექმენით კიდევ ერთი "css" ცარიელი "style.css" ფაილით. ის დაგჭირდებათ საკუთარი სტილის დასამატებლად.
როდესაც შეიქმნება ყველაფერი, რაც საჭიროა, შემდგომი მუშაობა გაკეთდება მხოლოდ "ndex.html"-ით. თუ არ გსურთ კოდების ხელით დაწერა, იხილეთ მზა html დოკუმენტის ჩონჩხი. დააკოპირეთ და ჩასვით კოდი ფაილში. შექმნილ ჩონჩხში იქნება დაკავშირებული სტილები, ბიბლიოთეკა და სკრიპტი. სხეულის ტეგამდე არ დაგავიწყდეთ „jQuery“ბიბლიოთეკის ჩართვა, ხოლო შემდეგ - „js“სკრიპტის.
ბადე
Bootstrap მოდალური ფანჯარა გამოიყენება საიტის კლასიკური განლაგების შესაქმნელად. იგი შედგება სათაურის, სხეულის, გვერდითი სვეტისა და ქვედა კოლონტიტულისგან. იმისათვის, რომ ყველაფერი სწორად იყოს ნაჩვენები, აუცილებელია თითოეული ელემენტის სიგანე პროცენტულად გამოვთვალოთ ინდივიდუალური შეფუთვით. საიტის ქვედა კოლონტიტული და სათაური უნდა იყოს 100% სიგანის, სხეულის და გვერდითი სვეტები შეიძლება იყოს უფრო მცირე.
Bootstrap ბადე საჭიროა მხოლოდ ბლოკებისთვის საჭირო სიგანის დასაყენებლად. ბადის ფუნქციონირება ხდება ცხრილის დახმარებით, რომელსაც აქვს სვეტები და რიგები. ბადე შეიძლება გაკეთდეს სხვა ქსელში შეუზღუდავი რაოდენობის ჯერ. თუ საიტის ნაწილები მზადდება მასთან, არ არის საჭირო თავად დაწეროთ ადაპტური მოთხოვნები. ბადის გარდა, მოდალური ფანჯარა შეიცავს ბევრ დამატებით კომპონენტს (მენიუ, ცხრილები, ჩანართები, ინსტრუმენტების რჩევები).
შეცდომები
ზოგჯერ რამდენიმე Bootstrap მოდალის ერთდროულად გახსნამ შეიძლება გამოიწვიოს შეცდომა. ეს შესაძლებელია, თუ ვინდოუსს არ შეუძლიაჩატვირთეთ html ფაილი სწორად. შეცდომის არსებობა მიუთითებს იმაზე, რომ ფაილი ინფიცირებულია მავნე პროგრამით ან ვირუსით. ყველაზე ხშირად, Bootstrap-თან დაკავშირებული შეცდომები ჩნდება პროგრამების, კომპიუტერის ჩატვირთვისას ან რაიმე მოქმედების შესრულების შემდეგ. ყველაზე გავრცელებული არის ის, რაც დაკავშირებულია მოდალურ ფანჯარასთან: "შეცდომა ფაილში", "ფაილი აკლია", "ვერ მოიძებნა", "ჩატვირთვა ვერ ხერხდება", "რეგისტრაცია ვერ მოხერხდა", "შესრულება და ჩატვირთვის შეცდომა". ისინი შეიძლება გამოჩნდნენ, როდესაც მომხმარებელი აყენებს პროგრამას ან ის უკვე მუშაობს, ან როდესაც კომპიუტერი ჩართულია და გამორთულია. მნიშვნელოვანია, რომ ყურადღებით დავაკვირდეთ შეცდომების გამოჩენას, რადგან ეს დაგეხმარებათ სწორად აღმოფხვრას მათი წარმოშობის მიზეზი Bootstrap-ში. მოდალური ფანჯარა ზოგჯერ არასწორი ზარის გამო არ მუშაობს, რაც არ არის დამოკიდებული შიდა შეცდომებზე.
