Page 1 of 1
Responsive website
Posted: Mon Oct 18, 2021 9:11 pm
by spd54
Hi
A question re responsive websites. If I design a site for say 1920 width would someone with a smaller pc screen be able to the full page if I put a breakpoint in for say 1280 width. Or is there another way I should look at.
Thanks
Re: Responsive website
Posted: Tue Oct 19, 2021 12:15 am
by bkjohns
Put your content in a layout grid or flex grid/box, then it will self adjust to the users screen size.
Re: Responsive website
Posted: Tue Oct 19, 2021 12:29 am
by crispy68
As bkjohns stated, use layout grids, flex containers or flex grid in designing the site. You will only add a breakpoint if your design 'breaks' or needs re-adjusting so that it still looks good on smaller screens.
Re: Responsive website
Posted: Tue Oct 19, 2021 5:57 am
by Pablo
Re: Responsive website
Posted: Tue Oct 19, 2021 9:19 am
by spd54
Thanks will have a read up on it, much appreciated
Re: Responsive website
Posted: Tue Oct 19, 2021 10:59 am
by alan_sh
Since I have started down the 'responsive' route, I have found I don't need any page breakpoints - just flexbox ones. It's brilliant only having one screenful to edit and not needing to check the layour in every breakpoint. I can thoroughly recommend it. My pages are also set at 1920.
The main things I have learned is to set flex grow and flex shrink to 1 for any text object (texts, menus, tables etc.) inside a flex grid and to be aware of what happens when you shrink the page down (headings can suddenly look down on the wrong text if you are not aware, for example).
It's been a fun learning curve, but the results are well worth it.
Alan
Re: Responsive website
Posted: Tue Oct 19, 2021 11:31 am
by zinc
alan_sh wrote: Tue Oct 19, 2021 10:59 am
Since I have started down the 'responsive' route, I have found I don't need any page breakpoints - just flexbox ones. It's brilliant only having one screenful to edit and not needing to check the layour in every breakpoint. I can thoroughly recommend it. My pages are also set at 1920.
The main things I have learned is to set flex grow and flex shrink to 1 for any text object (texts, menus, tables etc.) inside a flex grid and to be aware of what happens when you shrink the page down (headings can suddenly look down on the wrong text if you are not aware, for example).
It's been a fun learning curve, but the results are well worth it.
Alan
That's not 100% true. It depends what you want to achieve and how complex your design is and what you can and cannot do with them. Those who know my work, I almost never use FB or Layout grid. The beauty of WWB is, it gives you a choice.
Re: Responsive website
Posted: Tue Oct 19, 2021 2:25 pm
by alan_sh
Zinc,
I can only describe my experience. WWB does an excellent job for the beginners in responsive (like me) and the experienced (like you).
I'm curious how you get responsive mode without using flex or layout stuff.
Alan
Re: Responsive website
Posted: Tue Oct 19, 2021 3:51 pm
by zinc
I use floating layers and break points. On occasion I will use layout grid but my work is mainly with floating layers which gives me a lot of fridom.
Re: Responsive website
Posted: Tue Oct 19, 2021 4:28 pm
by Chris_t
zinc wrote: Tue Oct 19, 2021 3:51 pm
I use floating layers and break points. On occasion I will use layout grid but my work is mainly with floating layers which gives me a lot of fridom.
Hmm, not familiar with that, any tutorials or examples please?
Re: Responsive website
Posted: Tue Oct 19, 2021 4:37 pm
by zinc
Chris_t wrote: Tue Oct 19, 2021 4:28 pm
zinc wrote: Tue Oct 19, 2021 3:51 pm
I use floating layers and break points. On occasion I will use layout grid but my work is mainly with floating layers which gives me a lot of fridom.
Hmm, not familiar with that, any tutorials or examples please?
Here is one
https://www.wysiwygwebbuilder.com/floating_layers.html
Re: Responsive website
Posted: Wed Oct 20, 2021 9:46 am
by Chris_t
zinc wrote: Tue Oct 19, 2021 4:37 pm
Chris_t wrote: Tue Oct 19, 2021 4:28 pm
zinc wrote: Tue Oct 19, 2021 3:51 pm
I use floating layers and break points. On occasion I will use layout grid but my work is mainly with floating layers which gives me a lot of fridom.
Hmm, not familiar with that, any tutorials or examples please?
Here is one
https://www.wysiwygwebbuilder.com/floating_layers.html
Thank you zinc.
Would you mind showing an example of how you are using it please?
Re: Responsive website
Posted: Wed Oct 20, 2021 2:45 pm
by zinc
Chris_t wrote: Wed Oct 20, 2021 9:46 am
Thank you zinc.
Would you mind showing an example of how you are using it please?
http://craftedby.today/projects/abybook/
Re: Responsive website
Posted: Wed Oct 20, 2021 3:48 pm
by Chris_t
Re: Responsive website
Posted: Wed Oct 20, 2021 10:04 pm
by zinc
You are welcome!