Breadcrumbs یک ویژگی ناوبری وب سایت است که مکان فعلی کاربر را در ساختار سلسله مراتبی سایت نمایش می دهد. Breadcrumbs که معمولاً در قالب دنباله ای از پیوندهای قابل کلیک ارائه می شود، به کاربران کمک می کند موقعیت خود را درک کنند و به راحتی به صفحات سطح بالاتر برگردند. این عنصر رابط کاربری ارزشمند تجربه کاربر را افزایش می دهد و نرخ پرش را کاهش می دهد و آن را به یک جزء ضروری برای وب سایت های مدرن تبدیل می کند.
تاریخچه پیدایش Breadcrumbs و اولین ذکر آن
مفهوم Breadcrumbs برای اولین بار توسط دانشمند کامپیوتر Ben Shneiderman در سال 1987 به عنوان بخشی از سیستم HOMER (تاریخچه کاوش و بازیابی یادداشت های اداری) او معرفی شد. اصطلاح خرده نان از افسانه کلاسیک هانسل و گرتل سرچشمه می گیرد، جایی که قهرمانان برای مشخص کردن مسیر خود در جنگل، خرده نان می ریزند. به طور مشابه، Breadcrumbs در ناوبری وب به کاربران اجازه می دهد تا مراحل خود را از طریق یک وب سایت دنبال کنند و از گم شدن آنها جلوگیری می کند.
اطلاعات دقیق در مورد Breadcrumbs. گسترش موضوع Breadcrumbs.
خرده نان به عنوان یک کمک ناوبری ثانویه عمل می کند و منوی اصلی و قابلیت جستجو را تکمیل می کند. آنها زمینه، جهتگیری و ابزاری کارآمد برای بازگشت از طریق سلسله مراتب سایت فراهم میکنند. با نمایش یک دنباله واضح از صفحات، Breadcrumbs چندین مزیت را ارائه می دهد:
-
کاربرپسند بودن: Breadcrumbs ناوبری را به ویژه در وب سایت های بزرگ و پیچیده ساده می کند و رضایت و تعامل کاربر را بهبود می بخشد.
-
کاهش نرخ پرش: وقتی کاربران بدانند که می توانند به راحتی به سطوح قبلی بازگردند، احتمال بیشتری دارد که به کاوش عمیق تر در وب سایت بپردازند.
-
مزایای سئو: Breadcrumbs با ایجاد پیوندهای شفاف و سلسله مراتبی بین صفحات به بهینه سازی بهتر موتورهای جستجو کمک می کند.
-
دسترسی: Breadcrumbs برای کاربرانی که به صفحهخوانها متکی هستند مفید است و به آنها در درک ساختار وبسایت کمک میکند.
-
ثبات: Breadcrumbs ثابت در یک وب سایت، قابلیت پیش بینی و قابلیت استفاده را بهبود می بخشد.
ساختار داخلی Breadcrumbs. Breadcrumbs چگونه کار می کند.
Breadcrumb ها معمولاً با استفاده از HTML و CSS پیاده سازی می شوند. آنها می توانند در وب سایت هاردکد شوند یا به صورت پویا از طریق سیستم های مدیریت محتوا (CMS) تولید شوند. ساختار Breadcrumbs به صورت سلسله مراتبی سازماندهی شده است که معماری اطلاعات سایت را منعکس می کند. مسیر معمولاً از صفحه اصلی شروع می شود و در هر سطح بعدی پیشرفت می کند و به صفحه فعلی ختم می شود.
ساختار داخلی معمولاً فهرستی از پیوندها است که هر پیوند نشان دهنده یک صفحه یا دسته بندی خاص است. در اینجا یک نمونه از ساختار HTML برای یک دنباله ساده Breadcrumb آورده شده است:
html<nav aria-label="Breadcrumb">
<ol class="breadcrumb">
<li class="breadcrumb-item"><a href="/">Home</a></li>
<li class="breadcrumb-item"><a href="/category/">Category</a></li>
<li class="breadcrumb-item"><a href="/category/subcategory/">Subcategory</a></li>
<li class="breadcrumb-item active" aria-current="page">Current Page</li>
</ol>
</nav>
سبکهای CSS را میتوان برای بهبود نمایش بصری Breadcrumbs به کار برد، و آنها را جذابتر و متناسبتر با طراحی وبسایت کرد.
تجزیه و تحلیل ویژگی های کلیدی Breadcrumbs
Breadcrumbs دارای برخی از ویژگی های ضروری است که عملکرد و قابلیت استفاده آنها را افزایش می دهد:
-
لینک های قابل کلیک: هر عنصر در مسیر Breadcrumb یک پیوند قابل کلیک است که به کاربران امکان می دهد به یک صفحه خاص حرکت کنند.
-
نشانگر صفحه فعال: آخرین عنصر در دنباله، که نمایانگر صفحه فعلی است، اغلب برای نشان دادن وضعیت فعال آن به گونهای متفاوت طراحی میشود.
-
نمایش سلسله مراتبی: Breadcrumb ها ساختار سلسله مراتبی وب سایت را نشان می دهد و به کاربران کمک می کند موقعیت خود را در سایت درک کنند.
-
لینک خانه: مسیر معمولاً با پیوندی به صفحه اصلی شروع می شود و به کاربران امکان می دهد ناوبری را از سطح بالا شروع کنند.
-
ناوبری به عقب: کاربران می توانند با کلیک بر روی پیوندهای موجود در مسیر Breadcrumb در سایت به عقب حرکت کنند.
انواع آرد سوخاری
خرده نان در انواع مختلفی وجود دارد که هر کدام عملکردهای متفاوتی را ارائه می دهند. انواع متداول آرد سوخاری عبارتند از:
تایپ کنید | شرح |
---|---|
بر اساس موقعیت مکانی | مکان کاربر را در سلسله مراتب وب سایت نشان می دهد که اغلب در وب سایت های تجارت الکترونیک استفاده می شود. |
مبتنی بر ویژگی | ویژگی ها یا فیلترهای اعمال شده برای دسته بندی محصول یا نتایج جستجو را نمایش می دهد. |
مبتنی بر مسیر | مسیر واقعی یا URL صفحه را ارائه می دهد که برای زمینه های فنی مفید است. |
مبتنی بر تاریخ | سابقه ناوبری کاربر را ثبت می کند و به آنها اجازه می دهد مراحل خود را دوباره دنبال کنند. |
خرده نان پویا | بر اساس تعاملات کاربر ایجاد شده و با رفتار مرور کاربر سازگار است. |
روش های استفاده از آرد سوخاری:
-
وب سایت های تجارت الکترونیک: Breadcrumbs مسیر روشنی را از صفحه اصلی به محصول مورد نظر در اختیار کاربران قرار می دهد و فرآیند خرید را ساده می کند.
-
ناوبری وبلاگ: در وبلاگ ها و وب سایت های خبری، Breadcrumbs به کاربران کمک می کند تا از یک مقاله خاص به دسته یا صفحه اصلی برگردند.
-
منوهای چند سطحی: Breadcrumbs میتواند به عنوان یک کمک ناوبری تکمیلی برای منوهای کشویی چند سطحی عمل کند و بازگشت به عقب را برای کاربران آسانتر کند.
-
اضافه بار خرده نان: اگر یک وب سایت دارای سطوح تو در تو بیش از حد باشد، مسیر Breadcrumb می تواند بسیار طولانی و به هم ریخته شود. پیادهسازی Breadcrumbهای پویا که فقط مرتبطترین سطوح را نشان میدهند، میتوانند این مشکل را برطرف کنند.
-
پاسخگویی موبایل: در صفحات کوچکتر، نمایش کل دنباله Breadcrumb ممکن است فضای زیادی را اشغال کند. استفاده از تکنیکهای طراحی واکنشگرا، مانند جمع کردن Breadcrumbs در یک منو، میتواند این مشکل را حل کند.
-
نامگذاری متناقض: نامگذاری نادرست یا متناقض دستهها میتواند باعث سردرگمی کاربران شود. اطمینان از برچسب های منسجم و توصیفی برای هر پیوند به کاربران کمک می کند مکان خود را بهتر درک کنند.
مشخصات اصلی و سایر مقایسه ها با اصطلاحات مشابه در قالب جداول و فهرست
مشخصه | پودرهای سوخاری | منوی ناوبری | نقشه سایت |
---|---|---|---|
هدف | مکان کاربر را در سلسله مراتب وب سایت نشان دهید. | فهرستی از پیوندها را برای پیمایش در وب سایت ارائه دهید. | یک نمای کلی از ساختار سایت ارائه دهید. |
عمق | به طور معمول یک مسیر خطی با تعداد محدودی از سطوح را نشان می دهد. | می تواند چندین سطح از سلسله مراتب سایت را نمایش دهد. | کل ساختار وب سایت را نمایش می دهد. |
ارائه | معمولا به صورت افقی نمایش داده می شود. | می تواند عمودی، افقی یا ترکیبی باشد. | معمولاً به صورت یک صفحه نمایش داده می شود. |
مکان در وب سایت | به طور کلی در نزدیکی بالای صفحه قرار می گیرد. | اغلب در هدر یا نوار کناری یافت می شود. | معمولاً از فوتر یا نوار کناری پیوند داده می شود. |
اثر متقابل | هر عنصر قابل کلیک است و ناوبری به عقب را تسهیل می کند. | با کلیک بر روی آیتم های منو به صفحات مربوطه هدایت می شود. | با کلیک بر روی بخش ها معمولاً کاربران به صفحات خاصی هدایت می شوند. |
با پیشرفت تکنولوژی، نقش Breadcrumbs ممکن است برای تطبیق پارادایم های رابط کاربری جدید و رفتارهای مرور تکامل یابد. در اینجا برخی از پیشرفت های احتمالی آینده وجود دارد:
-
نان های آگاه از زمینه: Breadcrumb هایی که بر اساس رفتار کاربر، زمینه و ترجیحات سازگار می شوند، می توانند ناوبری کاربر را بیشتر بهبود بخشند.
-
ادغام با هوش مصنوعی: ادغام هوش مصنوعی می تواند Breadcrumbs را قادر به پیش بینی قصد کاربر و پیشنهاد مسیرهای مربوطه کند.
-
ناوبری مبتنی بر صدا و اشاره: همانطور که تعاملات مبتنی بر صدا و اشاره رایج تر می شود، Breadcrumbs ممکن است نیاز به تطبیق با این روش های ورودی داشته باشد.
چگونه می توان از سرورهای پروکسی استفاده کرد یا با Breadcrumbs مرتبط شد
سرورهای پروکسی را می توان با Breadcrumbs در زمینه خراش دادن وب و استخراج داده ها مرتبط کرد. ارائه دهندگان سرور پروکسی مانند OneProxy می توانند راه حل هایی برای دور زدن مکانیسم های ضد خراش و دسترسی به وب سایت ها با حفظ ناشناس بودن ارائه دهند. Breadcrumbs را می توان همراه با سرورهای پروکسی برای اطمینان از ناوبری یکپارچه در طول فرآیند خراش دادن وب استفاده کرد و به کاربران این امکان را می دهد تا مراحل خود را به دقت دنبال کنند.
لینک های مربوطه
برای اطلاعات بیشتر در مورد Breadcrumbs، می توانید منابع زیر را بررسی کنید: