웹을 통해 새로운 창조를 꿈꾸는 인간 - kimdirector
www.kimdirector.co.kr Photo by unsplash.com
kimdirector
Creative Web & Mobile UI/UX Planner and Designer
Humans dreaming of new creation through the UI/UX



WEBDESK
Design Inspiration
HOME WEBDESK Design Inspiration
40 Effective Responsive Navigation Menus
Posted by kimdirector | 2014.12.13 | Hit : 1689
Responsive Navigation Menus 반응형 네비게이션 모바일
목록보기이전보기
아래 소개하고 있는 사이트들은 기본으로 반응형 웹 형태로 되어 있습니다. PC 버전인 경우에는 상관없이 서핑이 가능하겠지만, 모바일 버전에서의 홈페이지 서핑의 상황은 완전히 다른 형태로 구성될 수 밖에 없습니다.
 
이유는 간단합니다. 모두 아시겠지만, 모바일의 특성상 PC버전처럼 구현할 수 없는 형태입니다. 모바일의 가로 폭이 짧고, 세로로 긴 형태이므로 모바일 환경을 고려하여 디자인하거나 개발을 해야 합니다.
 
모바일에서 웹페이지를 구현할 떄 가장 고민되는 부분이 네비게이션 시스템 부분인 것 같습니다.
 
제한된 공간에 네비게이션 시스템을 PC버전 처럼 구현했다가는 첫번째 진입화면이  네비게이션 시스템으로 꽉 차게될 것이고 내용을 확인하기 위해서는 당연히 버티컬 스크롤을 하거나, 메뉴를 Tab 해야 하는 상황이 연출되고, 사용자로 하여금 뭘 해야 하는지 당황하게 만들 수 있습니다.
 
그러한 사용자 경험을 또대로 네비게이션 시스템을 모바일 환경에 최적화하여 서비스를 기획하고 디자인하고 개발을 해야 하는 것 입니다. 소개하고 있는 40가지의  모바일 네비게이션 시스템의 좋은참고 자료가 될 것으로 생각합니다.
 
40가지 중에서도 비슷한 것들이 많지만 조금씩의 나름대로 차이점을 가지고 있고, 실제 홈페이지를 보시면 다른 요소들도 볼 수 있어서 추천할 만한 것들입니다. 최근 웹디자인 트렌드도 확인할 수 있습니다.
 
브라우저에서 보시려면, 브라우저 가로폭을 줄여서 보면 되는거 아시죠.
 
시간있을 때 한번씩 확인하고 지나가시기 바랍니다.


Grain & Mortar


Your Majesty Co


Andculture


WP Engine


Pace Law


Antro


Fixed Digital Agency


Draftfcb


Zinio


Marmoset Music


Static Interactive


The Japan Times


A List Apart


An Event Apart


Stanford Arts


World Wildlife Fund


Tilde Inc.


Paid to Exist


Web Design Ledger


Fiafo


StudioPress


ThemeTrust


DevCasts


Awesem


Matter of Form


The1stMovement


WebEffectual


Mostly Serious


Daniella Draper


Wedge & Lever


MarketPlace


Webknit


Tradestone Confections


Coulee Creative


Rokivo


 
Curt’s Special Recipes


Fall in Tennessee


Wallmob


More Air

 

Posted by kimdirector | 2014.12.13 | Hit : 1689
LINK http://www.vandelaydesign.com/inspirationalnavigation-menus/
Tags Responsive Navigation Menus 반응형 네비게이션 모바일
Trackback http://www.kimdirector.co.kr/bbs/zerotb.php?id=DesignInspiration&no=68

COMMENT
목록보기 이전보기

WEBDESK
Design Review
Webdesign Report
Web Plan Report
Design Inspiration
Mobile Life
Web Standard
Recommend Site
Insight Story
Popular Contents
Category Cloud
About us Review Portfolio Design Review Leaders Story Mobile UXD IT Information Web Identity Everyday Story Mobile Life Webdesign
Web Standard Homepage Work Web Plan Report Practical Use Tip Inspiration Download Recommend Site
Tags
웹디자인 기업 디자인 프로그레시브 웹앱스 프로젝트 결단 디지털데일리 사고 가이드라인 이벤트 아이포 브라우저 애플리케이션 kimdirector 템플릿 무료 소스 유저인터페이스 토론 바이널 리더십 인터랙션 디자인 바탕화면 비주얼 인스펙터 IT 플래시 네이버 Evernote BIP 블로그 유형 관리 웹표준 로고 Renewal 아웃룩 트랜드 마이클 델 iOS