그리드(그래픽 설계)

Grid (graphic design)
일련의 교차하는 수직 및 수평 그리드 선으로 구성된 페이지 레이아웃 그리드(흰색 선으로 표시됨) 텍스트(내용)는 그리드의 일부가 아니다. 텍스트 내용은 그리드 선의 하단 및 오른쪽을 따라 그리드 "flush left"를 사용하여 특정 페이지에 적용된다. 동일한 그리드를 다른 유형의 내용 또는 동일한 내용 유형의 다른 스타일을 사용하는 여러 페이지에 적용할 수 있다.
비율을 안내하기 위해 추가 각도 선을 사용하여 이미지(페이지 대신) 내에 적용되는 그리드.

그래픽 디자인에서 격자는 일련의 교차 직선(수직, 수평, 각도) 또는 내용을 구조화하는 데 사용되는 곡선(그리드 라인)으로 구성된 구조(보통 2차원)이다. 그리드는 설계자가 합리적이고 흡수하기 쉬운 방식으로 그래픽 요소(이미지, 글리프, 단락 등)를 구성할 수 있는 전기자 또는 프레임워크의 역할을 한다. 그리드는 페이지에 관련된 그래픽 요소, 페이지에 있는 다른 그래픽 요소 또는 동일한 그래픽 요소 또는 모양의 다른 부분과 관련된 그래픽 요소를 구성하는 데 사용될 수 있다.

덜 흔한 인쇄 용어인 "기준 그리드"는 인쇄 초기에 뿌리를 둔 관계없는 시스템이다.

역사

선행자

이동형식이 발명되기 전에는 손으로 쓴 텍스트를 페이지에 배열하는 데 최적의 비율에 기초한 시스템이 사용되었었다. 빌라드 다이어그램으로 알려진 그러한 시스템 중 하나는 적어도 중세시대부터 사용되고 있었다.[1]

현대 격자망의 진화

제2차 세계 대전 이후, 얀 츠치콜드의 다이 타이포그래피(The New Typeography)의 모더니즘 사상에 영향을 받은 맥스 빌, 에밀 루더, 요제프 뮐러 브록만 등 다수의 그래픽 디자이너들이 당시의 전통적인 페이지 레이아웃의 관련성에 의문을 제기하기 시작했다. 그들은 디자이너들이 페이지를 정리하는 데 있어 일관성을 이룰 수 있도록 도울 수 있는 유연한 시스템을 고안하기 시작했다. 그 결과는 국제 타이포그래픽 스타일과 연관된 현대 타이포그래픽 그리드가 되었다. 뮐러-브록만에 의한 그래픽 디자인의 그리드 시스템이라는 주제에 관한 정석적인 연구는 처음에는 유럽에서 그리고 나중에는 북미에서 그리드의 사용을 전파하는 데 도움을 주었다.

반응 및 재평가

1970년대 중반까지 그래픽 디자인 커리큘럼의 일부로서 타이포그래픽 그리드의 지침은 유럽, 북아메리카 및 많은 라틴 아메리카에서 표준이 되었다. 그리드의 그래픽 스타일은 기업 커뮤니케이션을 위한 시선으로 채택되었다. 1980년대 초, 그리드, 특히 그것의 독단적 사용과 기업 문화와의 연관성에 대한 반응은 일부 설계자들이 더 유기적인 구조를 선호하기 위해 그리드의 사용을 거절하는 결과를 낳았다. 애플 매킨토시 컴퓨터의 출현과, 타이프라이터에 의해 정해진 형식에서 디자이너 설정 유형으로의 그 결과적인 전환은, 츠치콜드나 뮐러-브록만의 가르침과는 반대로, 실험의 물결이 일게 되었다. 타이포그래픽 그리드는 오늘날에도 계속 가르쳐지고 있지만, 모든 페이지 설계의 요건이나 출발점이 아니라 일부 프로젝트에 유용한 도구로서 더 많은 것을 가르쳐 준다.

웹 설계에서 그리드 사용

그리드 시스템은 인쇄 매체에서 상당한 사용을 보였지만, 웹 개발자들의 관심은 최근에서야 되살아났다. HTMLCSS를 생성하는 웹사이트 설계 프레임워크는 새로운 프레임워크가 그리드 기반 레이아웃의 사용을 대중화하기 전에 한동안 존재했었다. 일부 그리드 시스템은 픽셀을 가진 고정 너비 요소를 지정하며, 일부는 '유체'로, 이는 페이지 요소 사이징을 픽셀이나 포인트와 같은 절대 단위가 아닌 백분율과 같은 상대 단위로 요구한다는 것을 의미한다.[2]

W3CCSS 그리드 레이아웃 모듈 레벨 1을 발표하여 2차원 그리드 기반 레이아웃 시스템을 정의하였다.[3]

또한 자체 그리드 시스템을 포함하는 CSS 프레임워크도 있다.

인쇄 설계에서 그리드 사용

인쇄 디자인은 항상 그리드 시스템을 사용하여 콘텐츠를 구성하고 구조해 왔다. 그리드 시스템은 필기 도서의 도우미 라인으로 시작되었다. 예술가들은 글과 이미지라는 내용을 읽기 쉽고 흡수하기 쉽게 배치하기 위해 그리드 시스템을 사용했다. 신문, 책, 잡지, 분류 등 모두 더 나은 읽기와 발표를 위해 공간을 최적화하는 서로 다른 그리드 시스템을 사용한다.[4]

소프트웨어

대부분의 데스크톱 출판 소프트웨어와 전문 출판 소프트웨어 및 워드 프로세서를 포함한 기타 사무용 소프트웨어는 그리드 레이아웃을 옵션으로 표시한다.

참조

  1. ^ "Archived copy". Archived from the original on 2013-05-30. Retrieved 2013-06-17.{{cite web}}: CS1 maint: 타이틀로 보관된 사본(링크)
  2. ^ 마르코테, 이단(2009년 3월 3일). "유체 그리드" A List Anthe List Alist Alist.
  3. ^ Tab Atkins Jr.; Elika J. Etemad; Rossen Atanassov (14 December 2017). "CSS Grid Layout Module Level 1". World Wide Web Consortium. Retrieved 10 July 2019.
  4. ^ "What is a grid system?".
  • 베인스, 필, 하슬람, 앤드류 유형 & 타이포그래피, 제2판. 뉴욕: Waston-Guptill Publishments, 2005. ISBN 0-8230-5528-0.
  • 번힐, 피터 활자 공간: 알두스 마누티우스의 타이포그래피에 있는 하우스 규범에서. 런던: 하이픈 프레스, 2003. 페이지 101.
  • 엘람, 킴벌리. 그리드 시스템: 조직 유형의 원리. 뉴욕: Princeton Architecture Press, 2004. ISBN 1-56898-465-0.
  • 호출이, 조스트. 책 디자인: 실천과 이론.
  • 헐버트, 앨런. 그리드: 신문, 잡지 및 책의 설계 및 제작을 위한 모듈형 시스템. 와일리: 1982년. ISBN 0-471-28923-X.
  • Le Corbusier The Modular I.
  • 뮐러-브록만, 요제프 그래픽 설계의 그리드 시스템. 니글리: 1996. ISBN 3-7212-0145-0
  • 루더, 에밀. 타이포그래피. 헤이스팅스 하우스: 1981. ISBN 0-8038-7223-2.
  • 루돌프 보샤르, 한스. 타이포그래픽 그리드. 니글리: 2002. ISBN 3-7212-0340-2
  • 코이 빈, 오예아! 그리드는 좋다. 사우스바이 사우스바이 사우스웨스트 컨퍼런스 프리젠테이션, 2007. [1]
  • Antonio Carusone, 플래시를 위한 그리드 시스템 설계.[2]
  • 마르코테, 이단(2009년 3월 3일). "유체 그리드"
  • 카포, 다니엘레(2009년 4월 5일). "중세지만 후기 현대적인 패션으로 n 파트로 세분화. [3]

외부 링크

  • 그리드 시스템 많은 자원을 가진 실제 그리드의 기술적 측면을 살펴본다.