ហេតុអ្វីបានជាអ្នកគួរប្រើ SVG នៅលើគេហទំព័ររបស់អ្នកនៅថ្ងៃនេះ

អត្ថប្រយោជន៍នៃការប្រើ Scalable Vector Graphics

ក្រាហ្វិកវ៉ិចទ័រដែលអាចធ្វើមាត្រដ្ឋានបានឬ SVG ដើរតួនាទីយ៉ាងសំខាន់ក្នុងការរចនាវេបសាយនៅថ្ងៃនេះ។ ប្រសិនបើអ្នកមិនកំពុងប្រើ SVG នៅក្នុងការងាររចនាគេហទំព័ររបស់អ្នកនោះគឺជាហេតុផលមួយចំនួនដែលអ្នកគួរតែចាប់ផ្តើមធ្វើដូច្នេះក៏ដូចជាការថយក្រោយដែលអ្នកអាចប្រើសម្រាប់កម្មវិធីរុករកចាស់ដែលមិនគាំទ្រឯកសារទាំងនេះ។

ដំណោះស្រាយ

អត្ថប្រយោជន៍ដ៏ធំបំផុតនៃ SVG គឺឯករាជភាពនៃដំណោះស្រាយ។ ដោយសារឯកសារ SVG ជាក្រាហ្វិកវ៉ិចទ័រជំនួសឱ្យរូបភាពបន្ទាត់បញ្ឈរដែលមានមូលដ្ឋានលើភីកសែលពួកវាអាចត្រូវបានប្ដូរទំហំដោយមិនបាត់បង់គុណភាពរូបភាព។ នេះមានប្រយោជន៍ជាពិសេសនៅពេលអ្នកបង្កើតវេបសាយឆ្លើយតបដែលត្រូវការ មើលទៅល្អនិងដំណើរការបានល្អនៅក្នុងទំហំនិងឧបករណ៍អេឡិចត្រូនិចជាច្រើន

ឯកសារ SVG អាចត្រូវបានធ្វើមាត្រដ្ឋានឡើងឬចុះក្រោមដើម្បីសម្រួលដល់ទំហំនិងតម្រូវការប្លង់នៃគេហទំព័រឆ្លើយតបរបស់អ្នកហើយអ្នកមិនចាំបាច់ព្រួយបារម្ភអំពីក្រាហ្វិចទាំងនោះដែលមានគុណភាពល្អ។

ទំហំ​ឯកសារ

បញ្ហាប្រឈមមួយក្នុងការប្រើរូបភាពស្ទ្រីម (JPG, PNG, GIF) នៅលើ គេហទំព័រដែលឆ្លើយតប គឺជាទំហំឯកសារនៃរូបភាពទាំងនោះ។ ដោយសារតែរូបភាព raster មិនធ្វើមាត្រដ្ឋានវិធីដែលវ៉ិចទ័រមួយធ្វើទេអ្នកត្រូវផ្តល់រូបភាពដែលមានមូលដ្ឋានលើភីកសែលរបស់អ្នកនៅទំហំធំបំផុតដែលវានឹងបង្ហាញ។ នេះគឺដោយសារតែអ្នកតែងតែអាចធ្វើឱ្យរូបភាពតូចជាងមុននិងរក្សាគុណភាពរបស់វាប៉ុន្តែមិនដូចគ្នាចំពោះការធ្វើរូបភាពធំជាងនេះទេ។ លទ្ធផលចុងក្រោយគឺថាអ្នកជាញឹកញាប់មានរូបភាពដែលធំជាងរូបភាពដែលគេកំពុងបង្ហាញនៅលើអេក្រង់របស់មនុស្សដែលមានន័យថាពួកគេត្រូវបានគេបង្ខំឱ្យទាញយកឯកសារដ៏ធំមួយ។

SVG ដោះស្រាយបញ្ហាប្រឈមនេះ។ ដោយសារក្រាហ្វិកវ៉ិចទ័រអាចពង្រីកទំហំបានអ្នកអាចមានទំហំឯកសារតូចតាចដោយមិនគិតពីរូបភាពទំហំធំប៉ុនណាដែលត្រូវបង្ហាញ។ នេះនឹងមានផលប៉ះពាល់ជាវិជ្ជមានទៅលើការអនុវត្តជាទូទៅរបស់គេហទំព័រនិងល្បឿនទាញយក។

CSS Styling

កូដ SVG ក៏អាចត្រូវបានបន្ថែមដោយផ្ទាល់ទៅ HTML នៃទំព័រ។ វាត្រូវបានគេស្គាល់ថាជា "Inline SVG" ។ គុណប្រយោជន៍មួយនៃការប្រើ Inline SVG គឺដោយសារតែក្រាហ្វិចត្រូវបានគូរដោយកម្មវិធីរុករកដែលផ្អែកលើលេខកូដរបស់អ្នកវាមិនចាំបាច់ធ្វើសំណើរ HTTP ដើម្បីទៅយកឯកសាររូបភាពទេ។ អត្ថប្រយោជន៍មួយផ្សេងទៀតគឺថាអ៊ីនគ្រីប SVG អាចត្រូវបានតែងជាមួយ CSS ។

ត្រូវប្តូរពណ៌រូបតំណាង SVG? ជំនួសឱ្យការបើករូបភាពនោះក្នុងកម្មវិធីកែសម្រួលមួយចំនួនហើយនាំចេញនិងផ្ទុកឯកសារឡើងម្តងទៀតអ្នកអាចប្តូរឯកសារ SVG ដោយប្រើបន្ទាត់ CSS មួយចំនួន។

អ្នកក៏អាចប្រើរចនាប័ទ្ម CSS ផ្សេងទៀតនៅលើក្រាហ្វិច SVG ដើម្បីផ្លាស់ប្តូរពួកវានៅលើរដ្ឋដាក់ឬសម្រាប់តម្រូវការរចនាជាក់លាក់។ អ្នកអាចធ្វើឱ្យក្រាហ្វិកទាំងនោះមានចលនាបន្ថែមចលនានិងអន្តរកម្មទៅទំព័រមួយចំនួនផងដែរ។

ចលនា

ដោយសារឯកសារ SVL Inline អាចត្រូវបានរចនាឡើងជាមួយ CSS អ្នកអាចប្រើចលនា CSS នៅលើពួកវាផងដែរ។ ការផ្លាស់ប្តូរ CSS និងការផ្លាស់ប្តូរគឺជាមធ្យោបាយងាយស្រួលពីរដើម្បីបន្ថែមជីវិតខ្លះទៅឯកសារ SVG ។ អ្នកអាចទទួលបានបទពិសោធន៏ Flash-like សម្បូរបែបនៅលើទំព័រដោយមិនទទួលខុសត្រូវចំពោះ ការធ្លាក់ចុះដែលមកជាមួយការប្រើប្រាស់ Flash នៅលើគេហទំព័រថ្ងៃនេះ។

ការប្រើប្រាស់ SVG

ក្នុងនាមជាអ្នកមានអនុភាពដូច SVG ក្រាហ្វិកទាំងនេះមិនអាចជំនួសគ្រប់ទ្រង់ទ្រាយរូបភាពផ្សេងទៀតដែលអ្នកកំពុងប្រើនៅលើគេហទំព័ររបស់អ្នកទេ។ រូបថតដែលត្រូវការជម្រៅពណ៌ជ្រៅនឹងនៅតែត្រូវការជា JPG ឬប្រហែលជាឯកសារ PNG ប៉ុន្តែរូបរាងសាមញ្ញដូចជារូបតំណាងគឺសមឥតខ្ចោះដែលត្រូវបានប្រតិបត្តិជា SVG ។

SVG ក៏អាចសមស្របសម្រាប់រូបភាពស្មុគស្មាញបន្ថែមទៀតដូចជាស្លាកសញ្ញាក្រុមហ៊ុនឬក្រាហ្វិកនិងគំនូសតាង។ ក្រាហ្វិចទាំងអស់នឹងទទួលប្រយោជន៍ពីការធ្វើមាត្រដ្ឋានអាចកំណត់រចនាសម្ព័នភជាមួយ CSS និងគុណសម្បត្តិផ្សេងទៀតដែលមានក្នុងអត្ថបទនេះ។

ការគាំទ្រសម្រាប់កម្មវិធីរុករកចាស់

ការគាំទ្របច្ចុប្បន្នសម្រាប់ SVG គឺល្អណាស់នៅក្នុងកម្មវិធីរុករកបណ្ដាញសម័យទំនើប។ កម្មវិធីរុករកតែមួយគត់ដែលខ្វះការគាំទ្រសម្រាប់ក្រាហ្វិកទាំងនេះគឺកំណែចាស់របស់កម្មវិធី Internet Explorer (កំណែ 8 និងខាងក្រោម) និងកំណែចាស់ជាងរបស់ Android ។ សរុបមកចំនួនភាគរយនៃការរុករកនៅតែប្រើកម្មវិធីរុករកទាំងនេះហើយចំនួននេះបន្តធ្លាក់ចុះ។ នេះមានន័យថា SVG អាចត្រូវបានប្រើដោយសុវត្ថិភាពនៅលើគេហទំព័រនៅថ្ងៃនេះ។

ប្រសិនបើអ្នកចង់ផ្តល់ការបម្រុងទុកសម្រាប់ SVG អ្នកអាចប្រើឧបករណ៍ដូចជា Grumpicon ពី Filament Group ។ ធនធាននេះនឹងយកឯកសាររូបភាព SVG របស់អ្នកហើយបង្កើតការផ្លាស់ប្តូរ PNG សម្រាប់កម្មវិធីរុករកចាស់ៗ។

កែសម្រួលដោយលោក Jeremy Girard នៅថ្ងៃទី 27 ខែមករាឆ្នាំ 17