ตัวสร้าง Favicon
แปลงรูปภาพใด ๆ ให้เป็นชุด favicon ครบชุด ได้แก่ .ico, ขนาด PNG, Apple touch icon และ web manifest โดยสร้างในเบราว์เซอร์ของคุณ
เครื่องมือที่เกี่ยวข้อง
วิธีใช้ ตัวสร้าง Favicon
- 01
อัปโหลดรูปภาพสี่เหลี่ยมจัตุรัส โลโก้หรือไอคอนง่าย ๆ จะให้ผลดีที่สุด และประมวลผลในเบราว์เซอร์ของคุณ
- 02
หากต้องการ เลือกสีพื้นหลังและกรอกชื่อเว็บไซต์สำหรับ web manifest
- 03
ดาวน์โหลด ZIP และวาง HTML snippet ลงใน head ของหน้าเว็บ
favicon คืออะไร
ไอคอน Fav คือไอคอนขนาดเล็กที่แสดงในแท็บเบราว์เซอร์ บุ๊กมาร์ก และบนหน้าจอหลักของโทรศัพท์ มันเป็นรายละเอียดเล็กๆ น้อยๆ ที่ทำให้ไซต์ดูเสร็จสมบูรณ์และเป็นที่จดจำได้ และเบราว์เซอร์สมัยใหม่คาดว่าจะมีเวอร์ชันหลายเวอร์ชัน
ทำไมรูปเดียวไม่พอ
สิ่งสำคัญคือ: ภาพเดียวไม่พออีกต่อไป คุณต้องมี .ico หลายขนาดสำหรับเบราว์เซอร์แบบคลาสสิก, ขนาด PNG แยกกัน, ไอคอน Apple touch สำหรับหน้าจอหลักของ iOS, PNG ที่ใหญ่ขึ้นสำหรับ Android และรายการเว็บหากไซต์ควรสามารถติดตั้งได้
เครื่องมือสร้างนี้สร้างทั้งชุดจากรูปภาพเดียว รวมถึง .ico หลายขนาดจริง และให้โค้ด HTML ที่แน่นอนแก่คุณเพื่อวางลงในส่วนหัวของเพจ ดังนั้นคุณจึงไม่จำเป็นต้องประกอบหรือเขียนด้วยมือใดๆ
จะอัพโหลดรูปอะไร.
เพื่อให้ได้ผลลัพธ์ที่ดีที่สุด ให้อัปโหลดภาพสี่เหลี่ยมจัตุรัสที่มีขนาดอย่างน้อย 512 พิกเซล ซึ่งถ้าจะให้ดีควรเป็นโลโก้หรือเครื่องหมายธรรมดาๆ แทนที่จะเป็นภาพถ่ายที่มีรายละเอียด เนื่องจากไอคอนมักจะมีขนาดเล็กมาก รูปภาพที่ไม่ใช่สี่เหลี่ยมจัตุรัสจะถูกจัดกึ่งกลางและหุ้มให้เป็นสี่เหลี่ยมจัตุรัส ดังนั้นรายละเอียดที่อยู่ใกล้ขอบจึงอาจไปอยู่ที่ระยะขอบ
สีพื้นหลังและชื่อไซต์
คุณสามารถเลือกตั้งค่าสีพื้นหลังและชื่อเว็บไซต์ของคุณได้ ชื่อไซต์จะอยู่ในรายการเว็บที่ใช้เมื่อมีคนเพิ่มไซต์ลงในหน้าจอหลักของตน
ทำงานในเบราว์เซอร์ของคุณ
ทุกอย่างทำงานภายในเบราว์เซอร์ของคุณด้วย Canvas API ดังนั้นรูปภาพของคุณจะไม่ถูกอัพโหลด คุณดาวน์โหลดไฟล์ ZIP พร้อมไฟล์ทั้งหมดและข้อมูลโค้ดที่จะวาง
คำถามที่พบบ่อย
มีอะไรบ้างในแพ็กเกจ favicon?
favicon.ico ที่มีขนาด 16, 32 และ 48 px, PNG แยกต่างหากขนาด 16 และ 32 px, Apple touch icon ขนาด 180 px, PNG ขนาด 192 และ 512 px สำหรับ Android, site.webmanifest และ HTML snippet สำหรับวางใน head ของหน้าเว็บ
ควรอัปโหลดรูปภาพแบบไหน?
รูปภาพสี่เหลี่ยมจัตุรัสขนาดอย่างน้อย 512 px จะให้ผลดีที่สุด ควรเป็นโลโก้หรือสัญลักษณ์ที่เรียบง่าย รูปที่ไม่เป็นสี่เหลี่ยมจัตุรัสจะถูกจัดกึ่งกลางและเติมพื้นที่ให้เป็นสี่เหลี่ยมจัตุรัส ดังนั้นรายละเอียดที่ขอบอาจอยู่ในพื้นที่ขอบ
รูปภาพของฉันถูกอัปโหลดหรือไม่?
ไม่มี ไอคอนถูกสร้างในเบราว์เซอร์ของคุณด้วย Canvas API ดังนั้นรูปภาพของคุณจะไม่ออกจากอุปกรณ์เลย