لینک ها واقعا مهم هستند: همه می دانیم که لینک ها جزو مهمترین اجزای سایت و اپلیکیشن شما به حساب می آیند. آنها روش ارتباطی بخش های مختلف سایت شما با یکدیگر هستند و به همین خاطر اگر آنها را به طور صحیح در سایت تان قرار نداده باشید، شانس کشاندن خواننده را به صفحات دیگر از دست می دهید. در ادامه فاکتورهای جذابیت سایت شما افت پیدا کرده و بقیه داستان را خودتان حدس بزنید...
اما به آنها کم توجهی می شود: ما در شرکت «پات شرق» طی ۱۰ سال گذشته روی تعداد زیادی پروژه وب کار کرده ایم. همیشه در فرایند عیب یابی پروژه ها این موضوع را می بینیم که به لینک ها به اندازه کافی توجه و دقت نشده است و نکات مختلفی در مورد آنها اعمال نگردیده.
در ادامه مطلب تلاش می کنیم تا تجربیات خودمان را در این مورد با شما به اشتراک بگذاریم و خوشحال می شویم تا شما هم آنها را تکمیل نمایید.
همانطور که در ابتدای مطلب گفتیم، تمرکز مطلب امروز نردبان روی موضوع رنگ در لینک ها متنی است. اما چه نکاتی را باید در این مورد رعایت کنیم؟
[h=3]رنگ لینک به خوبی از متن قابل تفکیک باشد
نکته ساده و واضحی است اما گاهی اوقات می بینید که برخی طراحان آن را فراموش می کنند. اگر رنگ لینک مانند متن کنارش باشد، خواننده چطور تشخیص دهد که با یک لینک مواجه است؟
بخش هایی که به نظر بولد می آیند در واقع لینک هستند اما چون همرنگ متن اند کاربر را به اشتباه می اندازند. (بگذریم از این موضوع که در این مثال، چیدمان متن هم درست نیست و چپ چین افتاده اند!)
این موضوع معمولا در بخش هایی از سایت که کمتر در دید قرار می گیرد مانند فوتر سایت به وجود می آید. گاهی اوقات هم رنگ لینک بسیار مشابه متن انتخاب می شود و باز هم تفکیک را سخت می کند.
[h=3]در لینک های فارسی از underline استفاده نکنید
[h=3]رنگ Hover مهم است به آن توجه کنید
وقتی موس روی لینک می رود معمولا تغییر رنگ ایجاد می شود که آن را با سی اس اس اعمال می کنیم. برخی طراحان این رنگ را به گونه ای تعیین می کنند که در این وضعیت لینک کمرنگ تر شده و خواندنش سخت می شود!
خواندن این لینک هنگام Hover کار سختی است نه؟
در حالی که رنگ Hover باید به گونه ای تعریف شود که لینک را پر رنگ تر نموده و کمی تاکید به آن اضافه کند تا خواندنی تر شده و خواننده را به کلیک کردن ترغیب نماید. گاهی اوقات هم برای تاکید بیشتر، از اضافه کردن رنگ پس زمینه به خود کلمه استفاده می شود که این هم روش مناسبی به شمار می رود.
[h=3]رنگ لینک ها را متناسب با رنگ بندی سایت انتخاب کنید
این یکی از رایج ترین مشکلاتی است که در سایت ها می بینیم. در طراحی هر سایتی از رنگ های مشخصی استفاده شده است. شما باید هنگام انتخاب رنگ لینک و hover از رنگی متناسب با رنگ بندی سایت تان استفاده نمایید. در موارد زیادی می بینیم که این رنگ ها هیچ ارتباطی با رنگبندی سایت ندارند و ضربه بزرگی به تم کلی سایت می زنند.
به نظر شما بین تم سبز این سایت و رنگ صورتی و قرمز برای لینک ها ارتباطی وجود دارد؟
در عین حال تجربه جالب دیگر این است که طراحان وب وقت زیادی را صرف طراحی یک گرافیک زیبا برای سایت شما می کنند. اما خیلی اوقات فراموش می کنند که رنگ های مناسب برای لینک های سایت را در اختیار تیم برنامه نویس قرار دهند. اگر طراح و گرافیست وب هستید، لازم است که در کنار گرافیک سایت، کد رنگ لینک ها، hover و ویزیت شده را مشخص نمایید تا در سایت استفاده شود.
[h=3]اندازه لینک ها را تغییر ندهید
این موضوع به رنگ ارتباطی ندارد اما تا به حال برایتان اتفاق افتاده که موس را روی یک لینک ببرید و ببیند که متن بزرگ شده است؟ این کار حواس خواننده را پرت می کند و احتمالا از کلیک کردن روی لینک شما منصرف خواهد شد. شما می توانید این تاکید را با تغییر رنگ انجام بدهید اما تغییر اندازه معمولا انتخاب خوبی نیست.
[h=3]رنگ لینک های ویزیت شده
[h=3]تداخل رنگ متن های سایت با لینک ها
بعضی وبمسترها از متن های رنگی رنگی خوششان می آید! آنها در پاراگراف ها بخش های مختلف متن را به رنگ های مختلف در می آورند و نتیجه چیزی شبیه به رنگین کمان خواهد بود. البته این موضوع به خودشان مربوط است اما بخشی که به مطلب ما مرتبط می شود این است که رنگی شدن متن ها سبب می شود که کاربر آنها را با لینک به اشتباه بگیرد. بنابراین تا جای ممکن از رنگ کردن متن ها خودداری کنید و رنگ را برای لینک ها کنار بگذارید.
شما این نکات را رعایت می کنید؟ چه چیزهایی به آن اضافه می کنید تا آن را تکمیل تر کنید؟
منبع:نگهبان