Skip to main content
Question

Why not considering leaving spacing for top navigation & bottom taskbar of screen?

Webminson

Hello my Friends . 👋

I’m a beginner in figma, and i saw a lot of youtuber that doesn’t take in consideration this issue.

so the problem is when we design a web page with a 1440*1080 frame (for exemple), the designers take all the space of this frame, without taking in consideration the browser top bar height and the window/mac task bar height. so the issue is when you preview the design in the browser (figma preview sucks 🥲) all the design get narrowed.

so maybe my question here is not linked to figma directly ? but to general design guidelines ? because all the tutorials that i saw were like “ok the front end will deal with it, it’s not my problem”.

Do we leave space for top and bottom bars or let this issue to “devs” ?

This topic has been closed for comments

3 replies

Parker4
  • Parker4
  • 4 replies
  • August 11, 2023

I have been wondering about this as well. Any designers or developers have any insight? I feel like I should be leaving space for the browser and task bar, but I haven’t seen anyone else doing this.

Webminson
1 person likes this
  • Webminson
    Webminson
Webminson
  • Webminson
  • Author
  • 1 reply
  • August 27, 2023

Hello friend 👋,

It’s sad no one answered… but on discord in the community of “kevin powell” one kind memeber gave me a small answer, it was like this :

"
there’s no point taking into account the height of those 2 things for 2 reasons :

1.- they will not be consistent, even on the same OS and Browser the navbar height will not be the same on every device, for example in that pic you sent they have bookmarks active which is not on by default and adds extra height, so how do you account for these if you can’t tell how much space on the screen they will take?

2.- As a dev, if something is 100% height you use viewport units 100vh will take all the available space on your viewport which is the actual available space (tho on mobile this is a bit iffy) so you are not cutting parts of the design. "

Deep5
1 person likes this
  • Deep5
    Deep5
Parker4
  • Parker4
  • 4 replies
  • August 28, 2023

Thank you! That makes a lot of sense!

Webminson
1 person likes this
  • Webminson
    Webminson
Terms & ConditionsCookie settings

Cookie policy

We use cookies to enhance and personalize your experience. If you accept you agree to our full cookie policy. Learn more about our cookies.

 
Cookie settings