okfn / sphinx-theme-okfn

Standard Open Knowledge Foundation sphinx theme resembling that on http://okfn.org/
12 stars 7 forks source link

UI discussion #19

Closed teleyinex closed 11 years ago

teleyinex commented 12 years ago

Hi there,

I've been playing a bit with your theme and I like it, but it has something that it is a bit "strange" to me: the index bar in the right side of the page.

I'm really used to have that bar in the left side (i.e. doxygen style, the Apple style, Twitter Bootstrap or the Android one) and as we read from left to right, I find really counter intuitive to look in the right side of my screen to find some information. Furthermore, in document viewers like Adobe Acrobat Reader, indexes are always in the left side.

Therefore here is my question before adopting this theme: did you decide to move the bar to the right because it looks much nicer on the screens (a "design decision") or because actually moving it to the right improves the reading experience?

I also found a bit confusing some other elements regarding the structure and differentiation of sections within the docs. I've taken two screenshots just to compare the official RTD theme and okfn one. IMHO the official RTD theme looks much cleaner and easy to read than the okfn one.

alt layouts

We can try to fix those issues for the okfn theme, what do you think?

In any case, I think this is just a personal taste, but I would recommend to use the same layout that other popular frameworks or companies use like Apple or Google so new people or new developers will not find it "strange" as I do :-)

I think that it is even possible to override the okfn theme to move the bar to the left side, right? Another option that may be worthy to try is to use the scrollspy feature from Bootstrap and move the index to the nav bar (which is actually always visible) so actually when you scroll down the bar, it updates itself "automagically".

Moreover as a user you will have access to the full index in a really nice place: the top bar. This could be less intrusive (again, a personal taste) and give more space to the real documentation (this is similar to the approach taken by Canonical for their user guides) (they even have a breadcrumb which I find usually really useful, this is really recommended by Krug in his book Don't make me think).

In summary, I'm a big fan of Bootstrap, but to my mind, I prefer the default RTD or Nature theme as they are because the reading experience to me is much easier. On the other hand, I like a lot the topbar from Bootstrap, so what do you think about working on those minor things like the notes, sections, font sizes, line spacing, etc. so they are on par with the default themes of Sphinx?

rufuspollock commented 11 years ago

@teleyinex i've done a bunch of work to fix some of this that should land now.

I have not changed sidebar location. Main reason had been that it improves reading experience in that you focus on the text which is on right. We could probably make sidebar location configuration though that would take a little bit of work.

I would also like the index in the top bar but that can be challenging with a lot of items. Some thoughts:

Lastly, regarding breadcrumbs: really like the idea - how do we implement?

teleyinex commented 11 years ago

Hi there,

I've tested it right now, and this new version is much cleaner! Congratulations!!!!

Comments :-)

1.- I'm still finding strange the index on the right side, as I said, I'm so used to have it in the left side that I find it really strange. I think I can tweak this without too many problems, right? 2.- I see that you use some JS in theme (jQuery, doctools, etc.) so, one question: would be possible to use the Bootstrap.js to enable the affix plugin? That could solve our problems of having everything on the top bar, and it will be more intuitive: it will provide for us the breadcrumb directly in the left/right bar and it will autoupdate itself when you are scrolling down the page, giving you direct access to the index on that page and letting you know what section you are reading.

What do you think?

PS: When I was checking the bootstrap page, I realized that they also have the sidebar in the left :-)

rufuspollock commented 11 years ago

Re sidebar: if you can make this a config option that would be brilliant.

Re bootstrap JS: I actually looked into this. It's tough but not impossible due to fact that sphinx 1.1 uses jquery 1.4 and bootstrap requires jquery >= 1.7 (cf #8)

teleyinex commented 11 years ago

Aha!!! so the problem is sphinx :-) Well, I will look into the sidebar option, ok?

rufuspollock commented 11 years ago

FIXED. @teleyinex everything is now done including LHS sidebar except for bootstrap.js which is a separate issue #27