Portrait & Landscape layouts - What is the UX guidelines for making two distinct layouts i.e. where the layouts will be significantly different from each other.
1
-
What does it mean when you say - 'the layouts will be significantly different from each other'?– RenOct 31, 2019 at 11:11
Add a comment
|
1 Answer
You could take a look at the Material Design Guidelines and how Responsive Layouts are approached.
A layout can be divided into columns based on the screen width. Material design splits the layout into 4-column, 8-column, and 12-column grids. The content on your page should be displayed based on these columns. Breakpoints can be used to determine the number of columns based on your screens width.
A layout can be split into UI regions. The UI regions should be organized depending on the breakpoints. An UI region could be a content area or the side navigation. You can i.e use collapsible UI regions for smaller screen widths, whilst displaying it permanently on a larger screen.
You can also have a look at Component Behavior in the Material Design Guidelines. This chapter describes how components behave between breakpoints and also shows some responsive patterns.
To answer your question:
If you design your layout responsively then switching the layout mode should be included automatically.
If your building web-pages with HTML you could have a look at bootstrap which could help you out a lot with building responsive layouts.
