--- title: "Website redesign: clearer layout, easier navigation, better content, and much more!" layout: post introduction: "A brand new look" color: "star" name: "Website redesign" icon: "star" --- The Bulma website has been widely redesigned! There's been a lot of work, to say the least:
files
diff
Just see for yourself!

Before

v7 website

After

v7 website
{% include elements/anchor.html name="Navbar" %} The **navbar** has been updated with a lighter markup and cleaner design:
navbar
This doesn't affect the current navbars. There's actually a new modifier called `is-spaced` that was created for this new navbar. Documentation coming soon! {% include elements/anchor.html name="Customize example" %} On the homepage, there's a new [**customization** section with a live example](/#customize):
customize
{% include elements/anchor.html name="Breadcrumb" %}
breadcrumb
A **breadcrumb** is now visible at the top of each page, to easily navigate up and down the hierarchy. This has led to the creation of new **intermediate pages**: * [documentation](/documentation) * [documentation/modifiers](/documentation/modifiers) * [documentation/columns](/documentation/columns) * [documentation/layout](/documentation/layout) * [documentation/form](/documentation/form) * [documentation/elements](/documentation/elements) * [documentation/components](/documentation/components) * [more](/more) {% include elements/anchor.html name="Links" %} These intermediate pages have new **link boxes** that help dive into each sub-category:
footer links
{% include elements/anchor.html name="Previous/Next" %} Next to the breadcrumb, you can easily navigate to the **sibling** pages with the **previous** and **next** links:
prevnext buttons
These links are also available at the bottom:
prevnextbis buttons
{% include elements/anchor.html name="Categories" %} There's a new **sidebar** including a navigation menu with all the categories and sub-categories:
categories menu
{% include elements/anchor.html name="Scroll spy" %} On some pages below the categories, you'll find a new menu called "On this page" which is actually a **scroll spy**:
scrollspy menu
{% include elements/anchor.html name="Footer" %} The footer has been redesigned as well. Among other things, there's a **sitemap** available:
footer links
{% include elements/anchor.html name="Code" %} The Bulma website is built with **Jekyll**. In the process of this redesign, the underlying code that helps maintain this website has been optimized and cleaned up as well. This well help further updates to be easier.