Site Designer suggestions - Page 32 -...

User 2622524 Photo


Registered User
97 posts

Dear CoffeeCup Site Designer Developers,

I hope this suggestion finds you well. As a loyal and long standing user of CoffeeCup Site Designer, I've come to appreciate the efficiency and user-friendliness of your software. However, I'd like to address a feature that seems to be missing but could greatly enhance the performance and user experience of websites created with your platform.

Fonts play a crucial role in web design, but they often come with a downside: slow load times. One common issue is the flash of invisible text (FOIT) that occurs while custom fonts are loading, particularly noticeable in certain browsers. To mitigate this, the CSS property "font-display" can be employed within the "@font-face" declaration, with the value "swap" being particularly useful. This instructs the browser to temporarily display system fonts until the custom font loads, thus avoiding the FOIT issue.

Unfortunately, the lack of support for the "font-display" property within CoffeeCup Site Designer means users have to resort to manual editing of CSS files after exporting their projects. This not only adds an extra step to the workflow but also makes it less convenient to implement best practices for web performance.

I believe that integrating support for the "font-display" property directly into CoffeeCup Site Designer would be immensely beneficial for users. Having the option to set font loading behavior easily within the Typography tab or Font settings would streamline the process and ensure that websites created with your software are optimized for performance from the outset.

For reference, here's an example of how the "font-display: swap;" property is typically added to "@font-face" declarations:

/* Custom Fonts Definitions */

@font-face {
font-family: Le Havre Light;
src: url('../custom_fonts/Le Havre Light Light.woff2') format('woff2');
font-weight: normal;
font-style: normal;
font-display: swap;
}

@font-face {
font-family: Le Havre Regular;
src: url('../custom_fonts/Le Havre Regular.woff2') format('woff2');
font-weight: normal;
font-style: normal;
font-display: swap;
}

@font-face {
font-family: Roboto Regular;
src: url('../custom_fonts/Roboto-Regular.woff2') format('woff2');
font-weight: normal;
font-style: normal;
font-display: swap;
}

For further information on the "font-display" syntax and its benefits, please refer to the following link: https://developer.mozilla.org/en-US/doc … nt-display

Integrating this feature would not only align CoffeeCup Site Designer with modern web design best practices but also empower users to create faster and more responsive websites without additional hassle. I hope you'll consider implementing this enhancement in a future update. (See attached sample of including the Font Display option into CoffeeCup)
Attachments:
User 3101044 Photo


Registered User
2 posts

Update to most recent version of Bootstrap. Now it's at v5.1 and the Bootstrap site even says that v4 is considered end of life.
User 488070 Photo


Registered User
6 posts

Could the container and image borders be set up so that one can change their size by clicking on the border and moving as one would an image in Microsoft Word or other programs? It would be so intuitive and familiar to do so. Or at least right-click on an image and get some options, like a choice between "replace (only this image)" and "replace (all instances of this image)" options, and clicking on the appropriate option brings up a file search window (and when you replace, it actually replaces)?
User 2699991 Photo


Registered User
5,057 posts
Online Now

David Merchant wrote:
Could the container and image borders be set up so that one can change their size by clicking on the border and moving as one would an image in Microsoft Word or other programs? It would be so intuitive and familiar to do so. Or at least right-click on an image and get some options, like a choice between "replace (only this image)" and "replace (all instances of this image)" options, and clicking on the appropriate option brings up a file search window (and when you replace, it actually replaces)?


Most of what you are asking is possible but not the way you describe it, I am not at home at the moment so can't do a demo video, but I will later if nobody else chips in first
Mastering The Understanding With Hands-On Learning
NEW TO "COFFEECUP SITE DESIGNER" FOUNDATION 6 FRAMEWORK?
STUCK ON SOMETHING?

LEARNING & UNDERSTANDING "THE HOW TO"? THE WHY'S & THE WHEREFORE'S?
WITH WAYAN'S STEP BY STEP TUTORIALS
Contact Me For One To One Assistance
https://mawarputih.coffeecup.com/forms/contact-wayan/

A simple quick way to contact me
https://rsd-tutorialscom.coffeecup.com/ … l-details/
User 3188984 Photo


Guest
2 posts

Yes, you can highlight the current page in a drop-down menu using CSS and JavaScript. Add a .current-page class in CSS for the highlight style. Then, use JavaScript to check the current page's URL and apply the class to the corresponding menu item. This will visually indicate the page you are on.
User 3108642 Photo


Guest
1 post

Dick VB wrote:
THEME MANAGEMENT: It would be really helpful to have an easy way to change the name of a theme to be more descriptive and perhaps even add a 'description' area (similar to Components). This would make choosing appropriate themes much easier, I believe .... any thoughts?


Agree with that.
User 3187741 Photo


Registered User
19 posts

Hello,
I allow myself a suggestion, because I find searching in the SD drop-down menus tedious.
if an alphabetical order could be added it would really facilitate the searches for class names, attributes etc...

http://img.cd91.eu/sitedesign/1sugestion.jpg

http://img.cd91.eu/sitedesign/2sugestion.jpg
Attachments:
User 2699991 Photo


Registered User
5,057 posts
Online Now

Default breakpoints and Disabled breakpoints.



The ability to do this is pretty neat especially when first seeing up a project, but also even for established projects,
However it is difficult for a lot of users to spot the difference.
How about making the Disabled Breakpoints option even more noticeable by having it a different colour altogether or even not displaying any breakpoints. ?? Or would that confuse people even more.
Mastering The Understanding With Hands-On Learning
NEW TO "COFFEECUP SITE DESIGNER" FOUNDATION 6 FRAMEWORK?
STUCK ON SOMETHING?

LEARNING & UNDERSTANDING "THE HOW TO"? THE WHY'S & THE WHEREFORE'S?
WITH WAYAN'S STEP BY STEP TUTORIALS
Contact Me For One To One Assistance
https://mawarputih.coffeecup.com/forms/contact-wayan/

A simple quick way to contact me
https://rsd-tutorialscom.coffeecup.com/ … l-details/
User 2699991 Photo


Registered User
5,057 posts
Online Now

Its A Kind Of Bali Magic wrote:
Default breakpoints and Disabled breakpoints.



The ability to do this is pretty neat especially when first seeing up a project, but also even for established projects,
However it is difficult for a lot of users to spot the difference.
How about making the Disabled Breakpoints option even more noticeable by having it a different colour altogether or even not displaying any breakpoints. ?? Or would that confuse people even more.


And or how about an overlay type of thingy in the bit that the breakpoints are displayed with a warning text

BREAKPOINTS ARE DISABLED
or words to that effect

Or even simpler open site designer with ALL BREAKPOINTS ENABLED then the user has to actually choose to disable them if they want,
Mastering The Understanding With Hands-On Learning
NEW TO "COFFEECUP SITE DESIGNER" FOUNDATION 6 FRAMEWORK?
STUCK ON SOMETHING?

LEARNING & UNDERSTANDING "THE HOW TO"? THE WHY'S & THE WHEREFORE'S?
WITH WAYAN'S STEP BY STEP TUTORIALS
Contact Me For One To One Assistance
https://mawarputih.coffeecup.com/forms/contact-wayan/

A simple quick way to contact me
https://rsd-tutorialscom.coffeecup.com/ … l-details/
User 122279 Photo


Senior Advisor
14,535 posts
Online Now

BREAKPOINTS ARE DISABLED
or words to that effect


It used to be like that, with the effect that many users started styling their pages and could not understand that the styles didn't stick if they viewed it from another viewpoint.

But we have this overlay that sometimes pops up, saying that some breakpoints are hidden. Something like that could also be used to warn about disabled breakpoints.
Ha en riktig god dag!
Inger, Norway

My work in progress:
Components for Site Designer and the HTML Editor: https://mock-up.coffeecup.com



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.