כיצד ליצור מפת תמונות באמצעות Gimp?
הוסף את מפת התמונות שלך ל- HTML של דף האינטרנט שלך. יהיה עליך להעתיק את כל שורות הקוד שאתה רואה, כולל התג (המגדיר את הנתיב לתמונת המקור שלך) וכל מה שבין התגים.
מפת תמונות היא תמונה שעליה כתובות אתרים "ממופות". אתה יכול להלביש את אתר האינטרנט שלך או את דף הפתיחה האישי שלך עם מפת תמונות עם האתרים המועדפים עליך שאתה רוצה לבקר בהם. יש הרבה תוכנות שאתה יכול לעשות את זה, אבל מאמר זה ישתמש ב- Gimp.
- 1הכן גרפיקה ראשונית שתמפה. אתה יכול להשתמש בתמונות, תמונות, כל מה שמתאים לך. כאן נשתמש במדריך, בפורום המדריכים וב- iGoogle.
- 2לאחר יצירת התמונה, (או פתיחתה), עבור אל מסננים >> אינטרנט >> מפת תמונות.
- מסך שיח Gimp ImageMap.
- 3לחץ על המלבן בצד ימין של המסך, ואז בחר באחת מהתמונות בהן תרצה להשתמש. בצילום מסך זה נבחר המדריך. מלא את המידע הדרוש במסך הדו-שיח שעולה.
- לחץ על מלבן ותוכל לראות את המיקום המדויק של הגרפיקה.
- 4המשך בתהליך זה להמשך המפה שלך.
- 5לאחר שתסיים להגדיר את כל אזורי הקישור, שמור את מפת התמונות שלך. GIMP יציע אוטומטית לשמור זאת כקובץ עם. הרחבת מפה. אם תרצה, תוכל לשמור זאת כך. אך קובץ זה מכיל את קוד ה- HTML (ללא תמונות) שעלינו לערוך ולהעתיק לדף האינטרנט שלנו, ולכן מומלץ לשמור אותו כ- [שם קובץ].html ולדלג ישירות לשלב 7.
- 6אם לא שמרת אותו כקובץ HTML, מצא את הקובץ השמור ושנה את שם התוסף ל-.html. ייתכן שתקבל אזהרה לגבי שינוי סיומות קבצים. לחץ על כן כדי להמשיך.
מפת תמונות היא תמונה שעליה כתובות אתרים "ממופות". - 7השתמש בעורך טקסט כדי לפתוח קובץ HTML זה. תבחין בקובץ זה פשוט מכיל רשימה של קואורדינטות וכתובות URL. זה הקוד שאומר לדפדפן אילו כתובות אתרים להקצות לאיזה חלק בתמונה שלך.
- 8ודא שנתיב הקובץ שהוגדר ב <img src> קישורים לתמונה שאליה אתה ממופה את הכתובות. אי הצבעה נכונה לתמונה עלולה להוביל לכך שתמונה לא תוצג כלל.
- 9אופציונלי: השתמש בדפדפן כדי לפתוח את קובץ ה- HTML שלך; אם הכל עובד, אתה אמור לראות את התמונה עם כל כתובות האתרים ממופות עליה בהתאם לאזורים שהגדרת.
- 10הוסף את מפת התמונות שלך ל- HTML של דף האינטרנט שלך. יהיה עליך להעתיק את כל שורות הקוד שאתה רואה, כולל התג <img> (המגדיר את הנתיב לתמונת המקור שלך) וכל מה שבין התגים <map>. זהו זה! אתה גמור.
- מפות תמונות עשויות לגרום לבעיות נגישות מסוימות אם הן מיושמות בצורה לא נכונה או שלא לצורך. הימנע משימוש בהם למטרות עיצוב שעשויות להתבצע ביעילות רבה יותר באמצעות CSS.
- GIMP
- עורך טקסטים
- דפדפן אינטרנט לבדיקה (אופציונלי)
