|
그누위즈는 현재까지 수백여 개의 홈페이지를 제작하고 웹 프로그래밍 관련 강의와 실무에서 다양한 활동들을 하고 있다. 그런 그누위즈에서 지금까지의 노하우를 한 권의 책으로 담았다.
내가 html을 본 것이 20년도 더 되었는데 아직도 html에 대해서 아는 게 별로 없다. 이쪽에 관심이 부족했던 것도 있고 웹 디자인의 영역은 나의 것이 아니라고 생각하고 있어서인 듯하다. 사실 디자인 이런 것과는 거리가 너무 멀어서 쳐다볼 생각을 못 했다. 그런데 이런 영역이 이제는 알고 있으면 너무나 유용하게 쓰일 시대인 것 같다. 이제부터라도 조금씩 관심을 가져보고 나만의 웹을 만들어 보아야겠다.
이 책은 웹 에이전시 그누위즈 대표 윤성훈님외 공저 2명으로 만들어졌다. 공저자 정지영님, 정동진은 강사로 왕성한 활동을 하고 계시는 분들이시다. 이 책은 4챕터로 나누어져 있다. 부록으로 별책부록 PDF 파일을 제공한다. 부록은 앤써북 공식 카페에서 다운로드할 수 있다. Part1. HTML 시작하기 1part에서는 웹 사이트의 가본 적인 개념과 HTML 기본 문법, 웹 문서의 다양한 내용 입력, HTML 입력양식 작성하기 그리고 HTML의 다양한 요소에 대한 설명을 상세하게 적어놓았다. 코딩 프로그램으로는 비주얼 스튜디오 코드(VS Code)를 설치한다.
마크업 언어? 처음 들어보는 용어라 검색을 해보았다. 마크업 언어는 문서에 포함된 문장이나 그림표, 소리 등과 같은 문서 내용에 대한 정보가 아니라 그 문장과 그림표는 어떻게 배치되고 글자는 어떤 크기와 모양을 가지며, 들여 쓰기와 줄 간격, 여백 등에 대한 정보를 의미한다. 한 장이 끝나고 나면 핵심정리로 정리할 수 있게 한 장으로 꼭 알아야 할 부분을 정리해 놓았다. 실습 예제로 한 번 더 중요한 것을 정리한다.
PART2 CSS 다루기 2part에서는 ccs의 기본 개념과 css 선택자, 텍스트 꾸미기, 색과 배경 넣어서 꾸미기, 레이아웃 박스 만들기 및 배치하기, 내 스타일 적용하기를 설명한다.
CSS를 사용하는 이유 Html은 뼈대를 만드는 역할, Css는 꾸며주는 역할을 담당 Css를 사용하면 Html 문서의 콘텐츠와 스타일을 분리할 수 있습니다. Css는 웹 페이지의 스타일을 별도의 파일로 저장할 수 있게 해주므로 웹 사이트의 전체 스타일을 손쉽게 제어할 수 있게 되었다. 웹 사이트의 유지 보수가 쉬워졌다. PART 3 HTML&CSS 한 걸음 나아가기 3part에서는 Html과 Css를 함께 적용하여 Html 시맨틱 태그, Css 상속, Css 고급 선택자, 반응형 웹과 미디어 쿼리를 설명한다.
시맨틱 태그를 사용하는 이유 시맨틱 태그를 사용하거나 사용하지 않거나 웹 브라우저에 나타나는 모습은 똑같다. 하지만 ＜div＞태크가 많아지다 보면 ＜div＞태그가 무슨 역할을 하는지 알아보기 힘들어 문서 구조를 한눈에 보기 어렵다. 이때 시맨틱 태그를 사용했을 경우 어느 부분이 제목인지 메뉴인지 쉽게 알 수 있다.
반응형 웹의 장점 1. 간편한 유지 보수 2. 유리한 마케팅 3. 최적화된 검색엔진 4. 미래지향적 기술
PART 4실전 웹 디자인 앞 장에서 배웠던 html&Css를 사용하여 실전에 사용 가능한 예제 세로 스크롤 형 사이트 풀 페이지형 사이트 가로 스크롤 형 사이트 반응형 사이트 를 만들어본다.
머지않아 우리나라에서도 웹 디자이너, 웹 개발자를 외국에서 들어와야 할 정도로 인력 부족 현상이 생길 거라고 한다. 이 책으로 틈틈이 실력을 쌓아서 기업들의 콜을 받는 그날을 기다려보자.
|
|
제가 주로 웹으로 프로그램을 만들고 있는 것은 알고 계시죠? 하지만, 웹을 기초부터 하나 하나 공부한 것이 아니라서 부분적으로는 부족한 부분이 있었습니다. 이번에 출간한 이 책을 통해서 기초부터 하나 하나 점검하고 부분적으로 몰랐던 내용을 알 수 있어서 무척 좋았습니다.
앞 부분에서는 태그를 하나 하나 설명해주고 있습니다. 어느 정도 알고 있는 상태라면 복습 차원에서 확인하고 넘어가면 될 것 같습니다. 속성에는 제가 모르는 것들도 많이 있더라구요.
챕터가 끝날 때마다 핵심정리를 통해서 배운 내용을 정리할 수 있습니다. 나중에 핵심정리를 잘 활용하면 복습 시간을 많이 줄일 수 있을 것 같습니다.
뒷 부분으로 가면 웹 디자인과 관련한 내용이 있습니다. 꼭 필요한 내용을 다루고 있어서 도움이 많이 되었습니다.
레이아웃 배치와 관련한 내용의 화면인데요. 예제를 통해서 생각할 수 있는 힘을 길러줍니다.
실습 예제를 통해서 학습한 내용을 코딩하면서 복습할 수 있습니다. 코딩은 눈으로 하는 것이 아니라 손으로 하는 것입니다.
여러가지 내용을 포함하고 있는 이 책을 통해서, 웹 디자인 기초를 잘 배울 수 있을 것 같습니다. 프런트엔드 개발자라면 잘 알고 있어야 하는 내용입니다. 입문, 기초 단계에 있다고 생각하는 프런트엔드 개발자 분들에게 추천드립니다. |
|
앤써북 | 윤성훈, 정지영, 정동진 공저 HTML5 & CSS3를 오래 전부터 해왔는데 다시 시작하는 마음으로 기초부터 살펴보려고 책을 보기 시작했습니다. HTML과 CSS의 기본부터 상세하게 설명되어 있고 잘 정리되어 쓰여진 책이라서 웹디자인 코딩을 처음 접하는 사람도 쉽게 배워나갈 수 있게 쓰여진 책인 것 같습니다. 코딩을 할 때 모든 태그가 영어로 쓰여져 있어서 사용하면서도 뜻을 잘 모르거나 이해가 안되는 채로 사용했던 경우가 종종 있었는데 이 책에서는 그 부분까지 친절하게 설명해주고 있습니다. 여백이나 배율, 플로트, 레이아웃 등 헷갈릴 수 있는 부분은 그림과 함께 이해가 쉽게 쓰여져 있고 실제 웹사이트를 제작할 때 실수하거나 놓치기 쉬운 부분까지 깔끔하게 잘 설명되어 있습니다. 앞부분에서 웹디자인 코딩을 기초부터 실전에서 활용할 수 있게 꼼꼼하게 배울 수 있고 뒷 부분에서는 실전에서 자주 사용하는 여러 유형의 웹사이트를 만들어 볼 수 있게 구성되어 있습니다. 책과 함께 제공되는 책 속의 주요내용이 요약되어진 PDF파일도 함께 사용할 수 있어서 편하게 책 속의 내용을 찾아볼 수 있어서 좋습니다. 웹디자인 코딩을 기초부터 실전까지 꼼꼼하게 잘 배울 수 있게 쓰여진 책인 것 같습니다. 출판사로부터 도서를 제공받아 작성한 서평입니다.
|
|
HTML&CSS를 공부하다 보면 항상 앞부분을 열심히 하다가 정작 중요한 웹 구성설계에서 약간 부실한 경우가 좀 많았다. 공부하면서 느낀 거지만 가장 중요한 부분이 레이아웃을 어떻게 설계하느냐이다. 이책은 그부분에 대한 내용을 PART04 부분에 실접 웹 디자인으로 친절하게 실질적인 설명과 연습을 할수 있도록 상세하게 잘 구성 되어 있다. 처음 시작하는 사람이라도 아예 PART04부분부터 시작해서 거꾸로 공부해 보는 게 더 나을지도 모르겠다. PART01~03부분에는 친절하게 기본 설명이 잘 되어 있다. 책 표지부터 이미 레이아웃에 대해 중요하게 기술했음을 알수있다. 빨간색으로 세로,가로 풀페이지등 중요한 부분을 표지에 실어 놓았다. 그리고 PDF로 예제10개를 같이 해볼수 있어서 확실히 개념을 잡기에 좋다. PART04를 하면서 거꾸로 기본개념을 찾아보고 . 예제10개를 하면서 거꾸로 기본개념을 찾아보고 하면 멋진 웹퍼블리셔가 되어 있을것 같습니다.
|
|
앤써북 출판사에서 웹디자인 입문+활용서가 출간되었습니다^^ 저번에는 1일만에 끝내는 스마트폰 영상촬영과 편집으로 참 많은 도움을 받아서 참 유용했습니다.^^
이번에는 한권으로 끝내는 그누위즈의 ＜HTML5&CSS3 웹디자인 입문+활용＞을 서평하게 되었습니다.
초장기 컴퓨터가 보급되고 나모웹에디터 시절에 하나하나 HTML을 배워가며 어렵게 어렵게 홈페이지를 만들어봤던.....언제적 나모이야기인지 나이가 나오네요 ㅋㅋ
항상 웹디자인 공부에 대한 열망을 가지고 있었는데 요즘은 반응형사이트 등등 너무 어렵게 느껴져서 배울 엄두조차 안났는데 앤써북의 ＜HTML5&CSS3 웹디자인 입문+활용＞은 한권으로~라는 타이틀에 맞게 220여개의 예제를 통해 하나하나 천천히 익힐 수 있도록 구성되어 있어서 좋았습니다^^
＜HTML5&CSS3 웹디자인 입문+활용＞은 홈페이지 제작의 달인이신 그누위즈에 대표분들께서 웹디자인 신입과 입문자들에게 확실한 기초를 쌓을 수 있는 전문 책을 제공해주시기 위해 각고의 노력끝에 나온 책이예요. 바로 전문 웹디자이너가 되기 위한 필수 도서!! 소장각!!
웹디자인에 대해 진짜 초보적인 HTML만을 아는 일반인에 대해서도 웹디자인에 대해서 한번 더 가까이 알 수 있어서 좋았습니다^^
세로스크롤형/풀페이지형/가로스크롤형/반응형 이 4가지 유형의 웹사이트 제작 예제로 이루어져 있어요. 또한 단원별 실습 예제도 할 수 있어서 연습하기에도 좋아요!
＜HTML5&CSS3 웹디자인 입문+활용＞의 그누위즈 저자분들의 웹디자인 후배들을 위한 진심이 느껴지는데요. 그 중에서 바로바로 종이책에 담지 못한 70페이지 분량의 금쪽같은 내용들이 담긴 PDF전자책도 무료로 제공해주며, 별도의 사이트를 통해 책 실습 중 막히는 부분도 직접 문의해 볼 수 도 있어요^^
육아와 병행하느라 아직 다는 읽어보지는 못했지만 처음부터 하나하나 차근차근 실습예제를 따라하다보면 저도 홈페이지 하나 뚝딱 완성하는 날이 오겠죠?^^ |
|
웹디자인 작업에서 HTML 구조화는 더이상 웹퍼블리싱만의 영역은 아니게 됐습니다. 분업화된 것도 사실이지만 현업에선 웹디자이너가 코딩까지 완성해주기를 요구합니다. 개발이야 따로 진행한다쳐도 중대형 규모의 프로젝트가 아니면 일당백은 여전하네요.
한 권으로 끝내는 그누위즈의 HTML5 CSS3 웹 디자인 입문 활용은 책에 담긴 많은 예제가 앤써북 카페를 통해 제공됩니다. 특이한건 책의 별책부록은 PDF파일로 제공되므로 위 사진처럼 책의 안내에 따라 다운로드 받아서 사용하세요. 예전에는 HTML 편집프로그램으로 브라켓(Brackets)를 많이 사용했지만 지원중단된 이후로는 비쥬얼 스튜디오 코드가 가장 많이 사용됩니다. 웹 디자인 기능사 시험에서도 비쥬얼 스튜디오 코드 가 설치되어 있고 이 프로그램 중심으로 교육이 진행된다고 하네요.
각 단원의 마지막 장에서는 핵심 정리와 실습예제를 통해 정리하는 페이지가 마련되어 있습니다. 이미 웹 디자인과 웹 퍼블리싱, 프론트엔드 작업자라면 익히 알고 있기때문에 이 책이 필요없겠지만 초보자는 분명히 HTML 구조에서 이미 멘붕이 올것입니다. 많은 태그 요소를 다 외우려고 하지말고 전체 프레임을 잡는 연습부터 하세요.
이제는 스마트폰도 고해상도 스펙을 가지고 있어서 사실상, 이전에 타블렛 해상도와 무슨 차이가 있겠냐만은 PC를 통해 웹 사이트 레이아웃과 모바일 환경에서 브라우저에서 가변적으로 재정렬되는 웹 페이지에 대한 공부는 미디어 쿼리로 코딩해보시기를 권장합니다.
마지막으로 파트4에서는 실전 웹 디자인을 할때 유형별 예제로 연습합니다. 가장 일반적인 세로 스크롤형 사이트, 랜딩페이지로 많이 활용되는 풀페이지형 사이트, 갤러리 형태나 프모모션에 사용되곤 하는 가로 스크롤형 사이트, 앞장에서는 배운 반응형 사이트까지 왠만한 형태의 웹 페이지는 구조잡고 HTML5, CSS 로 코딩하는데 도움이 됩니다. 살짝 아쉬운 부분이 두가지 있더군요. 편집적인 부분에서 HTML 문서구조안에 박스 형태에 있는 타이틀이 뚱딴지맞게 필기체로 되서 가독성이 상당히 떨어집니다. 그리고 간단한 HTML 태그 예제를 해당 단락의 우측에 얹혀서 편집한게 은근히 산만해 보이네요. 크면 바로 아래로 놓더던가, 작으면 우측 영역에 할당을 하던가 해야 하는데 말이죠. 전체적으로 한 권으로 끝내는 그누위즈의 HTML5 CSS3 웹 디자인 입문 활용 책은 이미 웹 디자인을 하고 있더라도 작업하다가 들쳐볼 수 있고 입문자에게는 찬찬하 기초부터 익힐 수 있는 수준으로 보입니다.
|
