در طراحی یک صفحه وب، تاکید به معنای ایجاد یک ناحیه یا شیء است که به عنوان نقطه کانونی صفحه عمل می‌کند. این تکنیک به ما کمک می‌کند تا یک عنصر خاص را در طراحی برجسته کنیم و توجه کاربر را به آن جلب کنیم. این نقطه کانونی می‌تواند بزرگتر از سایر عناصر باشد، رنگ‌های روشن‌تری داشته باشد یا با استفاده از تکنیک‌های دیگر، توجه‌ها را به خود معطوف کند.
هنگام طراحی یک صفحه وب، می‌توانید با انتخاب یک کلمه یا عبارت کلیدی و اختصاص دادن رنگ، فونت یا اندازه متفاوت به آن، بر آن تاکید کنید. اما روش‌های بسیار دیگری نیز برای استفاده از تاکید در طراحی وجود دارد که در ادامه به آنها خواهیم پرداخت.
چگونه از تاکید در طراحی استفاده کنیم؟
یکی از بزرگترین اشتباهاتی که طراحان وب مرتکب می‌شوند، تلاش برای برجسته کردن همه چیز در طراحی است. وقتی همه عناصر به یک اندازه مورد تاکید قرار گیرند، طراحی شلوغ، گیج‌کننده و یا بدتر از آن، خسته‌کننده و بی‌جذابیت به نظر می‌رسد. برای ایجاد یک نقطه کانونی در طراحی وب، از موارد زیر غافل نشوید:
- خطوط: با ایجاد تضاد می‌توانید بر یک عنصر تاکید کنید. اگر بیشتر عناصر افقی هستند، یک عنصر عمودی به نقطه کانونی تبدیل می‌شود.
- رنگ: اگر بیشتر عناصر در طراحی تیره یا بی‌رنگ هستند، هر شیء رنگی توجه را به خود جلب می‌کند. استفاده از رنگ راهی موثر برای تاکید است.
- شکل‌ها: هنگامی که بیشتر شکل‌ها نامنظم هستند، یک شکل هندسی برجسته می‌شود.
- نزدیکی: وقتی چند مورد در یک گروه قرار دارند و یکی از آنها از گروه جدا است، چشم به سمت مورد جداگانه می‌رود.
- موقعیت قرارگیری: اگرچه استثنائاتی وجود دارد، اما عنصری که در مرکز طراحی قرار می‌گیرد، معمولاً چشم را به خود جلب می‌کند.
- وزن: یک عنصر سنگین توجه بیننده را به خود جلب می‌کند.
- تکرار: هنگامی که یک عنصر گرافیکی یا تایپی ساده تکرار می‌شود، چشم عنصر تکراری را تا نقطه کانونی دنبال می‌کند.
- تضاد: علاوه بر تضادهای ایجاد شده توسط رنگ و خطوط، تضاد می‌تواند با تغییر اندازه، بافت یا فونت ایجاد شود. این تغییر باعث می‌شود عنصر کانونی یا تاکید برجسته شود.
- فضای سفید: عنصری که توسط فضای سفید (یا خالی) احاطه شده است، به نقطه کانونی تبدیل می‌شود.
اهمیت سلسله مراتب در طراحی وب
سلسله مراتب در طراحی وب به معنای چیدمان بصری عناصر به گونه‌ای است که اهمیت آنها را از طریق اندازه نشان دهد. بزرگترین عنصر، مهم‌ترین است و عناصر کم‌اهمیت‌تر، کوچکتر هستند. تمرکز خود را بر ایجاد یک سلسله مراتب بصری در طرح‌های وب خود قرار دهید. اگر ساختار HTML خود را به صورت معنایی ایجاد کرده‌اید، این کار آسان‌تر خواهد بود، زیرا صفحه وب شما از قبل دارای یک سلسله مراتب است. تنها کاری که طراحی شما باید انجام دهد این است که بر عنصر صحیح (مانند یک عنوان H1) برای بیشترین تاکید، تمرکز کند.
علاوه بر سلسله مراتب در ساختار، به این نکته توجه داشته باشید که چشم بازدید کننده یک صفحه وب را به صورت حرف Z از گوشه سمت چپ بالای صفحه اسکن می‌کند. این باعث می‌شود گوشه سمت چپ بالای صفحه، مکان مناسبی برای یک عنصر مهم مانند لوگوی شرکت باشد. گوشه سمت راست بالا، دومین موقعیت مناسب برای قرار دادن اطلاعات مهم است.
چگونه تاکید را در طراحی وب بگنجانیم؟
تاکید در طراحی وب را می‌توان به روش‌های مختلفی پیاده‌سازی کرد:
- از نشانه‌گذاری معنایی (Semantic markup) برای ایجاد تاکید، حتی بدون استفاده از هیچ استایلی، استفاده کنید.
- اندازه فونت‌ها یا تصاویر را تغییر دهید تا بر آنها تاکید کنید یا از اهمیت آنها بکاهید.
- از رنگ‌های متضاد برای ایجاد تاکید استفاده کنید.
- اندازه مهم است. یک کلمه بزرگ در صفحه یا نمایشگر، بلافاصله توجه را به خود جلب می‌کند.
- نقطه کانونی را با فضای سفید احاطه کنید.
- یک کلمه یا تصویر را تکرار کنید تا توجه را جلب کنید.
جایگاه کم‌رنگ کردن (Subordination) در طراحی کجاست؟
کم‌رنگ کردن زمانی اتفاق می‌افتد که شما سایر عناصر یک طرح را کم‌رنگ‌تر می‌کنید تا نقطه کانونی بیشتر به چشم بیاید. یک مثال، قرار دادن یک گرافیک رنگارنگ در برابر یک عکس پس‌زمینه سیاه و سفید است. همین اثر زمانی رخ می‌دهد که از رنگ‌های ملایم یا رنگ‌هایی استفاده کنید که با پس‌زمینه پشت نقطه کانونی ترکیب شوند، که باعث می‌شود نقطه کانونی برجسته شود.
تاکید در طراحی وب: راز جلب توجه کاربران و افزایش نرخ تبدیل — https://www.rayeshmand.ir/article/emphasis-as-a-web-design-principle