Advertisement
  1. Web Design
  2. Design Theory

مقدمه ای برسلسله مراتب

by
Read Time:3 minsLanguages:
This post is part of a series called Design School for Developers.
Reducing the Bloat
Building Content Hierarchy Through Design

Persian (پارسی) translation by Pouria Parhami (you can also view the original English article)

 خیلی مهمه که شما اطمینان داشته باشید، طرح‌هایتان دارای سلسه مراتب واضحی هستند، و این همان چیزی‌ست که باید در همه‌ی طراحی‌های خود به عنوان هدف در نظر بگیرید. هنری که به شدت مربوط می‌شود به برنامه ریزی محتوا و مرحله استراتژی شما.


سلسله مراتب چیست؟

می‌شود سلسله مراتب به این شکل توصیف کرد:

یک سیستم یا سازمان که هرفرد یا گروه(ها) را بر اساس قدرت و موقعیت‌شان رتبه بندی می‌کند، یکی بالاتر از دیگری.

و بر اساس این تعریف می‌توانیم تعریف دیگری را درست کنیم برای این موضوع که چطور سلسله مراتب در طراحی استفاده می‌شود؛ که عبارت است از چیزی شبیه تعریف زیر:

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

هدف ما این است که با ایجاد یک سلسله مراتب تمام المان‌های مختلف درون طراحی خودمان به صورت موثری نشان دهیم، با توجه به این‌که آنها چقدر مهم هستند و چقدر باید روی آنها توجه و تمرکز داشته باشیم.

همچنین سلسله مراتب در مورد داستان‌سرایی هم است. در مورد سفر کاربر ما به وب سایت‌مان و جریانی که ما برای کاربر ایجاد کردیم.  یک سلسله مراتب قدرتمند، همان اهرم قدرتمندی که باهاش می‌توانیم کاربران خودمان آن جایی ببریم که می خواهیم بروند.

سلسله مراتب تنها مربوط به لایه‌های بصری ما نیست، در مورد ساختار سایت هم هست، که به برنامه ریزی ما برای مرحله محتوامان تکیه دارد. در این نقطه می‌توانیم نگاهی به سلسله مراتب محتوا داشته باشیم، چه‌طور محتوامان را  تقسیم و مدیریت کنیم تا به ما کمک کند به سلسله مراتب بصری و ساختاری برسیم، در جایی که به طرح‌های اصلی (main layouts) شبکه‌ها (grids) تایپوگرافی (typography) و تصاویری مانند آیکون‌ها (icons) دکمه‌ها (buttons) وعکس‌ها (photos) نگاه می‌کنیم .

barley-1barley-1barley-1
In the Barley design, they use hierarchy very well, using both content and imagery to convey their messages.In the Barley design, they use hierarchy very well, using both content and imagery to convey their messages.In the Barley design, they use hierarchy very well, using both content and imagery to convey their messages.
در طراحی جو(Barley)، آن‌ها به خوبی توانسته‌اند از سلسله مراتب استفاده کنن، از تصاویر و محتوا در کنار هم استفاده کردند تا پیغام خودشان را برسانند.

چرا سلسله مراتب خیلی مهم است؟

سلسله مراتب به این دلیل خیلی مهم است که به ما کمک می‌کند تا سفارشی که گرفته‌ایم را به طرح قوی تبدیل کنیم، طرحی که مطئنیم بیشتر پیام‌های مشترک در آن نام تجاری (brand) برای کاربرها قابل پیش‌بینی باشد.

هم‌چنین سلسله مراتب به ما کمک می‌کند تا فضاهای بصری رو بسازیم که برای کاربران جالب باشد. به این شکل به ما در هدایت کاربران در طول سفرشون به دور وب سایت ما کمک می کند. وقتی به این صورت از آن استفاده کنید، یک سلسله مراتب خوب بصری خواهید داشت که می‌تواند کمکتان کند تا آن ناحیه که می‌خواهید مورد توجه قرار بگیرد را برجسته کنید. هم‌چنین در ایجاد یک سلسله مراتب و ساختار بصری قوی، شما باید تاکید درستی بر فضاها داشته باشید و نشان دهید چرا آن‌ها مهم هستند.

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

zendesk-1zendesk-1zendesk-1
The Zendesk uses a lot of space, as well as good use of different styles of typography and imagery, to help guide the user through their key features.The Zendesk uses a lot of space, as well as good use of different styles of typography and imagery, to help guide the user through their key features.The Zendesk uses a lot of space, as well as good use of different styles of typography and imagery, to help guide the user through their key features.
وب سایت زن دسک(Zendesk) از فضاهای زیادی استفاده کرده است، همین‌طور از استایل‌های متفاوتی برای تایپوگرافی و تصاویر، تا از طریق ویژگی‌های کلیدی خودش کاربرهایش را راهنمایی کند.

ابزارهایی برای ایجاد سلسله مراتب

ابزارها و تکنولوژی‌های بسیار زیاد و متفاوتی در دسترس هستند که می‌توانید با آن‌ها یک سلسله مراتب خوب بصری برای وب سایت خود بسازید:

  • استفاده از رنگ
  • استفاده از کنتراست
  • استفاده از سایز
  • استفاده از تراز
  • استفاده از تکرار
  • استفاده از مجاورت
  • استفاده از فضای خالی

تمام جزیات بیشتر در مورد این‌ها، به همراه چگونگی استفاده از هرکدام را، در مقالات مربوط به سلسله مراتب خواهیم گفت. هم‌چنین در آن مقالات به محتوا و ساختار سلسله مراتب بصری توجه خواهیم کرد. 

Advertisement
Advertisement
Looking for something to help kick start your next project?
Envato Market has a range of items for sale to help get you started.