Favicon ขนาดสำหรับเว็บไซต์ของคุณ

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

ค่าปรับดังกล่าวสามารถจะยกตัวอย่างเช่นพื้นหลังของปุ่มแบบอักษรที่ไม่ถูกต้องบางรายการที่มีขนาดเล็กและแม้กระทั่ง favicon อันที่จริงดูขนาดใหญ่ sami- เว็บไซต์ที่รู้จักกันดีมีไอคอนของแต่ละบุคคลที่แสดงไว้ใน "บุ๊ก" ในเบราว์เซอร์ของผู้ใช้ ก็ไม่มีนักพัฒนาทรัพยากรล้มเหลวในการสร้างองค์ประกอบที่พวกเขาพยายามที่เดิม

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

เว็บไซต์ไอคอน

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

เว็บมาสเตอร์หลายคนเข้าใจว่าภาพนี้เป็นสิ่งจำเป็น - แต่ไม่กี่คนที่ทราบว่าขนาด favicon สำหรับเว็บไซต์จะเหมาะสมที่สุด ดังนั้นในบทความนี้เราจะไม่เพียง แต่ให้ข้อมูลเกี่ยวกับวิธีการทำเช่นไอคอนและวิธีการติดตั้งบนเว็บไซต์ของคุณ แต่ยังเพื่ออธิบายมิติของภาพ

favicon วัตถุประสงค์

ดังนั้นภาพที่อยู่ใกล้กับส่วนหัวของเว็บไซต์ที่มีการใช้เพื่อระบุตัวตน นี่คือวัตถุประสงค์เดิม: จะแสดงเว็บไซต์ที่เราเห็นนาธาเนียลและเลือกมันอยู่ในสายตาของคนอื่น มันจะกลายเป็นง่ายมากโดยการใช้กราฟิก: เราสังหรณ์ใจรับรู้ข้อมูลในภาพได้เร็วขึ้นและง่ายกว่าในรูปแบบข้อความ Favicon ช่วยเราในการนี้ แต่อย่าลืมว่า ขนาด favicon น้อยที่สุดในสายตาของผู้ใช้ นี้ไม่ได้เป็นโลโก้ใน "หมวก" เว็บไซต์ที่อาจมีข้อมูลเพิ่มเติมในรูปแบบของการจารึกบางคำชี้แจงหรือติดต่อสอบถามข้อมูล อะไรที่สามารถปรากฎในไอคอนถัดจากชื่อที่ควรจะเป็นที่เหมาะสมที่สุดกับขนาดของ favicon และมันก็เป็นตามที่ระบุไว้แล้วขนาดเล็ก (16 16 พิกเซล)

วิธีการเลือก favicon หรือไม่?

ดังนั้นวิธีที่จะเป็นเว็บมาสเตอร์สามารถออกแบบไอคอนสำหรับเว็บไซต์ของคุณอยู่แล้ว? มันควรจะตั้งข้อสังเกตว่าเพียงแค่บีบอัดโลโก้ของเว็บไซต์ที่ส่วนใหญ่มีแนวโน้มจะไม่ประสบความสำเร็จ ในโปสเตอร์ที่จะใส่ในรูปแบบของโลโก้ของทรัพยากรโดยเฉพาะอย่างยิ่งที่มักจะเห็นรายการที่แตกต่างกันที่จะไม่ได้รับการแสดงอย่างถูกต้องในรูปแบบขนาดเล็ก มันจะดีกว่าที่จะละทิ้งทันทีกิจการนี้

แน่นอนขนาดของ favicon ไม่สามารถพูดคุยเกี่ยวกับที่เพิ่งแทรกจารึกมี ข้อความใด ๆ ที่จะไม่เพียงแค่มองเห็นได้ในการแก้ปัญหานี้ เราจำเป็นต้องพัฒนาไอคอนใหม่ที่จะส่งรูปแบบเว็บไซต์ เพื่อหาแนวทางแก้ไขปัญหาอีกครั้งให้ดูที่สถานที่จัดงานสำคัญ

หลายคนใช้ favicon เฉพาะตัวอักษรตัวแรกของชื่อของการให้บริการ ดังนั้นมาตัวอย่างเช่น Bing, Yahoo, Yandex, วิกิพีเดีย, Google มีอีกวิธีหนึ่งคือ - ถ้าคุณมีชื่อสั้น ๆ ของเว็บไซต์ที่คุณสามารถตั้งค่าเป็นพื้นหลังของไอคอน เพื่อ favicon ความละเอียด (พิกเซลที่จะถึงอีกครั้ง 16-16 คะแนน) อย่างถูกต้องสามารถแสดงสัญญาณก็จะต้องมีความยาวไม่เกินสามตัวอักษร ดังนั้นสำหรับตัวอย่างเช่นบริการ Aol

วิธีการสร้าง favicon หรือไม่?

ทำให้ไอคอนสำหรับชื่อของเว็บไซต์ในหลายรูปแบบ แน่นอนง่ายที่สุด - คือการทำงานด้วยโซลูชั่นสำเร็จรูปที่แตกต่างกัน เราสามารถพูดคุยเกี่ยวกับการบริการหรือโปรแกรมที่ช่วยให้คุณสามารถทำให้ภาพของไอคอนเต็มรูปแบบโดยการลดมัน ๆ แต่ผมอยากจะแนะนำให้ดำเนินการพัฒนาของโลโก้บนตัวของมันเอง นี้คือประการแรกจะทำให้มันเป็นไปได้ที่จะเรียนรู้สิ่ง; และประการที่สองเพื่อให้เป็นจำนวนมากของเครื่องมือ ทั้งหมดที่คุณต้องสามารถที่จะทำวาดใช่หรือไม่เพราะตลอดจนรู้ว่าสิ่งที่ favicon ขนาดที่จะอยู่ในรุ่นสุดท้าย เกี่ยวกับขนาดของไอคอนสำหรับเว็บไซต์ที่เราจะพูดคุยในภายหลัง แต่สำหรับตอนนี้เราทราบบางส่วนของรายละเอียดปลีกย่อยของการทำงานกับภาพดังกล่าว โดยเฉพาะอย่างยิ่งไม่ต้องพูดถึงขนาดของ favicon สำหรับเว็บไซต์ที่ควรชี้แจงอัตราส่วนนี้ ตามที่ระบุไว้โดยนักออกแบบที่มีประสบการณ์, ภาพที่ควรจะบันทึกเป็น .PNG (24 บิต) หรือเป็น fayl.ICO

ดำเนินการบันทึกภาพที่คุณสามารถยกตัวอย่างเช่นด้วยความช่วยเหลือของ Photoshop ที่มันจะได้รับการวาดสัญลักษณ์

ขนาด favicon

ดังนั้นตอนนี้เราจะมาพูดคุยเกี่ยวกับวิธีการที่ดีจะต้องเป็นภาพที่เราเห็นอยู่ถัดจากเว็บไซต์ในผลการค้นหา โดยค่าเริ่มต้นดังกล่าวแล้วมันมีขนาดเล็กเพียง 16 พิกเซล (ในแต่ละด้าน) แต่ถ้าคุณพยายามที่จะแก้ไขภาพใน "Photoshop" ตรวจสอบตัวเองว่านี่คืออึดอัด ดังนั้นเราจึงขอแนะนำให้ทำงานกับภาพขยายซึ่งในอนาคตจะเป็นเพียงแค่บีบขอบและบันทึกไว้ในรูปแบบที่ต้องการ

หลากหลาย

อย่างไรก็ตามการพูดเกี่ยวกับสิ่งที่ขนาดของ favicon ควรจะอยู่ในเว็บไซต์ของคุณคุณต้องจำไว้สิ่งหนึ่งที่เพิ่มเติม ไม่ได้ทุกแพลตฟอร์มเท่าเทียมกันสะท้อนให้เห็นถึงภาพของทรัพยากร ยกตัวอย่างเช่นอุปกรณ์แสดงผล Retina "เห็น" favicon ของคุณเป็นจำนวน 32-32 พิกเซล ใน Safari และบนแพลตฟอร์ม Windows ใหม่และไอคอนทั้งหมดเหล่านี้ถึงขนาด 64 พิกเซล

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

บรรณาธิการต่างประเทศ

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

ในการทำงานบางครั้งก็จำเป็นต้องลงทะเบียน แต่ที่คุณรู้ว่านี้จะทำเพียงครั้งเดียว - ในความเป็นจริงไม่ได้จึงมักจะเปลี่ยน บริษัท favicon เพียงแค่ดูที่ Google ซึ่งในแต่ละวันมีการเปลี่ยนแปลงโลโก้ แต่มันก็ไม่ได้สัมผัสที่ไอคอน

วิธีการติดตั้ง favicon หรือไม่?

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

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

นอกจากนี้จะมีผลผูกพันนี้คุณสามารถเพิ่มสายอื่นที่จะ "ให้" ที่ไอคอนของคุณ มันมีลักษณะดังต่อไปนี้:

ตั้งค่ารหัสควรจะอยู่ในส่วนหัว

ผลการวิจัย

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

ดังนั้นรู้สึกฟรีเพื่อทดลองคิดค้นสิ่งใหม่ลอง - และประสบความสำเร็จ!