Favicon היא התמונה הקטנה והמגניבה הזו לצד שורת הכתובות שלך בדפדפן שלך. זה מה שמייחד את האתר שלך בכרטיסייה סימניות וניתן להשתמש בו כדי להגביר את המודעות למותג. אם יש לך אתר אך מעולם לא שקלת ליצור פאוויקון, עליך לחשוב מחדש על החלטתך. יותר ויותר מפתחי תוכנה משתמשים בפאוויקונים להיבטים שונים ביישומים שלהם, כגון סמלים של מסך הבית בטאבלטים. למרבה המזל, עיצוב, יצירה ויישום של favicon הוא משהו שכמעט כל אחד יכול לעשות אם הוא בצע את הצעדים הנכונים.
צעדים
שיטה 1 מתוך 3: עיצוב ה- Favicon שלך
שלב 1. צור פייקון המייצג את האתר שלך
סוג האתר שיש ברשותך צריך לקבוע את המראה של favicon שלך. נסה לעצב משהו שידביק את תדמית המותג שלך ושהוא יהיה מזוהה ובלתי נשכח לאנשים. Favicon שלך יהיה הדבר הראשון שאנשים יראו כשהם מסתכלים על הכרטיסיות בדפדפן שלהם ויופיע גם בסימניות של אנשים.
- לדוגמה, אם יש לך אתר מזון, בחירה באבנית שיש בה פרי או ירק כעיצוב עשויה להפוך אותו לבלתי נשכח יותר.
- אם האתר שלך מיועד למשרד עורכי דין או חברת השקעות, עדיף Favicon מסורתי ומלוטש.
- אם אתר האינטרנט שלך מיועד לאנשים צעירים יותר, נסה ליצור פייקון שובב וצבעוני.
שלב 2. החליטו אם אתם רוצים רקע שקוף
אם אינך מציין רקע, הוא יתמלא בצבע לבן, שאולי לא ידבק למותג שלך. רקע שקוף יקבל את צבע הדפדפן של האדם וייראה יעיל יותר במקרים מסוימים. במקרים אחרים, בעל צבע לרקע יגרום לאותיות החזית או הגרפיקה לצוץ. החליטו מה יהיה הטוב ביותר עבור העיצוב שלכם ושימו לב כאשר אתם מייצרים אותו.
הפאביקון הבסיסי ביותר הוא ריבוע בגודל 16X16 ובעל צבע רקע
שלב 3. צור קובץ favicon שקל לקרוא אותו
מכיוון שתמונת favicon שבה תשתמש היא קטנה, חשוב שתוכל להעביר את המותג שלך מבלי לבלבל את המבקרים שלך. Favicon שקשה לקרוא מותיר רושם שלילי ויכול ליצור במוחו של המבקר שאלות לגבי איכות העבודה שאתה יכול לספק. תמונות ולוגואים מורכבים מדי אינם נראים טוב כאשר הם מצטמצמים ל -16x16 או 32x32 פיקסלים.
- אם הלוגו הקיים שלך מסובך מדי, תוכל להשתמש בטקטיקות כדי לפשט אותו, כך שניתן יהיה לזהותו בגודל favicon. השתמשו בראשי תיבות במקום להציג את שם החברה כולה, או עצבו סמל פשוט במקום להשתמש בתמונה.
- אם כבר יש לך לוגו פשוט, אתה יכול לצמצם את התמונה ולהגדיר אותה כ favicon שלך. ייתכן שיהיה עליך לשנות אותו לפני המרתו לקובץ אייקונים.
- תוכל גם להשתמש בתמונה של אובייקט המתאר את הנושא הכללי של האתר שלך.
שלב 4. יצירת favicon אסתטי
מבנה הפאביקון שלך נקרא צורתו. Favicons בדרך כלל לובשים צורות, כמו עיגול או ריבוע. כאשר אתה מעצב את האוויקון שלך, בדרך כלל עדיף אם הוא יכול להתאים לאחת הטפסים הבסיסיים הללו מכיוון שצורות בצורת חופשיות עלולות להסתבך או להתבלבל בגודל 16x16 פיקסלים. היבט חשוב נוסף בעיצוב שלך נקרא אחדות אסתטית. אחדות אסתטית כוללת את הפרטים והגדלים של רכיבים שונים ב- favicon שלך וכיצד favicon שלך מאוזן. ככל שהפרטים אחידים יותר, כך הפאיקון שלכם יראה מלוכד יותר. לדוגמה, שימוש בסוגי גופנים או גדלים שונים בתוך הפאביקון שלך אינו נעים לעין ויכול לגרום לאופן הפאוויקון שלך להיראות מבולבל או מבולגן.
- דוגמה נוספת לאחדות אסתטית היא שמירה על פינות מעוגלות לאורך הצורות שבאוויקון שלך.
- דוגמה טובה לאייקון ששינה צורה הוא ה- favicon של גוגל. הוא השתנה מרובע לעיגול.
שלב 5. השתמש בצבעים המתלכדים עם המותג שלך
כאשר אתה יוצר את ה- favicon שלך, עליך ליצור אותו בעומק הצבעים של 8 סיביות (256 צבעים) או 24 סיביות (16.7 מיליון צבעים), מכיוון שזה יעבוד על דפדפנים מודרניים. וודא שניתן למצוא את הצבעים שאתה בוחר במקומות אחרים באתר שלך או להיות משויכים בצורה מסוימת למותג שלך. סמל אהוב עם צבעים שאינם נמצאים באתר שלך, הלוגו או היישומים שלך לא יהיה בלתי נשכח, ואנשים לא יוכלו לשייך את הסמל למותג שלך.
- כמה שימושים יצירתיים בצבע favicon כוללים את GitHub שמשנה צבעים בהתאם למצב המערכת שלך ו- Trello, המשתנה בהתאם לצבע הרקע שלך.
- הצבעים הנפוצים ביותר בשימוש בפאביקונים הם אדום וכחול.
שלב 6. התחשב בקהל שלך בעת עיצוב favicon
מלבד זיהוי המותג שלך, ה- favicon שלך צריך להיראות מושך את המבקרים שלך. אנשים עם טעמים, תחומי עניין ונורמות חברתיות שונים יסתכלו על איקונולוגיה שונה מנקודות מבט שונות. קיימים הבדלים תרבותיים בחברה שלנו ועלולים לבלבל או להדוף את הקהל שאתה מנסה למשוך.
לדוגמה, Mac Os X משתמש בחותמת שהיא סמל אוניברסלי לדואר. שימוש בתיבת דואר לא יהיה יעיל כי תיבות הדואר משתנות במקומות שונים בעולם
שלב 7. קבל את דעתם של חברים ועמיתים
הוא אמנם לא אינטנסיבי מבחינה גרפית, אך favicon הוא חלק חשוב במותג שלך. לדוגמה, חשוב על האתרים המועדפים עליך כמו טוויטר, ג'ימייל, פייסבוק או wikiHow, וכמה אתה משייך את הפאוויקון למותג. אם אין לך עין טובה לעיצוב, או שאתה מתלבט לגבי איזה סוג עיצוב אתה צריך לאתר שלך, התייעץ עם חברים שיש להם עין בעיצוב או שעובדים בעיצוב גרפי.
- שאל בסביבת רשת החברים שלך כדי לבדוק אם מישהו יכול לספק ייעוץ עיצובי בחינם.
- לחברות גדולות יותר יש מעצבים גרפיים בתוך הבית שיכולים ליצור את תמונת favicon.
שיטה 2 מתוך 3: יצירת Favicon שלך
שלב 1. השתמש בתוכנת עריכת תמונות ליצירת favicon שלך
אתה יכול להשתמש בתוכנת עריכת תמונות כמו Adobe Photoshop או Illustrator כדי ליצור את התמונה עבור favicon שלך. יישומי תוכנה אלה גם מאפשרים לך לשנות את גודל ולייצא את התמונה בפורמט הנכון. תוכנות מסוימות מאפשרות לך ליצור את הפאביקון שלך ביד.
- ישנן גם תוכניות עריכה ספציפיות ל- favicon שתוכל למצוא באינטרנט.
- השתמש במנוע חיפוש והקלד "עורכי favicon".
- הפוך את גודל הקנבס שלך ל -512x512 פיקסלים מכיוון שמספר זה מתפרק לגדלי הפאיקון הרלוונטיים ביותר ועדיין גדול מספיק כדי שתוכל לערוך ביעילות.
- תוכנות פופולריות אחרות לעריכת תמונות כוללות GIMP, PhotoScape ו- Paint. NET.
- בעת שימוש בתוכנה זו, לא תוכל לערוך את קבצי.ico ישירות, אך תוכל להשתמש בקבצי.png,-j.webp" />
שלב 2. שנה את גודל השמירה ושמור אותה
32x32 פיקסלים הוא גודל פריטי שולחן העבודה של Windows ואילו 16x16 פיקסלים הוא גודל הפאיקונים בכרטיסייה של הדפדפן שלך. לאחר שתיצור את ה- favicon שלך בפורמט גדול יותר, חשוב להקטין את גודלו כך שתראה כיצד הוא ייראה בדפדפנים של אנשים. אם הוא בלתי קריא או לא אסתטי, התחל מחדש על העיצוב המקורי שלך. חשוב על הפלטפורמות שבהן סביר להניח שהאתר או האפליקציה שלך ישמשו אותך ולאחר מכן צור פייקון שיכסה את כל הבסיסים שלך.
- חשוב לציין כי חומרה ותוכנה שונות משתמשות בגדלים שונים של favicon.
- כמה גדלים אחרים של favicon כוללים 57x57px למסך הבית הסטנדרטי של iOS, 72x72px לאייפד, 96x96px ל- Google TV, 128x128px לחנות האינטרנט של Chrome ו- 195x195px לחיוג מהיר של Opera.
- אם אתה רוצה לכסות את כל הבסיסים שלך אתה יכול ליצור גרסאות של favicon שלך בכל אחד מהגדלים האלה.
- שמור גרסאות נפרדות של ה- favicon שלך, כך שלא תאבד את העבודה שעשית.
שלב 3. שלב את הקבצים שלך באמצעות ממיר
הדבר הגדול בקבצי.ico הוא שאתה יכול לשלב יותר מקובץ אחד כדי ליצור אותו. זה שימושי מכיוון שדפדפנים ותוכנות שונות ירצו Favicon בגודל שונה. כדי לוודא שה favicon שלך נראה טוב בכל הפלטפורמות השונות, המר את הקבצים שלך באמצעות ממיר מקוון. הקלד "ממיר אייקונים" במנוע החיפוש המועדף עליך כדי למצוא יישומים מקוונים בחינם לשם כך. שמור את הקובץ הממוזג כ- "favicon.ico".
- אתה יכול גם להשתמש בתוכנית כמו GIMP הכוללת תכונה מובנית, או להוריד תוסף בשם ICO FORMAT ל- Adobe Photoshop.
- צור תיקיה חדשה כך שתוכל לאחסן favicons או עבודות מתבצעות חדשות.
- הקלד "ממיר.ico" או "מחולל favicon" במנוע חיפוש כדי למצוא כלים שונים בהם תוכל להשתמש.
שיטה 3 מתוך 3: יישום Favicon שלך
שלב 1. העלה את favicon שלך אם אתה משתמש בעורך אתרים
עורכי אתרים רבים מגיעים עם טופס מובנה המאפשר לך להעלות את favicon לאתר שלך באופן אוטומטי. אם אתה משתמש בעורך אתרים הכולל את זה מובנה, חפש אפשרויות האומרות "העלה Favicon" או "הוסף Favicon" בתפריט ההגדרות של האתר שלך. בחר בקובץ favicon.ico שלך והעלה אותו לאתר שלך.
אם אינך מוצא מקום להעלות את ה- favicon שלך בעורך האתר שלך, יהיה עליך לעשות זאת באופן ידני
שלב 2. העלה את הקובץ לספריית השורש של האתר שלך
אם האתר שלך תומך בפרוטוקול העברת קבצים או FTP, תוכל להשתמש בלקוח FTP שלך כדי להעלות את קובץ favicon.icon החדש שלך לספריית השורש (אינדקס) שלך. אם לא, יהיה עליך לעבור לדף מארחי האינטרנט שלך ולהעלות את התמונה באופן ידני. זכור להחליף את הקובץ favicon.ico הקיים בקובץ החדש שלך.
שלב 3. הוסף את הקובץ לכותרת שלך
מצא את המקום בו תוכל לגשת לקבצי PHP ו- CSS עבור האתר שלך. עבור לקובץ header.php של האתר שלך וערוך אותו. תחת סוג התג,"
-
. זה אמור לחבר את האתר שלך לאתר favicon שלך.
מכיוון שאתה משתמש ב- PHP, פירוש הדבר שכל אתרים שמשתמשים בקובץ הכותרת שלך יקבלו כעת את אותו favicon
צור סמל Favicon משלך שלב 14 שלב 4. רענן את הדפדפן שלך
לאחר שתסיים להעלות את favicon תוכל לרענן את הדפדפן שלך כדי לראות את התמונה החדשה שליד שורת הכתובת. כדי לעבור ישירות לתמונה של הפאביקון המעודכן שלך, הקלד "https://www.yourdomain.com/favicon.ico".
- אם favicon שלך לא מופיע בתחילה, ייתכן שיהיה עליך לאפס את המטמון של הדפדפן שלך.
- כדי לנקות את המטמון, היכנס להגדרות הדפדפן שלך ומחק את קבצי האינטרנט, העוגיות וההיסטוריה הזמניים שלך.
