1

I am working on some wireframes for an app. The app has a lot of short flows that usually require filling two inputs fields or have a small FAQ as seen in the examples below. I tried looking the internet for some suggestion but nothing helps.

I`m looking for some standards or best practices.

I tried a few variations but all seem off in my opinion.

1. Aligned left small container.

2. Full width container and content

3. Full width container with center content

4. Center content

smaller container aligned left

full width

enter image description here

enter image description here

3

If the problem is where to align the container, why using a container?

Container

The containers are used to arrange the information by putting a limit frame, but sometimes they are visual noise, among other reasons, for which you indirectly state in your question.

In your case there are four containers (five if there's a header):

  1. the one on the web
  2. the FAQ container
  3. the question container
  4. the answer container

Arranging these four related containers can be a tedious and meaningless job if the result will always be visual noise.

  • Hello, Good answer. The problem is not where to align the container but where to align the content when there is small content on a 1920 resolution that leaves a lot of white space everywhere as I have a lot of pages with very little content. – Cristian Negraia Oct 23 '19 at 9:45
  • If the title FAQ is aligned to the left, the content must also be aligned to the left regardless of the content extension. Without a visual container this will be not a design problem. – Danielillo Oct 23 '19 at 11:14
0

If you follow this very website you'll see that the left menu + container are centered, with white space around it.

On the other hand, looking at the Blender manual website you'll see the layout follows your first option (Aligned left small container). I've seen both examples in many different websites.

I'd say it will be a matter of preference, as long as you don't stretch the container too much, which will make lines more difficult to read. Your content doesn't need to stretch all the way to the edges of the screen on all screen sizes.

0

I'd suggest testing a few variants with some of your users to see if they have a preference.

Regardless of whether you want to test or not, I suggest you create a few variations with a variety of content, short and long texts and view them at different screen sizes to give yourself a better idea of what people will get to see. Then make a decision on what looks best overall. If that means at certain length of content it's less visually appealing, I doubt the user experience will suffer from it.

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.