כיצד לבנות תמונות תמונה ללא תמונה מפת עורך

by ג 'ניפר קירנין

תמונות מפות פשוט תגי HTML פשוטים

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

אתה צריך תמונה, עורך תמונות וכמה עורך HTML או עורך טקסט. רוב עורכי התמונות יראו לך את הקואורדינטות של העכבר כאשר אתה מצביע על התמונה. זה נתונים קואורדינטות הוא כל מה שאתה צריך כדי להתחיל עם מפות תמונה.

יצירת מפת תמונה

כדי ליצור מפת תמונות, בחר תחילה תמונה שתשמש כבסיס למפה. התמונה צריכה להיות "גודל רגיל" - כלומר, אתה לא צריך להשתמש בתמונה כל כך גדול כי הדפדפן יהיה בקנה מידה זה.

כאשר תוסיף את התמונה, תוסיף מאפיין נוסף שמזהה את הקואורדינטות של המפה:

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

מלבן-מלבן או דמות חד-צדדית
פולי - מצולע או דמות רב צדדית
מעגל - מעגל

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

עבור מלבן , אתה מפה רק בפינה הימנית העליונה התחתונה הימנית. כל הקואורדינטות מופיעות כ- x, y (למעלה, למעלה). אז, עבור בפינה השמאלית העליונה 0,0 ואת הפינה הימנית התחתונה 10,15 היית סוג 0,0,10,15 . לאחר מכן תוכל לכלול אותו במפה:

<צורת השטח = "rect" coords = "0,0,10,15" href = "morris.htm" alt = "Morris">

עבור מצולע , אתה ממפה כל x, y לתאם בנפרד. דפדפן האינטרנט מחבר באופן אוטומטי את מערכת הקואורדינטות האחרונה עם הראשון; כל דבר בקואורדינטות אלה הוא חלק מהמפה.

<צורת השטח = "פולי" coords = "17,34,41,96,110,121" href = "garfield.htm" alt = "Garfield">

צורות מעגל דורשות רק שתי קואורדינטות, כמו המלבן, אבל עבור הקואורדינטה השנייה, אתה מציין את הרדיוס או את המרחק ממרכז המעגל. אז, עבור מעגל עם המרכז ב 122,122 ורדיוס של 5 היית כותב 122,122,5:

<צורת הצורה = "Circ" coords = "122,122,5" href = "catbert.htm" alt = "Catbert">

כל האזורים והצורות עשויים להיכלל באותה תג מפה:

<צורת הצורה = "rect" coords = "0,0,10,15" href = "morris.htm" alt = "Morris"> <צורת הצורה = "poly" coords = "17 , 34,41,96,110,121 "href =" garfield.htm "alt =" Garfield "> <צורת הצורה =" Circ "coords =" 122,122,5 "href =" catbert.htm "alt =" Catbert ">

שיקולים

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

גישות מודרניות מעודדות עיצוב תגובה ושימוש גיליונות סגנון מדורגים כדי לשלוט על המיקום של תמונות וקישורים בדף.

למרות שתג המפה עדיין נתמך בתקן HTML , השימוש בהתקנים ניידים עם גורמי צורה קטנים עלול להוביל לבעיות ביצועים לא צפויות במפות תמונות. בנוסף, בעיות רוחב פס או תמונות שבורות מחזירות את הערך של מפת תמונה.

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

יצירת מפת תמונה

שיקולים

Alike posts

See Newest

Sapid posts