لینک، تصویر، فهرست و جدول
لینک‌ها
لینک با تگ a: نشانی کامل و نسبی، باز شدن در زبانهٔ تازه، رفتن به بخشی از همان صفحه، ایمیل و تلفن — و متن لینکی که هم کاربر و هم گوگل می‌فهمند.
- لینک به صفحهٔ دیگر، به بخشی از همان صفحه، به ایمیل و تلفن بسازید
- نشانی کامل را از نسبی تشخیص دهید
- متن لینک معنادار بنویسید
وب یعنی لینک. عنصر <a> (از anchor به معنی لنگر) متنی را قابل کلیک می‌کند و ویژگی href مقصدش را می‌گوید.
<a href="https://mashaalstudio.com">مشعل استودیو</a>
<a href="/articles">مجله</a>
<a href="#faq">پرسش‌های پرتکرار</a>
<a href="mailto:hello@example.com">ایمیل بزنید</a>
<a href="tel:+982100000000">تماس بگیرید</a>- نشانی کامل (absolute) با https:// شروع می‌شود و به هر سایتی می‌رود.
- نشانی نسبی (relative) مثل /articles داخل همان سایت می‌ماند؛ اگر دامنه عوض شود، لینک‌ها خراب نمی‌شوند.
- #faq به عنصری با id="faq" در همان صفحه می‌رود.
- mailto: برنامهٔ ایمیل و tel: شماره‌گیر گوشی را باز می‌کند.
زبانهٔ تازه
<a href="https://developer.mozilla.org" target="_blank" rel="noopener">MDN</a>target="_blank" لینک را در زبانهٔ تازه باز می‌کند؛ rel="noopener" نمی‌گذارد صفحهٔ تازه به صفحهٔ شما دسترسی داشته باشد. فقط برای سایت‌های بیرونی و وقتی واقعاً لازم است؛ بیشتر کاربران ترجیح می‌دهند خودشان تصمیم بگیرند.
یک منوی کوچک بسازید: لینکی به https://mashaalstudio.com، لینکی به بخش #contact همین صفحه و یک لینک تلفن. بخشی با id="contact" هم زیر منو بسازید.
- لینکی با نشانی کامل https
- لینکی به #contact
- یک لینک تلفن
- عنصری با id="contact"
آزمونک درس
۳ پرسش — سرور مشعل تصحیح می‌کند و دلیل هر پاسخ را می‌گوید.
۱مقصد لینک در کدام ویژگی است؟
۲کدام متن لینک بهتر است؟
۳لینک به بخشی با id="faq" در همان صفحه: