Layout Types

A listing of the different types of layouts.

Chart of layout types

- Width Columns Top
Navigation
Side
Navigation
Aligned
Type 1 Fixed 2 Yes Left Left
Type 2 Fixed 2 Yes No Left
Type 3 Fixed 2 No Left Left
Type 4 Fixed 2 No No Left
Type 5 Fixed 2 Yes Left Center
Type 6 Fixed 2 Yes No Center
Type 7 Fixed 2 No Left Center
Type 8 Fixed 2 No No Center
Type 9 Variable 2 Yes Left Full
Type 10 Variable 2 Yes No Full
Type 11 Variable 2 No Left Full
Type 12 Variable 2 No No Full
Type 13 Fixed 3 Yes Left Left
Type 14 Fixed 3 Yes No Left
Type 15 Fixed 3 No Left Left
Type 16 Fixed 3 No No Left
Type 17 Fixed 3 Yes Left Center
Type 18 Fixed 3 Yes No Center
Type 19 Fixed 3 No Left Center
Type 20 Fixed 3 No No Center
Type 21 Variable 3 Yes Left Full
Type 22 Variable 3 Yes No Full
Type 23 Variable 3 No Left Full
Type 24 Variable 3 No No Full
Type 25 Fixed 2 No Right Center
Type 26 Variable 2 No Right Full
Type 27 Fixed 2 No Right Left


Type 1

HEADING  
NAVIGATION
LEFT
COLUMN
150px
MAIN
COLUMN
600px
 
Examples:
furnitureesuperstore.com
zacks.com
streetauthority.com

Type 2

HEADING  
NAVIGATION
LEFT
COLUMN
150px
MAIN
COLUMN
600px
 
Examples:

Type 3

HEADING  
LEFT
COLUMN
150px
MAIN
COLUMN
600px
 
Examples:
directIncorporation.com
premierins.com
olwm.com
ft.com

Type 4

HEADING  
LEFT
COLUMN
150px
MAIN
COLUMN
600px
 
Examples:

Type 5

  HEADING  
NAVIGATION
LEFT
COLUMN
150px
MAIN
COLUMN
600px
 
Examples:
target.com

Type 6

  HEADING  
NAVIGATION
LEFT
COLUMN
150px
MAIN
COLUMN
600px
 
Examples:

Type 7

  HEADING  
LEFT
COLUMN
150px
MAIN
COLUMN
600px
 
Examples:
addme.com

Type 8

  HEADING  
LEFT
COLUMN
150px
MAIN
COLUMN
600px
 
Examples:

Type 9

HEADING
NAVIGATION
LEFT
COLUMN
150px
MAIN
COLUMN
100%
 
Examples:


Type 10

HEADING
NAVIGATION
LEFT
COLUMN
150px
MAIN
COLUMN
100%
 
Examples:

Type 11

HEADING
LEFT
COLUMN
150px
MAIN
COLUMN
100%
 
Examples:
editpadlite.com

Type 12

HEADING
LEFT
COLUMN
150px
MAIN
COLUMN
100%
 
Examples:

Type 13

HEADING  
NAVIGATION
LEFT
COLUMN
150px
MAIN
COLUMN
100%
RIGHT
COLUMN
150px
 
Examples:

Type 14

HEADING  
NAVIGATION
LEFT
COLUMN
150px
MAIN
COLUMN
100%
RIGHT
COLUMN
150px
 
Examples:

Type 15

HEADING  
LEFT
COLUMN
150px
MAIN
COLUMN
100%
RIGHT
COLUMN
150px
 
Examples:

Type 16

HEADING  
LEFT
COLUMN
150px
MAIN
COLUMN
100%
RIGHT
COLUMN
150px
 
Examples:

Type 17

  HEADING  
NAVIGATION
LEFT
COLUMN
150px
MAIN
COLUMN
600px
RIGHT
COLUMN
150px
 
Examples:
fool.com
irs.gov
audible.com
hitwise.com

Type 18

  HEADING  
NAVIGATION
LEFT
COLUMN
150px
MAIN
COLUMN
600px
RIGHT
COLUMN
150px
 
Examples:

Type 19

  HEADING  
LEFT
COLUMN
150px
MAIN
COLUMN
600px
RIGHT
COLUMN
150px
 
Examples:

Type 20

  HEADING  
LEFT
COLUMN
150px
MAIN
COLUMN
600px
RIGHT
COLUMN
150px
 
Examples:

Type 21

HEADING
NAVIGATION
LEFT
COLUMN
150px
MAIN
COLUMN
100%
RIGHT
COLUMN
150px
 
Examples:
amazon.com
alexa.com
imdb.com

Type 22

HEADING
NAVIGATION
LEFT
COLUMN
150px
MAIN
COLUMN
100%
RIGHT
COLUMN
150px
 
Examples:

Type 23

HEADING
LEFT
COLUMN
150px
MAIN
COLUMN
100%
RIGHT
COLUMN
150px
 
Examples:
affiliate-net.net
humanbeatbox.com

Type 24

HEADING
LEFT
COLUMN
150px
MAIN
COLUMN
100%
RIGHT
COLUMN
150px
 
Examples:

Type 25

  HEADING  
MAIN
COLUMN
600px
RIGHT
COLUMN
150px
 
Examples:
bankrate.com

Type 26

HEADING
MAIN
COLUMN
100%
RIGHT
COLUMN
150px
 
Examples:

Type 27

HEADING  
MAIN
COLUMN
600px
RIGHT
COLUMN
200px
 
Examples:
csszengarden.com


 
Bookmark this page: