반응형 웹 강좌를 시작하며 > 퍼블리싱강좌

퍼블리싱강좌

본 게시판은 강좌를 연재하는 회원님들을 위한 전용 게시판입니다.
강좌를 연재하시려는 경우 미리 관리자에게 알려 주십시오.
알리지 않고 등록되는 글은 팁 게시판 등으로 이동됩니다.

반응형 웹 강좌를 시작하며 정보

반응형웹 반응형 웹 강좌를 시작하며

본문

반응형 웹 강좌를 시작하면서

이번에 '반응형 웹' 강좌를 맡게된 전진입니다. '강좌'라는 이름을 붙히기에는 많이 부족하겠지만, 제가 아는 범위 내에서 진행해보겠습니다. 대부분의 자료는 제 블로그반응형웹 관련 글그누보드 스터디 사이트와 연결된 위키의 내용을 발췌/정리해서 사용할 예정입니다.

강좌 일정

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. 반응형 테이블
가로폭이 넓은 테이블을 모바일 화면에서 어떻게 처리하는 지 알아봅니다.
  • 위 일정은 수시로 변경될 수 있습니다.
추천9
스폰서링크

댓글 전체

좋은 강좌 기대합니다.
궁금한점이 있습니다.
반응형 웹이라고 하는데,

하나의 페이지를 PC, 모바일, 화면 사이즈에 맞추어서 CSS 로 화면을 재구성(?) 한다는건 알고 있는데요.
이렇게 했을 때의 장점은 도대체 무엇인가요?

한 페이지에 모바일,PC 두가지의 CSS 가 들어가고,
거기에 맞추어 HTML 도 더 들어갈거 같은데...
그러면 트래픽도 더 먹고 불러들여야 하는 HTML 양도 더 많아지는데요.
핵심적인 질문이네요. ^^
강좌를 진행하면서 더 알아보겠지만 우선 간단히 말씀드리자면,
알찬돌삐님 말씀이 맞습니다. ^^;
특히, 더 많은 트래픽을 (특히 모바일에서) 어떻게 최소화하느냐가 반응형 웹의 해결해야 할 부분 중 하나일것입니다.

그럼에도 불구하고 장점이 되는 점을 언급하자면,
- 모바일사이트를 별도의 주소/코드로 만들지 않기에, 하나의 코드만 관리하면 되며
- PC, 스마트폰 등 (어느정도) 정해진 스크린 뿐만 아니라, 10인치 테블릿, 7인치 테블릿 등 계속 쏟아져 나오는 여러 형태/크기의 스크린에 적절히 대응할 수 있기 때문입니다.

앞으로도 좋은 의견/토론 계속 부탁드립니다.
전체 277
퍼블리싱강좌 내용 검색

회원로그인

(주)에스아이알소프트 (06253) 서울특별시 강남구 도곡로1길 14, 6층 624호 (역삼동, 삼일프라자) 대표메일:admin@sir.kr
사업자등록번호:217-81-36347 대표:홍석명 통신판매업신고번호:2014-서울강남-02098호 개인정보보호책임자:이총

© SIRSOFT