In this lesson we covered the concept of using breadcrumbs as a secondary navigation method for a site:

  • Use breadcrumbs to indicate where a user is and the extent of the site
  • Breadcrumbs are implemented using unordered lists in HTML with custom CSS styling
  • Three types of breadcrumbs exist:
    • location - based on hierarchical structure of site
    • attribute - based on attributes of current page or item
    • path - unique to a user’s journey on the site
  • Path-based breadcrumbs can be confusing, only use if needed
  • Ensure breadcrumbs will add value before adding to a site


Our completed styled breadcrumbs are shown on the right.

Sign up to start coding

By signing up for Codecademy, you agree to Codecademy's Terms of Service & Privacy Policy.
Already have an account?