When you add blocks of different widths on a page, make sure they align well, otherwise, the page will have uneven edges.
💫 Don't use more than two block widths on a single page. You may set up blocks to 8 and 12-column width. Arrange them in any order—the page will look good.
💫 Make sure to maintain high contrast between columns of different widths—four columns or more. Otherwise, a slightly different width can seem like a sloppy design.
💫 Remember to align blocks vertically. If you are using an 8-column block with a 2-column indent at the start of a page, keep the same indent for the blocks of the same width. You'll break up the design flow if you add a block with a 1-column indent.
💫 When designing an article, keep the width of text and images the same. This will improve readability and the user won't be distracted by blocks of different widths. 8-column width is the best option for easy perception. This doesn't apply to the cover—it can be wider.
💫 Use a consistent style for aligning content across the page. If you decide to center-align your heading section, make sure the rest of the headings on the page are center-aligned, too.
Besides the width, the structure of the blocks is also important. For example, the Features block FR201 is made up of 3 sections, each one taking up 4 columns.