معماری دستهبندی و منوی فروشگاه اینترنتی: از «دسته مادر» تا مگامنو
در این راهنمای شهر سایت یاد میگیرید معماری دستهبندی فروشگاه اینترنتی را اصولی بچینید: تفاوت «دسته» و «فیلتر»، تعداد و عمق مناسب، نامگذاری شفاف، طراحی هابپیج برای هر دسته مادر، ساخت مگامنو قابل اسکن در دسکتاپ و موبایل، breadcrumb و لینکدهی داخلی درست، و چکلیست نهایی برای کاهش سردرگمی، جلوگیری از صفحات تکراری و افزایش کشف محصول و خرید. در عمل!!
این مقاله توسط شهر سایت تهیه شده است.
مقدمه: چرا معماری دستهبندی، ستون فقرات فروشگاه است؟
در فروشگاه اینترنتی، «کشف محصول» (Product Discovery) مهمترین مرحله قبل از خرید است. کاربر یا دقیقاً میداند چه میخواهد و دنبال مسیر کوتاه تا همان محصول است، یا هنوز مطمئن نیست و میخواهد بین گزینهها بگردد، مقایسه کند و کمکم تصمیم بگیرد. معماری دستهبندی و منو همان چیزی است که این دو رفتار را بدون اصطکاک ممکن میکند.
اگر معماری شما ضعیف باشد، نشانههایش معمولاً اینهاست:
-
کاربر زیاد اسکرول میکند ولی محصول مناسب پیدا نمیکند.
-
در صفحه دستهبندیها فیلترها را امتحان میکند و عقبگرد میزند.
-
نرخ خروج از صفحات دستهبندی بالاست و به صفحه محصول نمیرسد.
-
جستجوی داخلی زیاد استفاده میشود، اما نتیجهای که کاربر میخواهد پیدا نمیشود.
-
صفحات زیادی «شبیه هم» ساخته میشود (خصوصاً وقتی فیلترها را بهجای دسته استفاده کردهاید).
هدف این راهنما این است که یک معماری استاندارد بسازید که هم برای کاربر روشن و قابل پیشبینی باشد، هم برای توسعهپذیری فروشگاه (افزایش محصولات و دستهها) دردسر درست نکند، و هم از نظر سئو، صفحات دستهبندی واقعاً معنادار و قابل رتبهگیری داشته باشید.
۱) دستهبندی ≠ فیلتر: مهمترین تمایز در طراحی فروشگاه
قبل از هر چیز باید یک خط قرمز روشن داشته باشید:
دسته (Category) یعنی «نوع محصول» یا «شاخه اصلی»
دستهبندی معمولاً بر اساس نوع محصول یا ساختار ذهنی پایدار کاربران شکل میگیرد؛ چیزی که اگر فردا محصول جدید اضافه شد، باز هم معنیاش تغییر نمیکند.
مثال: موبایل، لپتاپ، کفش، کیف، کرم ضدآفتاب، صندلی اداری.
فیلتر (Facet/Attribute) یعنی «ویژگی محصول»
فیلترها توصیفکننده ویژگیهای محصولاند؛ چیزهایی مثل رنگ، سایز، جنس، برند، بازه قیمت، ظرفیت، کاربرد، نوع ارسال و… .
اشتباه کلاسیک: ساختن دستههایی مثل «کفش قرمز»، «کفش ارزان»، «کفش سایز ۴۱». اینها باید فیلتر یا صفحه موضوعی باشند، نه دسته اصلی.
چرا این اشتباه خطرناک است؟
-
منو با رشد فروشگاه شلوغ و غیرقابل کنترل میشود.
-
کاربر بین گزینهها گم میشود چون مرز دستهها مبهم است.
-
از نظر سئو، صفحات بسیار مشابه میسازید (thin/duplicate) و قدرت صفحات اصلی دستهبندی پراکنده میشود.
-
مدیریت محتوا سخت میشود: هر بار تغییر موجودی یا قیمت، ساختار را به هم میریزد.
۲) عمق و عرض دستهبندی: چند سطح کافی است؟
هیچ «عدد جادویی» برای همه فروشگاهها وجود ندارد، اما قاعده عملی برای اکثر فروشگاهها این است:
-
۳ سطح معمولاً کافی است (دسته مادر → زیر دسته → زیرزیر دسته).
-
۴ سطح برای برخی حوزهها قابل توجیه است (خصوصاً دیجیتال یا ابزار تخصصی).
-
۵ سطح و بیشتر معمولاً علامت خطر است و نشان میدهد فیلترها به شکل دسته پیاده شدهاند.
تعادل عمق و عرض
-
اگر عمق کم باشد ولی عرض زیاد (خیلی زیردسته در یک سطح)، منو شلوغ میشود.
-
اگر عمق زیاد باشد، مسیر کاربر طولانی و خستهکننده میشود.
هدف: کاربر در ۲ تا ۳ کلیک از صفحه اصلی به دسته مطلوب برسد و با فیلترها انتخاب را دقیقتر کند.
۳) ۴ مدل رایج برای ساخت دستهبندی (و اینکه کدام را اولویت بدهیم)
فروشگاهها معمولاً ترکیبی از این مدلها هستند، اما یکی باید ستون اصلی باشد:
۳.۱) مدل «نوع محصول» (Taxonomy کلاسیک) – ستون اصلی
این مدل پایدارترین و قابل فهمترین گزینه است و معمولاً مناسبترین ساختار برای منوی سطح اول است.
۳.۲) مدل «کاربرد/سناریو» – مناسب صفحات موضوعی (Collection)
مثلاً: «هدیه برای…»، «مناسب سفر»، «مناسب ورزش»، «برای پوست چرب».
اینها معمولاً بهتر است بهصورت صفحه موضوعی ساخته شوند تا انعطاف داشته باشند و با تغییر موجودی به هم نریزند.
۳.۳) مدل «مخاطب» – وقتی رفتار خرید بر اساس جنسیت/سن جداست
مثل زنانه/مردانه/بچگانه در پوشاک یا «خانگی/اداری» در مبلمان.
۳.۴) مدل «برند» – معمولاً صفحه برند جدا
در اغلب فروشگاهها بهتر است برندها صفحه اختصاصی داشته باشند (Brand Index و Brand Page) و در منوی سطح اول نیایند؛ مگر اینکه فروشگاه کاملاً برندمحور باشد.
۴) فرآیند استاندارد طراحی معماری دستهبندی (گامبهگام و قابل اجرا)
گام ۱: موجودی واقعی و ویژگیها را استخراج کنید
قبل از طراحی منو، یک تصویر واقعی از کاتالوگ لازم دارید:
-
لیست گروههای محصولی موجود
-
تعداد SKU در هر گروه
-
ویژگیهای کلیدی هر گروه (attributes)
-
تغییرپذیری موجودی (کدام گروهها فصلیاند؟ کدام همیشه هستند؟)
قاعده: دستهای بسازید که حداقل «عمق محتوا» و «تنوع محصول» داشته باشد. اگر در یک دسته فقط ۳ محصول دارید و این ۳ محصول هم احتمالاً ماه بعد تمام میشود، آن دسته معمولاً نباید سطح بالا باشد.
گام ۲: مدل ذهنی کاربر را از داده بیرون بکشید، نه از حدس
روشهای کمهزینه ولی موثر:
-
بررسی سوالات پرتکرار پشتیبانی (کاربران چه اصطلاحی به کار میبرند؟)
-
بررسی عبارتهای سرچ داخلی سایت (اگر دارید)
-
بررسی فروشگاههای موفق همحوزه (نه برای کپی، برای دیدن الگو)
-
Card Sorting سبک (۱۰ تا ۱۵ نفر کافی است) برای فهم اینکه کاربران اقلام را چطور گروهبندی میکنند
گام ۳: درخت دستهبندی (Category Tree) را طراحی کنید
خروجی قابل تحویل باید یک درخت روشن باشد:
-
سطح اول: ۶ تا ۱۰ دسته (ترجیحاً)
-
هر دسته سطح اول: ۶ تا ۱۲ زیردسته
-
اگر زیردستهها زیاد است، گروهبندی در مگامنو یا صفحه هاب
گام ۴: قواعد نامگذاری (Naming Rules) را بنویسید
نامگذاری در فروشگاهها عامل اصلی «قابل فهم بودن» است. قواعد پیشنهادی:
-
کوتاه و مشخص (حداکثر ۱ تا ۳ کلمه)
-
همواژهسازی ثابت (کتانی/اسنیکر را یکی کنید)
-
پرهیز از اصطلاحات داخلی
-
پرهیز از دستههای مبهم و همپوشان
گام ۵: ساختار URL را استاندارد کنید
ساختار URL باید ساده، قابل پیشبینی و پایدار باشد. دو الگوی رایج:
-
/category/parent/child/ -
/shop/parent/child/
اگر از پارامترهای فیلتر استفاده میکنید، بهتر است URL فیلترها بهصورت کنترلشده ساخته شود (در بخش فیلترها توضیح میدهیم).
گام ۶: صفحات «هاب» (Hub Pages) را برای دستههای مادر طراحی کنید
یک اشتباه رایج این است که دسته مادر فقط یک لیست محصول باشد. در فروشگاههای حرفهای، دسته مادر یک صفحه هاب است که:
-
معرفی کوتاه و انسانی دارد (۸۰ تا ۱۵۰ کلمه)
-
زیردستهها را به شکل کارت/گروه نمایش میدهد
-
چند مسیر محبوب را برجسته میکند (پرفروشها، جدیدها، راهنمای انتخاب)
-
امکان شروع سریع خرید را میدهد
۵) طراحی صفحه دستهبندی: استانداردی که باید رعایت شود
صفحه دستهبندی جایی است که کاربر انتخاب را دقیق میکند. اگر صفحه دستهبندی درست نباشد، کاربر یا مجبور میشود به سرچ داخلی پناه ببرد یا خرید را رها میکند.
۵.۱) Above the Fold در دستهبندی: کاربر باید بداند کجاست
در بالای صفحه دستهبندی باید اینها واضح باشد:
-
عنوان دسته (H1)
-
مسیر (Breadcrumb)
-
تعداد نتایج
-
کنترلهای کلیدی (مرتبسازی، فیلتر، نمایش Grid/List)
۵.۲) کارت محصول استاندارد
کارت محصول باید برای تصمیم سریع کافی باشد:
-
تصویر واضح و ثابت
-
نام کوتاه و خوانا
-
قیمت و تخفیف شفاف
-
وضعیت موجودی (اگر مهم است)
-
امتیاز/تعداد نظر (اگر معتبر و کافی است)
۵.۳) مرتبسازی و فیلترها: کنترل واقعی به کاربر بدهید
مرتبسازیهای رایج:
-
مرتبطترین (اگر الگوریتم دارید)
-
پرفروشترین
-
جدیدترین
-
ارزانترین/گرانترین
فیلترها باید بر اساس ویژگیهای واقعی و مهم آن دسته انتخاب شوند، نه یک لیست طولانی از همه ویژگیها.
۶) فیلترهای چندبعدی (Faceted Navigation): هم لازم، هم خطرناک
فیلترها برای UX ضروریاند، اما اگر کنترل نشوند، برای سئو و مدیریت سایت دردسر ایجاد میکنند.
۶.۱) طراحی UX فیلترها
-
فیلترهای مهم بالا و در دسترس باشند
-
انتخابها قابل مشاهده و قابل حذف باشند (Selected filters)
-
حالت «بدون نتیجه» مدیریت شود (پیشنهاد حذف یک فیلتر یا تغییر بازه قیمت)
-
در موبایل، فیلتر بهتر است به شکل Bottom Sheet/Drawer باز شود و دکمه اعمال/پاککردن واضح داشته باشد
۶.۲) تصمیم سئو برای فیلترها: کدام فیلترها صفحه قابل ایندکس میشوند؟
قانون استاندارد:
-
فقط ترکیبهای پرتکرار و پرارزش که واقعاً نیت جستجو دارند، میتوانند صفحه مستقل شوند (مثلاً «کفش زنانه»، «گوشی سامسونگ» اگر بازار و جستجو دارد).
-
اکثر ترکیبهای فیلتر بهتر است ایندکس نشوند تا از تولید صفحات بینهایت جلوگیری شود.
در عمل این یعنی:
-
برای برخی فیلترهای کلیدی، صفحه موضوعی (Collection) بسازید.
-
برای بقیه فیلترها، URLهای پارامتری را با سیاستهای فنی (canonical/noindex) کنترل کنید. (این بخش را با تیم توسعه هماهنگ کنید.)
۷) منو و مگامنو: چطور ساختار دستهبندی را به ناوبری تبدیل کنیم؟
منو باید نسخه «قابل استفاده» معماری دستهبندی باشد، نه نمایش خام کل درخت.
۷.۱) منوی سطح اول: کم، روشن، پایدار
-
۶ تا ۱۰ آیتم سطح اول
-
عنوانها کوتاه و قابل فهم
-
ترتیب بر اساس اهمیت تجاری/رفتاری (نه لزوماً الفبایی)
۷.۲) مگامنو: وقتی زیردستهها زیاد است
مگامنو باید:
-
گروهبندی واضح داشته باشد (تیتر گروه)
-
لینکها کوتاه و اسکنپذیر باشند
-
مسیرهای محبوب را برجسته کند (پرفروشها/جدیدها/کالکشنها)
-
یک «مشاهده همه» برای دسته مادر داشته باشد
خطای رایج: دیوار لینک. اگر کاربر نتواند در ۳ ثانیه مسیر خود را پیدا کند، مگامنو شکست خورده است.
۷.۳) الگوی پیشنهادی برای فارسی (RTL)
-
گروهبندیها از راست به چپ خوانا باشند
-
جهت فلشها و باز شدن زیرمنوها با RTL هماهنگ باشد
-
فاصلهها و تایپوگرافی برای اسکن سریع تنظیم شود
۸) Breadcrumb، لینکدهی داخلی و مسیرهای ثانویه
Breadcrumb برای فروشگاه فقط تزئین نیست؛ ابزار جهتیابی است. حداقل استاندارد:
-
خانه > دسته مادر > زیردسته > محصول
-
همه آیتمها لینکپذیر باشند (بهجز صفحه فعلی)
-
نامها کوتاه و دقیق باشند
لینکدهی داخلی هوشمند
-
در هابپیجها به زیردستههای کلیدی لینک بدهید
-
از صفحه دستهبندی به صفحات راهنما (مثل راهنمای سایز) لینک بدهید
-
از صفحات بلاگ به دستههای مرتبط لینک بدهید (بدون اسپم)
۹) اعتبار و اعتماد: معماری دستهبندی باید به اعتماد هم کمک کند
گاهی کاربر محصول را پیدا میکند ولی هنوز شک دارد. چند عنصر که در صفحات دستهبندی و هاب میتواند کمک کند:
-
راهنمای انتخاب کوتاه (۲ تا ۴ نکته)
-
توضیح شفاف درباره ارسال/مرجوعی برای آن دسته (اگر متفاوت است)
-
برجسته کردن «فقط محصولات موجود» یا وضعیت موجودی (در حوزههایی که مهم است)
-
نمایش نشانهای اعتماد به صورت محدود و واقعی
۱۰) سنجش موفقیت معماری دستهبندی: با عدد و رفتار
برای اینکه بدانید معماری شما جواب داده یا نه، این شاخصها را دنبال کنید:
-
نرخ کلیک از صفحه اصلی/منو به دستهها (CTR منو)
-
نسبت بازدید دستهبندی → بازدید صفحه محصول (Category to PDP rate)
-
نرخ استفاده از جستجو و نرخ تبدیل جستجو (Search usage & conversion)
-
نرخ خروج از صفحات دستهبندی
-
میانگین فیلترهای اعمالشده و نرخ رسیدن به نتیجه (Filter success)
اگر این شاخصها بد باشد، مشکل معمولاً یکی از اینهاست:
-
دستهبندیها با مدل ذهنی کاربر همخوان نیست
-
فیلترها بد طراحی شدهاند یا بیش از حدند
-
کارت محصول برای تصمیم سریع کافی نیست
-
مسیرهای محبوب در منو/هاب برجسته نشدهاند
۱۱) چکلیست نهایی (استاندارد و اجرایی)
چکلیست معماری
-
دستهها بر اساس «نوع محصول» ساخته شدهاند، نه ویژگیها
-
عمق دستهبندی حداکثر ۳ یا ۴ سطح است
-
نامگذاری کوتاه، سازگار و بدون ابهام است
-
برای دستههای مادر Hub Page واقعی وجود دارد
-
صفحات موضوعی (Collection) برای سناریوهای مهم ساخته شدهاند
چکلیست صفحه دستهبندی
-
عنوان، breadcrumb و تعداد نتایج واضح است
-
فیلترها بر اساس ویژگیهای مهم دسته انتخاب شدهاند
-
حالت بدون نتیجه مدیریت شده است
-
کارت محصول استاندارد و قابل اسکن است
-
مرتبسازیهای کاربردی وجود دارد
چکلیست منو/مگامنو
-
آیتمهای سطح اول محدود و معنادارند
-
مگامنو گروهبندی و تیتر دارد (دیوار لینک نیست)
-
مسیرهای محبوب برجسته شدهاند
-
نسخه موبایل ساده و لمسپذیر است
-
RTL و تایپوگرافی درست رعایت شده است
اجرای عملی این معماری با شهر سایت
اگر میخواهید همین معماری دستهبندی، صفحات هاب، منو/مگامنو و ساختار صفحات فروشگاهی را بهصورت حرفهای طراحی و پیادهسازی کنید، تیم شهر سایت میتواند UI/UX و توسعه را یکپارچه انجام دهد. برای شروع، صفحه طراحی و توسعه سایت فروشگاهی را ببینید.
سوالات متداول
آیا باید برای هر فیلتر یک صفحه جدا بسازم؟
نه. فقط برای فیلترهای واقعاً مهم و پرتکرار (با نیت جستجوی مشخص) بهتر است صفحه موضوعی بسازید. باقی فیلترها را بیشتر برای UX نگه دارید و از تولید صفحات بینهایت جلوگیری کنید.
چند دسته سطح اول مناسب است؟
برای اکثر فروشگاهها ۶ تا ۱۰ دسته سطح اول تعادل خوبی بین کشف سریع و شلوغ نشدن ایجاد میکند.
اگر محصولات در چند دسته قرار میگیرند چه؟
این موضوع طبیعی است، اما باید مراقب تکرار و پراکندگی باشید. بهتر است یک «دسته اصلی» برای هر محصول تعریف کنید و بقیه مسیرها را به شکل کالکشن یا نمایشهای ثانویه مدیریت کنید.
مگامنو بهتر است یا منوی ساده؟
اگر زیردستهها زیاد نیست، منوی ساده بهتر است. مگامنو زمانی ارزش دارد که گروهبندی و اسکن را سریع کند.
۱۲) صفحات برند و کالکشن: مکمل دستهبندی، نه جایگزین آن
وقتی فروشگاه رشد میکند، معمولاً دو نوع صفحه کنار دستهبندیها لازم میشود: «برند» و «کالکشن/موضوعی». اگر درست طراحی شوند، کشف محصول بهتر میشود و فشار از روی منو کم میشود.
۱۲.۱) صفحه برند (Brand Page) استاندارد
صفحه برند بهتر است این اجزا را داشته باشد:
-
معرفی کوتاه و واقعی (بدون شعار)
-
«محبوبترینها» و «جدیدترینها»
-
فیلترهای مرتبط با همان حوزه
-
لینک به دستههای مرتبط
۱۲.۲) کالکشن/صفحات موضوعی (Collections) برای نیتهای پرتکرار
کالکشنها صفحههایی هستند که از ترکیب «دسته + معیار انتخاب» ساخته میشوند، اما بهصورت کنترلشده و با هدف مشخص. مثال: «هدیه اقتصادی»، «مناسب سفر»، «ویژه پوست حساس».
کالکشن خوب عنوان و توضیح روشن دارد و با تغییر موجودی، خراب نمیشود.
۱۳) صفحهبندی (Pagination) در دستهبندیها: UX و سئو را همزمان مدیریت کنید
چند اصل عملی:
-
کاربر بداند چند صفحه نتیجه دارد و کجاست
-
کنترلهای «بعدی/قبلی» در موبایل لمسپذیر باشد
-
اسکرول بینهایت فقط وقتی مناسب است که “Load more” داشته باشید و برگشت به جای قبلی در لیست حفظ شود
-
ترتیب نمایش پایدار باشد تا آیتمها بین صفحات جابهجا نشوند
۱۴) خطاهای رایج در معماری دستهبندی (و هزینههای پنهان)
۱) دستههای همپوشان و مبهم
۲) ساختار مدیریتی بهجای کاربرمحور
۳) تبدیل فیلترها به دسته و تولید صفحات بسیار مشابه
۴) بیتوجهی به رشد آینده (با افزایش محصولات، منو از کنترل خارج میشود)
۵) تست نکردن با کاربر واقعی حتی در حد ۵ نفر
۱۵) یک روش سریع برای اعتبارسنجی منو قبل از لانچ
سه سناریو را با چند کاربر تست کنید:
-
«میخواهم یک هدیه اقتصادی پیدا کنم» (کالکشن)
-
«میخواهم مدل X را پیدا کنم» (جستجو)
-
«میخواهم بین گزینهها مقایسه کنم» (دسته + فیلتر)
اگر کاربر مکث طولانی یا عقبگردهای زیاد داشت، معماری نیاز به اصلاح دارد.
یک نمونه قالب خروجی برای «درخت دستهبندی» (برای تحویل به تیم)
برای اینکه در جلسهها بحث سلیقهای نشود، درخت را در یک جدول ساده مستند کنید:
-
ستون ۱: سطح (L1/L2/L3)
-
ستون ۲: نام دسته
-
ستون ۳: هدف/تعریف کوتاه (این دسته دقیقاً چیست؟)
-
ستون ۴: ویژگیهای فیلتر مهم (۳ تا ۷ مورد)
-
ستون ۵: صفحات موضوعی پیشنهادی (اگر لازم است)
این قالب باعث میشود هر دسته «تعریف» داشته باشد، فیلترها از دسته جدا بمانند، و بعداً هم بتوانید رشد فروشگاه را بدون آشفتگی مدیریت کنید.
هنوز نظری برای این پست ثبت نشده است.
ارسال نظر