Html

|

اموزش لینک دادن

ایجاد لینک یک امر عادی و مهم هست که برای داشتن یک سایت پویا و خوب نیاز به لینک های موثر داریم که به راحتی بتوانیم مخاطبانمانرا به صفحات وب سایت مورد نظر کاربر هدایت کنیم.

برای ایجاد لینک از تگ <a> استفاده میکنیم.

<a/> متن لینک شده <"a href="url>

تگ <a> که برای ایجاد لینک به سایر صفحات وب استفاده می شود و با href ادرس لینک مورد نظر (مقصد) را مشخص میکنیم که میخواهیم کاربر پس از کلیک روی متن به آن هدایت شود.

تگ <a> از آن دست لینک هایی است که نیاز به تگ پایاینی یعنی <a/> دارد.

A مخفف anchore و href مخفف Hypertext Reference هستند.

برای مثال ما یک تگ لینک به صفحه طراحی سایت شرکت داتینه میدهیم.

<a/> طراحی و ساخت وب <"a href="http://dotineco.ir/web-design>

طراحی و ساخت وب سایت

لینکی که بالا ساختیم به صورت رنگی (بسته به نوع برنامه نویسی سایت) و زیرخط دار به وجود می آید و وقتی موس بر روی آن قرار میگیرد شکل آن به صورت دست در می آید.

درست کردن عنوان برای لینک

تگ a با ویژگی دیگری کامل تر میشود که برای بهینه بودن لینک بسیار مهم است و طراحان وب برای سئوی بهتر لازمه کار هست که از این ویژگی استفاده کنند.

<a href="http://dotineco.ir/seo" title="سئوی داتینه <" سئوی سایت داتینه </a>

سئوی سایت داتینه

برای دیدن ماوس خود را روی لینک بالا قرار دهید ولی کلیک نکنید تا نتیجه آن را ببینید.

باز شدن لینک در یک صفحه جدید

برای اینکه لینک مورد نظر شما در یک new tab باز شود از ویژگی زیر استفاده میکنیم.

<a href="http://dotineco.ir/graphic" target=”_blank”>گرافیک داتینه<a/>

گرافیک داتینه

Target شامل پارامترهایی هست که در زیر به آنها اشاره میکنم.

blank_ : نمایش در یک new tab یا پنجره جدید

parent_ : نمایش در یک new window یا پنجره والد

self_ : نمایش در پنجره فعلی ( این حالت به صورت پیش فرض هست و نیازی به استفاده از این کد نیست.)

Frame : برای پارامتر terget می توان نام یک frame را نیز قرار داد، بدین ترتیب محتوای لینک در داخل فریم نمایش داده خواهند شد.

لینک کردن به یک تصویر

برای لینک دادن لزوما نباید یک متن باشد گاهی اوقات نیاز به این داریم که یک عکس رو به لینک تبدیل کنیم.

<a href="http://blog.dotineco.ir" title="این یک لینک است" target="_blank"> <img src="image/your-img.jpg" alt="your-alt" width="100" height="100"> </a>

شاید در پایان این مقاله این سوال به ذهن شما برسد که چرا در بعضی از سایت ها لینک های داده شده به رنگ های متفاوت یا فونت سایزهای متفاوت هستند ( برای مثال خود وبلاگ داتینه از رنگ و سایز مخصوص استفاده کرده و از پیش فرض مرورگر ها پیروی نکرده ) اما عجله نکنید پس از یادگیری مقدماتی html در سری آموزش های css شما هم به راحتی میتوانید لینک ها را به سلیقه خود استایل دهی کنید .

دریافت آخرین مطالب وبلاگ در کانال داتینه

بهاره شهسواری

بهاره شهسواری ، کارشناس نرم افزار هستم .
از سال 91 مشغول به یادگیری زبان های css ,html , javascript و jquery شدم
و از سال 93 به صورت اختصاصی به فعالیت در حوزه css و html پرداختم. علاوه بر کد نویسی به گرافیک هم علاقه مند هستم.

نظرات
نظر بدهید