좋은 이미지로 웹 사이트 디자인하는 법
dianedesign | 15-11-17 17:24
본문
좋은 이미지로 웹 사이트 디자인하는 법
멋있는 사진들을 전시할 수 있는 웹사이트를 디자인하는 것은
단지 CSS와 HTML로 만든 패키지에 모든 이미지를 갔다 붙이는 것만큼
간단하지 않습니다. 전체적으로 계획하고 그 이미지를 지원하도록 제작될 필요가 있습니다.
◆ 디자인과 많은 사진들을 웹 사이트에 적용하는 방법 10가지
1. 대형 이미지를 사용
이미지가 큰 경우 그래픽을 사용하여 시각적으로 근사한 효과를 나타냅니다.
대형 이미지가 웹 사이트의 방문자를 유인할 수 있는 극적이 영향을 미칠 수도 있습니다.
2. 여러 장의 사진을 슬라이더로
사용할 이미지가 많을 경우, 슬라이더는 좋은 옵션이 될 수 있습니다.
전체 화면 이미지에 고정되지 않도록 여러 크기를 수용할 수 있는 슬라이더는
가장 큰 이미지의 스틱, 각 이미지의 관련성 및 중복 또는 다른 이미지처럼 보이지 않는지
확인해야 합니다. 만약 계절에 사진 이미지를 교체하거나 새로운 제품의 이미지를
추가해서 시간에서 시간으로 이미지를 변경할 수 있습니다.
3. 콜라주와 그리드
사진의 아름다운 그룹화는 웹 사이트에서 여러 분위기를 연출할 수 있습니다.
하지만 디자인시 사진 선택, 자르기 및 그룹화에 주의해야 합니다.
스크롤 기능은 사진의 그룹을 통해 이동하는 사용자를 유지할 수 있는
아주 재미있는 방법이라고 할 수 있습니다.
화면의 사진 크기 - 콜라주 나 그리드를 만들 때 유의해야 할 몇 가지가 있습니다.
작은 크기로 볼 수 있는 이미지를 선택하며 일반적으로 간단한 프레임 및 조성물과
이미지를 포함합니다.
하지만 이 방법은 디테일 사진이나 많은 풍경이나
이미지에는 최적화되지 않는 이미지를 제공합니다.
4. 최소한의 미학을 사용
테마로 이미지 작업을 할 때 디자인과 테마의 공간을 유지해야 합니다.
사진에게 훨씬 많은 공간을 주고 간단한 버튼, 요소, 화면 색상을 작업합니다.
5. 너무 많은 효과는 No!
고해상도의 사진에 효과를 적용하려는 경우
간단한 보정이나 자동 로딩 이미지를 고려한다.
6. '사진' 테마 디자인
일부 이미지 사이트는 사진과 다른 디자인 기술을 과시할 수 있는 "테마"를 사용합니다.
인스타그램의 디자인 테마, 흑백 갤러리, 테두리나 테두리 색상, 오버레이 효과를
포함하며 사진 기반의 테마로 사이트를 만드는데 사용할 수 있는 많은 옵션이 있습니다.
7. 사이즈와 크기를 혼합
이미지는 서로 다른 모양 과 크기 및 방향으로 시각적 관심을 만듭니다.
뿐만 아니라 사진의 구도와 구성에 대해 생각하며 색상과 배경에 관한 차이도 생각해야 한다.
8. 전략적인 텍스트 배치
텍스트 배치가 잘못되면 좋은 이미지로 만든 웹 사이트를 망칠 수 있습니다.
텍스트나 버튼, 다른 요소는 이미지의 주요 부분 위에 배치하지 않습니다.
9. 명암 만들기
대비 디자인의 주요 원칙 중 하나로 이미지 위주의 웹 사이트 디자인에 대해 생각할 때
사진과 다른 텍스트와 배경을 만드는 겁니다.
검정, 흰색이나 그 사이의 배경이 이미지 웹 사이트에서 대표적인 작품이 될지. 아닐지
색상을 어떻게 대조하느냐에 따라 나뉩니다.
흰색 공간을 많이 사용하고 각 이미지는 주변의 사진에서 구별할 수 있을 정도로 상황과
대비를 해야 합니다.
10. 이미지 제작
사진 기반의 웹 사이트를 디자인할 때 가장 중요한 것은
사진에 집중하여 사진을 위해 디자인을 하는 것입니다.
첫 번째 이미지를 선택하고 콘텐츠를 지원하는 프레임 워크를 제작합니다.
결론
사진은 웹 사이트에서 가장 큰 비중을 차지합니다.
이미지의 활용에 따라 웹 사이트의 퀄리티가 결정됩니다.