WordPress 디자인에서 공백의 효과적인 사용
게시 됨: 2022-03-09웹사이트는 이미지와 의도가 모두 다릅니다. 한 사람에게 효과가 있는 것이 다른 사람에게는 효과가 없습니다. 즉, 모든 사이트는 아니지만 대부분의 사이트에 적용되며 모든 디지털 마케팅 도구 및 전략의 필수적인 부분이어야 하는 반응형 디자인의 몇 가지 요소가 있습니다. 이러한 요소 중 하나는 "여백"을 잘 활용하는 것입니다.
물론 웹사이트 디자인은 항상 외관과 효율성 사이에서 최적의 지점을 찾는 것입니다. 당신이 초보자 블로거이든 이를 달성하려는 고급 개발자이든, 도전 과제는 동일하게 유지됩니다.
특히 워드프레스 디자인은 여백이 좋습니다. 공백을 잘 사용하는 사이트의 좋은 예는 WPTavern을 참조하십시오. 이를 위해 블로그 테마를 사용할 필요는 없습니다. 자유롭게 실험해 보세요.
WordPress의 또 다른 좋은 점은 얼마나 널리 사용되는지입니다.
이로 인해 사용자가 쉽게 이해할 수 있는 웹사이트를 만드는 데 필요한 풍부한 정보를 제공합니다.
개업 정보면 충분합니다. 이 단락을 닫고 이 섹션과 다음 섹션 사이의 명확한 구분을 만들기 위해 약간의 공백을 사용하도록 합시다.
공백이란 무엇입니까?
어느 정도 공백은 들리는 그대로입니다. 내용이 없는 페이지에 있는 것입니다. 그러나 이 공간이 흰색이어야 한다는 생각에 속지 마십시오. 아니요, 원하는 색상이 될 수 있습니다. WordPress는 결정한 공백 색조를 포함하여 프로젝트에서 가장 잘 작동하는 것과 관련하여 뛰어난 사용자 지정 색상 포인터를 제공합니다.
예를 들어, WordPress 디자인으로 만든 국립 아프리카 미술관 사이트의 여백에서 색상 옵션의 멋진 사용을 살펴볼 가치가 있습니다. 그들은 특징적인 이미지를 아름답게 보완하는 역할을 하는 조용한 배경을 형성합니다.
따라서 흰색 공간은 표면적으로 많은 기능이 없는 모든 색상의 공간입니다.
아니면?
얼굴 너머를 보면 기능이 나타납니다. 모든 디자인 응용 프로그램과 마찬가지로 공간은 선명도, 대비, 컨텍스트 및 프레이밍 측면에서 매우 중요할 수 있습니다. 우리는 적절한 시기에 공백을 사용하는 이러한 이유(및 기타 이유)를 살펴볼 것입니다.
공백의 유형
먼저 접할 수 있는 공백의 종류를 살펴보겠습니다.
마이크로 및 매크로
전자는 기본적으로 이해를 가능하게 하는 비교적 적은 양의 여백이다. 여기에는 텍스트 줄 사이의 공백이 포함됩니다. 이것이 없으면 사이트는 사용자에게 웹사이트를 디자인해서는 안 된다는 의사소통을 제외하고는 어떤 면에서도 의사소통 도구로 기능하지 않을 것입니다.
후자는 보기에서 구성 요소 사이의 더 큰 공간을 나타냅니다. 그래서 페이지의 경계를 이루는 공간은 물론이고 명확하게 감상하고 이해하고 싶은 이미지와 텍스트 덩어리에 숨을 쉴 수 있는 공간을 제공합니다. 그리고 명확한 이해는 사이트 성공의 열쇠입니다.
이 영역에서 WordPress 디자인을 간소화하는 방법을 쉽게 탐색할 수 있습니다.
수동 및 능동
디자이너가 의도했든 아니든 수동적 공백은 나타납니다. 줄과 단락을 만들 때 텍스트 편집기가 삽입할 공간의 자동 존재입니다.
활성 공백은 디자이너가 의도적으로 페이지 요소 사이에 더 많은 공간을 제공한 곳입니다. 이유는 아래에서 설명하겠습니다. 일반적으로 요소가 더 뚜렷할수록 요소 사이에 더 많은 공간이 있어야 합니다. 우리는 매우 기초적인 생물일 수 있으며 "깃털이 뭉쳐진 새" 사고방식으로 작업하는 경향이 있습니다.
공백을 사용하는 이유
이제 웹 디자인에서 공백이 사용되는 이유를 살펴보겠습니다.
명쾌함
이것은 대단히 중요합니다. 웹사이트 디자이너가 저지르는 매우 흔한 실수는 페이지에 너무 많은 내용을 집어넣어 전달하려는 핵심 메시지를 어지럽히고 모호하게 만드는 것입니다. 깔끔한 레이아웃이 좋은 레이아웃임을 기억하십시오.
디자인 요소가 규율 부족으로 고통받는 상황에서 사용자는 당황하고 결과적으로 사이트를 조기에 떠날 수 있습니다. 이와 같이 열악한 사용자 경험을 제공하는 경우 높은 이탈률을 기대할 수 있습니다.
지나치게 복잡하면 처음에는 로딩 속도에도 영향을 미칠 것이며, 높은 로딩 속도 = 높은 포기율입니다.
고맙게도 WordPress의 속도를 높이는 방법은 많이 있습니다.
차이
대조되는 색상의 공간으로 이미지나 텍스트 상자를 둘러싸면 훨씬 더 큰 영향을 미칠 수 있습니다. 이러한 종류의 색 구성표는 소화 공간을 제공하여 사용자가 다음 자료를 만나기 전에 전달되는 내용을 씹을 수 있습니다.
공백을 통한 대비는 사이트의 특정 요소를 강조 표시하는 데 사용할 수도 있으므로 사용자가 예를 들어 CTA 상자를 클릭하여 특정 경로를 선택하도록 할 수 있습니다.

문맥
때로는 컨텍스트의 오용을 방지하기 위해 약간의 공간을 확보해야 합니다. 진지한 점과 유머러스한 이미지의 안타까운 병치는 아무 소용이 없다.
프레이밍
이것은 순전히 미학적입니다. 이미지는 프레임과 함께 더 잘 보입니다.
그리고 프레임은 다른 자극이 들어와 침입하는 것을 막는 효과적으로 그림 주위의 공간입니다.
프레이밍은 약간 사소해 보이지만 매우 중요합니다. 온라인 상점을 시작하려는 사람에게는 필연적으로 전체 거래의 일부가 제품 이미지 모음이 될 것입니다. 프레임 없이 이미지를 서로 강하게 붙이십시오. 엉망은 결과입니다. 눈은 눈 앞에 있는 것을 제대로 인식하기 위해 자연스럽게 프레임이 필요합니다. 덧붙여서, WordPress 디자인에는 몇 가지 훌륭한 시작 기능이 있습니다.
작동한다면…
공백은 오랫동안 우리와 함께했습니다. 그것은 20세기 초 중국의 서예가와 예술가의 접근 방식에 뿌리를 두고 있습니다. 잉크와 라이스페이퍼로 작업하면서 이 장인들은 시트에 추가한 것뿐만 아니라 비어 있는 것에서도 의미를 찾았습니다. 마찬가지로 대화의 침묵은 어떤 말보다 더 많은 표현을 할 수 있으며 페이지의 공간은 적절한 시기에 적절한 방식으로 사용된다면 의미를 전달할 수 있습니다.
이 시작부터 여백은 20세기 전반에 걸쳐 세계적으로 지배적인 모더니즘을 특징짓게 되었습니다. 이 멋진 신고전주의는 오늘날에도 계속 울려 퍼지고 있으며 우아함과 품질의 약칭입니다. 이것이 많은 브랜드에서 이미지 디자인에 큰 효과를 주기 위해 사용하는 이유입니다. WordPress는 미니멀리스트 테마로 이를 제공할 수 있습니다.
테마 및 템플릿
전 세계의 테마 디자이너는 WordPress 사용자에게 무수히 많은 사용자 정의 테마 옵션을 제공하여 공백 사용에 도움이 될 수 있습니다. 전자 상거래 테마, 깔끔한 테마, 순전히 우아한 테마 또는 유연한 테마를 사용하려는 경우 WordPress 디자인이 다양한 테마 옵션을 제공하는 방법을 살펴볼 가치가 있습니다.
Total WordPress 테마는 예를 들어 사이트에 활성 공백을 추가하고 사용자 지정하는 데 사용할 수 있는 다양한 설정을 제공합니다. 사이트 너비, 열 간격, 전체 화면 행 등에 대한 옵션을 사용하여 게시물과 페이지에 공백을 추가합니다.
또는 완전한 미니멀리스트이자 다목적 테마인 Blank Canvas로 모든 것을 할 수 있습니다.
템플릿도 공백 배포를 지원할 수 있습니다. WordPress는 랜딩 페이지 템플릿을 원하든 더 일반적인 것을 원하든 디자이너에게 사용할 수 있는 아름다운 템플릿을 제공합니다.
균형을 맞추십시오
여백에서 중요한 것은 성공적인 균형을 이루는 것입니다. 언급했듯이 한 번에 너무 많은 것을 화면과 사용자에게 과부하시키는 위험을 감수할 수는 없습니다. 반면에 실제로 할 말이 있고 서비스를 제공하는 것처럼 보일 필요가 있습니다.
사용할 공백의 양은 웹사이트가 무엇에 관한 것인지에 따라 크게 달라질 수 있습니다. 모든 마케팅 도구와 마찬가지로 마케팅 대상에 따라 마케팅 방식이 달라질 수 있습니다. 전시의 방식으로 많이 필요합니까? 제품이 매우 잘 알려진 경우 사용자는 컨텍스트 정보가 많이 필요하지 않습니다.
예를 들어, WordPress 디자인을 사용하여 만든 Walt Disney 사이트는 방문 페이지에서 정보가 거의 없는 경로로 이동합니다. 이미지에 디즈니 이름이 겹쳐서 큰 영향을 미치고 있습니다. 확실히 얻지 못하고 필요하지 않은 것은 Disney가 누구이며 무엇에 관한 것인지 설명하는 정보입니다.
신제품을 출시하는 신생 기업의 경우 다른 고려 사항과 SaaS 아이디어를 탐색해야 합니다. 이 모든 정보가 스크롤 없이 볼 수 있는 부분에 쉽게 표시되기를 바랍니다.
그러나 나누어 줄 덩어리가 있더라도 더 많이 하기보다는 적게 하는 편에서 잘못을 범해야 한다고 말하는 것이 공평합니다. 사용자가 더 많은 것을 배우고자 하는 의향을 보이면 언제든지 더 자세한 하위 페이지로 사용자를 추천할 수 있습니다. 이에 대한 예는 WooCommerce 랜딩 페이지를 참조하십시오.
웹사이트는 멋진 외모로 관심을 끌고 의미 있는 의사 소통을 촉진하여 그 관심을 좋은 쪽으로 돌릴 때 가장 좋습니다. 우리가 배웠듯이 정보 전달은 콘텐츠의 양에만 의존하지 않습니다. 독자에게 데이터를 제공하기 위해 모든 것을 한 번에 제공하면 과부하가 발생할 수 있습니다.
공백으로 간소화할 수 있습니다. 전문 디자이너이든 막 시작하는 사람이든 관계없이 공백을 사용하여 WordPress에서 최상의 효과를 얻을 수 있습니다.
여백은 공간을 제공하며, 이는 중요한 포인트를 얻는 데 필요한 것입니다. 때로는 대화에서 가장 설득력 있는 부분이 임신부가 될 수 있습니다. 정지시키다.