수평 홈통에 대한 특정 용어가 있습니까?


12

컨텍스트
우리 팀은 반응 형 웹 사이트에서 작업하고 있으며 사용자는 그리드 "셀"사이의 공백을 포함하여 페이지의 일부 속성을 구성 할 수 있습니다. 우리는 "세포 사이의 공간"을 식별하기 위해 올바른 용어에 대해 대화했습니다. 분명히 우리는 "여백"과 같은 것을 사용할 수 있지만 페이지와 가장 바깥 쪽 셀 사이의 공간을 포함하기에 너무 넓습니다. 셀 사이의 공간 만 식별하려고합니다. 우리의 사용자는 기술에 정통해야 할 필요는 없지만 (CSS 등을 의미) 그래픽 디자인에 대한 배경 지식이 있거나 최소한 일반적인 용어에 익숙 할 수 있습니다.


"Gutter" 라는 질문 은 가장 정확한 용어처럼 보이지만 에서 공백을 구체적으로 언급 할 수있는 "Gutter"에 대한 대부분의 정의는 다음과 같습니다 .

사이의 공백에 대한 특정 용어가 있습니까? 아니면 단순히 "수평 거터"라고 부르는 것이 적절합니까?


다음은 내가 식별하려는 것을 보여줍니다.
( https://www.init.de/en/news/responsive-design 에서 빌린 이미지 )

여기에 이미지 설명을 입력하십시오

내 현재 용어의 문제점
"수평 (/ 수직) 거터"는 거터가 수평 (/ 수직) 요소들 사이에 있는지 또는 수직 (/ 수직) 사이에 수평 (/ 수직) 공간을 제공하는지 확실하지 않기 때문에 약간 혼란 스럽습니다. 수평) 요소. 팀에서 어떤 정의가 정확한지에 대해 의견이 맞지 않아서 그 문구가 실제로 혼란 스러울 정도로 충분한 증거라고 생각합니다.

적어도 웹과 관련하여 "패딩"과 "여백"은 내가 설명하는 내용에 적합하지 않습니다. 패딩은 테두리와 내용 사이의 간격을 말하고 여백은 요소 주위 의 공간을 나타냅니다 . 각각 10px의 여백을 가진 두 개의 인접한 요소는 그 사이에 20px 거터를 갖습니다. (예, CSS 마진이 종종 붕괴 되지만 항상 그런 것은 아님을 알고 있습니다.)

반응 형 그리드 프레임 워크에서 자주 사용되는 "홈통"이라는 용어를 보았으므로 웹 개발에서 허용되는 용어라는 것을 알고 있습니다. "수평 홈통"에 대해 더 적절한 용어가 있는지 궁금합니다.


좋은 질문입니다. 나는 그 용어를 잘 모릅니다. 그러나 거 터라는 용어는 종종 잘못 사용됩니다. 기둥 사이의 간격을 골목 이라고합니다 . 설명을 위해이 이미지보십시오
Zach Saucier

당신은 구체적으로 여기에서 선두를 의미하지는 않습니까? 단락 간격은 어떻습니까?
e100

상황이 전부입니다. 테이블 같은이 소리, 나는 무엇이든 용어 (나는 그것의 '패딩'IIRC 생각) 스프레드 시트 셀에 대한 서식 옵션을 선택 MS 엑셀 사용을 차입을 건의 할 것
DA01

에 관해서는 간격 단락 우리가 열에서 단락 사이의 수평 공간에 대해 진정으로 얘기하면 나는 용어 그래픽 디자이너 사용이 생각 입니다 '단락 간격'.
DA01

즉 테이블 / 그리드의 외부의 주위에 공간을 추가로 셀 간격이 정확하지
JDB은 여전히 모니카 기억

답변:


3
짧은 답변

"행 간격"을 사용합니다.

긴 대답

JDB가 언급했듯이, 나는 (매혹적인) 인쇄 매체 세계에서 조판 용어를 가져 오는 대신 웹 관련 용어를 사용하려고합니다.

대부분의 그리드 레이아웃은 "열"과 "그리드"라는 용어를 사용하기 때문에 "열 간격"과 "행 간격"이라는 용어를 사용합니다. CSS 키워드와의 충돌을 피하기 위해 "여백"과 "패딩"이라는 용어를 사용하지 마십시오.


1
새로운 CSS Grid 사양은 grid-row-gap및을grid-column-gap 정의 하지만 실제로는 "간격"을 조금 더 좋아합니다.
JDB는 여전히 Monica

7

OP의 질문의 범위 인 웹 디자인의 범위에서는 (매혹적인) 인쇄 매체 세계에서 조판 용어를 가져 오는 대신 웹 관련 용어를 사용하려고합니다.

CSS margin 속성에서와 같이 이것을 "vertical margin"이라고합니다. 여백은 인접한 요소의 경계 사이의 간격입니다 (요소 내부의 간격 인 패딩과 반대로 경계와 내용 사이의 간격).

여기에 이미지 설명을 입력하십시오

W3C의 말에서 :

여백은 요소 주변의 경계를 벗어납니다. 여백에는 배경색이 없으며 완전히 투명합니다. 출처

요소의 테두리는 투명 할 수 있습니다. 눈에 띄지 않아도됩니다.

개발자는이 용어를 매우 명확하게 이해해야합니다. 그리고 제 생각에는 "여백"은 "거터", "애 슬레"또는 "슬러그"보다 매력적이지 않지만, 고객은 더 친숙한 용어를 찾아야합니다.

침략

Cellpaddingcellspacing와 유사 padding하고 margin, 그러나 그들은 너무 구체적이다. 일반적인 CSS 속성이 아닌 <table><td>태그 의 유효한 html 속성입니다 . 다른 태그에는 적용 할 수 없습니다. ( <table>태그를 사용하여 만든 구문에서와 같이) 테이블에 대해서만 이야기하는 경우 해당 영역을 호출하면 맞습니다 cellspacing. 당신이 (에 의해 정의 된 영역에서와 같이 일반적으로 직사각형 영역에 대해 이야기하는 경우 <div>, <span>, <img>또는 다른 태그), 다음 margin더 정확한 것입니다.

그냥 측 의견과 같이 있음을 통지하시기 바랍니다 cellpadingcellspacing더 어렵다 페이지의 결과로 스타일 (CSS)와 구조까지 속성 믹스 (HTML)이 유형의 유지 및 / 또는에 의해 개발 때문에 속성은 현대적인 웹 디자이너와 개발자에게 매우 눈살됩니다 팀. 개발자는 이러한 속성을 사용 하지 말고 CSS 속성 paddingmargin대신 사용하는 것이 좋습니다.

일반적인 레이아웃을 생성하기 위해 테이블을 사용하는 경우에도 마찬가지입니다. 순수 주의자들은 표는 표 형식의 데이터를 표시하는 데만 사용해야한다고 주장합니다. <div><span>태그 비계에 사용되어야한다. 언젠가 우리가 의미 적으로 웹 페이지를 의미있게 수정하기를 희망하는 것은 태그가 컨텍스트를 의미 적으로 표시하는 것입니다.


2
"여백"은 요소 주위 의 공간을 나타내는 일반적인 용어 인 반면 "거터"는 특히 요소 사이 의 공간을 나타냅니다 . 예를 들어, 두 개의 연속 요소가 각각 10px의 여백을 갖는 경우 이들 사이의 홈통은 20px입니다. 다양한 격자 레이아웃 프레임 워크에서 "거터"가 자주 사용되는 것을 보았으므로 웹 사이트의 맥락에서 벗어나지 않는다고 생각합니다. 세로로 쌓인 요소 사이의 공간에 대한 올바른 용어인지 궁금합니다.
JDB는 여전히 Monica를 기억합니다.

1
@JDB : 충분합니다 ... 요소들 사이의 공간이 청중에 따라 달라질 수 있기 때문에 "홈통"을 받아들이는 것 같습니다. BTW에서 HTML / CSS 여백은 때때로 함께 축소되므로 10px 여백을 가진 두 요소가 반드시 20px 여백을 가질 필요는 없습니다. 여백이 무너지면 10px 거터로 끝날 수 있습니다. css-tricks.com/almanac/properties/m/margin
cockypup

또한 CSS의 "margin"은 일반적인 용어가 아닙니다. 매우 구체적인 정의가 있습니다. w3.org/TR/CSS2/box.html
cockypup

1
좋은 지적. "최종 요소 사이에 남은 실제 공간"을 나타내는 용어를 사용하는 것이 좋습니다.
cockypup

1
그들은 마진이됩니다 방법의 모든 목록을 비록 되지 붕괴를, "마진 붕괴는 설명서의 규칙이 아니라 예외가 될 것으로 보인다 적어도, 문서는 영어 문법 책처럼 읽는 없습니다 :.. 어떤 규칙 및 모든 예외를 아마, 적어도 당신의 팀을 위해, 당신은 (비) 붕괴 후 요소들 사이의 수직 마진 인 용어 ( "alley"와 같은)를 정의합니다.
Yorik

4

조판 용어에서 슬러그 는 수평 간격에 대한 일반적인 용어입니다. -단락 뒤 / 앞의 공간, 섹션 간 또는 규칙 간 수평 간격 등. 슬러그는 유형 크기와 유사한 지정된 크기를 가지며 적절한 수직 간격을 만들기 위해 금속 유형과 나란히 배치됩니다.

편집을 기반으로 ....

Cell padding가장 확실한 선택 인 것 같습니다. 또는 cell spacing.


이 용어는 섹션 뒤의 간격에도 적용됩니까? 아니면 단락?
Zach Saucier

1
수평 공간이 사용되는 모든 영역에 적용됩니다. 핫 타입 시절에 슬러그는 단락, 열, 규칙 등의 조판 된 영역 사이에 수평으로 균등 한 공간을 만드는 데 사용되었습니다.
Scott

나는 그것을 좋아하지만 웹 디자인에 두 번째 정의가 있기 때문에 웹 디자인에 매우 혼란 스럽습니다.
JDB는 여전히 Monica를 기억합니다.

1
슬러그는 모든 간격에 사용되는 용어입니다. 오목한 금속 슬러그로 잉크가 달라 붙지 않습니다. 그것들은 단락 간격 또는 다른 간격 요구를 만들기 위해 유형 사이뿐만 아니라 수평 간격 및 정렬 유형을 만드는 데 사용되었습니다. 나는 신문을 위해 일하지 않았다면 오늘날 많은 디자이너들이 알고있는 용어가 아니라는 것을 알고 있습니다. 그렇다고 그것이 정확하지 않다는 것을 의미하지는 않습니다. 세로 항목은 xheight, lead 및 slug입니다. 웹 디자인의 엄격한 측면에서, 나는 "여백"을 사용하는 경향이 있습니다.
Scott

1
...이 답변을 게시 한 후 훨씬 더 추가하기 위해 질문이 편집되었음을 알 수 있습니다. 이전에는 "웹"에 대한 언급이 없었습니다.
Scott

1

레이아웃 디자인에서 그리드의 가로 거터를 "흐름 선"또는 "행선"이라고합니다.


2
GD.SE에 오신 것을 환영합니다! 답변을 더 잘 설명하십시오. "레이아웃 디자인"이란 무엇입니까?
Mensch

Kurt가 말한 것에 추가하기 위해 시각적 예제도 포함시킬 수 있습니다.
벨츠
당사 사이트를 사용함과 동시에 당사의 쿠키 정책개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.