honojs / website

Repository for hono.dev
https://hono.dev
68 stars 205 forks source link

Updating Options #403

Open NicoPlyley opened 1 week ago

NicoPlyley commented 1 week ago

Hi @yusukebe,

I wanted to discuss updating how options are displayed on the site. Currently, they are just a list that looks a little crowded.

I am proposing to update it to be table-based.

Screenshot 2024-06-18 at 3 32 45 PM

I think the table option is easier to understand and makes the docs look cleaner. However, on mobile, this means the table would be scrollable and not displayed in full like it is now.

Screenshot 2024-06-18 at 3 33 13 PM

I don't think it is a huge issue since it's still readable with a scroll, which is an overflow scroll, it does not affect the horizontal width of the window. And I would think the majority of users are using a desktop device to read the documentation.

Based on what you think or if you want to try it yourself, I will submit a PR. Lastly, should we open a discussion for the website and ideas? All previous conversations are in an issue on the Hono repo

yusukebe commented 1 week ago

Hi @NicoPlyley

I also thought the list style was not good since it's as crowded as you said. The table-based you suggested is good. I think we don't have to care for mobile viewers. The following is a screenshot of Google Analytics for hono.dev website:

CleanShot 2024-06-19 at 12 46 33@2x

The mobile is not a lot.

Based on what you think or if you want to try it yourself, I will submit a PR.

Please! This will be a huge contribution.

Lastly, should we open a discussion for the website and ideas?

I think we don't have to open it now. If others write down too many ideas, we can't handle them though we should not accept all things. Right now, I think only you, me, and @goisaki can come up with ideas.

ryuapp commented 1 week ago

I don't agree with making it table-based.

The mobile is not a lot.

Mobile users are 25% of the total, which is not a lot, but it's not a small number. And even on the desktop, do we maximize the window to view documents? When we look at documents, we may have code editor and its app open at the same time. It would be even harder to see if we were using a laptop.

Also, as far as I know, I don't know much about a documentation for APIs that are table-based, so I'd like to ask if you have any good examples.

Could this be improved by simply adjusting the existing design? image

yusukebe commented 1 week ago

@ryuapp

Thank you for your opinion! I'll comment later.

NicoPlyley commented 1 week ago

@ryuapp To clarify, it will work on mobile. On smaller screens like an iPhone SE you do have to scroll horizontally. Like shown in my example. I and still believe it is readable. On larger displays like an iPhone Pro Max you don't have to scroll (depending on how many columns). There are some tables on the site now you can see on the first page of the docs for who is using Hono.

But I do also like how you presented using pills instead. I feel both options would add improvement.

yusukebe commented 5 days ago

Could this be improved by simply adjusting the existing design?

I love the design @ryuapp suggested. @ryuapp or @NicoPlyley, can you work on it?

NicoPlyley commented 4 days ago

Great, I do like how that one looked as well! I will add it to my to-do list. @ryuapp, if you do start it, please let me know