Opera Proposes Switching Browser Scrolling For 'Pages'

Barence writes "Opera has proposed a new browsing system that swaps scrolling on websites for flippable pages. The Norwegian browser maker is looking to remove the side scroll bar for documents or articles in favor of 'pages' of a set-size, similar to an ebook. Text can be reflowed into a column layout, and ads will be moved into the right spot in the text, with different ones displayed depending on the orientation of the device. Pages are flipped with gestures on tablets or with mouse clicks on the desktop. It's an 'opportunity to rethink the ads on the web and the user interface,' said Hakon Wium Lie, Opera's CTO." Their main focus for this is browsing on tablets.

Comments

Re:Crappy websites already do this

[TechLA]

Note that they aren't proposing replacing scroll bars, they're proposing adding "pages" as CSS element. They also say this lets user decide if they want to have pages (great for tablets) or the old style scroll bars.

Frankly, I think their idea is great, especially considering how many news sites have switched to using pages made with actual different pages. What Opera is proposing would fix that and would let you choose what style you want, directly in your browser. Personally I enjoy pages if the content is long, but I know many here on Slashdot like to read the print version just because it doesn't have paging.

As Opera's focus with this seems to be tablets, it also makes lots of sense. It actually sucks trying to scroll the web browser with your finger. It works better with a mouse and mousewheel, but tablets would be greatly improved if the browser could do the paging itself and show exactly the amount of content that fits the screen. With a single tap you could go to next "page".

This way everyone would be happy, but with tablets and computers, because it actually allows the user choose their preferred way.

jQuery Mobile

[bigsexyjoe]

Wium Lie noted it takes “enormous amounts of JavaScript to achieve what is a reasonable experience but we believe we can make it better with native support for pages”. -And that enormous amount of JavaScript is called jQueryMobile. In jQuery Mobile, pages are div's with the data-role=page. From there you, can use HTML5 media queries to calculate your page. To be fair, RC1 just came out like two weeks ago, so it's understandable if this info didn't come to them.

Seeking to the next line

[tepples]

Open any plain HTML page and resize the window. Developers have been intentionally overriding this so their page looks the same on every device, whether it has a width of 200 px or 1920 px (methinks most didn't think that one through). I'm not quite sure why this is the favored approach

If lines are more than about 30 ems (60 to 70 characters) wide, it becomes harder for the eye to seek from the end of one line to the start of the next line without skipping a line or rereading a line. That's why so many sites put things like max-width: 30em on an article.

but I suppose it might be because people like to make webpages like magazine pages, where everything is statically positioned, rather than coming up with something that looks good on a variety of browsers, screens, font and color settings.

On a device with a very small screen and a slow, expensive connection, such as a smartphone using EDGE or 3G, your documents are more usable if you transmit and show smaller chunks of information at once. On a device with a very small screen and a slow, expensive connection, such as a desktop or laptop PC using a high-speed wired connection, your documents are more usable if you transmit and show larger chunks of information at once. CSS can help with the "show" but not with the "transmit".

Re:Crappy websites already do this

[IANAAC]

I could mess around with ad-blockers and flash blockers etc, but frankly it just ain't that big a deal to me.

I'll offer up my own experience with ads. I've used some form of Linux and Firefox to browse websites for a few years now almost exclusively. When My last netbook died, I went out and bought another with W7 installed. I decided to just try W7 and IE for a couple days as it was installed - no ad blockers.

I have to say, it was an absolutely horrible experience. The ads weren't flashy/blinky as I had remembered them from long ago, but they were really distracting, interspersed throughout any web page I was viewing. I probably wouldn't have had such a problem with the ads had they been either consistently at the top or bottom of the page, or along the side where they wouldn't get in the way. Unfortunately, that's not how most websites are designed.

Once you've gotten used to not seeing obnoxiousness on a web page, it's really hard to accept it again. I've shown a few people how to add an ad blocker to their web browser and I've never heard a single complaint from any of them regarding any missing ads. On the other hand, I have heard complaints from some of these people regarding ads on their work computers after experiencing no ads on their home computers.

Re:Sounds interesting

[dgatwood]

Speaking as someone who has spent countless hours writing custom LaTeX macros, bulletproof is exactly the opposite of the word I'd use for LaTeX. As soon as you stray very far at all from academic papers, it suddenly becomes just about the most fragile piece of code I've ever worked with. It's great as long as you never have to do anything custom. As soon as you say the words, "I know. I'll write a custom macro to [...]," you've just crossed the line into despair territory.

To put it in perspective, my novel formatting code is 1545 lines, about half of which are insanely complex TeX macros, versus under 500 lines of CSS that does about 90% of the same stuff (minus the crop marks and page margin bits).

In fact, given what modern browsers are capable of in terms of typesetting, I'd imagine it would be just a few thousand lines of JavaScript to produce a much more fully capable typesetting engine than all of LaTeX put together, but with a lot fewer limitations. For example:

• It took 28 lines of LaTeX code to emulate the interaction between the CSS min-width and width properties on a div. (The min-height property, by contrast, took only one line of TeX, which may explain why I found a dozen sites that explained min-height, but no ready-made solutions for min-width.)
• LaTeX is really, really bad at math. You have to know how to write your own macros just to subtract one length from another. I'd estimate 75% of the macros I've written have required getting the floating point package involved, which is just a royal pain.
• There are three different ways to center. Not all of them ignore the first paragraph indent like you'd expect. So if you're wondering why your centered text is shifted off to the right....
• LaTeX mixes code (macros) with text freely (without any delimiters), which means it is often difficult to write macros that are easily readable without adding extraneous whitespace in the output.
• LaTeX doesn't have any real notion of floating content on its own, so if you add a drop cap and the paragraph in one chapter happens to be only a single line long, you get to fix it by hand or write some insane code using the FP package calculating the vertical distance between the drop cap marker and the first line of the next paragraph to see if it is greater than one line long. That's almost a hundred lines of code right there, versus something like three lines of CSS.
• LaTeX really doesn't have a very good way to say that the end-of-section marker must be on the same page as at least two lines of the previous paragraph, but that it need not be on the same page as the entire paragraph. In HTML, it's just style="page-break-before: never;" and you're done.
• There seem to be a thousand different ways to tweak page margins, none of which are universally compatible with various other packages (headers, footers, and other stuff done during the AddToShipoutPicture phase, in particular, if memory serves).
• The user community has all sorts of hacks to work around various aspects of LaTeX's design, but these often interact in strange and almost inexplicable ways when you combine them. What makes this particularly problematic is that most of the maintained macro packages aren't much better in this regard. This is actually fairly fundamental in the design; macros are inherently much harder to write than normal procedural code that operates on attributed data like the DOM.
• There's something fundamentally bizarre about a typesetter that doesn't know where it just put content, forcing you to add a bookmark and write it into a file, then find out the value on the next pass. Compared with the JavaScript DOM, that's amazingly clumsy.
• God help you if you want to do something simple like programmatically redefine boldface to a squiggly underline in a way that is actually robust. In particular, I had endless trouble with the interaction of uwave and/or textbf and other macros causing all sorts of errors whose explanations had absolutely nothi

Re:Sounds interesting

[kiwix]

In fact, given what modern browsers are capable of in terms of typesetting

What browser are you using?

My browser doesn't do hyphenation or ligatures, the kerning is probably rather bad, and I don't think that the line breaking algorithm is as good as the one in TeX. Moreover, there is no reasonable way to set the line length (half of the websites use a very small column, and the other half use the full window width which is generally too wide), and making a table of content is a pain in the ass.

And to answer a specific claims:

LaTeX really doesn't have a very good way to say that the end-of-section marker must be on the same page as at least two lines of the previous paragraph

I't called a widow, and you can prevent them with \widowpenalty=10000. By default, they are only discouraged because sometimes they look less ugly that the other alternatives.