Whether in design or writing, layout is the decisive factor which makes the reader want to stay to read your article/design. . Layout design is the process of arranging visual elements—like text, images, and shapes—on a given page. Layout design is important for any project that conveys a message through eye-catching visuals, like magazine layouts, website design, and advertisements. An effective layout not only looks attractive, but also helps the viewer understand the message the design is conveying. In other words, understanding layout is key when it comes to creating user-friendly, engaging designs, particularly in the realms of web design and advertising. ---- Learn More from Our Website: https://liasidik.com Be sure to follow us: https://www.instagram.com/liasidik https://www.facebook.com/liasidik.branding https://twitter.com/liasidik Or contact our team via WhatsApp +62 89 659 108 869 If you have any additional questions, please leave a comment. Thank You!

1. THE BEAUTY OF LAYOUTING
lia s. Associates
THE BEAUTY OF
LAYOUTING

2. THE BEAUTY OF LAYOUTING
What is Page Layout?
Page Layout is the placement or arrangement of visual elements or
ingredients in a work of art.
It can also be thought of as the organization of the elements of art.

3. THE BEAUTY OF LAYOUTING
Elements of Design
1. Line the visual path that enables the eye to move within the piece
2. Shape areas defined by edges within the piece, whether
geometric or organic
3. Color hues with their various values and intensities
4. Texture surface qualities which translate into tactile illusions
5. Direction visual routes which take vertical, horizontal or diagonal
paths
6. Size the relative dimensions and proportions of images or shapes
to one another
7. Perspective expression of depth: foreground, middle ground,
background
8. Space the space taken up by (positive) or in between (negative)
objects

4. THE BEAUTY OF LAYOUTING
Grids and templates
are page layout
patterns

5. THE BEAUTY OF LAYOUTING
What is the difference between Grid and Template?
GRID
A set of guidelines, visible in the
design process and invisible to
the end-user/audience, for
aligning and repeating elements
on a page.
Using a grid to layout elements
on the page may require just as
much or more graphic design skill
than that which was required to
design the grid.
TEMPLATE
A template involves repeated
elements mostly visible to the
end-user/audience. Using a
template to layout elements
usually involves less graphic
design skill than that which was
required to design the template.
Templates are used for minimal
modification of background
elements and frequent
modification (or swapping) of
foreground content.

6. THE BEAUTY OF LAYOUTING
Why Grids?
1. Grids create visual harmony
2. Grids allow you to do more with less
3. Grids provide coherence to complexity

7. THE BEAUTY OF LAYOUTING
Why Grids?
1. Grids create visual harmony
2. Grids allow you to do more with less
3. Grids provide coherence to complexity

8. THE BEAUTY OF LAYOUTING
Why Grids?
1. Grids create visual harmony
2. Grids allow you to do more with less
3. Grids provide coherence to complexity

9. THE BEAUTY OF LAYOUTING
Anatomy of Grid
Are the negative spaces between
the format edge and the content,
which surround and define the live
area where type and images will
be arranged
Are alignments that break the space into
horizontal bands. It can be used to impose
additional stopping and starting points for
text or images
Are groups of modules that together
form distinct fields. Each fields can be
assigned a specific role for displaying
information
Are placement indicators for subordinate
or consistently appearing text, like running
heads, section titles, folios, or any other
element that occupies only one location in
any layout
Are individual
units of space
separated by
regular intervals
Are vertical alignments of type
that create horizontal divisions
between the margis. There can
be any number of columns,
sometimes they are all the
same width, and sometimes
they are different widths
corresponding to specific
information

10. THE BEAUTY OF LAYOUTING
Basic Structures of Grid
1. Manuscript Grid
The block or manuscript grid is structurally the simplest kind of grid.
Its base structure is a large rectangular area that takes up most of
the page.
2. Column Grid
3. Modular Grid
4. Hierarchical Grid

11. THE BEAUTY OF LAYOUTING
Basic Structures of Grid
1. Manuscript Grid
2. Column Grid
Column grid is pattern that is discontinuous benefits from being
organized into an arrangement of vertical columns. Column grid is
very flexible and can be used to separate different kinds of
information
3. Modular Grid
4. Hierarchical Grid

12. THE BEAUTY OF LAYOUTING
1. Manuscript Grid
2. Column Grid
3. Modular Grid
A modular grid is essentially a column grid with a large number
of horizontal flowlines that subdivide the columns into rows, creating
a matrix of cells called modules.
4. Hierarchical Grid
Basic Structures of Grid

13. THE BEAUTY OF LAYOUTING
1. Manuscript Grid
2. Column Grid
3. Modular Grid
4. Hierarchical Grid
This grid type doesn’t rely on regularly-spaced columns. Size, placement,
and other layout considerations are very important to making this type
of grid work.
Basic Structures of Grid

14. THE BEAUTY OF LAYOUTING
But of course, as with all
design principles,
there are situations that call
for “breaking the rules.”

15. THE BEAUTY OF LAYOUTING
Depending on the needs
of a design, a grid system
can vary drastically from
the basic grid types
discussed above.

16. See you at IG @liasidik with weekly updates and new insights!
lia s. Associates