Favicon.ico – סמל אתר בדפדפן
לפני השקת אתר אינטרנט מתווסף קובץ גרפי, פאביקון, שיופיע בדפדפן, בשורת הכתובת. ברוב המצבים, ה-favicon הוא תמונה ממוזערת של הלוגו הגרפי או ראשי התיבות של האתר המתאים. סמל זה נוסף כדי לעזור למשתמשים לזהות במהירות רבה יותר כתובת אינטרנט בסימניות.
עד לאחרונה, קובץ זה היה צריך להיות בטופס “favicon.ico“, לזיהוי על ידי דפדפן האינטרנט. Chrome, Internet Explorer, Opera, Safari, Firefox וכו'.
במשך מספר שנים, עם התקדמותן של שפות אינטרנט חדשות, HTML9 וכן CSS3, favicon יכול להיות גם אחד fisier .png אוֹ .jpg. התנאי הוא שבכותרת האתר, לִפנֵי </רֹאשׁ>, השורה צריכה להיות קיימת:
<קישור rel=”סמל קיצור” href=”/images/favicon.ico” סוג=”תמונה/סמל x” / />
סמל אתר עבור iOS – iPhone, iPad או iPod Touch
ב iOS אנחנו יכולים להוסיף קיצורי דרך לדפי אינטרנט פ מסך הבית-לiPhone- iPad וכן ה-iPod Touchו
כיצד להוסיף קיצור דרך לאתר במסך הבית של האייפון, האייפד והאייפוד
אנו עושים זאת על ידי פתיחת דף אינטרנט באייפון (דפדפן אינטרנט ספארי, כרום וכו'), לחץ על הריבוע עם החץ (הסימן עבור “לַחֲלוֹק” ב-iOS), ואז האפשרות “הוסף למסך הבית“ו
אם לאתר יש ערכת favicon עבור הדפדפן, אך היא לא מוגדרת הסמל הספציפי עבור מכשירי iOS, יופיע סמל המורכב מ-a על המסך לדמיין תצוגה מקדימה של דף האינטרנט.
כיצד להוסיף סמלי אינטרנט לאייפון, אייפד ואנדרואיד.
הצעד הראשון הוא שלואנו יוצרים תמונה עבור הסמל, שיופיע ב מסך הביתאת המכשיר. כדי שסמל האינטרנט יהיה תואם בכל המכשירים וייראה בבירור, עלינו ליצור את התמונה לכל רזולוציות האייפון והאייפדו
הרזולוציות והגדלים הסטנדרטיים של סמלים עבור iPhone, iPad, iPod ואנדרואיד
- דגמי אייפון / אייפוד קלאסיים = 57×57
- אייפד = 76×76
- iPhone / iPod Retina = 120×120
- iPad Retina = 152×152
- אייפון 6/6S פלוס = 180×180
תַפּוּחַ לעדכן באופן קבוע גדלי אייקונים מומלציםכתובות אתרים יישומים וכן דפי אינטרנט פ הדף הזהו
עבור מכשירי אנדרואיד, הסמלים הם בשני גדלים:
- אנדרואיד קלאסי = 128×128
- אנדרואיד ברזולוציה גבוהה (רזולוציה גבוהה) = 192×192
לאחר שעשינו את התמונות, הן מועלות לשרת האינטרנט, ובמקור ה-HTML של האתר, לפני הסגירה </רֹאשׁ>, מתווספות השורות הבאות:
<קישור href=”/apple-touch-icon.png” rel=”תפוח-מגע-סמל” / /> <קישור href=”/apple-touch-icon-76×76.png” rel=”תפוח-מגע-סמל” גדלים =”76×76″ / /> <קישור href=”/apple-touch-icon-120×120.png” rel=”תפוח-מגע-סמל” גדלים =”120×120″ / /> <קישור href=”/apple-touch-icon-152×152.png” rel=”תפוח-מגע-סמל” גדלים =”152×152″ / /> <קישור href=”/apple-touch-icon-180×180.png” rel=”תפוח-מגע-סמל” גדלים =”180×180″ / /> <קישור href=”/icon-hires.png” rel=”אייקון” גדלים =”192×192″ / /> <קישור href=”/icon-normal.png” rel=”אייקון” גדלים =”128×128″ / />
עבור מכשירי Apple, שם התמונה הוא .PNG ו “rel=” חייב להכיל את הקידומת “תַפּוּחַ-“. עבור אנדרואיד, שמות הקבצים יהיו “icon-hires.png” וכן “icon-normal.png” עם rel=”אייקון”ו
אין צורך ליצור תמונות עבור כל רזולוציה בנפרד. אתה יכול ליצור תמונה ברזולוציה הגבוהה ביותר, ומכשירים עם רזולוציה נמוכה יותר יזהו אותה ויגדירו אותה כסמל.
הסמל של קיצור הדרך לאתר ייראה דומה לזה של כל אחד אחר יישומים עבור iOSו
