HTML의 발전에서 HTML5는 여태 개발되었던 사이트들의 신선한 공기처럼 다가왔습니다. “플래시 킬러” “새로운 거대한것” “미래의 웹 디자인” 등의 수식어가 붙은 HTML5가 우리들에게 다가오고 있습니다. 심지어 웹디자이너에게도 HTML5는다시한번 우리들을 즐겁게 만드는 데 놀라운 툴로 다가왔습니다.
여기 작은 웹의 수집이 HTML5로써의 구조화가 말해주는 즐거움을 알려줄 것입니다.
(역자주 : 솔직히 아래 사이트들 전부 다 추천입니다.. 제겐 솔직히 신선한 디자인적 충격을 안겨주었습니다.)
트론 웹사이트
HTML5 캔버스의 요소들을 정말 놀라우리만큼 잘 사용했습니다. 즐겨보세요.
자라 미디어 디자인
디자인 에이전시 회사의 홈페이지로 컨텐츠를 매끄러운 가로 스크롤로 보여줍니다.
Karlsruhe의 블로그
비주얼라이즈( visualise)
캐나다의 마이크로 블로깅 플렛폼입니다.
버튜티 디자인 스튜디오
퓨마 웹사이트
토오타 프리우스 프로젝트
와이어드 마인드
와이어드 마인드는 Wored.co.uk의 컨텐츠를 다른 방식으로 탐험해 볼 수 있는 시각효과를 제공해 줍니다. MS의 IE 9브라우저와 파트너쉽을 맺고 매우 빠른 표준 브라우저에서 여러분이 할 수 있는 것이 무엇인지를 보여줍니다.
(역자주 : 상당히 시각적이면서도 놀라운 디자인과 브라우징 방법을 보여줍니다. 꼭꼭 방문해 보시기를 추천합니다.)
황야의 시내(the wilderness downtown)
불릿 에이전시(The Bullit Agency)
미칠듯한 효과로 아티스트들을 보여줍니다. 슬라이드 바 없이 부드럽게 컨텐츠를 이동하고, 메뉴들이 위치를 이동합니다.
(역자주 : 정말 멋진 사이트입니다. 꼭 방문하셔서 멋진 디자인 효과를 살펴보시길..)
S5 스타일 포트폴리오
캔버스로 무엇을 할 수 있는지에 대해 아름다운 예제를 보여줍니다. 처음 제가 보았을때는 플래시인줄 알았는데, 아니었습니다!
롭 에드워드의 포트폴리오
레드스퀘어 에이전시
안투안 웻(Antoine Wette) 의 포트폴리오
리카드 선드의 포트폴리오
이 사이트는 신선한 공기와도 같습니다. 다른 사진작가들과 협력하여 사이트를 만들었습니다. 플래시를 사용하지 않고 단지HTML5와 자바스크립트만을 사용하였습니다. 최적화된 사진을 내려받으며 꽤 괜찮은 슬라이딩 애니메이션/네비게이션이 가능합니다. 정말 멋진 사이트인 것 같습니다.
더 나은 세상, 나이키 캠페인 웹사이트(Nike Better World Campaign website)
nGen Works
맥킨니 에이전시(McKinney Agency)
Kzauhide Fukuyama Portfolio
Klokkerent shop
Harpoon Pictures Directors
고업 커뮤니케이션 그룹(Go Up Communication group)
고스트 홀스(Ghost horses)
무료 에이전트 디폿(FreeAgent Depot)
페시오 디자인(Facio Design)
엠파이어 스테이트 리코딩
HTML5 오디오 테그들을 멋지게 구현하였습니다.
카탈린 보로이(Catalin Boroi)의 포트폴리오
HTML5로 만든 깔끔한 디자인의 홈페이지 입니다.
디지털 핸드 에이전시(Digital Hands Agency)
다니엘 스콜턴(Daniel Scholten)
컬쳐럴 솔루션 UK(Cultural Solution Uk)
카펜 디지털 에이전시(Cappen Digital Agency)
Büro Maisengasse Gassee
BountBev
벤 더 보디가드
에스페시 제펜(Aspesi Japan)
에어워크
이 회사는 보드 스포츠 문화에 혁명을 일으키고 있는 회사입니다. 온라인 샵이 멋진 터치들로 이루어져 있고, 세로 슬라이더,비디오, 애니메이션 등이 있습니다. 눈으로 즐기세요!
Octave and Octave
Octave & Octave 은 디자인과 모바일 웹 기반의 신세대 에이전시 입니다.
데이브 가마체(Dave Gamache)의 2010년의 중요한 7가지
본 페이지는 데이브의 2010년의 특별한 순간들을 표현했습니다. 전체화면의 배경 화면에 오버래핑 되는 세로 네비게이션은정말 질리지 않더군요.
결론
HTML5 와 CSS3의 조합, 그리고 자바스크립트의 엄격한 구현은 새로운 관점의 유저 경험을 가져옵니다. 단지 디자인적으로 작은 HTML5 단계의 변화가 있을지라두요. 새롭고 희망적인 것들이 HTML5를 통한 디자인에서 나올 것을 우리는 기대해봐야 겠습니다.
원문 : 38 websites coded in HTML5 for your inspiration
번역 : Mattew, Chang(www.izect.kr)
(이 글은 한국 HTML5 사용자 모임에 기고된 글입니다.)