그것이 우리의 전화,책 또는 웹 사이트에 있든,우리는 끊임없이 쓰여진 단어를 소화하고 있습니다. 지시 책자에서 상점 전선에 이르기까지 유형은 우리 주변에 있습니다. 우리는 종종에 반영하의 힘을 쓰지만,거지 우리는 디자이너의 역할을 모방의 단어나 문장이다.디자이너는 텍스트의 모양과 텍스트가 말하는 것 사이의 관계를 고려할 시간을 가졌습니다. 실제로 다른 기분,분위기 및 감정은 유형 선택을 통해 간단히 표현할 수 있습니다. 그러나 실제로 타이포그래피는 무엇이며 왜 그렇게 중요합니까?
이 기사에서는 타이포그래피에 대해 알아야 할 모든 것에 뚜껑을 들어 올릴 것입니다. 그 기원에 대한 간략한 역사를 포함하여 타이포그래피의 정의부터 시작하겠습니다. 그런 다음 좋은 타이포그래피의 이점과 그것이 사용자에게 미칠 수있는 영향을 다루겠습니다. 마지막으로 타이포그래피를 구성하는 여러 요소들과 그것들이 모두 의미하는 바를 살펴 보겠습니다.
다음은 우리가 다룰 내용입니다:
- 타이포그래피 란 무엇입니까?
- 타이포그래피가 중요한 이유는 무엇입니까?
- 다양한 요소들의 타이포그래피
- 를 선택하는 방법은 정확한 서체를 위해 귀하의 웹사이트
- 결론
준비되어 있는가? 잠수 해 봅시다!
타이포그래피 란 무엇입니까?
기본으로 킥오프하자:실제로 타이포그래피 란 무엇입니까? 본질적으로,타이포그래피의 예술이 정한 문자와 텍스트를 만드는 방식으로 사본을 읽을 수 있고,명확하고,시각적으로 매력적인 리더입니다. 타이포그래피는 특정 감정을 이끌어 내고 특정 메시지를 전달하는 것을 목표로하는 글꼴 스타일,모양 및 구조를 포함합니다. 요컨대,타이포그래피는 텍스트에 생명을 불어 넣는 것입니다.
아래 동영상,CareerFoundry UI 디자인 멘토 Olga 리프트에 뚜껑을 이유 타이포그래피 문제와 어떤 차이를 만든 사용자를 위해.
타이포그래피는 움직일 수있는 유형의 혁신 과정에서 11 세기로 거슬러 올라갈 수 있습니다. 디지털 시대 이전에는 타이포그래피가 책과 잡지와 관련된 전문 공예품이었으며 결국 공공 작품이었습니다. 타이포그래피의 첫 번째 예는 서구에서 타이포그래피 혁명을 걷어차 기 시작한 구텐베르크 성경에서 볼 수 있습니다. 재미있는 사실은 스타일의 유형에 사용되는 구텐베르크 성경은 지금으로 알려진 얼굴은 이미 바람이 되고,당신은 그것을 찾을 수 있 글꼴에서 드롭다운 메뉴에서 주요 데스크탑 응용 프로그램 오늘!
타이포그래피는 대부분 디지털 세계와 인쇄 모두와 관련된 현대에 빨리 감기. 인터넷의 탄생과 함께 타이포그래피의 예술의 창조적 인 폭발을했다. 갑자기 웹 디자이너는 자신의 처분에 따라 글꼴과 유형 옵션이 풍부하여 타이포그래피를 이전보다 시각적으로 다양하게 만들었습니다.
타이포그래피가 중요한 이유는 무엇입니까?
타이포그래피는 아름다운 글꼴을 선택하는 것보다 훨씬 더:그것은 사용자 인터페이스 디자인의 중요한 구성 요소입니다. 좋은 타이포그래피는 강력한 시각적 계층 구조를 수립하고 웹 사이트에 그래픽 균형을 제공하며 제품의 전반적인 음색을 설정합니다. 타이포그래피는 사용자를 안내하고 알리고 가독성과 접근성을 최적화하며 우수한 사용자 경험을 보장해야합니다.
타이포그래피가 왜 그렇게 중요한지 조금 더 깊이 탐구 해 봅시다.
타이포그래피 빌드는 브랜드 인지도
뿐만 아니라 좋은 인쇄술을 향상시킬 웹사이트의 성격,그러나 당신의 사용자가 잠재 의식적으로 시작을 연결하는 글자체 추천 사이트에서와 함께 귀하의 브랜드입니다. 독특한 일관된 글을 설정하는 데 도움이 될 것입니다 강력한 사용자는 다음과 신뢰를 구축하고 사용자를 수행하는 데 도움이 귀하의 브랜드니다.
타이포그래피 영향을 결정 만들기
타이포그래피에 지대한 영향을 미치는 방법이 사용자가 소화하고 인식하는 정보에 의해 전달되는 텍스트입니다. 눈길을 끄는 유형은 텍스트의 메시지를 강화하지 않는 약한 글꼴보다 훨씬 설득력이 있습니다.
타이포그래피를 보유한 관심의 독자
좋은 타이포그래피 될 수 있는 사이의 차이는 누군가에 머무는 당신의 웹 사이트 중 하나에 대한 분 또는 반 시간입니다. 귀하의 웹 사이트가 시각적으로 자극적이고 기억에 남는 것이 중요하며 타이포그래피는이 과정에서 큰 역할을합니다.
다양한 요소들의 타이포그래피
에서 시작하는 타이포그래피,당신은 처음에 필요험을 얻을 팔 필수적인 인쇄상의 디자인 요소입니다.
글꼴 및 글꼴
이 혼란을 둘러싼 차이는 글꼴 및 글꼴,많은 치료하는 두 가지로 동의어입니다. 서체는 다양한 크기와 무게의 수많은 문자를 포함하는 디자인 스타일이지만 글꼴은 텍스트 문자의 그래픽 표현입니다. 간단히 말해 서체는 관련 글꼴 패밀리이며 글꼴은 서체를 구성하는 가중치,너비 및 스타일을 나타냅니다.
세가지 기본적인 종류의 서체:serif,sans-serif,그리고 장식하고 있습니다. 인터페이스를 유지하기 위해 깔끔하고 능률적인,좋은 디자이너를 사용하지 않을 것입니다 세 개 이상의 글꼴 및 유지 장식적인 글꼴을 최소화합니다. 가장 UI 디자이너 쌍 리프 글꼴과 sans-serif 글꼴과 같은 두기 본문 텍스트에서 리프 글꼴과 제목에서 sans-serif 글꼴,또는 그 반대도 마찬가지입니다.
대비
처럼 많은 계층에 대비하는 데 도움이 전달하는 아이디어 또는 메시지를 강조하고 싶은 독자에게 제공합니다. 대비에 약간의 시간을 할애하면 텍스트가 재미 있고 의미 있고주의를 끌 수 있습니다. 대부분의 디자이너들이 대조를 재생하여 주변에 다양한 서체,색,스타일 및 크기에 영향을 만들고 끊 페이지입니다.
일관성
유지의 서체는 일관된 핵심입을 피하고 혼란스럽고 지저분한 인터페이스입니다. 정보를 전달할 때,그것은 필수적 지팡이 같은 글꼴 스타일,그래서 당신의 독자는 즉시 이해해 그들은 무엇을 읽고를 주목하기 시작한 패턴이다. 는 동안 그것의 확인을 재생하는 주위의 수준으로 계층의 어느 정도,그것은 좋은 연습을 설정하는 일관의 계층 구조체(하나의 일관된 글꼴을 위한 헤더,다른 위한 부제목)고 그것에 충실하는 것입니다.
공백
종종’음수 공간’이라고하며 공백은 텍스트 또는 그래픽 주위의 공간입니다. 그것은 종종 간과되고하는 경향이 가르쳐 주기 사용자지만,적절한 사용의 공백을 보장한 인터페이스를 정리하고 텍스트를 읽을 수 있습니다. 공백은 심지어 텍스트에주의를 끌 수 있으며 전반적으로 심미적으로 즐거운 경험을 제공합니다. 공백은 종종 여백,패딩 또는 텍스트 나 그래픽이없는 영역의 형태를 취합니다.
선형
정렬 프로세스의 통합과 구성하는 텍스트,그래픽,그리고 이미지를 보장가 동일한 공간 크기,그리고 거리를 사이에 각 요소입니다. 많은 UI 디자이너는 로고,머리글 및 텍스트 본문이 서로 정렬되도록 여백을 만듭니다. 사용자 인터페이스를 정렬 할 때 업계 표준에주의를 기울이는 것이 좋습니다. 예를 들어 텍스트를 오른쪽으로 정렬하면 왼쪽에서 오른쪽으로 읽는 독자에게는 반 직관적 인 것처럼 보일 것입니다.
Color
Color 는 타이포그래피의 가장 흥미로운 요소 중 하나입니다. 디자이너가 실제로 창의력을 발휘하고 인터페이스를 새로운 차원으로 끌어 올릴 수있는 곳입니다. 그러나 텍스트 색상은 가볍게 가져갈 수 없습니다: 못을 박는 폰트 색깔을 만들 수 있는 텍스트 스탠드 전달 톤의 메시지—그러나 그것은 잘못된 결과에 더러운 인터페이스와 텍스트와 충돌 사이트 색상입니다.
색상에는 값,색조 및 채도의 세 가지 핵심 구성 요소가 있습니다. 좋은 디자이너는 방법을 알게 될 것이 균형을 이 세 가지 요소의 텍스트를 만들이 모두 눈길을 끌고 명확하게 읽,심지어 사람들을 위해 시각 장애가 있습니다. 주,디자이너들이여 이를 테스트 보기 텍스트에서 그레이 스케일(컬러)및 바뀌는 경우 텍스트는 너무 어둡거나 빛에 대하여 배경 색상.
계층 구조
설정하는 계층의 가장 중요한 원칙의 타이포그래피. 오타 계층을 만드는 것을 목표로하고 명확한 구별이 눈에 띄는 조각의 복사본을 해야 하는 알고 읽는 첫째,표준 텍스트 복사합니다. 의 시대에 집중할 수 있는 시간이 짧에 의해 소셜 미디어,디자이너들은 간결하고 만들기체할 수 있는 사용자가 소비하는 데 필요한 정보를 짧은 양의 시간입니다.
계층구조를 사용하여 만들 수 있습니다 크기 조정,컬러,대비 및 정렬. 는 경우,예를 들어,당신은 선의 복사와 함께 느낌표 아이콘을 시작 부분에는 빨간색과 이전보다 더 큰 사본,이 시각적 단서의 독자는 그것을 행하라는 부름입니다. 인쇄상의 계층 구조의 가장 전형적인 예는 크기입니다:제목은 항상 부제목과 표준 텍스트보다 커야합니다.
귀하의 웹 사이트에 적합한 서체를 어떻게 선택합니까?
이제는 우리가 익숙해져 우리 자신과 다른 입력 체계 요소에 대해 이야기 할 수 있는 과정을 선택의 서체에 대한 인터페이스입니다. 선택할 수있는 다양한 글꼴과 서체가 너무 많아서 압도감을 느끼기 쉽습니다. 올바른 선택을하는 것은 멋지게 보이는 것을 보는 것보다 훨씬 더 많은 것에 달려 있습니다. 여기에 몇 가지 중요한 고려 사항:
생각하는 성격에 대해서
는 방법 당신은 당신의 사용자가 느끼는 때 처음으로 귀하의 웹사이트를 입력. 친근한 분위기를 모방하고 싶습니까? 당신은 사이트가 하이 엔드,환영,장난,또는 심각한 느낌을 원하십니까? 타이포그래피가 브랜드 또는 제품의 개성을 반영하는 것이 필수적입니다. 좋은 출발점에 직면했을 때 이러한 문제를 정의하는 핵심 특성의 브랜드를 수집하기 시작 서체는 이러한 특성입니다. 거기에서 추세를 알아 채기 시작할 수 있습니다.
톤에 반영
글꼴이 메시지의 톤과 어떻게 조화를 이루는 지 고려하는 것도 똑같이 중요합니다. 는 경우,예를 들어,당신을 전하고 싶은 심각한 또는 중요한 정보를 선택,적은 양식이나 장식하는 글꼴을 모두 분명하게 읽을 수 있고 제한됩니다.
인색하지 않에 기능
기능으로 중요 한 형태:것보다 더 나쁜 아무것도 없어 보이는 웹사이트 이는 전적으로 읽을 선도하고,당신이 잘못된 버튼을 클릭하 또는 길을 잘못하기 때문에 지 하는 것은 분명 합니다. 무엇을 결정할 때체를 포함하에서의 인터페이스 설정식,미적 및 음성을 따로 반영하고 있는지 여부에 글꼴은 읽기,읽기 쉽고 접근 할 수 있습니다. 텍스트를 변형없이 읽을 수 있습니까? 문자가 충분히 뚜렷합니까?
성능 고려
많은 디자이너가 종종 간과하는 한 가지는 웹 브라우저 친화적 인 서체를 선택하는 것입니다. 일반적으로 사용하는 글꼴 라이브러리 등과 같은 구글 글꼴을 제공하는 웹 기반 글꼴 파일을 렌더링할 수 있는 완벽하게 브라우저에서없이 문제입니다. 프로 팁:웹 글꼴을 다운로드 할 때 필요한 것보다 더 많은 문자 세트를 다운로드하지 마십시오. 이렇게하면 초과 중량을 피할 수 있습니다!
영감을 얻
확실하지 않으면 어디로 시작,일부 시간이 걸릴 무엇을 보고 다른 사람들이하고있다. 주변에서 볼 수있는 타이포그래피에 눈을 뜨십시오. 비슷한 패턴을 알 수 있습니까? 타이포그래피의 좋고 나쁜 예를 볼 수 있습니까? 심지어 다음과 같은 타이포그래피 hashtags 소셜 미디어에서나 찾는 타이포그래피 Pinterest 을 줄 것이다 당신은 몇 가지 좋은 아이디어의 수 있습니다. 추가 영감을 얻기 위해이 8 가지 타이포그래피 트렌드를 살펴볼 수도 있습니다.
테스트하기 위해 시간을 내십시오.
인터페이스에 사용할 글꼴을 해독하는 가장 좋은 방법은 무엇입니까? 테스트,테스트 및 테스트! 를 수집하여 유용한 피드백을 실제 사용자,당신은 좀 더 명확하게 통찰력으로 작동하는 무엇이,어떤지,무엇을 읽고 무엇을 느낀 어긋나 바랍니다.
결론
타이포그래피는 종종 간과되지만 사용자 인터페이스 디자인의 중요한 구성 요소입니다. 타이포그래피를 마스터하면 환상적인 UI 디자이너가되기위한 길을 잘 볼 수 있습니다! 어디서부터 시작해야할지 잘 모르겠다면,왜 즐겨 찾는 웹 사이트로 향하고 그들이 간 서체가 무엇인지에 대한 메모를 작성하지 마십시오.
UI 디자인에 대해 더 배우고 싶습니까? 이러한 체크 아웃에 관련 블로그 게시물:
- 10 의 예로 아름다운 블로그는 못을 박는 그들의 UI 설계
- 32 의 사용자 인터페이스 요소에 대한 UI 디자이너: 귀하의 궁극적 인 용어집
- 처음부터 아이콘을 디자인하는 방법은 다음과 같습니다 단계별 가이드