รูปแบบไฟล์ SVG เป็นเครื่องมือที่ได้รับความนิยมสำหรับการแสดงกราฟิกแบบสองมิติ แผนภูมิ และภาพประกอบบนเว็บไซต์ นอกจากนี้ SVG ยังเป็นไฟล์รูปภาพที่สามารถปรับขนาดให้ใหญ่ขึ้นหรือเล็กลงได้โดยไม่สูญเสียรายละเอียดใดๆ ด้วย เนื่องจากเป็นไฟล์เวกเตอร์ มาเรียนรู้เพิ่มเติมเกี่ยวกับฟีเจอร์หลักๆ ข้อดี ข้อเสีย และวิวัฒนาการของรูปแบบ SVG
Scalable Vector Graphics (SVG) เป็นรูปแบบไฟล์เวกเตอร์ที่เป็นมิตรกับเว็บ ไฟล์เวกเตอร์จะเก็บข้อมูลรูปภาพโดยใช้สูตรคณิตศาสตร์ที่อิงกับจุดและเส้นบนตาราง ซึ่งต่างจากไฟล์ราสเตอร์เช่น JPEG ที่สร้างรูปภาพขึ้นจากพิกเซล ไฟล์เวกเตอร์เช่น SVG สามารถถูกปรับขนาดได้อย่างมากโดยไม่มีการสูญเสียหรือลดทอนคุณภาพใดๆ ไฟล์ประเภทนี้จึงเหมาะสำหรับโลโก้และกราฟิกออนไลน์ที่มีความซับซ้อน
ทั้งนี้ ไม่ใช่เพียงแค่ความสามารถในการปรับขนาดเท่านั้นที่ทำให้ SVG เป็นที่นิยมในหมู่นักออกแบบเว็บ แต่ไฟล์ SVG นั้นเขียนขึ้นด้วยโค้ด XML ซึ่งหมายความว่าไฟล์สามารถเก็บข้อมูลข้อความในรูปแบบตัวอักษรจริงๆ ได้แทนที่จะเก็บเป็นรูปทรง ด้วยเหตุนี้ โปรแกรมค้นหาอย่าง Google จึงสามารถอ่านกราฟิก SVG เพื่อหาคำสำคัญได้ ซึ่งสามารถช่วยให้เว็บไซต์ได้รับการจัดอันดับค้นหาที่ดีกว่าเดิม
คุณสามารถสังเกตหาไฟล์ SVG ได้จากนามสกุลไฟล์ .svg
ประวัติของไฟล์ SVG นั้นย้อนกลับไปได้ถึงช่วงปลายทศวรรษ 1990 ซึ่งเป็นช่วงที่ World Wide Web Consortium (W3C) ได้รวบรวมข้อเสนอจากนักพัฒนาเพื่อสร้างรูปแบบกราฟิกเวกเตอร์ประเภทใหม่ W3C ได้รับข้อเสนอทั้งสิ้นจำนวนหกข้อ ซึ่งได้ช่วยให้เกิดรูปแบบไฟล์ SVG ในเวลาต่อมา
SVG ใช้เวลาอยู่พักหนึ่งก่อนจะได้รับความนิยม ไฟล์ประเภทนี้ไม่ได้รับการยอมรับอย่างกว้างขวางนัก จนกระทั่งผู้คนเริ่มเห็นประโยชน์ของการใช้ SVG ในเบราว์เซอร์รุ่นใหม่ในปี 2017 ในปัจจุบัน ไฟล์ SVG ได้ถูกใช้อย่างแพร่หลายสำหรับรูปภาพ 2 มิติบนเว็บไซต์เพราะเบราว์เซอร์และแอปวาดภาพส่วนมากสำหรับไฟล์เวกเตอร์สามารถรองรับไฟล์ประเภทนี้ได้อย่างง่ายดาย
Scalable Vector Graphics ได้พัฒนาอย่างมากในช่วงไม่กี่ปีที่ผ่านมา แต่ในทางปฏิบัติแล้ว ผู้คนนำไฟล์ SVG ไปใช้ในการทำอะไรกันบ้างนะ
นักออกแบบมักใช้ SVG เพื่อแสดงไอคอนสำหรับเว็บไซต์ เช่น ปุ่มต่างๆ รวมถึงโลโก้บริษัท ความสามารถของไฟล์ในการปรับขนาดให้ใหญ่ขึ้นหรือเล็กลงได้โดยไม่ทำให้คุณภาพลดลงส่งผลให้ไฟล์ชนิดนี้เหมาะกับกราฟิกที่ต้องปรากฎในหลายๆ ตำแหน่งในขนาดที่ต่างกัน
เนื่องจากไฟล์ SVG ใช้ XML โปรแกรมค้นหาอย่าง Google จึงสามารถอ่านแผนภูมิและกราฟที่เต็มไปด้วยข้อความได้ ซึ่งจะช่วยในด้านการปรับแต่งเว็บไซต์ให้เหมาะกับโปรแกรมการค้นหา (Search Engine Optimization) และเนื่องจาก Google สามารถค้นพบคำสำคัญได้จากไฟล์ SVG ไฟล์ SVG จึงสามารถเพิ่มอันดับของเว็บเพจในผลลัพธ์การค้นหาได้ นอกจากนั้นไฟล์ SVG ยังช่วยทำให้เว็บเพจดูน่าสนใจมากขึ้นอีกด้วยเพราะ SVG รองรับภาพเคลื่อนไหวได้
คุณควรพิจารณาข้อดีและข้อเสียของไฟล์ SVG ก่อนบันทึกรูปภาพของคุณในรูปแบบไฟล์นี้
เบราวเซอร์หลักๆ ทั้งหมดในปัจจุบัน ตั้งแต่ Chrome ไปจนถึง Edge, Safari และ Firefox สามารถเปิดไฟล์ SVG ได้ ไม่ว่าคุณจะใช้งานบน Mac หรือ Windows ก็ตาม เพียงแค่เปิดเบราวเซอร์ของคุณแล้วคลิกที่ File (ไฟล์) > Open (เปิด) เพื่อเลือกไฟล์ที่คุณต้องการจะดู จากนั้นไฟล์จะแสดงบนเบราว์เซอร์ของคุณ
การเปิดภาพ SVG ด้วยโปรแกรมที่ติดตั้งมาพร้อมกับเครื่องคอมพิวเตอร์ของคุณนั้นก็ง่ายพอกัน ให้ดับเบิลคลิกที่ชื่อไฟล์ จากนั้น รายการโปรแกรมที่สามารถเปิดไฟล์ได้จะปรากฎขึ้น หรือไฟล์อาจเปิดขึ้นเองในโปรแกรมที่เข้ากันได้โดยอัตโนมัติ
ให้ปฏิบัติตามขั้นตอนเหล่านี้เมื่อใช้ Adobe Photoshop
หมายเหตุ: เนื่องจาก Photoshop เป็นโปรแกรมแก้ไขไฟล์ราสเตอร์ ผู้คนมากมายจึงเลือกที่สร้างและแก้ไขไฟล์ SVG ภายใน Adobe Illustrator ซึ่งเป็นโปรแกรมแก้ไขกราฟิกเวกเตอร์
รูปแบบไฟล์ SVG นั้นไม่ได้มีไว้เฉพาะสำหรับภาพนิ่งเท่านั้น คุณจะพบกับเครื่องมือออนไลน์มากมายซึ่งจะช่วยเพิ่มองค์ประกอบแบบเคลื่อนไหวได้ให้กับกราฟิกบนเว็บของคุณ ภาพเคลื่อนไหวในไฟล์ SVG อาจประกอบด้วยองค์ประกอบแบบพื้นฐาน เช่น ฟังก์ชันแถบเลื่อนที่ช่วยให้เลื่อนไปมาระหว่างแต่ละสไลด์ในอินโฟกราฟิกได้ นอกจากนี้ คุณยังสามารถทำให้ภาพประกอบเคลื่อนไหวได้เช่นกัน เช่นทำให้เข็มบนนาฬิกาเคลื่อน
วิธีการที่ดีที่สุดในการมองหาไฟล์ SVG คือการตรวจสอบโค้ดนามสกุลไฟล์ นามสกุลของไฟล์ SVG คือ .svg นอกจากนี้ คุณยังสามารถมองหาภาพเวกเตอร์ เช่น SVG ได้ด้วยการขยายภาพเป็นขนาด 200% หรือมากกว่าบนจอคอมพิวเตอร์ของคุณ ภาพเวกเตอร์สามารถรักษาเส้นให้คมชัดและสีให้สดใสไว้ได้โดยไม่ทำให้ภาพเบลอหรือแตกเป็นพิกเซลแม้ขยาย
แม้ว่าไฟล์ภาพ SVG นั้นมักถูกใช้บนเว็บ แต่ก็มีการใช้งานนอกเหนือจากบนโลกออนไลน์อยู่ เช่น การใช้ไฟล์ SVG เป็นเทมเพลตสำหรับภาพพิมพ์บนเสื้อผ้าเช่นเสื้อยืด เนื่องจากรูปภาพในไฟล์ SVG จะไม่แตกเมื่อถูกปรับเปลี่ยนขนาด ในขณะเดียวกัน ไฟล์ JPEG ซึ่งสร้างขึ้นจากพิกเซลจำนวนมากนั้นจะไม่สามารถนำไปพิมพ์ลงบนเสื้อผ้าได้คมชัดเท่า
ขนาดของไฟล์ SVG นั้นขึ้นอยู่กับปริมาณข้อมูลภาพในไฟล์ ซึ่งมักมีปริมาณน้อยกว่าไฟล์ชนิดอื่น ทั้งนี้ กราฟิกที่ซับซ้อนซึ่งมีเส้นและจุดหมุดมากมายอาจใช้เนื้อที่เก็บไฟล์มากกว่ากราฟิกที่ดูเรียบง่าย ดังนั้น ให้พยายามลดคำสั่งที่ซับซ้อนภายในไฟล์ของคุณให้เหลือน้อยที่สุด
หากสรุปอย่างรวบรัดแล้ว ไฟล์ SVG เป็นไฟล์เวกเตอร์ในขณะที่ไฟล์PNGเป็นไฟล์ราสเตอร์ หากคุณยืดไฟล์ PNG มากเกินไปหรือบีบอีดมากเกินไป ภาพอาจแตกหรือเบลอได้ SVG ไม่มีพิกเซลใดๆ ดังนั้นจึงไม่มีทางสูญเสียความคมชัด นอกจากนั้นแล้ว ไฟล์ PNG ยังไม่รองรับภาพเคลื่อนไหวอีกด้วย
รูปแบบไฟล์ใดที่เป็นผู้ชนะในด้านการออกแบบเว็บ
ลองพิจารณาความสามารถด้านการพิมพ์ของไฟล์เหล่านี้ให้ละเอียดยิ่งขึ้น
สร้างงานศิลปะและภาพประกอบเวกเตอร์ที่สวยงาม
ใช้งานฟรี 7 วัน หลังจากนั้นจ่าย ฿800.36/เดือน (รวม VAT)
สร้างเค้าโครงหน้าที่หรูหราสําหรับสื่อสิ่งพิมพ์และสื่อดิจิทัล
ใช้งานฟรี 7 วัน หลังจากนั้นจ่าย ฿800.36/เดือน (รวม VAT)
รับคอลเลกชันของแอปและบริการที่สร้างสรรค์ทั้งหมด
ใช้งานฟรี 7 วัน หลังจากนั้น ฿1,143.83/เดือน.(รวม VAT)