Questions tagged [viewport]
The Visual viewport is the part of the page that’s currently shown on-screen. The layout viewport can be considerably wider than the visual viewport, and contains elements that appear and do not appear on the screen.
14 questions
2
votes
2
answers
469
views
Web App - Set a Max Width or Let it Expand Responsively?
Hopefully this is an easy one.
I'm designing a web app that contains rows of cards you can horizontally scroll, and a sidebar navigation on the left (think: similar to DoorDash).
I notice on my wide ...
2
votes
2
answers
159
views
Should you flex items throughout all the viewport on desktop?
I've been noticing many popular websites often don't span items throughout all the viewport on desktop screens. For instance, Google:
I noticed this recently while building a website. I was flexing ...
1
vote
1
answer
593
views
Dealing with keyboard on mobile devices in prototyping tools such as Figma
I am trying to build an app and I'm starting with prototyping it, but I am not a professional UX & UI designers (I'm a software developer), so apologies if my question seems silly.
I am starting ...
1
vote
1
answer
457
views
Menu sidebar height on small screen resolutions
I'm currently having a challenge on a SaaS I'm helping designing, regarding small screen sizes.
That SaaS has a menu sidebar on the left as its main navigation, with 2 levels of navigation.
The ...
0
votes
1
answer
84
views
Whitespace viewport dependency (should CTAs be visible or not)
We've read few Q&A on this topic, also done the research but most of the articles says what whitespace is, not how to calculate it.
When designing for smaller screens, should the whitespace ...
0
votes
1
answer
523
views
Visual designs for multiple screen sizes [duplicate]
We are designing a website for desktop and tablets, which needs to work for 1366x768, 1024x768, 1920x1080, 600x1024, 1600x900 - the most common resolutions as per Stat Counter Global stats in India. I ...
0
votes
3
answers
151
views
By how much should slow/fast forward/backward scroll?
I am developing an application for visualizing graphs that contain technical data.
The user can move the graphs left or right with 4 buttons:
fast step backward - symbol = "<<"
slow step ...
3
votes
2
answers
436
views
Responsive Web Design based on physical size?
The current practice of using media queries via pixel-thresholds is fine, but what if someone decided to use their 50-inch 4k tv as a vertical monitor and actually sit really close to it?
I could see ...
0
votes
1
answer
2k
views
mobile and tablet responsivenes between landscape and portrait layouts
When designing Apps or websites for mobile or tablet we have to consider if the layout will change when the alignment of the device changes. I believe this is a kind of responsiveness. Noticed that ...
0
votes
2
answers
1k
views
What is the recommended default viewport for fixed-width websites?
Let's say I have a website (This is the actual one).
It has a fixed width of 1024px and the content is centered. I use width=device-width, initial-scale=1 for setting up the website to be nicely ...
2
votes
1
answer
370
views
Gracefully Constrain Window Size
I am working on a program that does not have many visual elements on the GUI, also, unlike what has been suggested previously, there are no multiple levels of detail or possible elements to add and ...
0
votes
3
answers
2k
views
Lightbox larger than viewport data
I was wondering if there is any data exists describing users' feelings towards a gallery-linked image lightbox being larger than the user's viewport--specifically vertically larger--such that the user ...
20
votes
4
answers
3k
views
Is viewport size a useful design constraint, and how are viewport sizes distributed?
I'm trying to support or falsify the hypothesis that desktop browser viewport size is distributed multimodally (that is, with "peaks" in the distribution that might make for useful website design ...
5
votes
3
answers
1k
views
Handling images larger than viewport in carousel-based gallery
I'm trying to figure out the best way to design an image gallery embedded in a lightbox. The gallery has thumbnail versions of each image in a carousel, and clicking a thumbnail brings that image ...