יצירת קישורים בשפת HTML

יצירת קישורים בשפת HTML

  • פרסומת

קישור הוא אחד המרכיבים החשובים בבניית אתר. מעבר למשמעות הבסיסית לה הוא משמש – לקשר בין דפי האתר – לקישור יש משקל רב אצל מנועי החיפוש. שימוש נכון בקישור יכול ליצור את ההבדל בין אתר מצליח לבין אתר כושל. בשביל לבנות קישור בצורה נכונה, ראשית צריך לדעת את מבנה השפה, ושנית צריך לבחור בקפידה את המילים שיהוו את תוכן הקישור.
קישור בשפת HTML נקרא Anchor וניתן להשתמש בו במספר דרכים. קישור בנוי בצורה הבאה:
<a href="http://www.some-website-name.co.il/">Anchor Text</a>

הטקסט שנמצא בין התגיות נקרא תוכן הקישור או באנגלית Anchor Text.
ישנם שלושה סוגים של קישורים:

  • קישור למקור חיצוני, כמו אתר או כל תוכן הנמצא מחוץ לאתר
  • קישור לדף אחר הנמצא באתר
  • קישור למקום מסוים באותו הדף

בנוסף, ניתן להגדיר אם הקישור ייפתח בחלון חדש, באותו חלון או במסגרת אחרת (frame).

קישור למקור חיצוני

דוגמה לקישור חיצוני:
<a href="http://www.webdesk.co.il/">הכל על בניית אתרים</a>
ה- a בתחילת הקוד מגדירה לדפדפן שזהו קישור (קיצור לעוגן Anchor).
לאחר מכן, ישנו ה- href="" אשר מגדיר את הכתובת של הקישור אליה יישלח הגולש ברגע שילחץ על הקישור.
לסיום, בין תגית הפתיחה לבין תגית הסגירה ניתן לכתוב שם לקישור או הסבר קצר עליו. הדפדפן יציג את המלל שנכתוב, עם קו תחתי בצורה הבאה:

ניתן לבטל את הקו התחתי ולעצב את הקישור בעזרת CSS.

קישור למקור פנימי

<a href="index.html">דף הנמצא בתיקיה הנוכחית</a>
<a href="images/index.html">דף הנמצא בתיקיה בתוך התיקיה הנוכחית</a>
<a href="../index.html">קישור לדף הנמצא מחוץ לתיקיה שלנו</a>

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

בדוגמה השניה ניתן לראות קישור לדף הנמצא בתוך תיקיה הנקראת images,
הנמצאת באותו מקום אשר נמצא הדף הנוכחי.
אז מה עושים אם רוצים לקשר אל מחוץ לתיקיה בה נמצא הדף שלנו? משתמשים בסימן הבא: ../
הסימן הזה מעביר אותנו לתיקיה המכילה את התיקיה שלנו. כל שימוש נוסף בסימן מעלה אותנו לתיקיה הבאה, כמו שניתן לראות בדוגמה השלישית.

קישור למקום מסוים בדף

בשביל ליצור קישור לאזור מסויים בדף שלנו, עלינו ליצור עוגן עם שם, במקום אליו אנו רוצים לקשר:

<a name="end_of_page">זהו סוף הדף</a>

ואז ליצור קישור אליו באופן הבא:

<a href="#end_of_page">עבור אל סוף הדף</a>

ניתן גם לקשר לאותו אזור, מדף אחר באתר או מכל מקור חיצוני:

<a href="http://www.webdesk.co.il/index.php#end_of_page">עבור אל סוף הדף</a>