디자인은 미학과 외모만이 아닙니다. 그것은 또한 마케팅이며 때로는 제품 자체이기도 합니다. 오늘날 방문자는 실제 매장이나 매장을 방문하기 전에 웹사이트를 확인하는 경향이 있습니다. 따라서 온라인 상태를 관리할 때 다음을 확인해야 합니다. 반응형 웹 디자인 런던 또는 지속적인 성공을 거두는 우아한 디자인으로 어디서나.
성공의 스카이라인으로 안내하는 효과적인 웹 디자인의 원칙
시각적 계층 구조 고정
가장 큰 소리로 외치거나 말하는 사람이 어떻게 사람들을 방심케 하고 이목을 집중시키는지 아십니까? 웹 디자인도 마찬가지입니다. 유추 이면의 아이디어는 인간의 눈이 보는 것을 인식한다는 것입니다. 즉, 웹 사이트의 일부는 다른 부분보다 더 중요합니다. 이러한 측면은 일반적으로 양식 및 클릭 유도문안이며 웹사이트에서 강조해야 하는 요소입니다.
여기서 '크게'는 크기가 더 크거나 색상이 더 밝음을 의미합니다. 그리고 이것은 전자 상거래의 거물인 Amazon이 최대한 완벽하게 구현하는 것입니다. 코퍼레이션은 '장바구니에 담기'와 '지금 구매하기'를 색상을 사용하여 강조합니다. 시각적 계층을 결정할 수 있는 다른 주목할만한 요소는 이미지, 질감, 스타일 및 공백입니다.
신성한 비율에 초점
웹 디자인은 크기와 색상에서 멈추지 않습니다! 상당한 수준의 수학이 포함됩니다. 그러나 걱정할 필요는 없습니다. 마법의 숫자 1.618을 생각하기만 하면 됩니다. 바로 황금 비율입니다. 전문가들은 비율을 정의하기 위해 황금 비율을 사용하는 웹 디자인이 더 나은 미학을 가지고 있다고 가정합니다.
이것이 바로 트위터의 크리에이티브 디렉터인 Doug Bowman이 언급한 황금 비율의 중요성입니다(얼마 전에).
예를 들어 레이아웃 너비가 960px라고 가정해 보겠습니다. 먼저 1.618로 나눕니다. 콘텐츠 영역의 너비는 약 593px입니다. 나머지 367px는 사이드바로 이동합니다. 몇 가지 수치를 더 던지기 위해. 웹 사이트 높이가 768px라고 가정해 보겠습니다. 당신이 할 수 있는 일은 이것을 474.66px와 293.33px로 나누는 것입니다.
가독성
또 다른 원칙은 말장난입니다. 디자인 요소가 웹사이트의 힘이라면 텍스트 콘텐츠는 두뇌입니다. 즉, 텍스트는 정보를 제공할 때 웹사이트를 지배합니다. 검색 엔진 크롤러는 이 아이디어에 익숙하며 SEO 전략의 중요한 측면이 되었습니다.
활판 인쇄술
텍스트 자체가 가독성을 나타내지만 타이포그래피도 있습니다. 온라인 방문자에게 시각적으로 어필하여 콘텐츠에 개성을 더하는 것입니다. 타이포그래피는 키워드, 메타 데이터 및 기타 SEO 관련 요소에 영향을 주어 전반적인 정신에 영향을 미칩니다. 이 문제를 해결하는 방법은 Arial 및 Helvetica와 같은 읽기 쉬운 글꼴을 사용하는 것입니다. 이들은 본문 텍스트에 탁월합니다. 다음은 헤드라인과 버튼을 포함한 모든 디자인 요소에 대한 적절한 서체 조합을 선별하는 것입니다.
F자 패턴 판독
무의식적으로 방문자는 F 기반 패턴을 사용하여 웹 사이트 텍스트를 항상 스캔합니다. 연구에 따르면 사람들이 보고 싶어하는 것 또는 적어도 대부분은 화면의 왼쪽과 상단 부분에 있습니다. 그리고 왜 'F'인가? 서양의 독서 패턴과 비슷합니다. 왼쪽에서 오른쪽으로, 위에서 아래로.
그리드 기반 레이아웃
웹 디자인은 가장 매력적인 색상과 언어로 구성될 수 있습니다. 그러나 구조가 없으면 웹 콘텐츠가 효과가 없는 것으로 간주됩니다. 여기에서 그리드가 구출됩니다. 그리드 기반 레이아웃은 열과 섹션이 있는 견고한 구조로 콘텐츠를 정렬하고 정렬합니다. 그 결과 미학적으로 만족스러운 웹사이트가 탄생했습니다.
모바일 친 화성
예전에 웹 디자인은 데스크탑과 랩탑 컴퓨터의 구성을 염두에 두었습니다. 하지만 더 이상은 아닙니다. 오늘은 전세가 역전됐다! 스마트폰, 태블릿 및 기타 장치의 사용이 계속 증가하고 있습니다. 이러한 장치는 화면 크기가 다릅니다. 따라서 이것이 웹 디자인에서 의미하는 바는 다양한 화면 크기 및 장치를 지원하고 호환되어야 한다는 것입니다. 그렇지 않으면 경쟁에서 지게 됩니다. 그러나 모바일 친화성은 사용자에게 더 좋고 정확한 결과를 제공합니다. 검색 결과는 사용자의 현재 위치를 기준으로 타겟팅되며 스마트폰은 휴대형이므로 현재 위치가 변경될 수 있습니다(특히 출퇴근 시간에).
카테고리
웹사이트가 탐색하기 쉽지 않으면 손실을 보게 됩니다. 또한 이는 이탈률을 높이고 전체 SEO 점수를 낮춥니다. 탐색 친화적 인 웹 디자인은 사용자가 더 오래 머물도록 유도합니다. 이에 대한 방법은 페이지의 논리적 계층을 만들고 클릭 가능한 버튼을 디자인하는 것입니다. 또 다른 측면은 'XNUMX의 법칙'이다. 웹 디자인은 방문자에게 세 번의 클릭으로 필요한 정보를 제공해야 합니다.
다음은 이를 올바르게 수행하는 데 도움이 되는 몇 가지 기본 사항입니다.
근접의 법칙
그룹화된 사물이나 측면은 단일 지각 대상이 되는 경향이 있습니다. 효과적인 웹 디자인에도 동일하게 적용됩니다. 탐색 친화적 웹 디자인은 탐색 메뉴 및 바닥글과 같은 관련 요소가 그룹화되는 디자인입니다. 광고 웹사이트인 Craigslist는 이 법칙을 활용하여 하위 범주를 정의했습니다.
유사성의 법칙
원칙은 디자인 자체와 더 관련이 있습니다. 예를 들어 모양, 색상 또는 음영이 유사한 측면은 그룹 또는 단위입니다.
대칭의 법칙
대칭 요소는 비대칭 요소보다 지각적으로 더 즐겁습니다. 또한 웹 사이트를 보다 조직적이고 미세하게 조정한 느낌을 줍니다. 또한 대칭은 웹사이트에 구조를 추가하고 시청자가 사이트를 스크롤하는 것을 편안하게 만듭니다.
분리 단어
웹 디자인은 뛰어난 첫인상을 만드는 데 도움이 되며 이는 쉬운 일이 아닙니다. 수많은 지침에도 불구하고 이 노력은 여전히 많은 사람들에게 벅찬 일입니다. 그럼에도 불구하고, 디지털 시대에 온라인 존재는 불가피하며 거기에 있는 모든 도구와 기술을 최대한 활용해야 합니다. 분명히 처리해야 할 것이 많고 숙고해야 할 것이 더 많지만 전략적인 계획을 염두에 둔다면 훨씬 쉬워집니다.