תגית a ויצירת קישורים ועוגנים

יצירת קישורים לעמודי HTML אחרים

קישור הוא קטע טקסט או תמונה, שהקלקה עליהם מעבירה את הגולש למקום אחר. המקום האחר יכול להיות מיקום שונה באותו עמוד או עמוד HTML אתר (באותו אתר או באתר אחר).

קישורים נבנים באמצעות התגית a והמאפיין href.

דוגמה:

<a href="https://www.iteacher.co.il">online courses</a>

הקישור בדוגמה מפנה לאתר בכתובת https://www.iteacher.co.il בעת הקלקה על הכיתוב online courses.

האלמנט שעליו מקליקים כדי להפעיל את הקישור (בדוגמה לעיל: הכיתוב online courses) מכונה גם "עוגן", ואם מדובר באלמנט מסוג טקסט, הוא מכונה "עוגן טקסטואלי".

קישור לא חייב לעמוד בפני עצמו. ניתן לשלב אותו כחלק מפיסקת טקסט.

דוגמה:

<p>To check out more online courses <a href="https://www.iteacher.co.il">click here</a></p>

בדוגמה זו, העוגן הטקסטואלי הוא click here.

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

דוגמה:

<a href="https://www.iteacher.co.il"><img src="courses.webp" alt="courses" /></a>

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

ניתן לקשר לעמודים באתרים אחרים. במקרה כזה, נעדיף (אין זו חובה) להשתמש במאפיין target עם הערך blank_ שמנחה את הדפדפן לפתוח את הקישור בלשונית נפרדת בדפדפן.

דוגמה:

<a href="https://www.mgweb.co.il" target="_blank">website building</a>

יצירת סימניות ב-HTML

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

סימניה היא כל אלמנט שיש לו מזהה id ייחודי ושיש קישור שמפנה אליו.

דוגמה לסימניה שמבוססת על כותרת:

<h1 id="anchor">Welcome</h1>

בעבר, סימניות היה נהוג ליצוג בעיקר מתגית a ללא החלק של ה-href. היום, זה פחות נפוץ.

דוגמה לסימניה מבוססת תגית a:

<a id="project">The project</a>

כדי לקשר לסימניה, ניצור קישור המפנה לכתובת עם הסימן #.

דוגמאות:

<p>Read more about <a href="#security">protection and security</a></p>
<p>Read more about <a href="https://www.mgweb.co.il/ssl#toc_2" target="_blank">SSL</a></p>

הקישור הראשון הוא עם העוגן protection and security שהקלקה עליו מפנה לסימניה עם המזהה security באותו עמוד HTML.

הקישור השני הוא עם העוגן SSL שהקלקה עליו מפנה לסימניה עם המזהה toc_2 בעמוד HTML חיצוני.