[레이아웃제작기] [이온디 에디션] 참조 반응형 웹사이트
2015.08.21 20:48
87
0
https://eond.com/360894
object(HotopayModel)#808 (23) { ["error"]=> int(0) ["message"]=> string(7) "success" ["variables"]=> array(0) { } ["httpStatusCode"]=> int(200) ["module"]=> string(7) "hotopay" ["module_info"]=> NULL ["origin_module_info"]=> NULL ["module_config"]=> NULL ["module_path"]=> string(52) "/home/eond/web/eond.com/public_html/modules/hotopay/" ["xml_info"]=> NULL ["module_srl"]=> NULL ["mid"]=> NULL ["act"]=> NULL ["template_path"]=> NULL ["template_file"]=> NULL ["layout_path"]=> NULL ["layout_file"]=> NULL ["edited_layout_file"]=> NULL ["stop_proc"]=> bool(false) ["user"]=> object(Rhymix\Framework\Helpers\SessionHelper)#807 (20) { ["member_srl"]=> int(0) ["user_id"]=> NULL ["user_name"]=> NULL ["nick_name"]=> NULL ["email_address"]=> NULL ["phone_number"]=> NULL ["homepage"]=> NULL ["blog"]=> NULL ["birthday"]=> NULL ["denied"]=> NULL ["status"]=> NULL ["is_admin"]=> string(1) "N" ["is_site_admin"]=> NULL ["profile_image"]=> NULL ["image_name"]=> NULL ["image_mark"]=> NULL ["signature"]=> NULL ["description"]=> NULL ["group_list"]=> array(0) { } ["menu_list"]=> array(0) { } } ["request"]=> object(Rhymix\Framework\Request)#10 (13) { ["method"]=> string(3) "GET" ["compat_method"]=> string(3) "GET" ["url"]=> string(23) "blog/360894/page/465339" ["hostname"]=> string(8) "eond.com" ["domain"]=> NULL ["protocol"]=> string(5) "https" ["callback_function"]=> string(0) "" ["_route_status":protected]=> int(200) ["_route_options":protected]=> object(stdClass)#11 (5) { ["cache_control"]=> bool(true) ["check_csrf"]=> bool(true) ["is_forwarded"]=> bool(false) ["is_indexable"]=> bool(true) ["enable_session"]=> bool(true) } ["module"]=> string(5) "board" ["mid"]=> string(4) "blog" ["act"]=> string(16) "dispBoardContent" ["args"]=> array(4) { ["document_srl"]=> string(6) "360894" ["page"]=> int(465339) ["mid"]=> string(4) "blog" ["act"]=> string(16) "dispBoardContent" } } ["ajaxRequestMethod"]=> array(2) { [0]=> string(6) "XMLRPC" [1]=> string(4) "JSON" } ["gzhandler_enable"]=> bool(true) }

#왜 반응형
이온디 에디션 레이아웃은 구조상 반응형인 웹사이트 레이아웃입니다.
처음 만들 때는 PC버전과 모바일 버전으로 각각 따로 만들어야 겠다고 생각했습니다만
작업하다보니 양쪽 로컬메뉴와 사이드바의 넓이가 각각 250픽셀이라 

#컨텐츠 중심의 레이아웃

#확장성 - 이온디 홈페이지의 '큰 그림'
이온디 에디션 레이아웃은 확장성과 사용성을 염두에 두고 작업합니다.
기본적으로 컨텐츠 중심의 레이아웃이며, 고정폭의 넓이를 가진 레이아웃보다 더 많은 내용을 
메뉴 영역 또는 사이트 메뉴, 컨텐츠 상단과 하단에 위젯 형식으로 제공할 수 있습니다.

#무료 버전과 유료 버전
기본적으로 저작권 표시가 있는 버전으로 무료 버전을 배포할 것입니다.
유료 버전과의 차이점은 저작권 표시 유무입니다.

#참조사이트
사이드바가 있는 반응형 사이트, 네이버 캐스트
http://tvcast.naver.com/
http://entertain.naver.com/tv

카페베네
http://www.caffebene.co.kr/

XE 연구센터 (숭숭군)
http://xecenter.com/xe/?mbs=116937

티스토리 스킨
http://chhwa75.tistory.com/1070

온시맨틱 오리지널 레이아웃 LITE(온시맨틱)
https://www.xpressengine.com/index.php?mid=download&package_id=22753732
http://original.onsemantic.com/example1_drip/593

One Color 레이아웃(XE템플릿)
https://www.xpressengine.com/index.php?mid=download&package_id=22753559

doorweb basic 가변형 레이아웃
https://www.xpressengine.com/index.php?mid=download&package_id=22753538

#반응형을 만들면서 주의해야할 점
사용자들이 익숙하도록 엘리먼트의 위치가 변동되서 혼동되지 않도록 만들기

#일워
내가 만들려는 레이아웃과 가장 비슷한 레이아웃!
https://www.ilwar.com/recent

라이믹스는 이온디와 함께

닫기

마이페이지

로그인을 해주세요

네이버로 로그인