[arttor]

Website redesign

What changed

• New look for the homepage, support, 404 and 500 pages, plus a new FAQ page.
• Light / dark theme. It follows the system setting until the visitor picks one with the toggle in the header.
• New stylesheet css/site.scss. The old css/main.scss and css/docs.scss are unchanged, because the old versioned docs on gh-pages still use them.
• Live stats. GitHub stars, the latest release, release count, image pulls and contributor avatars now update automatically.
• Removed: css/index.scss, css/error-code.scss and the images that are no longer used.

Live stats

The numbers are fetched at build time, not in the visitor's browser, so the site stays plain static HTML.

• Where the data comes from: the GitHub API (stars, releases, contributors of rook/rook) and the Docker Hub API (pulls of rook/ceph). The latest release is the highest stable vX.Y.Z, so a patch to an older branch never shows as the newest.
• How the site is updated: CI runs scripts/fetch-stats.py before make publish, on every merge and once a day. A new gh-pages commit is made only when something changed.
• If something fails: the script never fails the build. Any value it can't fetch falls back to _data/stats.yml and the committed avatars in images/contributors/. Local builds use those fallbacks too, unless you run the script first.
• What is set by hand: the contributors count (3,800+), taken from the "Contributors" row of CNCF DevStats (last decade, bots excluded). It lives in _data/stats.yml.

Makefile

make run and make build now use the official ruby:3.1 image instead of jekyll/jekyll:4.2.2, which was amd64-only and is no longer maintained, so they work on both Intel and Apple Silicon.

[travisn]

Great to see the redesign, thanks! There is a lot of useful content that is nice to see at a glance. Here are just a few minor thoughts to consider:

1. The "See Who Runs Rook in Production" is not currently very useful since it just links to a stale Adopters page. How about if we move that after other content near the bottom of the page? After we collect more details, then we could move it higher.
2. The "How it works" section always seems to be dark mode, which seems odd while everything else is in light mode.
3. Contributors section: Perhaps it should be later on the page after more content? Maybe it's better near the "Join the community" section?
4. The demo also needs to install csi-operator.yaml (this is needed independent from the website design, but perhaps simple enough just to keep it in this PR at the same time)
5. Under erasure coding guide, I would remove the string "half the disks", since it really depends on the EC params. The statement "Cut raw capacity" seems enough explanation for that link.

[arttor]

• The "See Who Runs Rook in Production" is not currently very useful since it just links to a stale Adopters page. How about if we move that after other content near the bottom of the page? After we collect more details, then we could move it higher.

Agree

• The "How it works" section always seems to be dark mode, which seems odd while everything else is in light mode.

this is by design. code snippets looks better on dark background and outlining different sections make the page less boring. maybe we can change this secion for dark mode?

• Contributors section: Perhaps it should be later on the page after more content? Maybe it's better near the "Join the community" section?

sure, i can move but my idea was having "contributors wall" as a part of social proof where we demonstrate usage numbers (releases, pulls, contributors)

• The demo also needs to install csi-operator.yaml (this is needed independent from the website design, but perhaps simple enough just to keep it in this PR at the same time)

Will fix

• Under erasure coding guide, I would remove the string "half the disks", since it really depends on the EC params. The statement "Cut raw capacity" seems enough explanation for that link.

i think that statement is correct. And the goal of EC is to save the space, so most of the customers can compare 3 replicaiton with 4+2 and see x2 improvement in disk usage.

[travisn]

• The "How it works" section always seems to be dark mode, which seems odd while everything else is in light mode.

this is by design. code snippets looks better on dark background and outlining different sections make the page less boring. maybe we can change this secion for dark mode?

In light mode, could only the code snippet have a dark background?

• Contributors section: Perhaps it should be later on the page after more content? Maybe it's better near the "Join the community" section?

sure, i can move but my idea was having "contributors wall" as a part of social proof where we demonstrate usage numbers (releases, pulls, contributors)

Sounds good to keep the contributors wall with the usage numbers. At a glance, I feel like it looks like the end of the page and I wouldn't think to scroll down for more content. While this is very interesting info, perhaps it just should be later on the page after the other content.

• Under erasure coding guide, I would remove the string "half the disks", since it really depends on the EC params. The statement "Cut raw capacity" seems enough explanation for that link.

i think that statement is correct. And the goal of EC is to save the space, so most of the customers can compare 3 replicaiton with 4+2 and see x2 improvement in disk usage.

How about if we change the wording like this? It will sound bigger and better, instead of smaller.
"Increase raw capacity with erasure coding"
"Same protection as three copies, twice the capacity"

[arttor]

@travisn i adressed all points:

• fixed background for code examples
• fixed wording for erasure
• moved numbers and contributors to the bottom
• added csi operator.

can you please check again.

but i highly recommed to put numbers and contributores to the old place before quickstart. i was following this guide for landing page https://www.julian.com/guide/startup/landing-pages and it says that "social proof" should go after "hero" secion.

i personally find this guide pretty useful

[travisn]

The changes look great.

but i highly recommed to put numbers and contributores to the old place before quickstart. i was following this guide for landing page https://www.julian.com/guide/startup/landing-pages and it says that "social proof" should go after "hero" secion.

Ok, let's move it up again. What about something like this?

• Add a new first tab "Community" in the menu with "How it works, Why Rook, ..."
• Below the menu, add the numbers and contributors
• Also consider moving the Join the Community section up with the contributors

This way, the menu is immediately visible so they can easily see where to jump to, and they will also immediately see the stats and contributors without scrolling.

[arttor]

updated

[travisn]

Looking great! Just some final suggestions on the menu. How about this menu?
Stats How it works Why Rook Storage interfaces Data protection Guides Community FAQ

Related changes:

• The stats and contributors would be considered in the Stats section
• The FAQ would be the last section (at least it seems more logical to me after the community section)
• The "Community" tab should correspond to the "Join the Community" section.

Thoughts?

[arttor]

Looking great! Just some final suggestions on the menu. How about this menu? Stats How it works Why Rook Storage interfaces Data protection Guides Community FAQ

Related changes:

• The stats and contributors would be considered in the Stats section
• The FAQ would be the last section (at least it seems more logical to me after the community section)
• The "Community" tab should correspond to the "Join the Community" section.

Thoughts?

agree. fixed.

[travisn]

LGTM! Anything else you are working on before merging?