What I learned is that the web is not a book and trying to use real life ideas in webdesign doesn't always work out.
There's an arrow to go back, but some funny page-curl-click thing to go forward. Oh, and a button to open the book.
Took me a while to figure out the page curl thing. The first time, I got it to change by randomly clicking everywhere. Even worse was that it follows you for a while, then gives up, making you think you're doing something wrong.
All canonical ways of page navigation work. There are large forward and backward buttons, the arrow keys work and the page curl is just an added gimmick. You don’t need to use it. I clicked through the whole book without ever noticing the page curl. Did only you have that problem or your upvoters, too? I would think that would be very strange because this book seems to to work exactly like all other such page navigation interfaces on the web.
If you want page navigation this is the way to do it.
I'm aware of three canonical ways of page navigation: scrolling, page down, space bar.
None of those work.
I agree that the interface was intuitive and at no point did I have any actual difficulty using it, but I'm not exactly impressed with a page that takes a lot of text and then crams it into two columns (WTF? whose bright idea was that?) in a tiny box with bad fonts surrounded by a vast sea of grey and then makes me have to click to advance to the next post-it sized page.
Agreed. The problem with page-curl in this case is that the left-hand-side of the book is a blank page. This means that when you're "curling" the page, you don't see a a bunch of text/images mid-transformation (mid "curl"). Also, there is no transparency at all to the "paper" - it's totally opaque. If it were semi-transparent, you would see the other side of the page bleeding through, giving some context/reality to the curling.
I agree with you. Moreover, by creating one's own UI, something other will break. For example, I can't close my Better HN for Chrome extension on this page, because the upper bar (with search box) over-drawn the upper part of the extension window (which normal website don't do).
It looks beautiful and everything, but still, please don't do things this way - don't mess with browser nagivation. That I think should be the first thing one should learn about browsers & the web.
You may not like the idea of the book or the approach, but the site is executed with amazing detail. From the design to the animations, to the use of local storage to work offline, remembering which pages you have visited, window.history, the graphical search auto-complete and all the other little details.
At first I was incredibly surprised that Google made this, since it a) looks beautiful b) uses jQuery and c) the UI is darn good - but then I viewed the source and saw this:
20 Things I Learned About Browsers and the Web
Built by Fi (www.f-i.com) for the Google Chrome Team.
Design-by-committee (or by data) would never have built this. This is why I know there would never be a place for me at Google, even though I don't consider myself a designer.
The extensive use of HTML5 is great and all, but including font files in your cache manifest (http://www.20thingsilearned.com/cache.manifest) seems like an inappropriate use of the offline cache (better fit for normal caching), unless you're absolutely sure the user doesn't already have the font installed (e.g. custom font made just for the app).
Works terribly on my droid. As I scroll that bar that is meant to sit at the bottom of the page is right in the middle, obscuring the text in the book.
> This illustrated book was designed for HTML5-compliant browsers and will not work with your current browser.
I wonder which HTML5 feature isn't supported in Opera that warrants complete degradation of page to non-JS version (Opera is not served <script>TT.initialize()</script>).
Arg! Safari on windows... the only thing I can get to beside the front cover is the credit page no matter what I try... I guess the 21st thing I learned is when people are too clever with their web interface, it usually mean I'll have to try in a few browsers or give up.
The question is whether prompting users for whether the site should be allowed to store stuff does anything. You have no idea why it wants to store data, or how much. So it's basically just a security thing, but how would you evaluate that? Usually people would look at the domain name I guess, but "20thingsilearned.com" is no more legit than "twentythingsilearned.com".
Does anyone know how the page avoids a refresh while changing the location url? it changes the path, and not just a hash. i thought all path changes demanded a page refresh.
Nope, it doesn't change path. Path changes are after the hash. Although when you hover over the arrow pointing to the next page it shows different path, it's probably for browsers with JavaScript disabled. Clicking this link is also intercepted by JavaScript.
EDIT: sorry, it actually does change the path on Chrome. It doesn't on Firefox.
I was dubious about the link from the "X things about Y" style of title, but left as soon it looked like a more stylish version of a Web slide show. I hate slide shows; if a site doesn't offer an obvious "all slides on one page" option, I'm out of there.
(Edit: Yes, there is a TOC link, but that page also evoked a tc;dc response.)
So, you clicked 'back', and it took you back to the last page you viewed. And that's unexpected behaviour?
I would theorise that the only reason you expected the back button to return you to HN was that your expectations have been poisoned by having to deal with the broken behaviour of sites like this made in Flash rather than HTML5.
>So, you clicked 'back', and it took you back to the last page you viewed. And that's unexpected behaviour?
Well, the site is basically a few pages of content split into an endless number of excruciatingly tiny chunks. Each 'page' is really a paragraph (and doesn't actually entail a page load) - nrmally I'd expect 'back' to take me back an entire page, rather than a single paragraph.
If you're going to use ajax to slice pages into tiny sections, it's far more usable if you then make the back button act as if you hadn't done such a stupid thing in the first place.
Like it or not, that's the reality. Most people's expectations of what "back" does are influenced by their years of experience with Flash and other plugin-based content.
And how is that different than browsing any other website on the internet? Each page needed a permalink so that you could instantly show a specific page to a friend.
Again I ask, how is this breaking your back button? Or are you just trying to imagine something to complain about?
There's an arrow to go back, but some funny page-curl-click thing to go forward. Oh, and a button to open the book.
Took me a while to figure out the page curl thing. The first time, I got it to change by randomly clicking everywhere. Even worse was that it follows you for a while, then gives up, making you think you're doing something wrong.