Is it a problem if my form takes up twice as much space in web form than it does in the desktop application?

Question

I am trying to migrate some forms from a desktop implementation to a web implementation, which should still primarily be used by desktop users.

Currently, we have a generic out-of-the-box theme (the default Bootstrap theme) which renders the same forms twice as big as they were in the desktop application. I'm wondering if all of this extra spacing is a problem that needs to be fixed.

Should I try to fit this form on one page like it was in the desktop application, or is it fine that now it requires scrolling?

Answer 1

Desktop Medium

It is not as common¹ to encounter native desktop applications in which the entire application scrolls. Sure, there may often be regions on a page, or a particular page or section that scrolls, but the application's layout is typically static, and this is what users tend to expect.

Historically², this has lead to a designer having to make things fit into a defined area, often working with exact pixel offsets, or percentages.

Web Medium

However, the web is different. Websites are almost always vertically-structured documents that allow pages to extend beyond the visible window.

With this understanding, developers aren't limited by the dimensions of the browser window, as the overflow can simply spill down causing the page to scroll. When used correctly, the increased whitespace can be a very good tool for enabling a user to digest sections of the page at a time without getting overloaded.

So I wouldn't worry so much about trying to fit your form to fit on one page like it used to. What happens if your user is on a small monitor, or is using low resolution, or has increased their font size or zoom ratio? It's perfectly fine for the web version to overflow like web pages often do.

---

^{1. Based on my observations.}

^{2. Many modern desktop applications, like those following Microsoft's newer Fluent Design guidelines, have adopted a responsive column design which allows elements to reposition based on the device's width.}