Here are several general rules that will be useful if you are just starting to use grids:
REMEMBER THAT ONLINE MEDIA ARE DIFFERENT FROM PRINTED MEDIA. Working with Internet means a designer should expect to be faced with a whole lot of barely predictable factors. Like, for example, you never know which part of the long read will be directly on a specific reader’s screen at any given moment in time since anything that somehow depends on vertical scrolling is absolutely up to the reader.
That is precisely why, as far as designing modules for a web environment is concerned, the emphasis is on working with the vertical lines of the grid, while its horizontal lines are of any significance only for the top and the bottom parts of the websites and on pages accommodating lists.
SO DO DECIDE FROM WHICH DEVICE and in which resolution readers are going to view your articles. Use adaptive web design, make several different grids convenient for different screen resolutions and try to preserve logical consistency between these module grids.
FOCUS ON THE CONTENT. When building grids, you will need to take into account all available options, when it comes to headlines, inserts, quotes and the sizes of images, videos and other multimedia that may be found in your online resource or blog.
BREAKING THE RULES IS NOTHING TO BE AFRAID OF. Do not carry it all too far: pages should not be all shoehorned into one grid type. This is what typeface designer Allen Hurlburt wrote: “Seeing that the nature of materials to be published may vary greatly, one grid may prove to be not enough to complete your design. In cases like this I would recommend using separate layouts and, wherever possible, superimposing various grids or merge them into a complex one.”
Working with Grids
in Setka Editor
When working in Setka Editor, we use column grids — the basic grids in graphic design. Those are often supplemented with horizontal rows constructed depending on the font size. Their configuration depends on the number of columns, margins, and gutters.
Column grids help to develop design for a variety of devices: computers, tablet PCs, and smartphones. Columns provide necessary limitations to enable you to decide efficiently how to arrange the contents, leaving you, however, with a multitude of options to combine different types of information (texts and images) and design elements.
Check the Grid Systems section for basic grid settings for your chosen Setka Editor’s default settings offer several types of grids: 6 columns, 8 columns, 10 columns, and 12 columns. You can moreover upload a grid of your own.
If you are a total novice wishing to create unsophisticated text posts, opt for a 4-column grid. This is one of the simplest options available. Its drawback is that the post might look a bit dull because of the symmetrical break-up. Grids like this are often used with the following strategy: three columns are taken up by the contents, while the remaining one contains a menu or any other additional information.
If what you need is an especially flexible design (for example, for posting pictures or a post with multiple fillers), use 12-column grids: the post may be divided into 3, 4, and 6 columns. The post may, moreover, be broken up into symmetrical or asymmetrical parts — this too is a very helpful trick to create a potent post.
Even if you do not get the hang of working with multi-column grids right from the start, do not lose heart — practice is what will help you master even the most sophisticated methods. Take some simpler patterns for a start, but do not be afraid of trying new things. In any case, grids are something you will be wise to sacrifice some of your time to learn more about; they are, after all, an excellent tool helping to create attractive posts, that are both easy on the eye and easy to understand.