다크모드
로그인
회원가입
호스팅
호스팅 신청
정기결제
웹서버세팅
사용가이드
기술지원
기술지원
간편의뢰
견적상담
가격 안내
제품판매
라이믹스
워드프레스
그누보드
아임웹
카페24
피그마
문서
홈페이지 제작팁
홈페이지제작솔루션
CMS
WEB
툴팁
위키
지식인
CMS 포럼
경매모듈
질문•답변
프리랜서 커뮤니티
사이드 프로젝트
소통방
프리랜서 찾기
지역별 프리랜서
구인&구직
홍보
공모전 소개
소모임
홈페이지제작솔루션
CMS
WEB
툴팁
위키
지식인
CMS 포럼
경매모듈
질문•답변
홈페이지 제작팁
홈페이지제작솔루션
CMS
라이믹스(XE)
워드프레스
그누보드
카페24
고도몰
제로보드4
CGI
WEB
웹팁
디자인팁
기획팁
퍼블팁
개발팁
서버관리팁
툴팁
소프트웨어팁
피그마
PHP스톰
Intellij
웹스톰
VSCode
SublimeText
Editplus
jwFreeNote
IE Toy
위키
지식인
CMS 포럼
경매모듈
질문•답변
HTML5/CSS3
글쓰기
-
가
+
[반응형 웹]
전진님의 반응형 웹 강좌
이온디
2013.08.18 11:49
5313
0
https://eond.com/342977
주소복사
카트에 담기
반응형 웹 강좌를 시작하면서
이번에 '반응형 웹' 강좌를 맡게된 전진입니다. '강좌'라는 이름을 붙히기에는 많이 부족하겠지만, 제가 아는 범위 내에서 진행해보겠습니다. 대부분의 자료는
제 블로그
의
반응형웹 관련 글
과
그누보드 스터디 사이트
와 연결된
위키
의 내용을 발췌/정리해서 사용할 예정입니다.
강좌 일정
1. 반응형 웹 디자인/모바일 퍼스트의 이해
반응형 웹 디자인이 무엇이며 어떤 핵심기술들이 존재하며, 접근 전략중의 하나인 모바일 퍼스트를 어떻게 구현하는지 간단히 이해합니다.
2. CSS3 미디어쿼리와 스크린 경계
화면의 크기에 따라서 별도의 스타일을 지정할 수 있는 CSS3 미디어쿼리의 사용법과 스크린 크기를 대표하는 경계치 들에 대해서 알아봅니다.
3. 반응형 그리드
유동형 그리드 등 반응형으로 레이아웃을 만드는 그리드 기법과, 템플릿 등으로 제공되는 (반응형) 그리드 시스템의 종류와 활용법을 알아봅니다.
4. 반응형 레이아웃
데스크탑-테블릿-스마트폰 등 대표적인 기기에서 레이아웃을 바꿔나가는 패턴과 관련 기법 등을 알아봅니다.
5. 반응형 네비게이션/메뉴
모바일 화면에서 네비게이션/메뉴를 어떻게 처리하는지 알아봅니다.
6. 반응형 이미지
반응형 웹에서 이미지와 미디어를 처리하는 방법을 알아봅니다.
7. 서버측 접근방법 (RESS)
일종의 하이브리드 접근방법으로, user-agent 등을 기반으로 사용하는 기기/스크린의 정보를 파악하여 그에 해당하는 콘텐츠를 보내주는 방법 (RESS)를 알아봅니다.
8. 반응형 그누보드 (DTD) (1) - 게시판 스킨
그누보드에서 가장 많이 사용되는 board 스킨을 반응형으로 만들어 봅니다.
9. 반응형 그누보드 (DTD) (2) - 레이아웃
head.php, tail.php 등 그누보드의 레이아웃을 담당하는 코드를 반응형으로 만들어 봅니다.
10. 반응형 그누보드 (DTD) (3) - 기타 스킨들
아웃로그인, 최신글 등 기타 스킨들의 반응형 화
11. 반응형 웹 기술이 적용된 기존 프레임워크
부트스트랩과 foundation 의 내부를 들여다 봅니다.
12. 콘텐츠 퍼스트와 future-friendly
새로운 경향인 콘텐츠 퍼스트 (content first)와 새로운 웹 디자인의 방향을 모색하고 노력하는 future-friendly 에 대해서 알아봅니다.
잠깐글1. 반응형 웹은 ???이다.
반응형 웹에 대한 단상과 많이 하는 질문에 대한 개인적 의견입니다.
잠깐글2. 반응형 테이블
가로폭이 넓은 테이블을 모바일 화면에서 어떻게 처리하는 지 알아봅니다.
위 일정은 수시로 변경될 수 있습니다.
0
0
0
0
라이믹스는 이온디와 함께
댓글
0
댓글작성칸으로
HTML5/CSS3
-
가
+
전체
웹표준
웹접근성
부트스트랩
반응형 웹
UI
HTML5
jQuery
Script
CSS
Meta
Table
Form
미분류
PHP
Flash
CGI
DIV
웹폰트
크로스브라우징
위지윅에디터
svg
프레임워크
map
swiperjs
번호
제목
등록일
공지
코딩 배울 수 있는 사이트 모음(HTML/CSS/JS/IMG/PHP)
웹표준
웹표준
웹표준
웹표준
01/03
공지
jQuery를 배울수 있는 동네들입니다.
jQuery
jQuery
jQuery
jQuery
08/09
공지
관련 링크
1
미분류
미분류
미분류
미분류
05/23
8
[반응형 웹]
기기별 미디어쿼리 사이즈,모바일 디바이스별 사이즈
반응형 웹
반응형 웹
반응형 웹
반응형 웹
05/02
7
[반응형 웹]
모바일 사이드바 만들기
반응형 웹
반응형 웹
반응형 웹
반응형 웹
04/10
6
[반응형 웹]
반응형 템플릿 (naradesign)
반응형 웹
반응형 웹
반응형 웹
반응형 웹
08/26
5
[반응형 웹]
반응형웹(MediaQuery) 템플릿
반응형 웹
반응형 웹
반응형 웹
반응형 웹
08/26
4
[반응형 웹]
모바일 실제 해상도와 device-width
반응형 웹
반응형 웹
반응형 웹
반응형 웹
08/24
3
[반응형 웹]
[다음 TROY] 기기별 모바일 해상도 테스트 할 수 있는 사이트
반응형 웹
반응형 웹
반응형 웹
반응형 웹
08/22
2
[반응형 웹]
responsive-animated-block-menu
반응형 웹
반응형 웹
반응형 웹
반응형 웹
08/15
»
[반응형 웹]
전진님의 반응형 웹 강좌
반응형 웹
반응형 웹
반응형 웹
반응형 웹
08/18
로그인 해주세요.
자유게시판
글쓰기
저장함
쪽지
전체글보기
인기글
인기멤버
태그
즐겨찾는 게시판
메뉴명
메뉴명
메뉴명
전체 게시판
호스팅
호스팅 신청
정기결제
웹서버세팅
사용가이드
기술지원
기술지원
간편의뢰
견적상담
가격 안내
제품판매
라이믹스
워드프레스
그누보드
아임웹
카페24
피그마
문서
홈페이지 제작팁
홈페이지제작솔루션
CMS
WEB
툴팁
위키
지식인
CMS 포럼
경매모듈
질문•답변
프리랜서 커뮤니티
사이드 프로젝트
소통방
프리랜서 찾기
지역별 프리랜서
구인&구직
홍보
공모전 소개
소모임
마이페이지
로그인을 해주세요
로그인하기
네이버로 로그인
브라우저를 닫더라도 로그인이 계속 유지될 수 있습니다. 로그인 유지 기능을 사용할 경우 다음 접속부터는 로그인할 필요가 없습니다. 단, PC방, 학교, 도서관 등 공공장소에서 이용 시 개인정보가 유출될 수 있으니 꼭 로그아웃을 해주세요.
댓글 0
댓글작성칸으로