docs: new landing page design (v2)

[thisisobate]

New landing page design

[thisisobate]

@mowies

[mowies]

@thisisobate please check how you like the new graphics :)
also dark mode definitely still needs some work

[mowies]

mobile version also needs some work still 😅

[nate-double-u]

Couple comments:

1. could we change the text at the top, gradient on gradient is hard to read
2. could we reduce the size of the CNCF logo, and use this one https://github.com/cncf/artwork/blob/main/other/cncf/horizontal/color-whitetext/cncf-color-whitetext.svg

[thisisobate]

could we change the text at the top, gradient on gradient is hard to read

oh yes, @mowies is taking a look at this. please note that this issue only applies to dark theme

[nate-double-u]

Deploy preview

[mowies]

@thisisobate @nate-double-u we made some updates to dark mode, pls have a look one more time. We are happy with it now :)

[mowies]

@thisisobate one more thing on mobile: it would be better to always have the text first and then have the picture below that. right now, it's always picture first, and then text

[sonarcloud]

Quality Gate passed

Issues
0 New issues
0 Accepted issues

Measures
0 Security Hotspots
0.0% Coverage on New Code
0.0% Duplication on New Code

See analysis details on SonarCloud

[nate-double-u]

I'm intrigued by your CI -- does the deploy preview automatically refresh? (I'm not seeing some of the changes that I'd expect to see based on the commits)

[nate-double-u]

(for instance, the CNCF logo still looks like the original one instead of the colour one that Uche updated)

[odubajDT]

(for instance, the CNCF logo still looks like the original one instead of the colour one that Uche updated)

did you try disabling the cache?

[nate-double-u]

I'll try that -- but some things did update 😅

[nate-double-u]

I see the updates now.

I'm not sure about the AI generated images we're introducing. I don't think that they hold to the nautical theme that the project has historically had (I understand potentially wanting to move away from it, but if that's the case we're only partly moving away from it).

• The metrics image doesn't speak to metrics (and I'm not sure i understand the cat being there)
• The deployment checks doesn't really speak to what's happening (it reads more like checking a developer than checking a deployment)

The lighthouse theming and icons on kptn.sh are pretty strong, I'd be hesitant to move away from them.

Could we hold for a more thorough design review before merging this?

[nate-double-u]

/hold for design review
(notes above)

[mowies]

@nate-double-u I'd be glad to have better images! This is the best we could come up with as engineers 😅
If we get some design support and maybe therefore better graphics, I'm all for it!

[StackScribe]

I do like the looks of this! Thanks so much! I guess I don't really understand how the graphic for Metrics and Orchestrate relate to the theme but they are attractive and I, personally, like the cat ;-)

A couple verbage and content-flow questions for your consideration. None of these are show-stoppers:

• For the "Deployment Observability" block:
  • The second bullet is a verb whereas the first and third bullets are nouns. Perhaps reword the second bullet to be "Troubleshooting assistance for failed deployments" but that might be too long. I guess just "Troubleshooting failed deployments" works although it is less precise.
  • Shouldn't these items spell out "OpenTelemetry" rather than using "OTel"? I googled "OTel" and it does eventually get one to the OpenTelemetry page but the first hits are to various hotel booking pages. I'm not sure what the rules are for using the "OTel" string and the cognoscenti will no what we mean but it seems that our landing page should use the official name
• When the user clicks on "Get Started", they go into the "Get started" section of the docs. This makes some sense but it would be better if they read the "Core Concepts piece before they dig into the tutorials -- it kind of paints the big picture of what Keptn can do and all. I see two options:
  • Make "Get Started" link to "Core Concepts". Each subsection of the latter doc links to the "Get started" exercise for that component
  • Add a sentence like the following to the "Get started" landing page: "Before attempting these tutorials, we recommend that you read the "Core Concepts[link]" section
  • Yes, this is outside the scope of this PR. I created Usability improvements to "Get started" landing page #3867 for it
• Under "Learn from the Community", the "Discover More" button takes me to the Keptn youtube channel, which is still kind of a mess. The three videos that I see without scrolling are "Migrating experience from Spinnaker to Keptn", the "Keptn New Contributor" meeting from Sept 11 2023 -- which is the one where Ondrej walks through the process of setting up a development environment so useful but perhaps should be re-titled or at least annotated, and a "Keptn in Google Summer of Code" from April 2022.
  • Yes, the mess that is the youtube channel is beyond the scope of this PR unless we want to curate the videos that get top billing
• Should we have a link to the blogs? Yes, they have a tab in the Documentation so I don't know...

[StackScribe]

A bunch of those WARNINGs in the htmltest log sound ominous... You can search for "WARNING" in the log to see them quickly

[thisisobate]

Hi @StackScribe
I'm actually working on a new design of the website. Will open another PR soon

[mowies]

@thisisobate shall we close this one in the meantime?

[thisisobate]

sure...feel free