이온디

따뜻한 커피같은 토닥 커뮤니티

세월호, 71시간의 기록
한국어
찜한 책
2013.03.01 00:41

모바일 웹 퍼블리싱

조회 수 1770 추천 수 0 댓글 0
?

단축키

Prev이전 문서

Next다음 문서

크게 작게 위로 아래로 댓글로 가기 인쇄
?

단축키

Prev이전 문서

Next다음 문서

크게 작게 위로 아래로 댓글로 가기 인쇄
Extra Form
링크 http://book.naver.com/bookdb/book_detail.nhn?bid=7099934
저자 주영아
출판사 인터프레스
출판년도 2012.12.21


이번에 배우고자 하는 욕심만 많아 서점에서 둘러보지 않고 막 고른 측면이 없잖아 있어 내용이 좀 미흡한 책을 고른 것도 같지만

이 책의 경우는 고민하지 않고 바로 질러도 괜찮을 것 같습니다. 추천을 받아 저도 포스팅합니다. ^^


출처 http://cafe.naver.com/dgeeks/4369


모바일 웹 퍼블리싱" 괜찮아서...소개해 드립니다.

 

모바일 웹 퍼블리싱은 XHTML + CSS2 기반의 웹 표준부터 시작하여 HTML5 + CSS3까지 이어지는 웹 페이지 제작 기술을 소개하고 모바일 웹 페이지 제작에 필요한 활용 기법을 넘기면서 쉽게 배우고 익힐 수 있게 편집하였으며, 드림 위버나 기타 다른 저작 도구를 사용하여 한번쯤 웹 페이지를 제작해 본 경험은 있으나 웹 표준과 HTML5 및 CSS3에 대하여 체계적인 정리가 필요한 분들이나, 웹 표준과 크로스 브라우징 기법에 대해서 습득하고자 하는 웹 퍼블리셔, PC용 웹 페이지 제작경험을 모바일용 웹 페이지 제작에 활용하는 능력을 습득하기 위한 분들에게는 모바일 웹 퍼블리셔 실무자로 전문가로 거듭날 수 있는 좋은 기회를 제공할 것입니다.

 

*모바일 웹 페이지 제작에 필요한 모든 과정에 대한 총정리 입문서

*한권으로 끝나는 모바일 웹 페이지 제작의 실전 입문서

*모바일 웹 페이지 제작! 이 한권이면 어렵지 않습니다.

*실무에 사용되는 웹표준과 html5의 핵심기법들만 모아놓은 모바일 웹 퍼블리싱 바이블

 

 

목 차

PART 1

Section1. 웹 접근성과 웹 표준

1. 웹 접근성

1) 웹 접근성 개요

2) 웹 접근성의 법제화

2. “à시멘틱 웹”à과 “à웹 표준”à

1) 시멘틱 웹

2) 웹 표준

3. 어떤 브라우저를 쓸까

1) 웹 브라우저의 종류

2) CSS 렌더링 지수

Section2. 작업환경 구성하기

1. Google Chrome Browser의 설치

2. Aptana Studio 3의 설치

1) Aptana Studio 다운로드

2) Aptana Studio Workspace 설정

3) Aptana Studio 테마 설정

4) Aptana Studio 프로젝트 생성하기

5) 프로젝트에 새 항목 추가하기

6) 예제소스 불러오기 (다른 프로젝트 불러오기)

7) 기본 글꼴 변경하기

8) 소스 자동 완성 기능 사용 및 설정하기

9) 소스 자동 줄 맞춤 기능 사용하기

10) 실행환경을 Google Chrome 브라우저로 변경하기

11) 인터넷 공유기를 통한 핸드폰 접속환경 설정하기

XHTML with CSS2

3. Site To Phone의 설치

1) 계정 생성하기

2) Google Chrome 브라우저의 플러그인 설정하기

3) iPhone용 App 설치하기

4) Android용 웹 페이지 등록하기

4. IETester 사용하기

PART 2

Section1. 웹 표준으로 작업하기

1. HTML 페이지의 기본 구조

1) DTD 선언문

2) 캐릭터 셋을 지정하기 위한 meta태그

3) 모바일 장치의 해상도 설정을 위한 Viewport 지정하기

2. HTML 태그의 분류

1) 블록 레벨 요소 (Block Level Element)

2) 인라인 레벨 요소 (Inline Level Element)

3) 치환요소 요소

3. CSS 시작하기

1) HTML 문서에 CSS를 적용하는 방법

2) CSS의 기본 형식

3) CSS 기본 셀렉터

4) 셀렉터를 조합하여 사용하기

5) 기본적인 가상 셀렉터

6) 잘 알려지지 않은 가상 클래스

7) HTML 태그의 속성에 따른 셀렉터

4. CSS 구체성 단위

Section2. 글자/문단 관련 속성

1. 글자 관련 속성

1) 기본 적인 글자 관련 속성.

2) 글자 관련 속성 일괄 지정 하기

2. 문단 관련 속성

Section3. CSS2 박스모델

1. 박스의 크기

1) 박스의 기본 크기

2) 박스의 크기를 구성하는 속성 90 2) 박스 계층에서의 크기

3) height 100%의 비밀

2. 박스를 벗어나는 내용에 대한 처리

1) overflow 속성

2) text-overflow 속성

3) 최대/최소 크기 지정하기

3. 위치 관련 속성

1) margin 속성에 대한 이해

2) padding VS margin

3) 박스 계층에서의 margin 속성

4. auto값의 사용

1) width, height에서의 auto값

2) margin에서의 auto값

5. display 속성

1) display 속성의 기본 이해

2) inline-block

3) 목록 정의 요소 사용하기

Section4. Float 처리

1. Float 속성의 기본 특성

1) Float 속성의 기본 특성

2) 새로운 문단의 시작 처리

3) 중첩된 박스에서의 Float 속성

4) 박스 나열하기

5) 갤러리 레이아웃 예제

6) Float 속성을 사용한 레이아웃 구성하기

Section5. 포지션 관련 속성

1. 포지션 속성의 기본 특성

1) position: relatvie

2) position: absolute

3) position: fixed

4) 절대좌표 기준점의 이동

2. 포지션 속성의 응용 (리스트 뷰)

1) HTML 코드의 작성

2) CSS 코드의 작성

Section6. 배경 관련 속성

1. 배경 관련 속성 살펴보기

1) 배경 이미지 지정하기

2) 배경 속성 일괄 지정

2. 배경 관련 속성 응용하기

1) 웹 접근성을 고려한 서브타이틀

2) 이미지를 사용한 리스트 메뉴

3. 이미지 클립핑 기법

1) 이미지 클립핑의 개요

2) 이미지 클립핑의 활용

3) 이미지 클립핑의 이점

Section7. IE를 위한 처리

1. CSS Hack

1) IE6을 위한 분기 처리

2) IE7을 위한 분기 처리

3) IE6과 IE7을 위한 분기 처리

2. IE 조건부 주석

1) 조건부 주석의 사용 방법

2) 조건부 주석의 종류

3. IE6 PNG 버그 해결

1) DD_belatedPNG 스크립트 소개

2) DD_belatedPNG 스크립트 사용방법

4. 그 이외의 필수적인 크로스 브라우징 팁

1) IE 7/8 호환성 보기 모드 금지

2) IE9.js 파일의 적용

3) reset.css 파일의 적용

Section8. 모바일 웹을 위한 기본 사양

1. CSS 및 xxJavaScript 기본 사양

1) 폰트 크기 변경 방지

2) 브라우저 주소 표시줄 숨기기

2. 모바일 웹을 위한 추가사항

1) 배경화면 즐겨찾기 아이콘 지정하기

2) iOS를 위한 추가적인 처리

3. 단말기의 기능을 활용할 수 있는 DataLink

Section9. Demo(1) - 아카데미 모바일 웹

1. 작업 내용 살펴보기

1) 파일 구성

2) 이미지 파일

2. 메인페이지 작업 (index.html)1

1) HTML 태그 구성

2) 공통 CSS - /css/common.css

3) 메인페이지 CSS - /css/index.css

3. 센터소개 페이지 작업 (info.html)

1) HTML 태그 구조

2) 타이틀 바 공통 CSS - /css/top_bar.css

3) 센터소개 페이지 CSS - /css/info.css

4. 과목 소개 페이지 작업 (a.html)

1) HTML 태그 구조

2) content 영역의 CSS 표현 - /css/a.css

Section10. Demo(2) - 아파트 분양 안내 모바일 웹

1. 작업 내용 살펴보기

1) 파일 구성

2) 이미지 파일

2. 메인페이지 작업 (index.html)

1) HTML 태그 구성

2) 공통 CSS의 구성 - /css/common.css

3) 메인페이지의 CSS의 구성 - /css/index.css

3. 분양안내 페이지 작업 (a.html)

1) HTML 태그 구성

2) 상단 tab 영역 스타일 구성 - /css/tab.css

3) 본문영역 스타일 구성 - /css/a.css

4. 단지소개 페이지 작업 (b.html)

1) HTML 태그 구성

2) 본문영역 스타일 구성 - /css/b.css

XHTML5 with CSS3

PART 3

Section1. HTML5의 개요

1. HTML5의 등장

1) 웹 페이지와 웹 어플리케이션

2) HTML5의 탄생

2. HTML5의 소개

1) 퍼블리셔의 HTML5와 프로그래머의 HTML5

2) 플러그인이 필요 없는 웹 436

3) HTML5의 현재와 미래

Section2. HTML5 태그

1. HTML5의 기본 문서 구조

2. 새롭게 추가된 시멘틱 태그

1) 문서의 구조를 표현하기 위한 태그

2) 내용을 강조하기 위한 태그

3) 추가된 공통 속성

4) HTML5를 지원하지 않는 브라우저에 대한 처리

Section3. 멀티미디어 지원 태그

1. 음악 재생을 위한 <audio>태그

2. 동영상 재생을 위한 <video>태그

Section4. HTML5 Form

1. 기존의 Form 요소

1) <form> 태그의 기본 사용법

2) <form> 태그의 기본 입력 컨트롤

3) 그 밖의 입력 컨트롤들

2. 새롭게 추가된 HTML5의 Form 요소

1) 새로운 input 요소들

2) <input> 태그의 새로운 속성

3) 새롭게 추가된 <button> 태그

Section5. CSS3 시작하기

1. CSS3의 새로운 가상 클래스

1) 반복되는 요소의 특정 위치를 선택할 수 있는 :nth-child

2) 동일 페이지 내에서 링크를 통해 지정되는 :target

3) 반응형 웹 페이지 제작을 가능하게 해 주는 미디어쿼리

Section6. CSS3의 새로워진 효과들

1. 브라우저마다 다르게 구현되는 프로퍼티

2. CSS3 텍스트/문단 관련 효과

1) 줄바꿈을 제어하는 word-wrap 속성

2) 단 나누기를 지원하는 multi_columns 속성

3) 웹 폰트 지원

4) 글자에 대한 그림자 처리

3. 새로워진 색상처리 방법들

1) 색상에 추가된 투명도 효과

2) 배경 색상에 적용가능한 그라데이션 효과

3) CSS3로 제작한 타이틀 바 예제

4. 박스 관련 효과.

1) 투명처리

2) 둥근 모서리 효과

3) 박스에 대한 그림자 처리

4) 이미지 태두리

5. 더욱 강력해진 배경 이미지 관련 속성

1) 배경이미지 중첩 적용

2) 배경이미지 적용 범위 지정

3) 배경이미지 크기 조절

6. 요소의 형태 변환 - transform.

7. CSS 애니메이션 효과

1) CSS3 Transition 소개

2) 애니메이션 효과가 가미된 submenu 구현

3) 애니메이션 효과를 적용한 아코디언 메뉴 예제

8. CSS3 애니메이션 무비

Section7. Demo - 관광정보 모바일 웹

1. 작업 내용 살펴보기

1) 파일 구성

2) 이미지 파일

2. 메인페이지 작업 (index.html)

1) HTML 태그 구성

2) 공통 CSS의 구성 - /css/common.css

3) 메인페이지 스타일 시트 구성 - /css/index.css.

3. 서브페이지 작업 (a.html)

1) HTML 태그 구성

2) 서브페이지 스타일 시트 구성 - /css/a.css.

~^^


  1. No Image

    국내 일반 시립 도서관의 서적 분야

    비밀글입니다.
    Date2014.03.06 Category일반
    Read More
  2. No Image

    학년별 권장도서 E-book

    e독서비치여부확인.xlsx e독서비치여부확인.xlsx mellowslo@다음
    Date2014.02.06 Categoryebook
    Read More
  3. No Image

    모바일 웹 퍼블리싱

    이번에 배우고자 하는 욕심만 많아 서점에서 둘러보지 않고 막 고른 측면이 없잖아 있어 내용이 좀 미흡한 책을 고른 것도 같지만 이 책의 경우는 고민하지 않고 바로 질러도 괜찮을 것 같습니다. 추천을 받아 저도 포스팅합니다. ^^ 출처 http://cafe.naver....
    Date2013.03.01 Category찜한 책
    Read More
  4. No Image

    웹 접근성 프로젝트 시작하기(NHN은 이렇게 한다)

    웹 접근성 지침서랄까요..; 2013년에 새로 나온 따끈따근한 책입니다. 위키북스는 이런 책을 많이 내서 참 좋아요.
    Date2013.02.27 Category찜한 책
    Read More
  5. No Image

    오래가는 UX 디자인(모바일 시대의 제품 디자인 기본 원칙)

    웹 관련 서적은 '바이블'이라 삼을 정도로 수학의 정석 같은 책이 나오기 어렵습니다. 그러나 이 책은 왠지 UX계의 바이블이 될 조짐이 보인다고 할까요?;;
    Date2013.02.27 Category찜한 책
    Read More
  6. No Image

    html&css 웹사이트 개발과 디자인 기초

    리뷰 : http://blog.naver.com/dmlrud7/174831023
    Date2013.02.27 Category찜한 책
    Read More
  7. No Image

    모던 웹 디자인을 위한 HTML5+CSS3 입문(PC 태블릿 모바일 웹 페이지를 한 번에 끝내는 디자인 입문서)

    정가 : 30,000원 한빛미디어에서는 모던 웹 시리즈가 있는 중 그 중 한 권 입니다. 책의 뒷 표지에 로드맵이 그려져 있는데, 모던 웹디자인을 위한 HTML5+CSS3 입문 > 모던 웹을 위한 Javascript+jQuery 입문 > 모던 웹을 위한 Node.js 프로그래밍 자바스크립...
    Date2013.02.27 Category
    Read More
  8. No Image

    메모혁명

    지은이는 그림으로 생각할 줄 아는 사람은 일도 잘한다고 이야기하며, 자신의 아이디어를 그림의 메모로 활용하여 효과적인 커뮤니케이션을 이루자고 제안한다. 이 책은 메모기법은 그림이나 도형으로 나타낼 수 있는 방법, 즉 빠르고 명확하게 정보를 제공할 ...
    Date2011.11.27 Category찜한 책
    Read More
  9. No Image

    블랙 스완

    2009년 6월 24일 네이버 오늘의 책에 선정되었던 책이다. 물론 시일이 좀 지나긴 했지만 책이 시간이 지났다고 해서 그 지식이 남루하다던가 쓸모없는 것이 되버린다면 그것이 과연 책으로써 제 역할을 다하는 것이라 할 수 있겠는가. 책은 음악이나 그림과 마...
    Date2011.02.25 Category찜한 책
    Read More
  10. No Image

    생각하지 않는 사람들 / 니콜라스 카

    오랜만에 새로 주문한 책입니다. 그동안 토익이다 자격증이다 시험 준비로 책 읽기는 내 생활사 영역 저 밖의 것으로 멀리 하고 살았는데 책을 읽지 않고는 생각을 할 수가 없는 것 같습니다. 생각을 하지 않고는 말 또한 할 수가 없는 것이고요. 입력과 출력 ...
    Date2011.02.24 Category찜한 책
    Read More
목록
Board Pagination Prev 1 2 3 4 5 6 Next
/ 6