[Pro] FWP 6 and External Stylesheets?

Freeway
1

I just tried converting a FWP 5.5 document to 6.0 and I’ve already run into a bit of a problem. Has FWP 6.0 changed the way it handles external stylesheets? I just noticed that my newly published FWP 6 site has an external stylesheet for every page in my website. I don’t recall that being the case before.

Unfortunately, the site I’m working on is Perch enabled and FWP 6.0 has written over an existing Perch style sheet that was similarly named. Basically I have a gallery page and Perch uses a gallery css, which means my page no longer functions as designed. :frowning:

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

2

I just did some tests to confirm this. Not sure what’s going on, but when I selected Output External Stylesheets in FWP 5.5 I got one .css file for the entire FWP document.

With FWP 6.01 I get 38. What the heck.

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

3

That sounds about right, FW6 does that because it needs to put the DIV styles anywhere. As you can see, all styles from the objects are now moved to stylesheets.

It works, but it creates a total mess, I hate this behavior, and I think there must be a better way to do this. It’s fucked up really. I got a site representing hundreds of pages already … no way in hell I ever gonna work on that one in FW6. Even though the structure of the site and pages is rock solid.

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

4

That seems like a pretty significant structural change. Why would softpress do that?

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

5

I just checked my document in FWP 6 and each page has the master css stylesheet selected, yet FWP 6 still outputs individual stylesheets. Here are my page settings in the Inspector:

[x] Use Master Content
[ ] Use Master Settings
[x] Use Master Actions (grayed out)
[ ] Use Master Children

Why is this happening?

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

6

I also noticed that FWP 6 added a style entitled, “sheet” to the Edit Styles list. I wonder what happens if I simply delete that. :slight_smile:

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

7

On 11 Feb 2013, 10:43 pm, RavenManiac wrote:

I also noticed that FWP 6 added a style entitled, “sheet” to the Edit Styles list. I wonder what happens if I simply delete that. :slight_smile:

Nothing. That’s what happens. FWP 6 still publishes and uploads a css stylesheet for each page.

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

8

Why why why - I was hoping to see FW6 address all the CSS issues we have been begging for. This version of of FW is more like v5.8 and not.v6.0

FW is still a great tool but I’m no longer a fan-boy.

Marcel

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

9

The reason why it does this is because it uses ID-based styles to carry the positioning information, but it also recycles IDs from page to page. If two different pages had elements with the same ID but different geometry, then one of them would be wrong.

Each master page gets a sheet, and any element that is sourced from a master page will get a listing on that sheet, and will not be listed on that page’s instance sheet.

The only solution I can think of to this would be for Freeway to enforce site-unique IDs – no elements are allowed to have the same ID from one page to another unless they refer to master elements.

Walter

On Feb 11, 2013, at 7:42 PM, Helveticus wrote:

Why why why - I was hoping to see FW6 address all the CSS issues we have been begging for. This version of of FW is more like v5.8 and not.v6.0

FW is still a great tool but I’m no longer a fan-boy.

Marcel

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

10

Walter, thanks for the post but I’m not sure I’m following you. Are you saying that every single item placed in a FWP 6.0 website has to have a unique name or ID?

If that’s the case, then softpress has severally limited my ability to easily update FWP 5.5 sites to 6.0 compatibility without a complete rewrite.

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

11

Oops! I meant severely.

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

12

No, I am saying that if they wanted to put all of the styles in a single sheet, that is in fact what they would have to do. All elements that shared an exact set of style attributes could certainly have the same ID, so anything that was stuck on the page from the master page would get the same ID on every page. But no two elements that had the same ID and different layout attributes could be represented in the same single sheet.

Another way they could do this would be to give each page an ID, like maybe and then they could “namespace” the CSS like this:

#page1 #item1 {
	top: 42px;
	left: 100px;
	color: red;
	...
}
#page2 #item1 {
	top: 30px;
	left: 200px;
	color: blue;
	...
}

But without that sort of disambiguation, either automatic or manual, the stylesheets could not be combined into a single sheet without some degree of breakage.

Walter

On Feb 11, 2013, at 9:36 PM, RavenManiac wrote:

Walter, thanks for the post but I’m not sure I’m following you. Are you saying that every single item placed in a FWP 6.0 website has to have a unique name or ID?

If that’s the case, then softpress has severally limited my ability to easily update FWP 5.5 sites to 6.0 compatibility without a complete rewrite.

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

13

Okay, so clearly people that are a whole lot smarter than me designed this new approach to css stylesheets.

Does that mean that every new website developed in FWP 6.0 will include css stylesheets for each page, and if so how does that benefit me?

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

14

On 12 Feb 2013, 1:46 am, waltd wrote:

No, I am saying that if they wanted to put all of the styles in a single sheet, that is in fact what they would have to do. All elements that shared an exact set of style attributes could certainly have the same ID, so anything that was stuck on the page from the master page would get the same ID on every page. But no two elements that had the same ID and different layout attributes could be represented in the same single sheet.

Another way they could do this would be to give each page an ID, like maybe and then they could “namespace” the CSS like this:

#page1 #item1 {
top: 42px;
left: 100px;
color: red;
…
}
#page2 #item1 {
top: 30px;
left: 200px;
color: blue;
…
}

But without that sort of disambiguation, either automatic or manual, the stylesheets could not be combined into a single sheet without some degree of breakage.

Walter

Then how did they make this work in FWP 5.5 because I only had one master style sheet for all my pages?

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

15

All of the CSS for each element was repeated inline, within the HTML, which is messy at best.

<div style="position: absolute; top: 0; left: 0; ... "> your content here </div>

Walter

On Feb 11, 2013, at 10:39 PM, RavenManiac wrote:

Then how did they make this work in FWP 5.5 because I only had one master style sheet for all my pages?

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

16

Which means that the only styles that were in the head of the page or the single external stylesheet were the text styles.

Walter

On Feb 11, 2013, at 11:01 PM, Walter Lee Davis wrote:

All of the CSS for each element was repeated inline, within the HTML, which is messy at best.

your content here

Walter

On Feb 11, 2013, at 10:39 PM, RavenManiac wrote:

Then how did they make this work in FWP 5.5 because I only had one master style sheet for all my pages?

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

17

Yes, I noticed that. I just opened an old and new web page in Text Wrangler and it was a bit messy in 5.5, so I will admit that FWP 6 writes much cleaner code.

So, does this mean that anytime I design a FWP 6 website with External Stylesheets selected I can expect a css Stylesheet for every page in the site, and is that standard coding practice these days?

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

18

From the Freeway Pro 6 New Features PDF:

2.2 Master-page Stylesheets

Freeway writes master page styles to an external CSS file when the External Stylesheets option is selected in Document Setup. This file contains styles for positioning master items, so they don’t have to be duplicated in page stylesheets. In cases where an item that uses master attributes has a different z-index (e.g. if another item on the instance page has been sent to the back), Freeway outputs a partial style for the instance page. If a master page does not generate any styles, Freeway will not create an empty stylesheet.

In order to allow item styles to be output in master page stylesheets, Freeway 6 uses different default names for master and non-master items. Items that use master attributes share the same name as their master item. Items that do not use master attributes have distinct names. Toggling Use Master Settings causes items to be renamed. Renaming an item causes Use Master Settings to be turned off.

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

19

On Feb 11, 2013, at 11:16 PM, RavenManiac wrote:

Yes, I noticed that. I just opened an old and new web page in Text Wrangler and it was a bit messy in 5.5, so I will admit that FWP 6 writes much cleaner code.

So, does this mean that anytime I design a FWP 6 website with External Stylesheets selected I can expect a css Stylesheet for every page in the site,

Yes. I hope this changes, but as things stand, it is the compromise that Softpress have settled on for now.

and is that standard coding practice these days?

What is standard depends on where you look. In Ruby on Rails-world, where I work most days, the standard is to write lots of little CSS files, probably just as many as you see in Freeway, but then to use a concatenation system to mux them together into one disambiguated sheet. This is done automatically using SASS or LESS, which are extensions of CSS to give it more programmatic smarts. If Freeway were to do this, you might see some redemption in terms of geek cred, but the minified CSS that a concatenator would write is not really meant for human eyes.

In a hand-coded site, you would probably see a lot more complexity arising from a combination of relatively simple rules. You might set up a style for the main content area on a page, then apply a classname to it to make it smaller when you need to slip another element up next to it. So instead of having #page1 #item1 and #page2 #item 2, as in my earlier example, you might have #main and .three-column, and each one would only be a partial style definition. When you applied .three-column to #main, you would get a third thing, which would be the combination of those rules.

This is the sort of thing that is very easy to hand-code, but very difficult to automatically generate. It relies on understanding the differences and similarities between items, and the simplest way to express those through combinations of styles.

Doing this in Freeway would probably require a multiple-pass system of first writing out all of the styles long-hand, then looking through them for similarities and factoring out the common stuff. As with any algorithmic product, it might not make the same sort of elegant sense that a well-factored set of hand-written CSS might. It would definitely work, though.

Walter

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

20

On Mon, Feb 11, 2013 at 11:16 PM, RavenManiac email@hiddenwrote:

…and is that standard coding practice these days?

That was good for a laugh :smiley:

There are lots of examples of websites with multiple stylesheets, so we
could safely say “common” practice. The way Pro6 separates the inline
positioning from other kinds of styles has been suggested for some time… I
myself advocated such a thing at one point, and Tim Plumb had developed an
action which did pretty much that (and rocked, btw).

By moving away from inline styles, Pro6 actually DOES move toward better
coding practices. In fairness I should point out that inline styles are
allowed by the Cascade Order - that thing that determines the fate of all
your styles. It just shouldn’t be the default place for styling your items.

It occurs to me now there may be situations where I would legitimately want
to take advantage of inline styling, and cannot… Irony alert!

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