推荐的实施面包屑的方法


13

我想在网站上实现面包屑,现在我在努力最好地实现它们。

用户可以搜索产品,但也可以导航到产品类别以查找产品。用户可以在产品页面上单击产品类别以查找类似产品。因此,用户使用不同的途径可以访问特定的产品/页面。

我认为实现面包屑有两种选择

选项1: 将所有访问过的页面添加到面包屑。例如:主页>搜索结果>产品1>类别2>产品2劣势:面包屑可能变得很长

选项2: 为每个页面指定特定的固定面包屑,例如:主页>类别1>产品1问题:如何处理多个类别的产品?

您对此有何看法?是否有我忽略的选项3?

Answers:


9

尽管在童话中它们被称为“面包屑”,但面包屑的目的并不是要取代浏览器的历史记录。因此,选项1不是选项。

它们是一种向用户展示他如何找到产品的工具,最重要的是向用户展示如何找到逻辑上放置在找到的产品旁边的其他产品。

所以基本上是选项2。

如果您的产品属于多个类别,则有三个选择:

  • 显示产品的所有可能路径。
  • 显示用户使用产品的路径。(这要求您使用产品类别列表的主键而不是产品ID。)这意味着,用户在搜索时几乎不会获得“搜索>产品”面包屑。
  • 为每种产品指定一个“主要类别”,以确定显示的面包屑(并在其他地方使用,例如,当有购物车并且用户在购物车视图中单击产品时。)

好的,让我们转储选项1,但是您认为在面包屑中显示用户是如何进入产品的,即使是通过搜索,也是一个好主意。例如:首页>搜索结果> product_1,首页> category_1> product_1或首页> category_2> product_1

从我给出的三种可能性中,我没有最爱。这取决于应用程序。如果您没有“主要类别”,并且只希望面包屑中有一条路径,那么显示用户如何使用该产品可能是您的唯一选择。

1

面包屑应该代表您的网站布局,而不是用户访问您网站的方式,这几乎排除了选项1。我不想在亚马逊上看到这个:

Home>Products>Home>PS3 Games>Call of Duty>PS3 Games>Funky Boxer Shorts->Add To Cart

虽然表示我的浏览历史记录和OCD单击,但不代表该网站:)

正如您提到的产品类别一样,我假设您有一个数据库后端。如果您有父类别,那么您就有了可以使用的结构。假设您有一个首页,我们可以在面包屑跟踪中将其称为“主页”。然后,假设您的数据库中的内容安排如下:

table_productCategories
    _pkCategoryID
    _categoryName
    _fkParentCategoryID

让您拥有产品类别树:

Software
    Windows
        Apps
        Games
        Crash-To-Desktop
    Linux
        Servers
        3-Games
Hardware
    Laptops
    PCs
    Missile-Launchers

...然后,每当您访问产品页面时,您都不必担心产品是否属于多个类别,用户可以在那里浏览并使用数据库查询来构建面包屑:

Home > Software > Windows > Games > Aunt Dolly and the Scared Sheep

此外,您将拥有非产品页面。“关于我们”,“联系我们”等。在CMS中,这些页面的内容也位于数据库中并进行了分类。

table_contentCategories
    _pkCategoryID
    _categoryName
    _fkParentCategoryID

...你明白了。这意味着您所有带有内容而不是产品的页面也可以被面包屑:

Home > About > Finding Us in a web of backstreets

您的第一个陈述确实很狭窄。有些人使用基于位置的面包屑来指示您在站点中的位置,而其他人使用基于路径的面包屑来指示用户如何到达他在站点中的位置。我想说后者更符合“面包屑”的概念。您网站的内容是确定哪个更好的重要因素。

同意,也许确实是这样。我主要是指“将当前页面添加到面包屑”建议,该建议将产生我给出的示例输出。

0

我必须不同意大多数答案中面包屑的特征,因为在类别或分类法(从最一般到最具体的类别的嵌套类别层次结构)之间(据我所知)存在差异(例如,产品类别>产品子类别>产品>模型或汽车>轿车>雪佛兰> impala> x5000)以及网站的路径(我不是在说浏览器的历史,而是上下文相关的路径)。

如果要搜索四门轿车,然后找到一个候选列表,然后向下钻取一个或多个,则对您而言,升回到搜索结果返回的列表比提升类别更为重要。您选择的任何产品。(因此,上面的示例可能是“首页>搜索>雪佛兰黑斑羚x5000”,而不是“汽车>轿车>雪佛兰>黑斑羚> x5000”

使用面包屑作为您去过的地方的标记与选择1相似,不同之处在于您不会在末尾无限期地添加面包屑,因为要选择面包屑来追溯您的前进路径(当您拾取面包屑时,所有由于您已在路径中选择了一个特定点并将从那里导航,因此移除了其中的一部分。

如果“面包屑”是此处建议的类别树,为什么将它们称为“面包屑”?我对面包屑的理解是它们是特定于路径的,而不是特定于模型的。


取决于你问谁。(他们实际上列表中选择一个模型那里。)在这一点上,术语基本上只是代表一般的“X> Y> Z”可视化部件,用第二个决定是由实施者作出他们正在使用的实际方法。
Su
By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.