Design Geeks > 포스팅 & 디자인소스
2014년 예상되는 웹디자인 트랜드 10가지
출처 http://thenextweb.com/dd/2013/12/29/10-web-design-trends-can-expect-see-2014
비록 해외에서 작성된 글이지만 국내 웹디자인 트랜드를 이해하는데 도움이 되길 바라는 마음으로 작성했습니다. 부족한 영어 실력이지만 주요 내용을 요약하여 전달하려고 했습니다. 혹시 잘못 전달된 내용을 있다면 지적해 주시길 부탁 드립니다. |
1. 식상하지 않은 타이포그래피
Non-boring typography
2014년에는 '개성있는 폰트'가 유행할 것으로 예상된다.
예를 들어, 위 그림에 나온 Stuff and Nonsense 웹사이트에서는 전통적 Serif 폰트를 사용하는 대신에
새로롭고 아름다운 Serif 폰트를 사용함으로써 보다 전문적이고 개성있는 디자인을 보여주고 있다.
2014년에는 단순하고 정형적인 기존의 폰트에서 벗어나
개성있는 타이포그래피를 사용하는 웹사이트들이 늘어날 것으로 보인다.
2. 플렛 디자인
Flat design
2013년 애플의 iOS7 발표 이후 웹 디자인에서 ‘Flat design’이 많이 활용 되고있다.
2014년에도 'Flat design'은 여전히 트랜드를 유지할 것으로 보인다.
3. Large hero 영역이 슬라이더를 사라지게 만들 것이다.
Large hero areas quickly killing sliders
2014년도 가장 유망한 트랜드는 바로 Large hero 영역에 대한 것이다.
참고로 Large hero 영역은 웹사이트 인트로 부분, 적은 양의 텍스트를 갖는 한 개의 이미지로 구성된 웹사이트 상단에 위치한
넓은 영역을 의미한다.
앞으로 Large hero 영역은 더 강화될 것이고 심지어 슬라이더가 위치했던 자리까지 꿰찰것이다.
위의 Realtii.com 사이트는 이에 대한 좋은 예를 보여준다
4. 모바일에 더 많은 포커스가 맞춰 질 것이다.
Heavier focus on mobile
모바일 기기를 이용하여 웹사이트에 접속하는 것은 이제 일상적인 일이 되었다.
2014년도에는 모바일을 고려한 디자인이 더욱 강화될 것으로 보인다.
5. 비디오가 텍스트를 대체할 것이다.
Videos in place of text
hero 영역에 동영상을 활용하여 컨텐츠나 정보를 동영상으로 제공할 수 있다면 더할나위 없이 좋을 것이다.
비록 동영상이 상대적으로 큰용량을 필요로하여 모바일에 적합하지 않은 면이 있지만,
텍스트보다 훨씬 효과적으로 내용을 전달할 수 있는 수단임은 분명하다.
6. 스크롤이 긴 웹사이트
Long scrolling sites
예전에는 일반적으로 컨텐츠가 많은 경우에만 긴 스크롤을 활용한 디자인을 하였지만
요즘에는 컨텐츠가 잘 정리 되어 있어도 긴 스크롤을 활용한 디자인을 사용하는 사례를 종종 볼 수 있다.
위의 예 (Macaw’s wesite)를 보면, 콘텐츠들이 잘 정리되어 있음에도 불구하고
긴 스크롤을 활용한 디자인을 사용하고 있다. 하지만 스크롤을 효과적으로 사용했기 때문에
사용자 입장에서는 스크롤을 많이 내리고 있다는 느낌을 주지는 않는다.
7. 단조로운 색상을 활용한 웹디자인
Simple color schemes
2014년에는 단조로운 색상의 웹사이트들을 많이 보게 될 것이다.
여기서 ‘단조로운 색상’이란 1, 2종류의 컬러만을 사용하는 것을 의미한다.
위의 UIKit 웹사이트를 보면 블루 색상만 사용했다.
(블랙이나 화이트는 디자인관점에서는 컬러로 여기지 않는다).
이러한 단조로운 색상을 활용한 디자인은 2번에서 언급한 “Flat design”과 함께 사용될 수도 있다.
요즘에는 컬러를 거의 사용하지 않는 웹사이트들도 볼 수 있다.
화이트나 블랙, 또는 이들 사이의 중간색들이 널리 사용되고 있으며
이 경우 강한 효과를 주고자 하는 부분에 포인트 색상을 넣어 디자인을 할 수도 있다.
8. 단순화된 컨텐츠
Simplified content
2014년에는 더욱 더 단순화된 컨텐츠 디자인이 주요한 웹디자인 트랜드가 될 것이다.
요즘에는 사용자의 집중 시간이 짧아짐에 따라 컨텐츠를 길게하기 보다는 짧게 하는 것이 효과적이다.
그리고 최근에는 250글자를 넘는 내용을 보이는 웹사이트를 찾아보기 힘들어졌다.
9. 슬라이드바를 빼라
Dropping the sidebar
보통 블로그나 매거진 웹사이트에서는 슬라이드바가 없는 디자인을 흔히 볼 수 있었다.
하지만 요즘은 블로그나 매거진 외 다른 타입의 웹사이트들에서도
슬라이드바가 없는 디자인을 종종 볼 수 있다.
슬라이드바를 없애면, 좀더 나은 비쥬얼효과를 얻을 수 있다.
예를 들어
사용자는 자신의 주의를 분산시키는 것들이 적을수록 편안하게 웹사이트의 내용을 읽을 수 있다.
이것이 슬라이드바를 없애는 이유 중 하나이다.
10. 이미지 리터칭
Manipulated imagery
2014년에 우리는 리터칭한 이미지 (color overlay, blurred 등)를 더 많이 보게 될것이다.
위의 예(the Seattle Cider Co)를 보면, 이 사이트의 분위기에 잘 맞도록 고풍적이면서 전원적인 느낌을 갖도록 리터칭한 사진이 hero area에 사용된 것을 볼 수 있다.
11. 보너스 : 괴상하고 섹시하며 신선한 것
Bonus : Crazy, sexy, cool stuff
웹 개발에 있어서는 항상 신선하고 획기적인 것들이 나오고 인기를 끌어왔다.
위의 예(Tobi’ Story 웹사이트)와 같이 웹사이트에서 특정 부분에 움직임을 주기 위해 HTML5를 사용하는 방식도 이중 하나가 되겠다.
새로운 시도는 매우 환영을 만한 일이겠으나, 단 너무 극단으로 치달아서는 안되겠다.
