Highlighted

Breakpoints VS. Using Alternate Layout (Tablet/Phone)

Participant ,
Dec 03, 2017

Copy link to clipboard

Copied

PLEASE HELP.

I've created a website, but unfortunately it's becoming quite frustrating trying to make it work at smaller breakpoints. The site goes nuts. If I try and fix at a different breakpoint it completely changes it in my larger breakpoint. Sure hope there is an easy fix for this.

I get the following error when I preview my desktop version of the site:

Warning: Master has multiple layouts (Desktop, Tablet, Tablet) and also breakpoints on non desktop devices and these breakpoints won't be used. You may want to delete the overlapping alternate layout or the unreachable breakpoints on this page....

I have no idea why it has two tablet version as they say above. Should I only work with breakpoints and delete the alternate layout Tablet?

I've wasted so much time with something that I thought would be easy. Adobe certainly makes it look that way in the videos.

Anyway if someone can look at my site below and offer some suggestions I would really appreciate it.

Desktop version of site

Tablet version of site

The second site doesn‘t exist („Page not found“ error), the first is heavily mislayouted. Please colour you page background (not browserbackground) and check, if there are elements overlapping/placed outside the breakpoint /page width. Check this on layout and masterpage. As I can see, there’s really lots of them!

Furthermore, drag the scrubber (this grey, vertical handle top right to the breakpoint bar) slowly inwards and see, if elemens float outside your breakpoint/page boundaries.

If you find no further problems, and your page is still misbehaving, please reduce you site to only the elements shown in your links (no more elements, no more pages) and share this .muse file with us by following these instructions: https://forums.adobe.com/docs/DOC-8652

Even better: If I look at your sample site, and see all these issues, I really like to suggest you, to stop layouting for some hours and have at first a very(!) deep(!) look into these tutorials: https://helpx.adobe.com/en/support/muse.html

Views

624

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more

Breakpoints VS. Using Alternate Layout (Tablet/Phone)

Participant ,
Dec 03, 2017

Copy link to clipboard

Copied

PLEASE HELP.

I've created a website, but unfortunately it's becoming quite frustrating trying to make it work at smaller breakpoints. The site goes nuts. If I try and fix at a different breakpoint it completely changes it in my larger breakpoint. Sure hope there is an easy fix for this.

I get the following error when I preview my desktop version of the site:

Warning: Master has multiple layouts (Desktop, Tablet, Tablet) and also breakpoints on non desktop devices and these breakpoints won't be used. You may want to delete the overlapping alternate layout or the unreachable breakpoints on this page....

I have no idea why it has two tablet version as they say above. Should I only work with breakpoints and delete the alternate layout Tablet?

I've wasted so much time with something that I thought would be easy. Adobe certainly makes it look that way in the videos.

Anyway if someone can look at my site below and offer some suggestions I would really appreciate it.

Desktop version of site

Tablet version of site

The second site doesn‘t exist („Page not found“ error), the first is heavily mislayouted. Please colour you page background (not browserbackground) and check, if there are elements overlapping/placed outside the breakpoint /page width. Check this on layout and masterpage. As I can see, there’s really lots of them!

Furthermore, drag the scrubber (this grey, vertical handle top right to the breakpoint bar) slowly inwards and see, if elemens float outside your breakpoint/page boundaries.

If you find no further problems, and your page is still misbehaving, please reduce you site to only the elements shown in your links (no more elements, no more pages) and share this .muse file with us by following these instructions: https://forums.adobe.com/docs/DOC-8652

Even better: If I look at your sample site, and see all these issues, I really like to suggest you, to stop layouting for some hours and have at first a very(!) deep(!) look into these tutorials: https://helpx.adobe.com/en/support/muse.html

Views

625

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Dec 03, 2017 0
LEGEND ,
Dec 03, 2017

Copy link to clipboard

Copied

The second site doesn‘t exist („Page not found“ error), the first is heavily mislayouted. Please colour you page background (not browserbackground) and check, if there are elements overlapping/placed outside the breakpoint /page width. Check this on layout and masterpage. As I can see, there’s really lots of them!

Furthermore, drag the scrubber (this grey, vertical handle top right to the breakpoint bar) slowly inwards and see, if elemens float outside your breakpoint/page boundaries.

If you find no further problems, and your page is still misbehaving, please reduce you site to only the elements shown in your links (no more elements, no more pages) and share this .muse file with us by following these instructions: https://forums.adobe.com/docs/DOC-8652

Even better: If I look at your sample site, and see all these issues, I really like to suggest you, to stop layouting for some hours and have at first a very(!) deep(!) look into these tutorials: https://helpx.adobe.com/en/support/muse.html

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Dec 03, 2017 2
Participant ,
Dec 03, 2017

Copy link to clipboard

Copied

Thank-you so much for taking the time to help me. My site had so many missing assets (that I didn't use) that I decided to copy and paste the layers into a completely new website, and things worked so much better.

The revised site is here. I still have to do the tablet and phone version, but if you have comments beforehand, I would greatly appreciate it.

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Dec 03, 2017 0
Most Valuable Participant ,
Dec 03, 2017

Copy link to clipboard

Copied

I'd start by making your layers clear, for example the menu (imo should be at top) is above some parts and under others

Screenshot (276).png

Screenshot (277).png

the basic design is fine for desktop but will not really work on a phone... people have limited wifi and don't want to wait forever to see lots of images... i'd go single colum with thubnail or no images on the phone layout

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Dec 03, 2017 2
Participant ,
Dec 03, 2017

Copy link to clipboard

Copied

Agree. I'll see what I can do about that. Thanks for the thoughts for the phone. I'll be keeping that simple.

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Dec 03, 2017 0
Participant ,
Dec 04, 2017

Copy link to clipboard

Copied

I'd like to have my browser fill with the taupe color all the way across when viewed on a large monitor. Should I make a larger breakpoint and fill more of the page background? Customer wanted the taupe color, I wanted white. Thanks.

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Dec 04, 2017 0
Most Valuable Participant ,
Dec 04, 2017

Copy link to clipboard

Copied

try changing the end point to expand

fill.png

the default is less than... click it to greater than (makes the broswer fill expand to whatever size the screen is

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Dec 04, 2017 1
Participant ,
Dec 05, 2017

Copy link to clipboard

Copied

Thank-you Ussnorway!

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Dec 05, 2017 0