رنگ لینک ها در html5 و واقعیت ها

بروزرسانی: 1398 /12 /22
توضیحات بیشتری از " رنگ لینک ها در html5 و واقعیت ها "

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

البته امروزه کمی این فرهنگ تغییر پیدا کرده است به طوریکه بسیاری از وب سایت ها برای اینکه صفحات سایتشان شلوغ نشوند, زیر خط (underline) لینک ها را بر میدارند که اصلا کار بد و نادرستی نیست. به دلیل اینکه کاربران دیگر میدانند که متن های بالای صفحه (Header) و پایین صفحه (Footer) عموما به صورت لینک هستند مگر اینکه متن و کلمه ای در داخل متن های زیادی وجود داشته باشد که در آن وقت میتواند از زیر خط برای لینک ها استفاده نمود.

برخی از سئو کارها زمانی که لینک های داخلی سایت را ایجاد می کنند علاقه ای به قراردادن زیر خط برای لینک ها ندارند, به دلیل اینکه دوست ندارند تا دیگر سئو کارها متوجه شوند که آنها چه کلماتی را به یکدیگر لینک میکنند و از چه تکنیک هایی برای این کار استفاده می کنند. البته این نظریه بسیار غلط است. به دلیل اینکه تنها لینک کردن و انجام سئو داخلی سایت اهمیت ندارد بلکه کلیک کردن کاربران بر روی آن لینک و رفتن از یک صفحه سایت به صفحه دیگر سایت بیشتر اهمیت دارد.

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

بنابراین نتیجه میگیریم که تولید محتوا برای سئو میتواند مزیت های دیگری را هم برای شما داشته باشند.

در گذشته به واسطه برخی از خصوصیت های (attributes) در زبان HTML میتوانستید رنگ لینک ها را تغییر دهید ولی هرگز نمی توانستید به زیر خط لینک ها دسترسی داشته باشید و آن را حذف نمایید و یا سایز آنها را تغییر دهید. اما امروزه به واسطه زبان CSS میتوانید به راحتی این کار را انجام دهید و حالت های بسیار جذاب و متنوع را برای آن ایجاد نمایید. حتی میتوانید به جای خط ثابت از خط چین برای آن استفاده نمایید و یا با بردن موس بر روی لینک مورد نظر, حالت های مختلفی را برای آن در نظر بگیرید.

شما این کار را به واسطه 4 selector در زبان css میتوانید انجام دهید که عبارتند از:

  • :link
  • :visited
  • :hover
  • :active

حالت :link زمانی مورد استفاده قرار می گیرد که لینک مورد نظر بازدید نشده است و کاربر بر روی آن کلیک نکرده است. معمولا در این شرایط رنگ لینک به صورت آبی است مگر اینکه شما با دستورات CSS آن را تغییر داده باشید

 

حالت :visited زمانی مورد استفاده قرار میگیرد که کاربر حداقل 1 بار بر روی لینک مورد نظر کلیک کرده است. بهتر است در این شرایط حداقل رنگ لینک را تغییر دهیم تا کاربر متوجه شود که قبلا بر روی این لینک کلیک شده است که دوباره این کار را انجام ندهد. معمولا برای لینک های Navigation سایت میتواند این حالت مفید باشد.

 

حالت :hover حالت بسیار ویژه ای است که حتی در زبان HTML5 هم نمیتوان آن را مدیریت کرد. به زمانی گفت می شود که شما موس خود را بر روی لینک مورد نظر میبرید. در این زمان شما میتوانید با تغییر رنگ لینک و یا تغییر زیر خط آن حالت جذابی را برای لینک به وجود بیاورید و یا توسط CSS Transition حالت های انیمیشنی را برای آن درست نمایید.

 

حالت :active معمولا خیلی کم مورد توجه قرار میگیرد. به زمانی گفته میشود که شما بر روی لینک کلیک کرده اید و هنوز کلیک موس را رها نکرده اید که معمولا خیلی کم این اتفاق میافتد و رنگ پیش فرض آن در این حالت قرمز رنگ میباشد.

 

معمولا در طراحی سایت میتوان از این قابلیت ها در تغییر رنگ های لینکها به خوبی استفاده نمود و حالت های جذابی را برای آن ایجاد نمود. به عنوان مثال در ساخت سایت وردپرس میتوان در سیستم مدیریت محتوای وردپرس از این قابلیت برای جذاب نمودن سایت استفاده نمود.

مشخص بودن لینک ها به واسطه رنگ و زیر خط میتواند در ماندگار بودن کاربران در سایت و بالا رفتن سئو سایت شما بسیار تاثیر گذار باشد و به نوعی CTR سایت شما را هم بالا تر خواهد برد.

یکی ار فاکتورهای سئو میزان ماندگاری کاربران در سایت است. به این معنا که هر چقدر کاربران در سایت بمانند و از مطالب سایت استفاده کنند, این پارامتر میتواند در سئو سایت شما و بالا رفتن رتبه سایت در موتورهای جستجو تاثیر گذار باشد.

کاربران میتوانند به راحتی لینک ها را پیدا نموده و از یک صفحه در سایت به صفحه دیگر در سایت بروند و زمان بیشتری را در سایت سپری نمایند.

سوالات متداول ( 6 ) سوال مطرح شده
  • آیا رنگ لینک ها در سئو سایت تاثیر گذار است؟

    به هیچ وجه. گوگل و دیگر موتورهای جستجو به CSS سایت کاری ندارند مگر در بخش ریسپانسیو بودن سایت. بنابراین شما رنگ لینک را تنها برای بهتر کردن UI سایت و جذاب بودن برای کاربران تغییر خواهید داد.

  • آیا میتواند رنگ های مختلفی را برای لینکها در بخش های مختلف سایت در نظر گرفت؟

    بله حتما. شما میتوانید توسط Selectorها در زبان CSS ناحیه بندی های مختلفی را داشته باشید و سپس تعیین کنید که لینک های در آن ناحیه خصوصیت های مختلفی داشته باشند.

  • آیا رنگ لینک ها میتواند در میزان کلیک شدن آنها تاثیر گذار باشد؟

    بله حتما. کاربران به صورت پیشفرش خیلی چیزها را در صفحات سایت نمی بینند. بنابراین شما با دادن رنگ  و متفاوت کردن آنها در صفحات سایت, میتوانید میزان دیدن و کلیک پذیری آنها را افزایش دهید.

  • آیا ابزارهایی برای تست رنگ لینکها وجود دارد؟

    به این معنا خیر. شما تنها با طراحی و مدیریت طراحی میتوانید رنگ لینکها را آزمایش کنید و بهترین رنگ ها را برای آن انتخاب نمایید. اما برای تست لینک ها و مشخص نمودن لینک های خراب در سایت, ابزارهایی مانند ahrefs نیز وجود دارند.

  • آیا رنگ لینک ها برای طراحی سایت در بازارهای بین المللی اهمیت دارد؟

    بله حتما. نه فقط در بازارهای بین المللی طراحی سایت مانند تم فارست این مورد اهمیت دارد, بلکه در بازار ایران هم امروزه کاربران دوست دارند تا سایت های خوب و جذاب را مشاهده نمایند. بنابراین بر روی رنگ لینکها کار کنید.

  • آیا ابزارهایی برای مدیریت رنگ سایت ها وجود دارد؟

    بله حتما. شما میتوانید برای مدیریت رنگ سایت و انتخاب بهترین رنگ ها برای سایت و ایجاد نمودن هارمونی بین آنها از ابزارهای و سایت های آنلاینی مانند Paletton.com استفاده نمایید.

ثبت نظر ( 0 ) نظر ثبت شده
برای ثبت نظر ابتدا وارد حساب کاربری خود شوید و یا ثبت نام نمایید...