청구할인 안내(인터파크 제휴카드) | 안내
북피니언 롯데카드 30% (최대할인 3만원 / 3만원 이상 결제)
하나SK 북&카드 30% (최대할인 3만원 / 3만원 이상 결제)
EBS 롯데카드 20% (최대할인 3만원 / 3만원 이상 결제)
인터파크 NEW 우리V카드 10% (최대할인 3만원 / 3만원 이상 결제)
인터파크 현대카드 7% (최대할인 3만원 / 3만원 이상 결제)
Close

2013년 9월 9일 이후 누적수치입니다.

웹디자인 2.0 고급 CSS : 감각적인 웹디자인 예술 미학

판매지수 138
?
판매지수란?
사이트의 판매량에 기반하여 판매량 추이를 반영한 인터파크 도서에서의 독립적인 판매 지수입니다. 현재 가장 잘 팔리는 상품에 가중치를 두었기 때문에 실제 누적 판매량과는 다소 차이가 있을 수 있습니다. 판매량 외에도 다양한 가중치로 구성되어 최근의 이슈도서 확인시 유용할 수 있습니다. 해당 지수는 매일 갱신됩니다.
Close
정가

35,000원

  • 31,500 (10%할인)

    1,750P (5%적립)

  • (1건)

    31,500원 ~(10%할인)

    [특급]

  • 중고판매

    이 책을 인터파크에
    판매하세요

할인혜택
  • 26,500원 [하나카드] 5만원이상 구매시 5천원 할인!할인쿠폰
적립혜택
배송정보
주문수량
감소 증가

I-Point는 출고완료 후 14일 이내 마이도서에서 직접 받기를 하셔야 합니다. (이후 자동소멸)

  • 이벤트/기획전

  • 연관도서(53)

  • 사은품

출판사 서평

웹이 발전하면서 새로운 표준이 점차 생겨나고 있으며 최신 브라우저는 웹을 새롭게 만들 수 있는 다양한 기능을 제공하고 있습니다. 웹사이트를 만드는 방법도 그에 따라 나날이 바뀌고 있습니다. 하지만 웹 디자이너 중 프로그래밍을 할 수 있는 사람은 많지 않습니다. 그렇기 때문에 멋진 디자인을 만들 때 의미있는 마크업과 CSS를 사용해야 한다는 사실은 제약이 될 수 있습니다. 뿐만 아니라 클라이언트에게 멋진 디자인을 선보이면서도 효율적인 업무 프로세스를 지켜야 하고 게다가 짧은 기간 안에 이 모든 것을 해내야 한다면 스트레스가 이만저만이 아닐 것입니다. 이러한 환경을 이미 경험해 잘 이해하고 있는 디자이너 앤디 클락은 ‘고급 CSS’를 활용해 접근성과 사용성이 높으면서도 아름다운 사이트를 만드는 웹디자인 2.0 개념에 대해 설명합니다.

이 책에서는 다양한 사례를 통해 마크업과 CSS를 사용하면서도 창의적이고 독창적인 디자인을 만들 수 있음을 보여줍니다. 새로운 업무 방법론을 소개하고 디자이너뿐만 아니라 프로젝트 팀 모두가 활용할 수 있는 프로토타입 제작방법을 설명합니다. 또한 그리드 기반 디자인을 웹에 적용하는 방법과 마크업 구조를 만드는 방법 등도 알려줍니다. 그밖에도 CSS3 등 앞으로 각광받을 기법들과 이를 최신 브라우저에서 직접 확인해보는 기술적인 내용뿐만 아니라, 프로젝트 팀 구성원과 더욱 효율적으로 업무를 수행하기 위한 개념적인 내용 등도 소개합니다.

■ 시각적으로 손쉽게 코딩 기술을 익힐 수 있습니다.
■ 유수 웹사이트, 사진작품, 컨셉 등 수많은 예제와 화보들을 통해 코드를 만드는 다양한 방법을 배울 수 있습니다.
■ 최신 웹브라우저와 최신 CSS3 스펙 사용 환경에 대한 기술적 이점을 한발 앞서 체험해 볼 수 있습니다.

감수자 소개
몰리 홀즈쉬랙
몰리 홀즈쉬랙은 열성적으로 저술활동과 강의를 하는 웹디자이너로서 웹 디자인과 개발에 관련된 30여권의 책을 저술했습니다. 데이브 셰어와 공저한 『The Zen of CSS Design』으로 더욱 유명해진 그녀는 가장 뛰어난 웹 전문가 중 한 명으로 인정 받으며 웹에서 가장 영향력 있는 여성 25인에 뽑히기도 했습니다. 웹 표준 프로젝트의 그룹 리더를 맡고 있으며 HTML과 다국어관련 W3C의 초대된 전문가로서 전세계를 대상으로 웹 디자인과 개발을 열심히 전파하고 있습니다.



<추천의 글>

웹 디자이너는 시각적인 사고를 하는 사람들이고 개발자들은 순차적인 사고를 하는 사람들입니다. 이들이 함께 일하면서 발생하는 커뮤니케이션 차이를 줄이는 일은 매우 힘든 일 중 하나입니다. 디테일과 창의적인 면을 중시하는 디자이너와 끊임없이 발전하는 복합 기술에 관심이 많은 개발자 성격 모두를 소화할 수 있는 사람은 흔치 않습니다. 그런 측면에서 제프리 젤드만, 더글라스 보우맨, 데이브 셰어 같은 사람들은 확실히 업계에 큰 공헌을 했다고 할 수 있습니다. 그들은 양쪽 방면 모두와 관련된 일을 했을 뿐만 아니라 그들이 그러한 위치에 도달할 수 있었던 방법에 대해 글로 남김으로써 다른 이들도 배울 수 있게 했기 때문입니다.

몇년 전 저는 뉴라이더스 출판사와 함께 『Integrated Web Design』이라는 책에서 위에 언급한 내용들을 썼습니다. 어떻게 하면 디자이너들이 의미가 있으면서 구조화된 개념을 갖고 생각할 수 있게 될까? 어떻게 하면 프로그램 기반의 분석적인 사고를 하는 개발자들이 미적인 부분에 대해 이해하고 인정할 수 있을까? 그에 덧붙여 관리부서나 마케팅 부서 등 기타 부서들과 커뮤니케이션하면서 발생하는 복잡한 문제들을 어떻게 해소할 수 있을까? 그리고 업무효율을 높이기 위해, 기술적인 지식을 쌓기 위해, 훌륭한 디자인을 만들기 위해, 끊임 없는 자기 개발을 하는 전문가가 되기 위해 어떻게 해야 하는지의 내용도 고민했습니다.

그런 생각을 하면서 저는 앤디 클락이 떠올랐습니다. 저는 오래 전부터 마크업과 CSS에 사용할 범용적인 명명법에 관심을 갖고 있었습니다. 때마침 앤디가 자신의 블로그에 그런 주제에 대해 글을 올린 것을 보고 그에 대해 알게 되었습니다. 이후 그의 글과 디자인 작업물을 더 자세히 살펴봄으로써 그가 실용적이면서도 열정적인 아이디어를 갖고 양쪽 분야의 차이를 좁혀 나가는 사람이라는 것을 알게 되었습니다. 앤디와는 2005년 SXSW컨퍼런스에서 첫 대면을 했고 이러한 주제에 대해 이야기를 나눴습니다. 몇 개월 지나지 않아 우리는 '디자이너를 위한 CSS', '개발자를 위한 CSS' 같은 워크샵을 만들어냈고 서로가 갖고 있는 기술 및 경험이 상호 보완되어 우리 주변 동료들을 교육하고 이끌었습니다.

앤디가 책을 쓰고 싶다는 이야기를 꺼냈을 때 저는 매우 흥분이 되어 바로 피치핏과 뉴라이더스의 편집자인 낸시 앨드리히 루엔젤에게 소개해 주었습니다. 앤디가 쓰고 싶은 이야기라면 당연히 뉴라이더스의 'Voices That Matter' 시리즈가 적합하다고 생각했습니다. 우리 셋은 샌프란시스코에서 만났고, 저를 잘 아는 사람이라면 매우 놀랄 일이겠지만, 그날 그 둘이 너무나도 열심히 이야기를 하는 통에 저는 채 세 마디도 하지 못했습니다. 결국 이야기가 잘되었고 저와 데이브 세어가 쓴 『The Zen of CSS Design』의 성공을 이어갈 수 있는 가장 적합한 책이 될 것이라고 생각했습니다. 저는 책의 편집을 지원하고 앤디와 같이 전체적인 흐름과 목차를 맞추었으며, 데이브는 서문을 쓰고 더 좋은 디자이너나 개발자가 되고자 하는 사람에게 이 책을 소개했습니다.

이 책을 만드는 과정이 수월하지만은 않았습니다. 아무리 기술적인 지식을 쌓았다고는 하지만 앤디는 근본적으로 비주얼적인 사람입니다. 한편 저는 디자인과 관련된 교육을 받았다고는 하지만 순차적이고 논리적으로 생각하는 사람입니다. 대부분의 비주얼적인 사람들이 그렇듯이 앤디는 상상력과 창의력이 넘치는 세계에서 살고 있는 반면 저는 순서와 커뮤니케이션 그리고 절차를 좋아합니다. 이 책을 만들면서 부딪히고 해결해야 했던 많은 문제들은 우리 주변에서 흔히 있는, 타입이 다른 사람들 사이에서 발생하는 바로 그런 문제였습니다.

이 책에서 우리는 매우 아름답고 기술적으로 안정될 뿐만 아니라 미래에 대한 비전도 포함할 수 있었습니다. 이렇듯 배경이 다른 사람들이 함께 머리를 모아 원하던 모든 내용을 담을 수 있었다는 점에서, 열심히 노력한다면 차이를 극복하고 진정한 변화를 만들 수 있다고 생각합니다. 그리고 이 책을 통해 그 과정을 독자 여러분과 공유할 수 있다는 사실이 매우 기쁩니다. 이 책을 읽는 여러분은 우리가 속한 산업군의 변화를 앞장서서 만들어낼 분들이기 때문에 더욱 그렇습니다. 이 책을 읽으신 독자 여러분들이 상상 속에서 만들고 싶었던 웹을 현실에서도 구현할 수 있는 능력을 한껏 높이실 수 있길 바랍니다.

몰리 E. 홀즈쉬랙
2006년 10월, 런던에서

목차

1장 웹에 대한 재발견

Transcendent CSS 소개
어떤 툴을 사용해야 할까?
왜 Transcendent CSS를 사용해야 하는가?
앞으로의 웹은 어떤 모습일까?
접근성은 옵션이 아니라 디자인 그 자체이다.
Transcendent CSS에 다가가기

Transcendent CSS의 기본 개념
사이트가 모든 브라우저에서 똑같이 보여야 하는 것은 아닙니다.
쓸 수 있는 모든 CSS 선택자를 사용합니다.
가능하면 새로나온 CSS3를 사용해서 한발 앞서 나갑니다.
CSS로 표현하기 어려운 부분은 JavaScript와 DOM을 사용합니다.
가능하면 핵과 필터를 사용하지 않도록 합니다.
의미 있는 코드 이름을 사용하고 마이크로포멧을 사용합니다.
아이디어를 공유하고 다른 사람들과 협력합니다.

왜 이제서야 Transcendent CSS를 사용할 수 있는가?
예상하지 못한 CSS의 사용
브라우저 지원 등급화
발견하고 진행하고 영감 받아아서 앞으로 나아가기

컨텐츠 중심의 디자인
컨텐츠 중심의 접근
흔히 볼 수 있는 최적화 되지 않은 CSS 레이아웃
스타일과 상관없이 최적화하기

시맨틱(semantics) = 의미
CSS 옷 벗는 날 (CSS Naked Day)
의미를 마크업으로 변환하기
컨텐츠의 의미 파악하기
계속 의미있게 작업하기

세상 모든 것을 마크업으로
전세계는 리스트로 만들 수 있다.
눈에 보이는 대로 리스트 사용하기
샌프란시스코에 가면 hCard를 보내세요.
세상을 더 넓게 보는 훈련하기
컨텐츠에서 시작해서 작업하기

여태까지 배운 내용으로 웹을 만들기

2장 웹을 만드는 새로운 방법

완벽한 방법론을 찾아가는 과정
더 좋은 방법 찾기
컨텐츠 기반의 프로세스

컨텐츠 수집하기

화면구성도 작성하기
과거의 화면 구성도가 실패할 수 밖에 없는 이유
과거의 화면 구성도와 동적인 표현

Grey Box 방법을 활용한 개선된 접근법
자세히 표현하기 위해 "심볼" 사용하기

시안 작업
빠르게 디자인 작업 진행하기
시안에 마크업 가이드 츠가하기

인터렉티브 프로토타입 사용하기
실제 동작하는 인터렉티브 프로토타입
재사용 가능한 코드 만들기
화면구조와 프로토타입을 잘 만드는 방법
WYSIWYG: 보는 것만큼 얻지 못할 수도 있다.

인터렉티브 프로토타입 실제 만들어 보기
개발환경(브라우저) 선택하기
브라우저 익스텐션 사용하기

엘리먼트를 최소로 사용하기
마크업 유효성 검사
플로트(float) 대신 포지션(position) 사용하기
CSS 정리하기

프로세스 실제 적용해 보기
컨텐츠 중심의 마크업 작성
CSS로 디자인 입혀가기
레이아웃 만들기
body부터 스타일 시작하기
기본 컬러 스타일
브랜드 영역
네비게이션과 푸터
타이포그래피 스타일 완성하기

사이트를 만들 기반의 완성

3장 디자인과 웹

그리드 기반 디자인
디자이너와 그리드
황금비율과 3분할 법칙
완벽하게 유동적인 레이아웃
균등 분할 그리드 디자인

실제 사이트에서 그리드가 적용된 모습
Subtraction
Airbag Industries
Jeff Croft
Veerle's Blog

웹이 아닌 곳에서 그리드 찾기
신문에서 배우기
8단과 6단 레이아웃
다른 신문 레이아웃

웹 디자인에 새로운 그리드 적용하기
그리드부터 접근하기
비법을 전수해 드립니다.
상세한 영역 조정
이미지 처리하기

디자인에 참고할 수 있는 예상치 못했던 곳들
홈페이지 다시 꾸미기
무드 보드에 대하여
디자인 스크랩 북 만들기
잡지에서 찾아볼 수 있는 인터페이스
타이포그래피 리소스
플래시 디자인에 대한 재검토
이미지나 사진을 활용한 작업

웹에서의 예술 활동
디자인은 단순히 매력적인 비쥬얼을 만드는 것이 아니다.
기술이 아닌 곳에 집중하기
무드 고조시키기
다른 면 살펴 보기
목적을 갖고 스크랩북 만들기

예술로 승화된 웹디자인

4장 Transcendent CSS

Transcendent CSS
절대 포지션
상대 포지션
플로트 응용하기
사이드 바 만들기
여러 기법 조합하기

CSS3
부분을 합쳐서 하나를 만들기
새로운 표준을 만드는 작업에 참여하기
미래로의 시간여행
CSS3의 선택자 모듈을 사용한 디자인
배경색을 사용해 가독성 높이기
배경과 보더 모듈을 사용한 디자인
복수 배경 이미지를 사용한 디자인
다단 구조 만들기
다단구조 레이아웃 모듈을 사용한 디자인

고급 레이아웃 모듈
다시 그리드에 대해서 생각해 보기
고급 레이아웃 모듈을 사용한 디자인
마무리

본문중에서

본론으로 들어가기에 앞서 책을 간단히 소개하는 이 글을 한번 읽어보시기 바랍니다.

책장을 한장 한장 넘기다보면 이 책의 디자인 스타일을 금방 파악할 수 있을 것입니다. 구성이 매우 아름답지 않습니까? 이 책에는 사진과 예시들이 가득합니다. 지루한 마크업과 CSS 코드를 반복하기보다 이미지를 사용해서 잘 설명하고 있습니다. 실제로 사용 가능할 정도의 예시들을 보여주면서 웹과 관련된 주제를 적절히 설명하고 있습니다. 코드와 관련된 책을 이렇게 잘 만들어도 되나 싶습니다.

저는 그런 부분을 여러분에게 강조하고 싶습니다. 제목을 통해서 나타나듯이 『웹디자인 2.0 고급 CSS』는 또 하나의 코드로 가득찬 책이 아닙니다. 이 책은 디자인과 코드가 잘 조화되고 어우러지도록 만들어졌습니다. 원하는 디자인을 만들기 위해서 어떤 코드를 적절히 사용해야 하는지에 대한 내용으로 되어 있습니다. 제약이 많은 실제 업무 보다는 그것을 벗어나서 새로운 시도를 하면서 작업할 수 있도록 합니다.

책에 들어 있는 내용이지만, 야후 같은 거대한 온라인 공간의 경우 구식 브라우저를 지원할 뿐만 아니라 새로운 브라우저를 사용하는 사람들에게는 최상의 경험을 제공하고 있습니다. 이러한 새로운 기술들은 머지 않아 곧 쓰이기 마련입니다. 여러분도 미리 배우고 준비 해서 앞으로 만들 사이트에 넣어야 할 내용입니다. 이 책에서는 여러분이 앞으로 사용할 기술에 대해 잘 보여주고 있습니다.

같은 관점에서 이 책은 2005년 초반에 나왔던 어떤 책과 비슷한 면이 있다고 할 수 있습니다. 이 책의 편집자인 몰리 홀즈쉬랙과 제가 같이 썼던 『The Zen of CSS Design』이라는 책을 읽어 보신 분도 있을 것입니다.

그 책에서 우리는 CSS를 코드라고 생각하기보다는 잘 만든 디자인 예시를 디자인 이론에 입각해서 설명하면서 보여주고 그것을 CSS로 표현하고자 애썼습니다. 만약 여러분이 그 책을 봤다면 이 책은 그 다음에 꼭 봐야 하는 책입니다. 『The Zen of CSS Design』을 통해 CSS 기반 디자인으로도 훌륭한 모양의 디자인을 만들 수 있다는 것을 알았고, 결국 비주얼 디자이너가 얼마나 잘하냐에 따라 다양한 가능성이 생길 수 있다는 것을 알았습니다. 이제 『웹디자인 2.0 고급 CSS』를 통해서 미래에 웹을 어떻게 만들 것인가에 대해 고민해 보시기 바랍니다.

그리고 또 중요한 것은 다른 기술서적과 달리 이 책은 순차적으로 과정을 따라가며 모든 것을 배우는 그런 책이 아니라는 점입니다. 이 책에서 여러분에게 개념을 알려주고 영감을 줄 수 있긴 하겠지만, 실제로 현재의 웹을 새로운 수준으로 끌어올리는 것은 모두 여러분의 몫입니다.

『웹디자인 2.0 고급 CSS』는 현재 웹에서 어떻게 해야 하는지를 설명하고 있지 않습니다. 현재의 웹을 어떻게 더 발전 시킬 것인가에 대해 이야기 합니다. 이제 과거에 연연하기보다는, 출발점에 섰다고 생각하고 앞으로 일어날 일을 생각해야 할 때입니다. 이 책은 여러분 앞에 펼쳐질 미래에 어떤 일이 일어날지를 시사해 줄 것입니다.

데이브 셰어
2006년 10월

저자소개

생년월일 -
출생지 -
출간도서 0종
판매수 0권

10년 남짓 동안 웹을 만들고 있는 비주얼 웹 디자이너인 저자는 영국에 살고 있으며 1998년부터 서프앤넌센스(http://www.stuffandnonsense.co.uk)라는 디자인 컨설팅 회사를 운영하고 있습니다.
디자인 책임자와 크리에이티브 디렉터를 역임하고 있으며 정부 기관, 자선단체, 국내외에 상주한 여러 고객사와 일하고 있습니다. 그가 관여한 기업으로는 영국 심장 협회, 영국 디즈니 스토어, Save the Children 협회, 영국 WWF 등이 있습니다.
웹표준 프로젝트(Web Standards Project) 멤버로서 2006년에는 해당 웹사이트를 직접 개편하기도 했습니다. 또 W3C의 CSS 워킹 그룹

펼쳐보기
생년월일 -
출생지 -
출간도서 0종
판매수 0권

서울대학교 컴퓨터공학과를 졸업하고 웹 에이전시에 입사해 여러 사이트에서 기획 및 PM을 담당했다. 컴퓨터공학을 전공한 웹 기획자로서 IA(Information Architecture), IxD(Interaction Design)을 전문으로 하고 있다. 정보 설계의 근간인 웹 표준 HTML과 CSS에 심취하고, 인터랙션 디자인을 위해 자바스크립트와 HTML5 등 여러 가지 신기술을 연구 중이다

이 상품의 시리즈

에이콘 웹 프로페셔널 시리즈(총 69권 / 현재구매 가능도서 54권)

펼쳐보기

리뷰

8.8 (총 0건)

등록된 리뷰중 당선작을 선정하여, 도서상품권을 드립니다.

리뷰쓰기

기대평

작성시 유의사항

평점
0/200자
등록하기

기대평

0.0

교환/환불

교환/환불 방법

‘마이페이지 > 취소/반품/교환/환불’ 에서 신청함, 1:1 문의 게시판 또는 고객센터(1577-2555) 이용 가능

교환/환불 가능 기간

고객변심은 출고완료 다음날부터 14일 까지만 교환/환불이 가능함

교환/환불 비용

고객변심 또는 구매착오의 경우에만 2,500원 택배비를 고객님이 부담함

교환/환불 불가사유

반품접수 없이 반송하거나, 우편으로 보낼 경우 상품 확인이 어려워 환불이 불가할 수 있음
배송된 상품의 분실, 상품포장이 훼손된 경우, 비닐랩핑된 상품의 비닐 개봉시 교환/반품이 불가능함

소비자 피해보상

소비자 피해보상의 분쟁처리 등에 관한 사항은 소비자분쟁해결기준(공정거래위원회 고시)에 따라 비해 보상 받을 수 있음
교환/반품/보증조건 및 품질보증 기준은 소비자기본법에 따른 소비자 분쟁 해결 기준에 따라 피해를 보상 받을 수 있음

기타

도매상 및 제작사 사정에 따라 품절/절판 등의 사유로 주문이 취소될 수 있음(이 경우 인터파크도서에서 고객님께 별도로 연락하여 고지함)

배송안내

  • 인터파크 도서 상품은 택배로 배송되며, 출고완료 1~2일내 상품을 받아 보실 수 있습니다

  • 출고가능 시간이 서로 다른 상품을 함께 주문할 경우 출고가능 시간이 가장 긴 상품을 기준으로 배송됩니다.

  • 군부대, 교도소 등 특정기관은 우체국 택배만 배송가능하여, 인터파크 외 타업체 배송상품인 경우 발송되지 않을 수 있습니다.

  • 배송비

도서(중고도서 포함) 구매

2,000원 (1만원이상 구매 시 무료배송)

음반/DVD/잡지/만화 구매

2,000원 (2만원이상 구매 시 무료배송)

도서와 음반/DVD/잡지/만화/
중고직배송상품을 함께 구매

2,000원 (1만원이상 구매 시 무료배송)

업체직접배송상품 구매

업체별 상이한 배송비 적용