CSS 에서 글꼴 처리 효과 에 대한 사고

저자:flying bird:파란색 이상
글씨체 의 처 리 는 웹 디자인 에서 아무리 강조해 도 지나 치지 않 는 다.왜냐하면 웹 페이지 는 정 보 를 전달 하 는 데 사용 되 기 때문에 가장 전형 적 이 고 직접적인 정보 전달 방식 은 바로 문자 이기 때문에 글씨체 의 기본 지식 을 조금 이해 하 는 것 은 디자인 에 있어 매우 중요 하 다.
중국어 와 영어 의 가장 큰 차 이 는 바로 중국 어 는 네모 난 글자 이 고 영 어 는 병 음 문자 로 글씨체 의 처리 에 큰 영향 을 미친다.아래 그림 을 보면 영어 글씨체 의 변화 가 중국어 글씨체 에서 모두 약화 되 었 다 는 것 을 알 수 있다.

중국어 의 독자 로 서 습관 적 으로 사각형 모양 을 받 아들 여 읽 는 단원 으로 하 는데 사실은 눈 에 피로 하기 쉬 운 방식 입 니 다.읽 을 때 당신 의 시선 은 실제 적 으로 전체 줄 의 문자 의 외형 을 따 르 는 것 입 니 다.이 예 를 보 세 요.
NOW I''VE TRIED TO TALK TO YOU AND MAKE YOU UNDERSTAND
Now I''ve tried to talk to you and make you understand
어느 줄 이 더 읽 기 쉽 습 니까?
첫 번 째 줄 과 중국어 의 상황 은 약간 비슷 합 니 다.다른 것 은 모든 중국어 단 어 는 그림 과 같 습 니 다.그 변 화 는 26 개의 영문 자모 보다 훨씬 풍부 합 니 다.우리 에 게 있어 서 우 리 는 이 특징 을 받 아 들 였 지만 디자인 할 때 고려 해 야 할 문제 가 있 습 니 다.저 는 디자이너 가 아 닙 니 다.만약 에 틀린 말 을 하면 아래 에 댓 글 을 달 아 토론 하 십시오.이 내용 들 은 제 가 Typography 를 가 르 칠 때 일반적인 원칙 으로 제 기 된 것 입 니 다.나 도 학생 들 에 게"The purpose of rule is to break the rule."디자인 원칙 자체 가 원칙 을 깨 기 위 한 것 이 고 이것 도 이른바 creativity 의 표현 이다.문 제 는 원칙 을 먼저 알 고 원칙 에 따라 연습 해 야 한 다 는 것 이다.원칙 을 잘 알 아야 만 원칙 을 깨 뜨 려 창조성 을 드 러 낼 수 있다.원칙 을 깨 는 것 은 원칙 의 결함 과 잘못 을 의미 하지 않 는 다.다만 이런 원칙 에 대한 기발 한 사용 일 뿐이다.당신 은 약간 깨 뜨 렸 을 뿐만 아니 라 당신 이 파괴 한 부분 에 대해 서도 어느 정도 보상 을 해 야 한다.철학 적 인 맛 이 나 는 것 같 습 니 다.
나 는 개인 적 으로 비교적 중요 하 다 고 생각 하 는 몇 가지 원칙 은(영어 에 적용 되 는 상황)이다.
글꼴 의 선택 은 이 문자 의 용 도 를 고려 해 야 합 니 다.제목 을 만 드 시 겠 습 니까?단락 문 자 를 만 드 시 겠 습 니까?일반적으로 san serif 글꼴 은 제목 으로 사용 하기에 적합 합 니 다.예 를 들 어 Arial;serif 글꼴 은 Time New Roman 과 같은 단락 문자 로 사용 하기에 적합 합 니 다.웹 디자인 에 있어 서 몇 개의 글꼴 은 제 가 강력 히 추천 한 것 입 니 다.verdana,tahoma,georgia.사실 베 르 다 나 와 같은 글씨 체 는 세계 최고의 글꼴 디자이너 가 디자인 한 지 2 년 이 채 되 지 않 아 마이크로소프트 가 계산 을 책임 지고 사용자 에 게 무료 로 제공 되 었 다.이 글씨 체 는 IE 가 설치 한 일부분 이다.IE 4 이상 버 전 을 설치 했다 면 컴퓨터 에 이 글씨체 가 있 을 것 이 므 로 사용자 가 이 글씨체 가 있 는 지 걱정 할 필요 가 없다.그것 의 디자인 은 글씨체 가 화면 에 나타 날 수 있 는 문 제 를 고려 했 고 완벽 에 가 까 운 답 을 제공 했다.유일한 번 거 로 움 은 완벽 에 가 까 워 서 우리 가 사용 할 때 개성 이 없다 는 것 이다.왜냐하면 모든 사람 이 그것 을 사용 하기 때문이다.
글자 크기?포럼 에 서 는 pixle 이 좋 습 니까?point 가 좋 습 니까?저 는 반복 하지 않 겠 습 니 다.여기 서 제 가 제기 하고 싶 은 것 은 글자 의 크기 가 CSS 에 있 고 서로 다른 단위 가 많 습 니 다.대체적으로 세 가지 가 있 습 니 다.
절대 크기:mm,cm,in,pt,pc 상대 크기:em,ex 는 장치 에 비해:px 는 em 과 ex 를 몇 마디 더 말 해 야 할 수 있 습 니 다.em 은 css 에서 글꼴 번호 의 크기 를 대표 합 니 다.예 를 들 어 12 pt 의 글꼴 에 있어 1 em 은 12 pt 범례 와 같 습 니 다.
p { font-size: 10pt; text-indent: 1em}
아마도 당신 은 내 가 text-indent:10pt 로 같은 효 과 를 실현 할 수 있다 고 말 할 것 입 니 다.그러나 그것 은 이상 적 인 상황 에서 사용자 가 그의 브 라 우 저 설정 글꼴 크기 가 14pt 가 더 좋다 고 생각 할 때 당신 이 디자인 한 비율 을 잃 기 때문에 상대 적 으로 사 이 즈 는 웹 페이지 의 신축성 디자인 에 매우 유리 합 니 다.
ex 와 em 은 유사 하지만 다 릅 니 다.위의 그림 으로 돌아 갑 니 다.x-height 는 모든 글꼴 에 있어 서 다 릅 니 다.ex 는 글꼴 의 x-height 에 따라 글꼴 의 크기 를 정의 합 니 다.
정렬 방식?왼쪽 정렬 을 사용 하 는 것 이 좋 습 니 다.특히 좌우 정렬 을 사용 하 는 것 을 피해 야 합 니 다.특별한 디자인 목적 이 있 지 않 으 면 왼쪽 정렬 시 오른쪽 이 일치 하지 않 는 것 은 바로 읽 기 편 의 를 위해 서 입 니 다.오른쪽 변 화 는 당신 의 시력 에 도움 이 되 고 변 화 를 통 해 알려 주 는 눈 으로 줄 을 바 꿀 수 있 습 니 다.
줄 간격?행간 거 리 는 글씨체 의 크기 에 달 려 있다.일반적으로 작은 글 자 는 읽 기 에 편리 하도록 큰 행간 거 리 를 필요 로 한다.중국어 글씨체 가 홈 페이지 에 행간 거 리 를 설정 하지 않 으 면 큰 글 자 를 읽 는 데 있어 독자 의 재난 이 므 로 line-height 를 적당 하 게 설정 하 는 것 이 필요 하 다.일반적으로 line-height 는 웹 디자인 에서 글꼴 크기 의 1.5 배 에서 2 배 에 달 해 야 한다.Word 와 다른 텍스트 편집 소프트웨어 에 서 는 일반적으로 글꼴 의 120%를 결 성 된 줄 간격 으로 설정 합 니 다.css 의 line-height 설정 은 균등 하 게 나 누 어 각 줄 의 상하 에 추가 합 니 다.즉,line-height 가 20px 로 설정 되면 각 줄 의 상하 에 각각 10px 의 간격 이 있 습 니 다.
글자 간격 과 문자 간격?매우 특수 한 용도 로 중국어 에 있어 서 이 두 가 지 는 같 아야 한다.이 설정 자 체 는 일부 글꼴 디자인 의 결함 을 해결 하기 위해 문자 의 가 독성 을 증가 시 키 는 것 이다.
칼럼 을 쓸 때마다 이런 느낌 이 든다.쓸 수록 어떻게 마무리 해 야 할 지 모르겠다.)  이것 이 아마도 수필 방식 의 폐단 일 것 이다.댓 글로 토론 해 주세요.저 는 벽돌 을 던 진 셈 입 니 다.