7월 11일(목) 자정 전까지 결제하면 5%할인!

할인마감 D-

HTML/CSS
마스터

프로젝트를 통해 HTML/CSS
문제 해결 능력을 기르고,
빠르게 변하는
웹 환경에 대응하는
스킬을 익혀가세요!

#웹 접근성
#시맨틱 마크업 
#반응형 웹디자인

기간 & 일정

2019.07.13-08.31
매주 토요일 14:00 – 18:00
주 1회, 총 32시간

장소 & 준비물

패스트캠퍼스 강남강의장
강남역 4번 출구, 미왕빌딩
개인 노트북

담당자 & 문의

이유리 매니저
02-501-9695
help.camp.dev@fastcampus.co.kr

감에 의존하는 HTML/CSS는 그만!
논리적인 구조설계부터 코딩까지 이어가는 HTML/CSS
파일럿 프로젝트로 빠르게 변하는 웹 환경에 대응하세요!

html

아직도 당신의 감만 믿고 HTML/CSS를 주먹구구식으로 다루시나요?
원인을 모르는 오류가 생겨도 구글링으로 쉽게 해결할 수 있다구요?

천만에 말씀! 다루면 다룰수록 디바이스와 브라우저 등
고려해야할 요소들이 너무나 많은 HTML/CSS!

웹 표준과 접근성을 지키며 내가 의도한대로 효율적인 작업을 하기 위해서는
기본기를 탄탄히 하고 원리를 정확하게 이해하고 있어야 합니다!

코스특징.

01

先 구조설계, 後 코딩
파일럿 프로젝트 진행

코드부터 치고 보는 학습이 아닌, 구조를 미리 잡아갈 수 있는 생각 방법을 먼저 가르쳐드립니다. 실습형 프로젝트를 통해 HTML/CSS의 원리와 활용 방법을 확실하게 익혀가세요!

02

다양한 해결방법 제시로
문제 해결 능력 향상

정답지만 제시하는 문제 해결 방식은 또 다른 오류를 마주했을 때 아무런 도움이 되지 않습니다. 어떠한 문제를 직면해도 스스로 해결할 수 있도록 다양한 해결 방법을 가르쳐드립니다.

03

웹 표준에 기반한 효율적인
HTML/CSS 활용법

수박 겉핥기 식으로 배운 HTML/CSS는 실무에서의 한계를 만들어냅니다. 웹 표준과 접근성에 기반한 마크업 방법을 익혀, 백지상태에서도 HTML/CSS를 시작할 수 있는 역량을 키워가세요!

공부도 하고!
학습지원금도 받고!

결제액의 10%를 학습지원금으로 드립니다.

패스트캠퍼스의 수강의지를 강화하기 위한 지원금 제도를 운영합니다
패캠이 제안하는 학습 목표를 달성하고 커리어 이상의 성취감을 얻어가길 바랍니다.

*학습지원금은 제세공과금(22%)을 제하고 드립니다.

과제/학습노트

100% 제출

커리큘럼.

책 8권 이상을 읽어야 알 수 있는 내용? 본 코스와 함께라면 8주만에 마스터!
실무자들도 잘 모르고 지나치는 HTML/CSS 활용법, 지금 바로 만나보세요.

Part 1. 프론트엔드 개발을 위한 개발환경 및 웹표준과 웹접근성

프로젝트 실습에 도움이 되는 개발환경을 구축하고 버전관리를 위해 Git을 사용할 수 있도록 학습합니다.
웹표준 기술을 이해하고 장애 환경에 대한 관점에서 웹 접근성을 바라볼 수 있는 시간을 가져봅니다.
또한 웹접근성 관련 기술 가이드라인을 살펴보고 WAI-ARIA 기술이 웹접근성 관점에서 어떤 역할인지 알아봅니다.

자세히보기

– Visual Studio Code
– Firefox, Chrome 등 최신 웹 브라우저 및 확장프로그램
– Git과 Github
– CLI 명령어
– 웹표준과 웹접근성
– 장애 환경의 이해
– 웹접근성 준수를 위한 가이드라인 (WCAG)
– WAI-ARIA

Part 2. 논리적인 구조설계를 위한 HTML 마크업

HTML5의 특성을 이해하고 콘텐츠 배치를 목적으로 하는 마크업이 아닌 구조적인 마크업에 대해 학습합니다.

또한 장애인과 비장애인 모두를 생각한 웹 서비스의 가치에 대해 살펴보고 웹접근성 가이드라인을 준수하여 모두를 위한 웹 콘텐츠를 제공할 수 있도록 각각의 콘텐츠를 분석하고 논리적인 순서와 의미에 맞는 요소를 고민하면서 HTML을 구성해 봅니다.

자세히보기

– HTML5의 탄생 배경
– 콘텐츠 모델(Content Model)
– 아웃라인 알고리즘(Outline Algorithm)
– 시맨틱 마크업
– 구조 설계를 위한 섹셔닝 요소
– 콘텐츠 제목 및 텍스트 레벨 요소
– 임베디드 요소
– 사용자의 입력을 검증하고 도와주는 폼 관련 서식 요소
– 2차원 데이터 표현을 위한 테이블 관련 요소
– 메타데이터 및 인터랙티브 요소
– HTML 유효성 검사

Part 3. 레이아웃 및 UI 디자인을 위한 CSS

CSS는 콘텐츠를 돋보일 수 있도록 HTML에 스타일을 적용하는 역할임을 이해하고 CSS의 상속 및 겹침, 우선순위 등 중요한 개념에 대해 살펴봅니다.
UI 디자인을 위해 다양한 속성 및 박스모델, float, position 등의 레이아웃 알고리즘을 살펴보고 이를 활용 할 수 있도록 학습합니다.

자세히보기

– CSS의 역할
– 기본 문법(Rule set) 익히기
– CSS를 적용하기 위한 3가지 방법
– 상속, 겹칩, 개별성 규칙
– 선택자(Selector)
– 박스 모델(Box Model)
– Float과 Position
– 그 외 다양한 CSS 속성

Part 4. 미디어쿼리를 활용한 반응형 웹디자인

모바일 등장 이후 다양한 크기의 디바이스가 시장에 출시되고 있으며 이렇게 다양한 크기의 디바이스에 대응할 수 있는 유연한 레이아웃을 제공하는 것은 float, position 등의 기존 방식으로는 많은 한계를 노출하게 됩니다.

이러한 환경을 대응하기 위해 미디어 쿼리 및 모던 레이아웃, 유연한 이미지 등의 기술을 활용하는 방법을 학습합니다.

자세히보기

– 반응형 웹디자인(RWD) 이란?
– 미디어쿼리(Media Query)
– 모던 레이아웃 (Flex Box & CSS Grid)
– CSS 애니메이 관련 속성
– 반응형 콘텐츠 이미지와 배경이미지
– 고해상도 대응을 위한 picture요소와 srcset 속성

수강대상.

웹 퍼블리셔, 프론트엔드 개발자, 백엔드 개발자 모두 모이세요!
당신의 직군에만 국한된 학습이 아닌, HTML/CSS를 전격 마스터 할 수 있는 강의니까요.

icon_man3_3_oh

HTML/CSS 사용 경험이
있지만 오직 감으로만
프로젝트를 진행해왔던 분

icon_woman1_2_happy-150x150

원하는 CSS 기능을 정확하게
구현하고 싶지만 원인을 모르는
에러에 당황스러운 분

icon_man4_3_oh

짧은 시간 안에 프론트엔드로
영역을 확장하여 풀스택
개발자로 일하고 싶은 분

수강 신청 전, 수강생 선수 지식을 확인하세요!

본 강의는 HTML/CSS의 기본적인 문법을 알고 계시는 분들이 수강하실 수 있는 강의입니다.
아래 링크의 내용을 이해하고 계신 분들이라면, 주저말고 수강신청하세요!

① 생활코딩 > WEBn > HTML&internet, CSS
https://opentutorials.org/course/3083
https://opentutorials.org/course/3086
br
② 생활코딩 > 클라이언트 > HTML수업, CSS 수업
https://opentutorials.org/course/2039
https://opentutorials.org/course/2418

br
코스와 관련한 문의는 담당매니저(02-501-9695)에게 언제든 연락해주세요🙂

8주 후, 당신은.

그동안 주먹구구식으로
다뤄왔던 HTML/CSS를
프로젝트로 완벽하게
이해할 수 있습니다.

구조 설계, 시맨틱
마크업
을 정확히
이해하고 웹 제작에
활용할 수 있습니다.

반응형 웹디자인으로
다양한 크기의 디바이스
유연한 웹 제작을
할 수 있습니다.

효율적인 방법으로
웹 표준을 지키고
웹 접근성이 높은 사이트를
제작할 수 있습니다

강사소개.

김데레사 강사님

이번에 진행할 HTML/CSS 마스터캠프 3기에서는 HTML과 CSS에 대해 여러분들이 그동안 생각해 보지 못했거나 놓쳤던 혹은 몰랐던 부분을 다양한 관점으로 보여드릴 예정입니다.
특히 특정 직군만을 위한 과정이 아니라 웹을 다루는 모든 분들에게 도움이 될 수 있는 내용으로 구성했습니다.
본 강의의 수강을 고민하시는 분들께 한가지 말씀을 드리자면 해당 과정은 입문 과정이 아닙니다. 그렇기 때문에 수업이 빠른 속도로 진행될 예정이며, 실무 중심의 프로젝트가 동반될 예정입니다. 8주간 열심히 수업에 참여하겠다는 각오를 가지신 분들을 손꼽아 기다리겠습니다.

[약력]
현) 한국생산성본부 전임 교수로 재직
전) 삼성 물산 전임 강사로 재직
전) 삼성 SDS 멀티캠퍼스 전임 교수로 재직

br
[기타경력]
-도서 웹표준 핵심 가이드 북 XHTML+CSS 집필
-도서 웹표준 핵심 가이드 북 Ⅱ HTML5+CSS3 집필
-미래부 주관 웹접근성 지킴이 사업의 멘토로 참여
-WAI-ARIA 사례집의 집필진으로 참여


잠깐! 자기계발지원금 받아가세요!
7월 한달간, 출석을 인증하고 후기를 작성하신 분 200분께, 50만원~100만원 상당의 수강쿠폰을 드립니다.

· 쿠폰은 10/1에 지급되며, 10월 한달 간 사용 가능합니다.
· 출석인증: 매주 수업 시 출석여부를 확인할 수 있는 강의장 문앞 강의명 안내표 인증사진을 #패스트캠퍼스 #공부하고100만원받고 #자기계발 태그를 붙여 인스타그램 개인 계정에 게시해야합니다.
· 후기작성: 종강 후 수강한 강의의 상세 후기를 네이버 블로그에 작성하고 공개해주셔야 합니다.

수강료안내.

강의 정보, 한 번 더 확인!

기 간 : 2019.7. 13. ~ 2019. 8. 31. (총 8주)
일 정 : 토요일 14:00 – 18:00 (주 1회 4시간)
준비물 : 개인 노트북 권장
장 소 : 패스트캠퍼스 강의장


수강료 : 100만원

개강임박!

✓ 개강이 얼마 남지 않았습니다. 수강신청을 서두르세요!
✓ 조기마감시 결제 순으로 수강하실 수 있습니다.

다음 모집은 언제죠?

출시알림을 신청해주세요

최저가로 강의를 수강할 수 있게, 강의 홍보 시작 시 가장 먼저 메일을 보내드립니다.

강의장안내.

학습 지원 프로젝트

공부도 하고! 학습지원금도 받고!

*학습지원금(제세공과금 22% 차감 후 지급)은 강의마다 개인마다 상이할 수 있습니다.

학습 목표. 학습노트 제출

-학습노트/과제 제출 일정: 매주 목요일 자정 24:00까지 폼스텍으로 제출합니다.
-제출 시간을 엄수하지 못한 노트는 추후 환급에 불이익이 있습니다.
-과제 제공 방식 : 강사님께서 수업시간에 hand-out(또는 이메일)으로 배포합니다.
-수강중 학습 콘텐츠 일정 : 1-6 주차 학습노트 제출

학습지원금을 받으려면?

미션을 모두 완료하면 신청페이지를 통해 신청 가능합니다.
다만, 강의 종료 후 30일 이내에 신청페이지를 통해서 신청해주셔야 합니다.
아래의 환급신청 링크로 신분증 사본 / 환급받을 통장사본을 제출 (반드시 본인 명의로만 가능)해 주세요.
결제한 수강료의 10% (환급 금액의 22% 제세공과금으로 차감) 를 드리며, 학습지원금은 개인마다 상이할 수 있습니다.

환불규정

* 학습지원금은 기수강생 및 얼리버드 할인과 중복 적용이 가능합니다. (기타 다른 이벤트와 중복 적용이 불가합니다.)
* 과제물이 허위로 작성되거나 표절일 경우 환급이 거절될 수 있습니다.
* 환불은 환불규정(https://www.fastcampus.co.kr/refund/)에 따라 진행됩니다. 규정에 의거하여 환불금액이 없을 수 있습니다.

{ FASTCAMPUS COMMUNITY MEMBERSHIP }

패스트캠퍼스 오프라인 강의를 수강하셨다면!
별도의 가입절차없이 패스트캠퍼스 커뮤니티 멤버쉽 회원이 됩니다.
커뮤니티 멤버쉽은 수강 후 1년 동안 유지되며,
오직 멤버들만을 위한 비공개 스터디클럽, 네트워킹행사, 세미나 등 비정기적 행사에 모실 예정입니다.