[Pro] Responsive site - where to start

Hi
I realise there has been a fair bit of discussion regarding using Freeway Pro to build responsive sites.

I wanted to know if it is possible and if so how to start:

When you load FW Pro and choose Blank Website - you get bog standard default 550px by 700px

If I choose say 1200px by 960 (large screen) and set pasteboard width to 1200px - I get this (visual included).

I guess my question is - I don’t think I am approaching this right - anything above 1200px screens are not full screen (like a iMac 27" or a mac book pro with hi-res screen).

I have looked at Calebs template and thinking about using that - but didn’t want to jump in without asking first.

Any help / pointers greatly appreciated.

Jeff

http://www.filetrans.co.uk/example/1/screen.png


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

I meant to add - as per the visual I included above - as you can see the area width only seems to extended to around 950 (I assume this is pixels)

If I have set the master and pasteboard to be 1200 is there a reason why it only extends to 950-ish?


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

Screen size is a delicate decision. Too large, and you make more work for yourself when trying to adjust to smaller screens, also too large and you end up with line-lengths that require so much leading that the entire page devolves into an unreadable mess. It is reasonably safe to assume two things about large screens. First, anything above 1200px is going to be difficult to fill in a visually-appealing manner. And Mac users with huge screens are going to be running at < full screen anyway. Two, many/most Windows users are not aware that you CAN make the browser smaller than the window. They are lost – dead to me!

You can make the visible page centered on the available window area, and that takes care of most of the edge cases at over-large screen sizes. Personally, I don’t make the largest size any wider than 960, because I don’t want to build a rod for my back.

Walter

On Jul 17, 2014, at 10:21 AM, ScotsJeff wrote:

Hi
I realise there has been a fair bit of discussion regarding using Freeway Pro to build responsive sites.

I wanted to know if it is possible and if so how to start:

When you load FW Pro and choose Blank Website - you get bog standard default 550px by 700px

If I choose say 1200px by 960 (large screen) and set pasteboard width to 1200px - I get this (visual included).

I guess my question is - I don’t think I am approaching this right - anything above 1200px screens are not full screen (like a iMac 27" or a mac book pro with hi-res screen).

I have looked at Calebs template and thinking about using that - but didn’t want to jump in without asking first.

Any help / pointers greatly appreciated.

Jeff

http://www.filetrans.co.uk/example/1/screen.png


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

PageSizes where made on assumptions.

Assumed 80% of the world has 21" monitors - 1024x768 is a reasonable size. But we can’t - cause there are trillions different devices out there.

Conclusion (and the best way to start into the responsive world):

  1. Free your mind and forget the DTP dimensions.

  2. Think of PageArea (rather than fixed page width) and think of widths in percentage.

  3. There is only one web (no desktop or mobile-web)

  4. The construction is based on “relative positioning” (however absolute theoretically could work as well)

  5. Content first, then a plan literally and then the construction

My daily practice is:

A width of 65% for big devices, 75% for the medium, 85% usually on the iPAD and 95% for iPhone (+/-) depending on the content.

Caleb’s Backdraft is great and it even enables you to subscribe to my screencasts (you’ll get a voucher for one week free). It should give you all the impressions written above.

But please keep in mind:

Responsive is kind of “what happens if …” and you are best prepared by slightly change your static Webdesign attitude towards the FrontEnd Development philosophy.

Cheers

Thomas


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