ქალი ვებ დიზაინერი მუშაობს კომპიუტერზე თანამედროვე ოფისში
სურათის კრედიტი: monkeybusinessimages/iStock/Getty Images
ორიგინალური Cascading Style Sheets სპეციფიკაცია, ისევე როგორც მისი ბევრად უფრო ახალი CSS3 რევიზია, არის ტექნოლოგიები, რომლებიც გამოიყენება HTML ვებ გვერდების გასაუმჯობესებლად და ფორმატირებისთვის. CSS თავდაპირველად შეიქმნა იმისათვის, რომ გაუმკლავდეს ვებ გვერდის პრეზენტაციის ფენას უფრო ეფექტური გზით, ვიდრე ფორმატირება HTML-ით, რომელიც არასოდეს ყოფილა გამიზნული თანამედროვე ვებ-გვერდის კომპლექსური კონსტრუქციისთვის. იმის გამო, რომ CSS2 არის CSS1-ის საყოველთაოდ მიღებული გაფართოება, ტერმინი CSS რიცხვის გარეშე გულისხმობს CSS2-ის ჩართვას. CSS3 სპეციფიკაცია ჯერ კიდევ დამუშავების პროცესშია 2014 წლის ივლისისთვის, ამიტომ ვებ დეველოპერებმა უნდა გაითვალისწინონ, რომ ფუნქციების მხარდაჭერა განსხვავდება ბრაუზერებს შორის.
CSS3 უკუღმა თავსებადია CSS-თან
CSS3 არის CSS2-ის განახლება, რომელიც ინარჩუნებს თავსებადობას CSS-ის ყველა მახასიათებელთან -- CSS3 არ უარყოფს არცერთ CSS კოდს. CSS3 კოდი შექმნილია იმისათვის, რომ ვებ გვერდები უკეთ გამოიყურებოდეს და უფრო სწრაფად ჩაიტვირთოს, ასევე შეამციროს განვითარების დრო მომხმარებლის ბრაუზერში გვერდების შესაქმნელად. CSS3 ხდის ვებ დიზაინს ნაკლებად დამოკიდებული გამოსახულების ფაილებზე გვერდის დიზაინის ელემენტებზე და ამცირებს ფაილის გადაცემის მოთხოვნას და ჩამოტვირთვის დროს ნაკლები სურათების გამოყენებით. CSS1 ორიენტირებულია გარეგნობის ფორმატირებაზე, ხოლო CSS2-მა დაამატა პოზიციონირების შესაძლებლობები ტექსტისა და ობიექტებისთვის. ძველი ბრაუზერის ვერსიები, როგორიცაა IE 9 და წინა, ფართოდ არ უჭერს მხარს CSS3-ის დამატებულ ფუნქციებს, რასაც შეიძლება დასჭირდეს განვითარების დამატებითი დრო CSS დაბრუნების კოდის შესანარჩუნებლად.
დღის ვიდეო
CSS3 ამატებს მომრგვალებულ კუთხეებს და გრადიენტებს
CSS3-მდე ვებ დეველოპერებს სჭირდებოდათ გამოსახულების ფაილების დიზაინი, რათა დაემატებინათ ისეთი რამ, როგორიცაა მომრგვალებული კუთხეები სტრუქტურული საზღვრებისთვის და ფონის სურათის გრადიენტებისთვის; CSS3 შეიცავს შესადარებელ ფუნქციებს, რომლებიც შეიძლება დაემატოს კოდის რამდენიმე სტრიქონს. CSS-ში ვებ დეველოპერმა უნდა შეიმუშავოს საზღვრები ან გრადიენტი, ატვირთოს იგი გამოსახულების სერვერზე, განათავსოს სურათი გვერდზე და გამოიყენოს CSS საზღვრის სწორად განლაგებისთვის. CSS3-ში ვებ დეველოპერს შეუძლია მსგავსის გაკეთება ისეთი კოდით, როგორიცაა ".roundBorder{border-radius: 10px;}". ფონის გრადიენტები ცოტა უფრო რთულია და სხვადასხვა ბრაუზერისთვის განსხვავებულ კოდს მოითხოვს. მაგალითად, Chrome-ისა და IE-სთვის თეთრი-შავი გრადიენტი იყენებს კოდს, როგორიცაა ".gradBG{background: liner-gradient (თეთრი, შავი);}".
CSS3 ამატებს ანიმაციის ფუნქციებს და ტექსტის ეფექტებს
CSS3-ს აქვს რამდენიმე ფუნქცია, რომელიც არ არის CSS-ში, რათა გააუმჯობესოს თქვენი გვერდის ელემენტების გარეგნობა. CSS3-ით ვებ დეველოპერებს შეუძლიათ ტექსტის ჩრდილის დამატება ტექსტში, რათა გაუადვილონ წაკითხვა ან ვიზუალური ელფერის დამატება და შეუძლიათ აიძულონ ხაზის წყვეტა უფრო გრძელი სიტყვებით, რათა ისინი მოთავსდეს სვეტებში სიტყვების შეფუთვით. CSS3-მდე ვებ დეველოპერებს სჭირდებოდათ ანიმაციის კოდირება სკრიპტირების ენებზე, როგორიცაა JavaScript და jQuery; CSS3 ამატებს ანიმაციის რამდენიმე ფუნქციას დიზაინის ფენას. W3C კვლავ მუშაობს ვებ ანიმაციების სტანდარტზე, რათა გადაწყვიტოს თავსებადობის საკითხები სხვადასხვა ანიმაციის ტექნიკას შორის.
CSS3 განსაზღვრავს ტექსტის სვეტებს
CSS3 ამატებს ტექსტის სექციების რამდენიმე სვეტად დაყოფის შესაძლებლობას, რათა წაიკითხოთ გაზეთი. CSS2 სპეციფიკაში, ვებ დეველოპერებს უჭირთ მრავალსვეტიანი ტექსტის სექციების აგება, რადგან სტანდარტი არ არის აღჭურვილი ტექსტის ავტომატურად გაყოფისთვის. განსაკუთრებით საიტებზე, რომლებსაც აქვთ საპასუხო დიზაინი, განვითარების ტექნიკა, რომელიც აწესრიგებს და ზომავს კონტენტს მოწყობილობის ეკრანის გარჩევადობის ყურებისას, უფრო დიდი მონიტორების მქონე ადამიანებს შეიძლება გაუჭირდეთ ტექსტის სტრიქონების კითხვა, რომლებიც ვრცელდება მთელს ეკრანი.
