0

In a body of text that contains both paragraphs and ordered and unordered list. Does it matter to indent the list items - by default, most browsers indent list items 16px?

The list in the following image is not indented. The bullets are at the same point on x-axes as the paragraph.

enter image description here

However, the list is indened 16px in this one.

enter image description here

2
  • 1
    Many web conventions for text display are adaptations of conventions for printed matter. It may be worthwhile to research whether (and why) the indentation convention exists for printed material. Jan 23, 2023 at 13:16
  • This question may be better suited to the graphic design stackexchange Jan 27, 2023 at 15:23

1 Answer 1

1

While I don't think there is a hard and fast rule for this, indentation breaks the flow so that it draws attention and users can quickly scan it and notice that there is a list. Used correctly, lists are very important because they mean that there are a number of items that need attention.

From NN/G

Bulleted lists attract attention, support scanning, shorten text, and reveal the relationship of items. Many different web-formatting techniques help break up dense paragraphs. Along with bolding, indenting, line spacing, and color-coding, bulleted lists are one of the most powerful methods for supporting efficient reading on the web.

However, I think the most important thing is to make sure you have consistent styling. Whatever indentation style you choose, make sure it's applied throughout the application.

According to MDN

In the end, we can see that none of the browsers mentioned in this article is right or wrong about how they lay out lists. They use different default styles, and that's where the problems creep in. By making sure you style both the left padding and left margin of lists, you can find much greater cross-browser consistency in your list indentation.

​I personally find your first example (without indentation) much difficult to read. Also, I did a quick check of several well-known websites, and they all use indentation, so I assume this is an accepted pattern.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

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