Skip to main content

breadcrumb-navigation

Use when reviewing templates, rendered HTML, or shared components related to Implement accessible breadcrumb navigation. Validate the final browser-facing markup, not just the source framework abstraction.

跳到安装

来源信息

仓库
thedaviddias/Front-End-Checklist
最近来源活动
2026年6月9日 20:15
检测到的 SKILL.md 语言
英语
星标
74,218
分支
6,742

安装方式

默认使用会先检查来源的 Prompt;你也可以切换为直接命令,或下载本地副本。

检查来源文件

决定是否安装前,请先阅读 SKILL.md,以及 SkillsMP 当前展示的配套文件。

文件资源管理器
2 个文件

正在显示 SKILL.md

SKILL.md
来源说明 · 只读预览
name
breadcrumb-navigation
description
Use when reviewing templates, rendered HTML, or shared components related to Implement accessible breadcrumb navigation. Validate the final browser-facing markup, not just the source framework abstraction.
metadata
{"category":"html","priority":"medium","difficulty":"beginner","estimatedTime":"15","source":"frontendchecklist.io","url":"https://frontendchecklist.io/en/rules/html/breadcrumb-navigation"}
# Implement accessible breadcrumb navigation Proper breadcrumb markup helps screen reader users understand site hierarchy and their current location, while also improving SEO through structured data. ## Quick Reference - Use nav element with aria-label='Breadcrumb' - Use ordered list (ol) for semantic structure - Mark current page with aria-current='page' - Keep any structured data aligned with the visible breadcrumb trail ## Check Verify breadcrumbs use nav element with aria-label, ordered list markup, and aria-current for the current page. ## Fix Implement breadcrumbs using semantic nav, ol/li structure, and proper ARIA attributes including aria-current='page'. ## Explain Explain how properly marked up breadcrumbs improve navigation, SEO, and screen reader accessibility. ## Code Review Review templates, server-rendered HTML, and shared components that output markup related to Implement accessible breadcrumb navigation. Flag exact elements, attributes, and routes where the rendered HTML violates the rule. --- For full implementation details, code examples, and framework-specific guidance, see `references/rule.md`. Rule page: https://frontendchecklist.io/en/rules/html/breadcrumb-navigation
在 GitHub 查看