Breakpoints - recommended best...

User 2736027 Photo


Registered User
68 posts

I am relatively new to RED, but have read through the Quick Start Guide to get me going.

While I understand the concept and need to predict how an email may be presented to email clients and varying screen sizes, I couldn't find a 'best practices' on what the default breakpoints should be set to. I know I can vary the slider to various widths, or number of pixels, and that's fine. But what are 'the standard' screen widths to which I set my breakpoints? And second, can I store these breakpoint settings as 'preferences' so that each new email design has knowledge of these settings?

Thanks
User 2088758 Photo


Senior Advisor
3,086 posts

Hi Norm,

The whole idea of break-points is to set them only where needed. Adjust your layout and shrink it and when the layout breaks you add a breakpoint and fix. You should never a set point ... each template will be different so the break points would be in different places.
Taking over the world one website at a time!

Steve Kolish
www.misterwebguy.com

YouTube Channel:
https://www.youtube.com/channel/UCL8qVv … ttneYaMSJA
User 2736027 Photo


Registered User
68 posts

Hi Steve,

Thanks for the quick reply...

Where I was getting somewhat confused is... if I have a headline that is 5 words long, say, then as I adjust the slider towards a smaller screen size, I notice that the headline will begin to word-wrap as the number of pixels decrease. For the smaller tablet and phone icons, there is quite a range over which I can adjust the slider, and the icon remains 'lit'. Over this range of adjustment, the headline will word-wrap after 2, or 3 (say) words.

I'm trying to adjust the text size so that for each of the 3 icons (screen sizes) the word-wrap will 'break' at a specific or appropriate locations, if I am explaining myself clearly. I am trying to avoid having a 'dangling' single word on the smaller screen sizes.
User 232214 Photo


COO
827 posts

Steve wrote:
Hi Norm,

The whole idea of break-points is to set them only where needed. Adjust your layout and shrink it and when the layout breaks you add a breakpoint and fix. You should never a set point ... each template will be different so the break points would be in different places.


EXCELLENT answer Steve, thanks!

:):):)
The future of web layout has arrived and it's called CSS Grid. CoffeeCup helps you to get ready with a free guide, the Grid Builder app plus cool demos & themes.
User 271657 Photo


Ambassador
3,816 posts

Is it possible...or OK to edit the HTML? I usually put a non-breaking space ( ) between the last 2 or 3 words to avoid widows. Then there's no need to fuss over breakpoints for individual headlines or paragraphs.
I love deadlines. I like the whooshing sound they make as they fly by. (Douglas Adams)
https://www.callendales.com
User 1948478 Photo


Senior Advisor
1,850 posts

Bob Visser wrote:
Steve wrote:
Hi Norm,

The whole idea of break-points is to set them only where needed. Adjust your layout and shrink it and when the layout breaks you add a breakpoint and fix. You should never a set point ... each template will be different so the break points would be in different places.

EXCELLENT answer Steve, thanks!
:):):)

EXCELLENT indeed!
Which just goes to show that we trained Steve well - and early - way back in February of last year!! :lol::lol: :

http://www.coffeecup.com/forums/respons … post227231

(Sorry, Steve, couldn't resist... :lol: )
User 2088758 Photo


Senior Advisor
3,086 posts

Yup yup... that was a "uh ha!" moment. Been preaching the break-point gospel ever since!
Taking over the world one website at a time!

Steve Kolish
www.misterwebguy.com

YouTube Channel:
https://www.youtube.com/channel/UCL8qVv … ttneYaMSJA
User 494996 Photo


Registered User
65 posts

I have a question Steve about your post:

where you said "... add a breakpoint and fix" ... fix what?

where you said "You should never a set point"... why not?

I have to digest information over and over again to grasp concept (in this case, the concept of breakpoints). Sorry that I am not comprehending. I am having an issue on my site and want to get it right!

thanks in advance!!
---- Michelle K.
User 103173 Photo


VP of Software Development
0 posts

Hulasista wrote:
I have a question Steve about your post:

where you said "... add a breakpoint and fix" ... fix what?

where you said "You should never a set point"... why not?

I have to digest information over and over again to grasp concept (in this case, the concept of breakpoints). Sorry that I am not comprehending. I am having an issue on my site and want to get it right!

thanks in advance!!

Are you asking for help for Responsive Email Designer or Responsive Site Designer? This thread is for Responsive Email Designer.
Learn the essentials with these quick tips for Responsive Site Designer, Responsive Email Designer, Foundation Framer, and the new Bootstrap Builder. You'll be making awesome, code-free responsive websites and newsletters like a boss.
User 494996 Photo


Registered User
65 posts

Oh Snap... thank you. No wonder I didn't understand his advice lol ... I was asking for Desginer! SMH...

Thanks for calling it out!!! I will do better next time!
---- Michelle K.

Have something to add? We’d love to hear it!
You must have an account to participate. Please Sign In Here, then join the conversation.