글꼴과 크기가 웹사이트 브랜딩을 향상시키는 방법
게시 됨: 2017-04-19모든 비즈니스 소유자는 명확하고 적절하게 설계되고 잘 관리된 웹사이트의 중요성을 알고 있습니다. 오늘날과 같은 시대에 고객에게 진정으로 감동을 줄 웹사이트를 제공하지 못하면 고객의 신뢰를 얻는 데 걸리는 시간보다 훨씬 빨리 고객을 잃게 됩니다.
불행히도 대부분의 기업가는 노력을 기울이고 개발에 능숙한 디자이너를 고용하지만 종종 한 가지 중요한 기능인 서체를 간과합니다.
사용하는 글꼴 스타일에서 각 내부 웹사이트 페이지의 텍스트 크기에 이르기까지 이것은 클라이언트가 머물고 상호 작용하고 최종적으로 전환하는지 여부를 결정하는 요소 중 하나입니다.
사실 글꼴은 그다지 영향력이 없어 보이지만 비즈니스를 위 또는 아래로 끌어들이는 힘이 있습니다. 정말 간단합니다. 웹사이트 방문자가 귀하가 게시한 콘텐츠를 읽을 의사가 없거나 읽을 수 없는 경우 메시지가 해당 방문자에게 전달되지 않아 변환할 수 없습니다. 여러 연구에 따르면 웹사이트에 사용되는 글꼴 유형은 가독성뿐만 아니라 분위기, 사용자 경험 및 인식되는 기사 길이에도 영향을 미칩니다. 이것이 바로 디자이너가 많은 콘텐츠로 웹사이트를 만드는 것과 독자의 기분을 좋게 하는 유쾌하고 임팩트 있는 디자인을 가진 웹사이트를 개발하는 것의 차이를 이해하는 것이 필수적인 이유입니다.
"타자는 아름다운 글자의 집합이 아니라 아름다운 글자의 집합이다."
글꼴 하면 가장 먼저 떠오르는 것이 무엇입니까? 아직 그 중요성을 이해하지 못하는 대부분의 사람들과 같다면 아마도 Calibri, Comic Sans, Arial, Times New Roman 등과 같은 서체를 생각하고 있을 것입니다. 그러나 알아야 할 것은 이것들은 단지 기본에 불과하다는 것입니다. 웹사이트에 구현해야 하는 타이포그래피에 대해 이야기할 때 서체뿐만 아니라 크기, 색상, 커닝 및 간격도 고려해야 합니다.
이 기사에서 우리의 목표는 글꼴의 중요한 기능의 영향에 대해 말할 뿐만 아니라 웹사이트의 전환율을 높이는 데 사용할 수 있는 실용적인 제안을 제공하는 것입니다. 연필과 메모장을 준비하세요. 놓치고 싶지 않은 정보이기 때문입니다.
서체와 그 영향
글꼴 및 타이포그래피에 대한 몇 가지 기사를 읽었다면 온라인 출판에 적합한 여러 글꼴이 있다는 것을 알 것입니다. 일부는 조지아가 가장 많은 결과를 가져온다는 데 동의하지만 다른 일부는 Baskerville이 우승의 영광을 차지했다고 생각합니다. 그러나 그것에 대해 이야기하기 전에 서체가 사이트 브랜딩에 미치는 전반적인 영향에 대해 논의해 보겠습니다. 여기 문제가 있습니다. 글자가 너무 가깝거나 크기가 너무 작아 콘텐츠를 읽기 어려운 경우 즉시 떠나거나 몇 초 더 읽으려고 시도하고 여전히 어렵다고 생각되면 결국 떠나게 됩니다. 시간을 들여 실제로 전체 사본을 읽은 매우 충성도가 높은 고객이 있더라도 그들은 너무 오래 걸리고 결국 고객을 잃게 된다는 것을 기억할 것입니다.
웹사이트에 사용할 서체를 선택하는 것은 메시지를 읽고, 이해하고, 이해하는 전체 프로세스를 쉽게 만들 수 있기 때문에 매우 중요합니다. 독자와 일치하는 글꼴을 선택하면 읽는 데 걸리는 시간이 아니라 제공하는 정보에 독자의 관심이 유지됩니다.
실용적인 팁: 모든 글꼴이 모든 웹사이트에서 작동하는 것은 아닙니다. 글꼴은 각기 다른 개성을 가지고 있으며 결정하는 글꼴은 전적으로 귀하의 비즈니스, 제공하는 고객의 종류, 그리고 표현하려는 메시지에 따라 다릅니다. 가장 좋은 것은 광범위하게 연구하고 같은 업계의 다른 사람들이 사용하는 서체를 보는 것입니다. 올바른 결정을 내리고 있는지 알 수 있도록 다양한 플랫폼에서 여러 유형을 시도하고 테스트하십시오. 적절한 글꼴을 선택하는 데 시간이 걸리지만 전환율이 증가하는 것을 볼 때 그만한 가치가 있음을 기억하십시오.
글꼴 크기 및 영향
글꼴 크기에 대해 이야기할 때 고려해야 하는 주요 문제 중 하나는 가독성입니다. 메시지가 전달되는지 확인하기 위해 가독성이 훨씬 더 중요해집니다. 글꼴 선택이 완벽하지 않더라도 최소한 방문자가 귀하가 제시하는 콘텐츠를 읽기 위해 눈을 피로하게 할 필요가 없기 때문에 적절한 크기로 절약할 수 있습니다. 글꼴 크기가 적절하면 고객이 메시지를 읽고, 상호 작용하고, 소문을 퍼뜨릴 가능성이 훨씬 높아집니다. 고객과 더 잘 소통할 수 있을 때 브랜드에 긍정적인 영향을 미치고 이는 다시 회사의 평판을 높일 것입니다.
실용적인 팁: 표시할 글꼴을 선택하는 크기는 웹사이트의 디자인 컨텍스트에 따라 다릅니다. 명함에는 매우 작은 크기가 필요할 수 있지만 이벤트 포스터에는 훨씬 더 큰 크기가 필요합니다. 그러나 우리는 웹사이트 디자인에 대해 구체적으로 이야기하고 있기 때문에 모바일 장치 또는 일반 화면용으로 게시할 것인지 고려해야 합니다. 경험에 따르면 전문가들은 본문 콘텐츠에 10~14픽셀을 사용하고 제목이나 제목에 16~20픽셀을 사용할 것을 권장합니다. 최상의 결과를 얻으려면 자신에게 맞는 크기에 대한 연습 검사를 실행한 다음 제대로 작동하지 않는 것 같으면 그에 따라 조정할 수 있습니다. 또한, 다양한 화면 크기에 맞게 조정해야 하는 경우 모바일 장치에서 크기를 줄였을 때 글꼴도 제대로 작동하는지 확인하세요.
글꼴 색상 및 웹사이트
귀하의 메시지를 가능한 한 가장 좋은 방법으로 방문자에게 전달하려면 단어 선택뿐만 아니라 표시 방법도 고려해야 합니다. 이제 글꼴 색상이 그렇게 큰 문제가 아닌 것처럼 보일 수도 있지만 특히 요란한 웹 사이트가 있는 경우에는 큰 영향을 미칩니다. 색상 심리학은 전체 연구 영역이며 이 분야에서 많은 것을 배울 수 있습니다. 그러나 특히 글꼴에서 색상을 구현할 때 너무 지나치면 웃기게 보일 것이기 때문에 너무 과도하게 사용하지 않도록 하십시오. 선택하는 색상은 비즈니스의 핵심 가치를 향상시킬 뿐만 아니라 고객과 연결되는 근본적인 개성을 강화해야 합니다. 글꼴에 잘못된 색상을 선택하면 귀하와 귀하의 비즈니스에 좋지 않은 영향을 미칩니다.
여기서 언급할 가치가 있는 또 다른 기능은 대비입니다. 텍스트 또는 페이지의 대비는 배경과 텍스트 사이에 존재하는 어두움의 차이입니다. 녹색 배경에 빨간색 텍스트를 넣는 것과 같은 오래된 기술을 사용하고 싶지는 않지만 가독성을 높일 수 있도록 텍스트와 배경 사이에 좋은 대비가 있는지 확인해야 합니다.
실용적인 팁: 먼저 글꼴 색상을 결정하기 전에 브랜드 및 로고에 통합되어야 하거나 이미 통합되어야 하는 색상과 글꼴에 대해 매우 신중하게 생각해야 합니다. 예를 들어 코카콜라 하면 붉은 색과 함께 매우 독특한 곱슬 글꼴이 떠오를 것입니다. 색상을 고를 때 집 안의 방을 색칠하는 것과 같다고 전문가들은 조언한다. 방문자가 블로그를 읽는 동안 따뜻하고 아늑함을 느끼도록 하려면 감각을 이완하고 진정시키기 위한 둔한 빨간색과 주황색을 사용하십시오. 그러나 다시 말하지만, 배경 색상에 따라 대부분의 콘텐츠가 검은색으로 보기에 좋고 가독성이 좋기 때문에 너무 지나치지 않도록 하십시오.
제목 글꼴 및 알아야 할 사항
콘텐츠에 사용하는 제목은 실제 단어뿐만 아니라 표현 방식에서도 매우 중요합니다. 여러 연구에 따르면 눈길을 사로잡는 헤드라인을 사용하지 않는 한 방문자는 계속해서 읽을 수 있는 좀 더 흥미로운 것을 찾을 것입니다. 인간이 웹을 읽는 방식에는 특정한 패턴이 있으며 이를 통해 대부분의 콘텐츠가 단순히 스캔된다는 것을 알게 될 것입니다. 따라서 제목으로 방문자의 주의를 끌지 않으면 읽을 가능성이 훨씬 더 낮아집니다. 이제 제목에 사용하는 글꼴과 색상이 방문자가 읽고 싶어하는지 여부를 결정한다는 점을 명심하십시오. 따라서 단순히 관심을 끌기 위해 Comic Sans를 사용하고 싶지는 않지만 읽을 수 있도록 유지해야 합니다.
실용적인 팁: 글꼴을 페어링하는 경우(하나는 헤드라인에 사용하고 다른 하나는 주요 콘텐츠에 사용) 실제로 서로 잘 어울리는지 확인하십시오. 글꼴의 대부분의 요소가 서로 크게 다르지 않게 일치하도록 해야 하기 때문에 페어링이 까다로울 수 있습니다. 이러한 경우 헤드라인 글꼴은 본문 텍스트를 보완해야 합니다. 반면에 동일한 서체를 사용하는 경우 다양한 크기와 줄 간격을 실험하여 제목을 향상시킬 수 있습니다. 동일한 서체는 독자에게 시각적 조화를 제공할 뿐만 아니라 로드해야 하는 글꼴 수를 줄여 전반적인 로드 시간과 성능을 향상시킵니다.
줄 길이와 중요성
웹사이트를 만드는 대부분의 사람들은 사용된 텍스트의 글꼴, 크기, 색상 및 대비를 고려할 것입니다. 그러나 그들이 놓치고 있는 것은 라인 길이입니다. 행 길이는 전체 가독성을 높이거나 낮추는 역할을 하며 각 가로줄에 있는 단어 또는 문자의 수를 나타냅니다. 가독성에 영향을 미치는 것은 문장의 짧거나 긴 것입니다. 선택한 글꼴로 인해 선이 너무 길어 보이면 방문자의 눈이 먼 거리를 이동해야 하므로 많은 노력이 필요하므로 읽는 데 방해가 됩니다. 반면에 줄이 너무 짧으면 문장의 흐름이 끊어져 방문자가 흥미를 잃게 됩니다.
실용적인 팁: Usability Institute Baymard에서 제안한 한 가지 이론은 최적의 가독성을 제공하기 때문에 한 줄에 50-75자(공백 포함)를 사용하는 글꼴을 선택해야 한다는 것입니다. Golden Ratio Typography Calculator를 사용하여 콘텐츠를 읽는 데 사용되는 화면에 따라 완벽한 줄 길이를 결정할 수도 있습니다.
커닝과 그것이 중요한 이유
Wikipedia에 따르면 '커닝은 일반적으로 시각적으로 만족스러운 결과를 얻기 위해 비례 글꼴로 문자 사이의 간격을 조정하는 과정입니다.' 좋은 글꼴을 사용하면 잘 커닝되고 각 문자 쌍 사이의 간격이 비슷합니다. Photoshop과 같은 그래픽 프로그램에서 서체를 설정하는 디자이너가 있다면 그는 글자 사이의 간격을 변경하고 글꼴과 커닝이 완벽해 보일 때까지 조정할 수 있습니다. 커닝에 초점을 맞추지 않으면 아마추어나 디자이너 지망생이 수행한 작업과 전문 작업을 구별하는 가장 큰 단일 요소이기 때문에 비용이 많이 듭니다.
실용적인 팁: 웹사이트가 전문적으로 보이도록 하려면 각 문자 사이의 간격이 같아야 합니다. 서체를 디자인하는 경우 글자 사이에 공간적 연속성이 있으면 가독성이 높아지므로 커닝을 통합하는 것을 잊지 마십시오. 반면에 이미 존재하는 글꼴을 사용하는 경우 이러한 글꼴에는 모두 간격에 대한 정보가 포함되어 있으므로 이에 대해 걱정할 필요가 없습니다.
결론
웹사이트 브랜딩을 개선하고 더 많은 고객을 유치하려는 비즈니스 소유자의 경우 기억해야 할 중요한 측면은 카피를 보완하는 서체를 사용하는 것입니다. 당신이 일을 올바르게 하고 있다면 그것은 독자의 감정, 기분, 행동에도 영향을 미칠 것입니다. 이것은 차례로 충성 고객으로 전환할 가능성을 높입니다. 글꼴, 크기, 색상 등을 테스트하는 가장 좋은 방법 중 하나는 테스트를 실행하고 결과가 어떻게 나오는지 확인하는 것입니다. 또한 이 전체 프로세스에 약간의 시간과 주의를 기울이십시오. 완벽함을 원하면 그것을 위해 노력해야 할 것입니다.
마지막으로 오늘날 우리가 글꼴에 많은 관심을 기울이는 이유에 대해 일차적으로 책임이 있는 Steve Jobs의 영감을 주는 인용문을 남기고자 합니다.
“서예를 배우기 위해 서예 수업을 듣기로 했어요. 나는 Serif와 Sans-Serif 서체에 대해 배웠고, 서로 다른 문자 조합 사이의 간격을 다양화하는 방법에 대해, 훌륭한 타이포그래피를 훌륭하게 만드는 요소에 대해 배웠습니다. 아름다웠다. 역사적인. 과학이 결코 포착할 수 없는 방식으로 예술적으로 미묘합니다.”