Grid System



• A grid comprises of a series of guidelines that divide a page into columns
• Grid System is used to control the structure of a web page layout and achieve a consistent and organized design

images/191-1.png

• Without Guides
images/191-2.png

# Turn Guides On/Off
View > Show Guides


• It's important to use a width and column that is easily transferrable between different devices

# Recommended
# Width (total)
1440 px
# Width (usable)
960 px
1200 px

# Number of columns
12 # most popular
8 or 15 # alternatives


• The grid system to use depends on the content and the style of the website
• Not to show certain elements like Logo in smartphone or use smaller logo



Index