제 블로그 글을 요약했습니다. :)
Multi-Device Layout Patterns - LukeW : mediaqueri.es 의 반응형 사이트들의 레이아웃 패턴을 5가지로 구분 (이미지 출처는 원글)





반응형 메뉴(navigation) 패턴 - Brad Frost : 7가지 패턴의 메뉴 처리 패턴.
Top nav or “do nothing”: 주로 메뉴가 상단에 있는 경우, 아무런 처리를 하지 않거나 약간의 조정만 해주는 방법. Footer anchor: 메뉴는 하단으로 보내고, 상단에는 하단 메뉴로 보내는 링크 하나만 남기는 방법. Select menu: 메뉴를 실렉트로 바꾸는 방법. Toggle: 드랍다운 메뉴를 토글로 보여주는 방법. Bootstrap Left nav flyout: 위 레이아웃 패턴중 off canvas에 해당하는 경우. Footer-only: Footer anchor와 다른 점은, 상단에 링크가 없다는 점. “Hide n’ Cry”: 많은 부분을 가려버리고 모바일 용 내용만 보여주는 방법.
그밖에 유용한 그리고 재밌는 리소스들로
복잡한 데스크탑 레이아웃이 어떻게 모바일 레이아웃으로 바뀌는 지 보여주는 웹: http://www.thismanslife.co.uk/projects/lab/responsivewireframes/ – 안에 들어있는 css만 연구해도 괜찮은 소스라 생각됩니다. http://www.thismanslife.co.uk/projects/lab/responsiveillustration/: 같은 웹사이트의 다른 페이지로, 화면 폭을 변화할때 각각을 대표하는 기기들로 변하는 애니메이션. 별다른 용도는 없어보임.
댓글 3개
으허어어어헝헝엏어어어헝엉
그래도 이번것은, 기술적인 부분이 아니고, ui/ux 패턴이라서 그나마 나았어요..^^;
아마 당분간 더 찾아보지는 않고, 지금까지 조사한 것 중
맘에 드는 것 하나씩을 선택해서 프로토타입 만들어보는 것에 집중해볼까 봐요.. ^^
게시판 목록
프로그램
| 번호 | 제목 | 글쓴이 | 날짜 | 조회 |
|---|---|---|---|---|
| 5130 | 13년 전 | 765 | ||
| 5129 | 13년 전 | 1769 | ||
| 5128 | 13년 전 | 934 | ||
| 5127 | 13년 전 | 518 | ||
| 5126 | 13년 전 | 766 | ||
| 5125 | 13년 전 | 1372 | ||
| 5124 | 13년 전 | 842 | ||
| 5123 | 13년 전 | 477 | ||
| 5122 | 13년 전 | 1005 | ||
| 5121 |
|
13년 전 | 1388 | |
| 5120 | 13년 전 | 507 | ||
| 5119 | 13년 전 | 487 | ||
| 5118 | 13년 전 | 417 | ||
| 5117 | 13년 전 | 728 | ||
| 5116 | 13년 전 | 469 | ||
| 5115 | 13년 전 | 920 | ||
| 5114 | 13년 전 | 943 | ||
| 5113 |
cookieyou
|
13년 전 | 1356 | |
| 5112 | 13년 전 | 542 | ||
| 5111 | 13년 전 | 831 | ||
| 5110 | 13년 전 | 4443 | ||
| 5109 | 13년 전 | 1063 | ||
| 5108 | 13년 전 | 425 | ||
| 5107 | 13년 전 | 498 | ||
| 5106 | 13년 전 | 647 | ||
| 5105 | 13년 전 | 1110 | ||
| 5104 | 13년 전 | 415 | ||
| 5103 |
프로프리랜서
|
13년 전 | 1354 | |
| 5102 | 13년 전 | 1592 | ||
| 5101 | 13년 전 | 469 | ||
| 5100 | 13년 전 | 379 | ||
| 5099 | 13년 전 | 526 | ||
| 5098 | 13년 전 | 2141 | ||
| 5097 | 13년 전 | 384 | ||
| 5096 | 13년 전 | 536 | ||
| 5095 | 13년 전 | 389 | ||
| 5094 | 13년 전 | 398 | ||
| 5093 | 13년 전 | 883 | ||
| 5092 | 13년 전 | 1075 | ||
| 5091 | 13년 전 | 430 | ||
| 5090 | 13년 전 | 525 | ||
| 5089 | 13년 전 | 965 | ||
| 5088 | 13년 전 | 422 | ||
| 5087 | 13년 전 | 1176 | ||
| 5086 | 13년 전 | 1513 | ||
| 5085 |
|
13년 전 | 3947 | |
| 5084 |
alexseo
|
13년 전 | 927 | |
| 5083 | 13년 전 | 1132 | ||
| 5082 | 13년 전 | 609 | ||
| 5081 | 13년 전 | 532 | ||
| 5080 | 13년 전 | 615 | ||
| 5079 | 13년 전 | 996 | ||
| 5078 | 13년 전 | 2212 | ||
| 5077 | 13년 전 | 687 | ||
| 5076 |
몰보는거야
|
13년 전 | 1697 | |
| 5075 |
|
13년 전 | 1776 | |
| 5074 | 13년 전 | 2024 | ||
| 5073 |
|
13년 전 | 779 | |
| 5072 |
프로프리랜서
|
13년 전 | 1048 | |
| 5071 |
프로프리랜서
|
13년 전 | 769 | |
| 5070 |
프로프리랜서
|
13년 전 | 881 | |
| 5069 |
뭐먹고살지ㅠ
|
13년 전 | 797 | |
| 5068 |
danielle
|
13년 전 | 656 | |
| 5067 | 13년 전 | 766 | ||
| 5066 | 13년 전 | 838 | ||
| 5065 | 13년 전 | 915 | ||
| 5064 | 13년 전 | 1728 | ||
| 5063 | 13년 전 | 447 | ||
| 5062 | 13년 전 | 837 | ||
| 5061 | 13년 전 | 591 | ||
| 5060 | 13년 전 | 396 | ||
| 5059 |
senseme
|
13년 전 | 870 | |
| 5058 | 13년 전 | 2887 | ||
| 5057 | 13년 전 | 1943 | ||
| 5056 | 13년 전 | 1503 | ||
| 5055 | 13년 전 | 458 | ||
| 5054 |
senseme
|
13년 전 | 1076 | |
| 5053 |
senseme
|
13년 전 | 1915 | |
| 5052 |
senseme
|
13년 전 | 1039 | |
| 5051 |
senseme
|
13년 전 | 1063 | |
| 5050 |
senseme
|
13년 전 | 809 | |
| 5049 |
senseme
|
13년 전 | 994 | |
| 5048 | 13년 전 | 2001 | ||
| 5047 | 13년 전 | 503 | ||
| 5046 |
우렁찬우렁이
|
13년 전 | 895 | |
| 5045 |
크라이스트
|
13년 전 | 2165 | |
| 5044 | 13년 전 | 980 | ||
| 5043 | 13년 전 | 541 | ||
| 5042 | 13년 전 | 987 | ||
| 5041 |
|
13년 전 | 819 | |
| 5040 |
스마일라니
|
13년 전 | 887 | |
| 5039 | 13년 전 | 1159 | ||
| 5038 | 13년 전 | 1934 | ||
| 5037 | 13년 전 | 1053 | ||
| 5036 |
cookieyou
|
13년 전 | 1410 | |
| 5035 | 13년 전 | 505 | ||
| 5034 | 13년 전 | 570 | ||
| 5033 | 13년 전 | 497 | ||
| 5032 | 13년 전 | 442 | ||
| 5031 | 13년 전 | 734 |
댓글 작성
댓글을 작성하시려면 로그인이 필요합니다.
로그인하기