컬럼,그리드 등 웹사이트 디자인 용어웹사이트 개발을 의뢰했는데 사이트 설명을 하는 과정에서 컬럼, 그리드 이런용어를 사용하더라구요 제가 알고있는 지식은 엑셀로 따졌을때 컬럼은 '열' 그리드는 '내용병합'이 맞을까요? 그리고 사이트 좌측에 있는 행메뉴 또한 컬럼이라고 불러도 되는건지? 너무 어렵네요
웹사이트 디자인에서 사용되는 컬럼(Column)과 그리드(Grid) 용어는 엑셀에서 사용하는 것과는 다소 다른 개념입니다. 웹 디자인에서는 주로 레이아웃을 구성하는 방식에 대한 용어로 사용되며, 이해하기 쉽게 설명드릴게요.
1. 그리드 (Grid)
- 그리드 시스템은 웹페이지를 구성하는 여러 개의 열과 행을 정리해 놓은 격자 같은 구조입니다.
- 웹사이트에서 그리드는 콘텐츠의 배치를 일관성 있게 만들기 위해 사용됩니다. 즉, 여러 개의 컬럼과 행을 정리해놓은 틀이라고 생각하시면 됩니다.
- 예를 들어, 12-컬럼 그리드는 웹페이지를 12개의 세로 열로 나누어 콘텐츠를 배치하는 방식입니다.
2. 컬럼 (Column)
- 컬럼은 그리드 시스템 내에서 세로로 나누어진 칸을 말합니다.
- 예를 들어, 12-컬럼 그리드에서 각 컬럼은 1/12 크기의 구역이 됩니다. 웹사이트 디자인에서 컬럼은 콘텐츠나 요소들을 세로로 정렬할 때 사용됩니다.
- 엑셀에서 "열"을 말하는 것과 비슷하지만, 웹 디자인에서는 페이지 내 콘텐츠를 구분짓는 세로 칸을 뜻합니다.
3. 행 메뉴에 대한 질문:
- 행 메뉴(예: 사이트 좌측에 있는 네비게이션 바)는 일반적으로 컬럼이라고 부르지 않습니다. 대신 네비게이션이나 사이드바(Sidebar) 라고 부르며, 컬럼은 보통 페이지 레이아웃에서 콘텐츠를 나누는 세로 영역을 의미하기 때문입니다. 다만, 그리드 시스템에서 사이드바 영역도 하나의 컬럼으로 포함될 수 있습니다.
정리:
- 그리드: 웹사이트 전체 레이아웃을 구성하는 격자 시스템.
- 컬럼: 그리드 내의 세로 열.
- 행 메뉴: 보통 사이드바라고 부르며, 그리드의 컬럼으로 분류될 수 있지만 일반적으로는 별도의 메뉴 영역입니다.
웹사이트 디자인에서의 용어가 처음엔 어렵게 느껴질 수 있지만, 한 번 개념을 이해하면 점차 쉬워질 거예요.
