วิธีใส่ไอคอนบนเว็บไซต์

สารบัญ:

วิธีใส่ไอคอนบนเว็บไซต์
วิธีใส่ไอคอนบนเว็บไซต์

วีดีโอ: วิธีใส่ไอคอนบนเว็บไซต์

วีดีโอ: วิธีใส่ไอคอนบนเว็บไซต์
วีดีโอ: สอนการใช้งานไอคอนบนเว็บไซต์ ด้วย Font Awesome 2024, อาจ
Anonim

ไอคอนที่แสดงในแถบที่อยู่ของเบราว์เซอร์ เช่นเดียวกับในรายชื่อไซต์โปรด และแม้แต่ในรายการค้นหาของไซต์ใน Yandex ก็เป็นส่วนเสริมที่มีประโยชน์มากในการดึงดูดความสนใจมายังไซต์ของคุณด้วยวิธีอื่นๆ วิธีการใช้ความเป็นไปได้นี้มีอธิบายไว้ด้านล่าง

FavIcon
FavIcon

คำแนะนำ

ขั้นตอนที่ 1

ไอคอนนี้มักจะเรียกว่า "Favicon" (ไอคอนโปรด) และเป็นรูปภาพขนาด 16 x 16 พิกเซล เบราว์เซอร์สมัยใหม่บางตัวสามารถแสดงไอคอนขนาดใหญ่ได้เช่นกัน แต่ถ้าความเข้ากันได้ข้ามเบราว์เซอร์เป็นสิ่งสำคัญสำหรับคุณ คุณควรได้รับคำแนะนำจากมาตรฐานขั้นต่ำนี้ คุณสามารถสร้างภาพดังกล่าวได้ด้วยตัวเองในโปรแกรมแก้ไขกราฟิกใดๆ เบราว์เซอร์สมัยใหม่สามารถอ่านไอคอนได้ทั้งในรูปแบบ ico ดั้งเดิมและในรูปแบบกราฟิกมาตรฐาน gif, png, bmp เป็นต้น อย่างไรก็ตาม หากคุณต้องการครอบคลุมจำนวนสูงสุดของการปรับเปลี่ยนเบราว์เซอร์ คุณควรเน้นที่รูปแบบ ico เป็นไปได้ที่จะวาดภาพที่คุณต้องการในตัวแก้ไข บันทึกในรูปแบบมาตรฐาน แล้วแปลงเป็นรูปแบบ ico โดยใช้หนึ่งในบริการออนไลน์ บริการเหล่านี้บางส่วนสามารถนำเสนอและสร้างไอคอน Fav แบบออนไลน์ทั้งหมดได้

ขั้นตอนที่ 2

เมื่อสร้างไอคอนแล้ว ควรอัปโหลดไอคอนดังกล่าวไปยังเซิร์ฟเวอร์เว็บไซต์ของคุณในชื่อ favicon.ico เบราว์เซอร์บางตัวไม่ต้องการให้ตั้งชื่อไอคอนในลักษณะนั้น แต่ควรคำนึงถึงความเข้ากันได้ของเบราว์เซอร์ข้ามระดับสูงสุด คุณควรเน้นที่ข้อกำหนดที่เข้มงวดที่สุด ขั้นตอนการดาวน์โหลดนั้นง่ายที่สุดในการดำเนินการผ่านตัวจัดการไฟล์ ซึ่งเป็นส่วนหนึ่งของระบบการจัดการเนื้อหาหรือแผงการดูแลระบบของผู้ให้บริการโฮสต์ของคุณ เป็นการดีที่สุดที่จะวางไฟล์ในโฟลเดอร์รูทของไซต์ - นี่คือที่ที่เบราว์เซอร์และโรบ็อตค้นหาค้นหาโดยค่าเริ่มต้น หากไม่มีที่อยู่ที่ชัดเจนในโค้ดของเพจ

ขั้นตอนที่ 3

สุดท้าย คุณควรเพิ่มการบ่งชี้ของไอคอนในซอร์สโค้ด html ของหน้าเว็บไซต์ แท็กที่เกี่ยวข้องสำหรับ Internet Explorer มีลักษณะดังนี้: เบราว์เซอร์อื่นเข้าใจความหมายที่แตกต่างกันของแอตทริบิวต์ "rel": เพื่อให้ทุกคนพอใจ ควรระบุทั้งสองอย่าง หากคุณวางไฟล์ไอคอนไม่อยู่ในรูทของไซต์ แต่อยู่ที่อื่น จากนั้นในแอตทริบิวต์ "href" คุณควรระบุพาธแบบเต็มไปยังไอคอน ควรวางสองบรรทัดนี้ระหว่างแท็ก และ นั่นคือ คุณต้องเปิดหน้าที่จำเป็นในตัวแก้ไขหน้าของระบบควบคุม เปลี่ยนเป็นโหมดแก้ไขโค้ด html ค้นหาบรรทัดที่มีแท็ก และเพิ่มสองบรรทัดที่ให้ไว้ด้านบนก่อนหน้านั้น จากนั้นบันทึกการเปลี่ยนแปลงของคุณในหน้า