그리드란 무엇인가요?

그리드 시스템은 한정된 공간 안에서 레이아웃을 배치하는데 도움을 줍니다. 그리드 시스템은 이미 건축, 책, 신문과 같은 곳에서 이미 널리 쓰이고 있습니다. 웹 페이지에서도 그리드 시스템에 의해 레이아웃을 구성하면 더 쉽고 빠르고 아름답게 디자인을 할 수 있습니다. 캠페이너스는 12단 그리드 시스템이 적용되어 있습니다. 간단히 그리드 시스템이 적용된 웹 페이지를 살펴볼까요?

아래 예시는 캠페이너스에서도 채택하고 있는 12단 그리드 시스템을 적용한 사이트 입니다. 언뜻 복잡한 이미지와 텍스트가 배치되어있지만 어수선한 느낌이 들지 않습니다. 그 이유는 바로 그리드 시스템을 적용했기 때문입니다.

레이아웃의 큰 축을 이루는 텍스트들은 12단계의 그리드에 포함되어 있는 것을 확인할 수 있습니다. 캠페이너스는 12단계의 그리드 시스템을 따르고 있기 때문에 각 요소(위젯)들은 1/12칸 단위로만 움직임을 제어할 수 있습니다.

언뜻 보면 움직임의 제약이 많아보이지만, 오히려 이러한 제약이 일관되고 안정된 디자인을 하는데 도움이 됩니다. 틀이 잡혀 있는 그리드 시스템은 디자인 과정을 보다 간단하고 명료하게 해주며, 디자인 작업을 빠르고 편리하게 해줍니다. 즉, 그리드 시스템은 디자인 방법의 하나로 보다 객관적이고 합리적으로 작업할 수 있도록 해줍니다.

그리드 시스템의 역할과 장점

• 그리드 시스템으로 더 좋은 구조를 만들 수 있습니다.
• 디자인의 위치에 대해 적절한 지침을 내려줍니다.
• 가독성과 주목성을 더 향상시킬 수 있습니다.