tigtools

מחולל Favicon

צרו ערכת favicon מלאה מהלוגו שלכם או מתו אחד או שניים על רקע צבעוני, ולאחר מכן העתיקו את תגי ה-HTML. הסמלים נוצרים בדפדפן שלכם.

פועל בדפדפן שלך ללא הרשמה

צור מתוך

מומלץ להשתמש בתו אחד או שניים; נעשה שימוש רק בשני התווים הראשונים.

62%
צורה

איך להשתמש בו

  1. בחרו באפשרות אותיות והקלידו תו אחד או שניים בצבעים שלכם, או בחרו באפשרות תמונה ובחרו לוגו (עדיף ריבועי, לפחות 512 פיקסלים).
  2. בדקו את התצוגות המקדימות בכל הגדלים, במיוחד 16 ו-32 פיקסלים, שמופיעים בכרטיסיות הדפדפן.
  3. הורידו את קובץ ה-ZIP והעלו את הקבצים שבו לשורש האתר שלכם.
  4. הדביקו את תגי ה-HTML בחלק ה-head של הדפים שלכם, ועדכנו את השם ב-site.webmanifest אם צריך.

איך זה עובד

דפדפנים ומכשירים מחפשים סמלים במקומות שונים. הערכה המופקת כאן מכסה את המקרים הנפוצים: favicon.ico עם תמונות של 16, 32 ו-48 פיקסלים עבור כרטיסיות דפדפן, מועדפים ותוכנות ישנות שמבקשות את /favicon.ico אוטומטית; קבצי PNG של 16 ו-32 פיקסלים שמקושרים דרך תגיות link; קובץ apple-touch-icon בגודל 180 × 180 שמשמש כאשר מוסיפים את האתר למסך הבית של iPhone או iPad; וסמלים של 192 ו-512 פיקסלים שמקושרים מ-site.webmanifest עבור מסכי בית ב-Android ואפליקציות רשת הניתנות להתקנה.

קובץ ה-favicon.ico שומר את הסמלים כתמונות PNG בתוך מיכל ICO, שכל דפדפן עדכני ו-Windows Vista ואילך יכולים לקרוא. קבצי ה-ICO וה-ZIP מורכבים באמצעות קוד בדף זה; שום דבר לא נשלח לשרת.

גדלים קטנים דורשים עיצוב פשוט: ב-16 × 16 פיקסלים קווים דקים וטקסט קטן נעלמים, לכן אות מודגשת או סימן לוגו מפושט עובדים טוב יותר מלוגו מלא עם מילים. התמונה מוקטנת בכמה שלבים באיכות גבוהה. ל-apple-touch-icon ניתן תמיד צבע רקע אחיד כי iOS ממלא אזורים שקופים בשחור, ו-iOS מעגל את הפינות בעצמו.

לאחר העלאת סמלים חדשים, דפדפנים עשויים להמשיך להציג את ה-favicon הישן לזמן מה כי הם שומרים אותו במטמון בצורה אגרסיבית. רענון מלא, או פתיחה ישירה של /favicon.ico, בדרך כלל עוזרים.

דוגמאות

סמל אות לפרויקט חדש

הקלדת "TG" באותיות לבנות על ריבוע מעוגל ירוק כהה נותנת סמל נקי שנשאר קריא ב-16 × 16 פיקסלים בכרטיסיית דפדפן, ללא צורך בלוגו מעוצב.

סמל מלוגו קיים

לוגו PNG בגודל 1024 × 1024 עם רקע שקוף, כשמוגדר 'התאמת התמונה כולה', יוצר סמלי כרטיסייה שקופים ו-apple-touch-icon בצבע המותג.

לוגו רחב

עבור לוגו מלל בגודל 1200×300, חיתוך המרכז משאיר רק את האותיות האמצעיות. התאמת כל התמונה שומרת על הכול אך הופכת אותה לקטנה מאוד; לרוב סימן לוגו ריבועי נפרד נראה טוב יותר.

שאלות נפוצות

האם אני עדיין צריך favicon.ico?

הוא עדיין שימושי. חלק מהדפדפנים, קוראי ההזנות וכלים אחרים מבקשים את /favicon.ico משורש האתר גם ללא תג link. דפדפנים מודרניים משתמשים גם בסמלי ה-PNG שמקושרים ב-HTML.

איפה לשים את הקבצים?

העלו אותם לתיקיית השורש של האתר, לצד דף הבית, כך ש-/favicon.ico והנתיבים האחרים ב-HTML יפעלו. אם אתם משתמשים בתיקיית משנה, שנו את הנתיבים בתגי ה-link וב-site.webmanifest.

מדוע ה-favicon הישן עדיין מוצג?

הדפדפנים שומרים favicon במטמון בנפרד ולזמן ארוך. נסו רענון מלא, פתחו את /favicon.ico בכרטיסייה חדשה או בדקו בחלון פרטי. שינוי שם הקבצים, למשל favicon-v2.ico, גם מאלץ טעינה מחדש.

האם זה יוצר favicon מסוג SVG?

לא. הכלי יוצר קובצי PNG ו-ICO, שעובדים בכל מקום. אם כבר יש לכם לוגו SVG, אפשר להוסיף אותו בעצמכם באמצעות תג link מסוג image/svg+xml בנוסף לקבצים האלה.

פרטיות

הסמלים, קובץ ה-ICO וקובץ ה-ZIP נוצרים בדפדפן שלכם. התמונה והטקסט שלכם אינם מועלים, אינם נשמרים ואינם נכללים בניתוח נתונים.