W3C home > Mailing lists > Public > www-style@w3.org > July 2014

Re: [css-figures][css-multicol][css-overflow] Ten CSS One-Liners to Replace Native Apps

From: Bobby Mozumder <mozumder@futureclaw.com>
Date: Fri, 25 Jul 2014 15:40:47 -0400
Cc: HŚkon Wium Lie <howcome@opera.com>, "<www-style@w3.org>" <www-style@w3.org>
Message-Id: <A637A14F-2A64-4ABB-AAC2-DE49C57F2BFE@futureclaw.com>
To: Sylvain Galineau <galineau@adobe.com>

On Jul 24, 2014, at 10:27 AM, Sylvain Galineau <galineau@adobe.com> wrote:

> 
> On Jul 24, 2014, at 4:58 AM, HŚkon Wium Lie <howcome@opera.com> wrote:
>> 
>> 
>> In my mind, the page has been the unit. So, when the user goes "next"
>> (by tapping, or making a swiping gesture, perhaps), the current page
>> disappears and a new page appears (perhaps with some stylable page
>> transition in between). However, there are situations when it makes
>> sense to page/scroll/pan smaller unites. You mention images: if the
>> screen is wide enough to show two images, it would make sense to
>> page/scroll/pan half a screenful. Likewise, if an e-book uses two
>> columns to display some text, it would make sense to page/scroll/pan
>> one column at a time.
> 
> Yes. Ultimately, the author needs control as to how much goes into a page.
> (And that page may not be full screen)
> 

Manually inserted breakpoints in the content should be used to determine page breaks. It really isnít optimal when auto-generated, since authors tend to group content into pages/spreads/sections anyways.  Auto-breaking only works for single flows of text, like a book. In a magazine layout, some pages might overflow vertically before going over the the next page, which is fine.

Also the pages need their own templates.  Itís not enough to just flow content over to the next page.  Each page likely would have itís own margins/headers/footers/column layouts/logos/page #/section#, etc.  Magazine layouts donít like having their page layouts repeated, it becomes boring and tedious.

For example, the initial page might need a unique template with lots of white space around lead paragraph and a cover photo before breaking to the next page.  

The 2nd/3rd/etc.. pages might have be just a full width multicolumn text, with smaller top margin and footer logos.  

The final page might need itís own template as well, with a big lower margin and separate appendix.

There might be intermediate photo spreads, some full bleed, some with margins.

I do fully support paged layouts, with swipe-left/right. While scrolling is great for short text, paged media works better for long-form articles. It also works great for photo galleries, which is why you see a lot of photographer portfolio websites use horizontal scrolling, as thereís a natural tendency to scan horizontally.

But it wonít work without more layout control.  I really think something like the new <TEMPLATE> tag should be used to define page templates for overflow:paged.  This would be similar to inDesignís page templates, and having the browser add these pages as needed when content overflows.

Meanwhile, I have an example design based on inline-blocks, instead of overflow: paged-x.  There are also lots of real-world example magazine layouts to peruse on issuu.com, as well as creative page layouts on polyvore.com.

Thanks for your time!

-bobby
---
Bobby Mozumder
Editor-in-Chief
FutureClaw Magazine
mozumder@futureclaw.com
1-240-745-5287
www.futureclaw.com
www.twitter.com/futureclaw
Received on Friday, 25 July 2014 19:41:24 UTC

This archive was generated by hypermail 2.3.1 : Monday, 2 May 2016 14:39:23 UTC