I am working on a form page. In which first their is a page heading comes then facts related to form & then form comes. enter image description here

My project manager wants facts & form comes in the first fold of the browser. Which is not possible as per design flow of the website.

In current design 2 & 3 form filed is visible in the first fold. But PM wants to show the entire form with submit button & facts also.

Any help is appreciated :)

  • 1
    I assume this PM is from a newspaper print background. It doesn't sound like s/he is from the 2014 digital age. And also; Why is a Project Manager making design decisions?
    – JonW
    Sep 29 '14 at 8:05
  • yup here PM's give there design inputs also :(
    – sandeep
    Sep 29 '14 at 8:14
  • 2
    Well you can't know what the page fold is for everyone, because no two devices / machines are the same. So the only thing you can do is reduce the size of everything down so small that it fits into a 240px height and go with that. Then bring up at your next project meeting that there is a blocker - an impossible requirement has been raised that cannot be met, therefore the project is at risk, so the PM will have to deal with it. (Hey, if s/he is trying to play the UX game then you should play the PM game yourself.) - I am not actually joking here either.
    – JonW
    Sep 29 '14 at 9:04

As JonW rightly pointed out, trying to define the fold is going to be a challenge with the surfeit of devices out there and you would be stuck trying to fit in as much content in a relatively small space (irrespective of the fold dimensions you choose).

You could make a strong case that your form page design is like a single page design which basically tells a story encouraging the user to scroll down and make a final decision based upon the information he reads which will help him decide if he wants to fill the form.

A strong case against fitting everything in the content above the fold would be that there is no singular point of focus since the form and information about what the form is about will be fighting for attention and users could would get distracted.

That said, here are some design inputs which would help you establish a stronger case

  1. Encourage the user to scroll down by telling a story and defining a path : Your primary banner should encourage the user to scroll down by telling a story which should make him eager to learn about what the form is all about. To quote this article about single page designs

Make sure to keep the messaging and media content clear and concise from beginning to end. And what is even more important, single-page websites should have a continuous and sequential flow of content (what->why->how->where->when).

enter image description here

Storytelling is a powerful way of delivering content and it’s actually another trend but this time in content marketing. Storytelling breathes life into the core message and more strongly relates to the user.

This should lead on the facts and the facts should lead on to the form establishing what-->why-->how path mentioned in the article referenced above.This works especially well if you are trying to convince a person to try a product and the form is to get him to sign.

Here are some more examples

enter image description here

enter image description here

  1. Keep it simple : While storytelling allows you to guide the user, I would recommend keeping it simple so that users can get to the main focus of the site as soon as possible without having to constantly wait for the next item to load or be displayed. Your design seems pretty good from that aspect but I would resist the urge to add more elements to try to enhance the story telling experience.

  2. Define the goal of your site : On reflection , this should be point one but one of the things you should consider is the main goal of this page. If the focus is mainly conversion, then the hero image's focus should be on getting the user to the conversion metric i.e. the form with a strong call to action but if the focus is on informing the user more on the product\offering and then letting him sign up storytelling would be a better option.

Here are some nice examples of call to actions which drive the user towards conversion or signing up.

enter image description here

enter image description here

enter image description here


I get a lot of "above the fold" with a fairly arbitrary minimum height in my workplace as well (ours is based on the screen height of company-distributed laptops). What we've gotten away with arguing is, as long as the key element (form in this case) appears partially on the page, it will be obvious to the user that they need to scroll to see the full breadth of the page.

You could possibly try an alternative layout which puts the facts in a vertical column to the left of the form, which would place it higher on the page.


Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.