[Pro] How was this done?

The other day I happened to browse this website on an iPhone. I was really impressed with how good the design was on a smartphone and how close it was to the original website in look and feel.

When I browse most mobile specific websites I usually see a mobile extension in the address, such as www.website.m.com or something like that.

How was this one done?


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

nearly not to wrap in words - it’s cool done.

This is another example of responsive design using @media queries on its finest. You ask if this can be done in Freeway?

Yes and no (up to my opinion).

The yes and how?

Deep knowledge in 100% BoxModel (not hybrid), deep knowledge in externalizing stuff***, a good plan on page-design. FW spoken you would design each page (between the breakpoints) as a single page. Each of those pages need a separate style-sheet, those stylesheets are finally called with each defined breakpoint (browser-width) in this case:

*** The no - Externalizing Styles:

These are my 5 cents and therefore not bullet-proofed.
It might be probably easier but Freeway is placing style-elements in 3 different places (inline, head, stylesheet) which may cause unexpected things regarding @media queries.

Cheers

Thomas


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Thomas, we think alike about this. Not a very easy approach for the
dedicated Freewayist. I find that I do a lot of pre-development outside of
Freeway Pro to guide my steps.

I think so much time and effort would be saved if FWP had a tick option for
externalizing ALL the styles. !!! #frustrating


Ernie Simpson

On Tue, Oct 16, 2012 at 10:02 AM, Thomas Kimmich email@hidden wrote:

nearly not to wrap in words - it’s cool done.

This is another example of responsive design using @media queries on its
finest. You ask if this can be done in Freeway?

Yes and no (up to my opinion).

The yes and how?

Deep knowledge in 100% BoxModel (not hybrid), deep knowledge in
externalizing stuff***, a good plan on page-design. FW spoken you would
design each page (between the breakpoints) as a single page. Each of those
pages need a separate style-sheet, those stylesheets are finally called
with each defined breakpoint (browser-width) in this case:

gist:3899434 · GitHub

*** The no - Externalizing Styles:

These are my 5 cents and therefore not bullet-proofed.
It might be probably easier but Freeway is placing style-elements in 3
different places (inline, head, stylesheet) which may cause unexpected
things regarding @media queries.

Cheers

Thomas


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

I think so much time and effort would be saved if FWP had a tick option for externalizing ALL the styles. !!! #frustrating

This is my biggest gripe with FW. I’m hoping v6 will take care of this.


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

The fundamental reason why this didn’t happen in FW5 is that Freeway is built from its very core (laid down in the late '90s) on the page model, rather than the site model. Sites are collections of pages, but each page stands alone during the publish process.

In order to externalize all CSS, there would need to be a central database of unique elements, to ensure that item5 on this page was exactly the same as item5 on that other page. Without that, there could be no notion of class-based styles for elements that share styling attributes, and id-based styles for elements that are globally unique.

This is an extremely difficult thing for a blind robot to get right. For example, you know in your mind that this box over here is the page header, but Freeway cannot guess or divine your intent – it only knows x, y, w, and h. And in order to truly externalize styles,

Freeway would need to publish everything twice. First pass would just create the CSS to define each element on each page. Second pass would go through that collection of styles (one per element per page) optimize for duplicates and partial duplicates, remove local styles and apply class and ID styles to replace them, and finally write out the One Style Sheet To Rule Them All (and in the darkness bind them).

Walter

On Oct 16, 2012, at 12:12 PM, Helveticus wrote:

I think so much time and effort would be saved if FWP had a tick option for externalizing ALL the styles. !!! #frustrating

This is my biggest gripe with FW. I’m hoping v6 will take care of this.


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Walter, as usual you bring a level of depth to our discussions I am quite grateful for, and which actually forces me to think.

So, I’m thinking this: what if it were possible to help Freeway understand our intentions… whether a style is global or page-specific? Maybe a checkbox in a style or HTML item to indicate its intent is global? Maybe a window like the Resources but instead listing ID’s??

Anyway, some of the sparks from whatever wire is loose in my head.

Sent from my iPad

On Oct 16, 2012, at 1:09 PM, Walter Lee Davis email@hidden wrote:

The fundamental reason why this didn’t happen in FW5 is that Freeway is built from its very core (laid down in the late '90s) on the page model, rather than the site model. Sites are collections of pages, but each page stands alone during the publish process.

In order to externalize all CSS, there would need to be a central database of unique elements, to ensure that item5 on this page was exactly the same as item5 on that other page. Without that, there could be no notion of class-based styles for elements that share styling attributes, and id-based styles for elements that are globally unique.

This is an extremely difficult thing for a blind robot to get right. For example, you know in your mind that this box over here is the page header, but Freeway cannot guess or divine your intent – it only knows x, y, w, and h. And in order to truly externalize styles,

Freeway would need to publish everything twice. First pass would just create the CSS to define each element on each page. Second pass would go through that collection of styles (one per element per page) optimize for duplicates and partial duplicates, remove local styles and apply class and ID styles to replace them, and finally write out the One Style Sheet To Rule Them All (and in the darkness bind them).

Walter

On Oct 16, 2012, at 12:12 PM, Helveticus wrote:

I think so much time and effort would be saved if FWP had a tick option for externalizing ALL the styles. !!! #frustrating

This is my biggest gripe with FW. I’m hoping v6 will take care of this.


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

You guys need to be on the Freeway Beta testing teams. :slight_smile:

On Tue, Oct 16, 2012 at 10:59 AM, Ernie Simpson email@hiddenwrote:

Walter, as usual you bring a level of depth to our discussions I am quite
grateful for, and which actually forces me to think.

So, I’m thinking this: what if it were possible to help Freeway understand
our intentions… whether a style is global or page-specific? Maybe a
checkbox in a style or HTML item to indicate its intent is global? Maybe a
window like the Resources but instead listing ID’s??

Anyway, some of the sparks from whatever wire is loose in my head.

Sent from my iPad

On Oct 16, 2012, at 1:09 PM, Walter Lee Davis email@hidden wrote:

The fundamental reason why this didn’t happen in FW5 is that Freeway is
built from its very core (laid down in the late '90s) on the page model,
rather than the site model. Sites are collections of pages, but each page
stands alone during the publish process.

In order to externalize all CSS, there would need to be a central
database of unique elements, to ensure that item5 on this page was exactly
the same as item5 on that other page. Without that, there could be no
notion of class-based styles for elements that share styling attributes,
and id-based styles for elements that are globally unique.

This is an extremely difficult thing for a blind robot to get right. For
example, you know in your mind that this box over here is the page header,
but Freeway cannot guess or divine your intent – it only knows x, y, w,
and h. And in order to truly externalize styles,

Freeway would need to publish everything twice. First pass would just
create the CSS to define each element on each page. Second pass would go
through that collection of styles (one per element per page) optimize for
duplicates and partial duplicates, remove local styles and apply class and
ID styles to replace them, and finally write out the One Style Sheet To
Rule Them All (and in the darkness bind them).

Walter

On Oct 16, 2012, at 12:12 PM, Helveticus wrote:

I think so much time and effort would be saved if FWP had a tick
option for externalizing ALL the styles. !!! #frustrating

This is my biggest gripe with FW. I’m hoping v6 will take care of this.


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

That’s a great idea. My own (which I have been banging the drum for since Freeway 1.1) is Master Items. Think of being able to define an element (anywhere, on any page) as a master item. Then, wherever it appears in the site, it has the same properties as its original. Each instance of that master would be flagged visually, so you could tell it was an instance, similar to how Action items get the little cog icon. You could right-click and edit the master, which would update all of its children everywhere, or you could detach it from its master (making it an unique, stand-alone element) and make local changes to it.

Walter

On Oct 16, 2012, at 1:59 PM, Ernie Simpson wrote:

So, I’m thinking this: what if it were possible to help Freeway understand our intentions… whether a style is global or page-specific? Maybe a checkbox in a style or HTML item to indicate its intent is global? Maybe a window like the Resources but instead listing ID’s??


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Walter, I like the way you’re thinking!


Ernie Simpson

On Tue, Oct 16, 2012 at 2:21 PM, Walter Lee Davis email@hiddenwrote:

That’s a great idea. My own (which I have been banging the drum for since
Freeway 1.1) is Master Items. Think of being able to define an element
(anywhere, on any page) as a master item. Then, wherever it appears in the
site, it has the same properties as its original. Each instance of that
master would be flagged visually, so you could tell it was an instance,
similar to how Action items get the little cog icon. You could right-click
and edit the master, which would update all of its children everywhere, or
you could detach it from its master (making it an unique, stand-alone
element) and make local changes to it.

Walter

On Oct 16, 2012, at 1:59 PM, Ernie Simpson wrote:

So, I’m thinking this: what if it were possible to help Freeway
understand our intentions… whether a style is global or page-specific?
Maybe a checkbox in a style or HTML item to indicate its intent is global?
Maybe a window like the Resources but instead listing ID’s??


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Walt I like your thinking - it’s kinda like php includes that can either sit on a master or a scratch page.

I have found the only way to have some margin of sanity is to plan the site in advance - naming divs and styles. Continually rename divs with logical names and delete those pesky style25, style 26 that FW auto generates.

Marcel


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

AWESOME idea! I sure hope Joe and the Freeway team are reading these posts because having the option to easily do a RWD from within FWP would be a HUGE selling advantage over the competition, including Wordpress and Muse.

On 16 Oct 2012, 6:21 pm, waltd wrote:

That’s a great idea. My own (which I have been banging the drum for since Freeway 1.1) is Master Items. Think of being able to define an element (anywhere, on any page) as a master item. Then, wherever it appears in the site, it has the same properties as its original. Each instance of that master would be flagged visually, so you could tell it was an instance, similar to how Action items get the little cog icon. You could right-click and edit the master, which would update all of its children everywhere, or you could detach it from its master (making it an unique, stand-alone element) and make local changes to it.

Walter


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options