Page 281 고등학교 컴퓨터 그래픽 교과서
P. 281
2 웹 디자인 요소
웹 디자인의 요소는 웹 페이지를 이루는 공통 요소로 제공하고자 하는 콘텐츠 이외
에 웹 사이트 전체 디자인 스타일에 맞추어 각 웹 페이지에 일관되게 사용한다.
웹 디자인 요소는 아이콘, 이미지 디스플레이, 메뉴, 강조 표시 등 여러 가지 방법으
로 제한 없이 사용하며, 서로 다른 색상, 크기, 패턴 등으로 접근성도 다양하다. 내비
게이션, 폰트, 컬러, 로고, 아이콘, 배너, 배경 이미지 등을 적절히 활용하면 독특하고
참신하면서도 감각적인 웹 디자인을 구현할 수 있다.
로고
사이트 전체를 상징하므로 사이
트의 첫인상이나 전체 분위기를
좌우한다. 사이트의 독창성과 시
각적 아름다움을 표현할 수 있다.
폰트
웹 사이트를 전체적으로 통일성
있게 표현하는 역할을 한다.
HTML상에서 스타일 시트를 이용
하여 폰트 크기, 자간, 행간 등을
자유롭게 표현할 수 있다.
CSS로 저장하고 웹 페이지에 링
크해서 폰트의 속성을 웹 사이트
전체에 적용할 수 있다.
내비게이션
웹 사이트에서 사용자가 원하는
정보를 찾아 이동하는 길이자 이
동 동선을 말한다. 페이지를 연계
하여 이동하고 연결하는 하이퍼
미디어 시스템의 링크 구조이다.
아이콘
내비게이션과 사용자 구조에 대
한 이해를 돕기 위해 사용하는 이
미지를 말한다.
[그림 Ⅳ-33] 서울특별시 교육 연구 정보원 홈페이지
배경 이미지 컬러 배너
페이지의 용량을 줄이면서도 시각적 효과를 주기 위해 보 웹 사이트의 성격과 콘셉트, 콘텐츠, 주 대상층에 맞게 선 텍스트 이미지, 동영상 등을 조합
통 단순하게 반복되는 패턴 이미지를 사용한다. 택해야 한다. 하여 광고나 홍보용으로 사용한
콘텐츠의 바깥 부분이나 화면 상단 또는 왼쪽 내비게이션 • 지나치게 화려하지 않으면서 편안한 색 선택 다. 지나치게 화려하거나 조잡스
부분에 사용하는 경우가 많다. • 유행에 민감한 색은 제외 럽지 않아야 하며, 파일 크기도 고
이미지가 크면 용량이 커지므로 신중하게 선택해야 한다. • 배경색과 무늬는 단순한 것 선택 려해야 한다.
• 원색보다 은은하고 부드러운 색 선택
•일관성 있는 색상 적용
3. 웹 디자인 279