강의 특징

line 이미지
웹표준에 대한 개념이해가 되었다면 이제는 실전입니다!

기초편에서 다루지 못한 속성들을 포함하고 있는
실제 웹사이트의 부분들을 엄선하여 실습합니다.

단순하고 큼직한 부분부터 시작하여 복잡한 디자인까지
실습을 통해 소화해 내면서 자세한 설명을 더하는 방식으로 진행됩니다.

수강생들이 가장 어렵고 시간이 걸린다고 여겨지는 부분들을
다양한 예제를 통해 숙달하고 쉽게 접근할 수 있도록 진행됩니다.

- 본 강의는 드림위버가 아닌, BRACKETS를 이용한 하드코딩 트레이닝 과정입니다.

css 이미지

 강의 목표

line 이미지
  • - 실제 디자인을 통해 스스로 응용해서 만들 수 있는 능력을 키우기
  • - 그림이 아닌 코드를 이용해 모양을 만들 수 있는 데 필요한 사고 방법 숙달시키기.

* CSS3를 활용한 애니메이션 효과

 강의 방식

line 이미지

이론과 실습을 분리하지 않고 준비된 학습 시나리오를 가지고 다양한 예제와 실습 설명을 통해 진행합니다.
기초편의 탄탄하고 깊은 이해에 응용편의 실제적이고 자세한 기법을 훈련함으로써
그림이 아닌 코드를 이용해 모양을 만들 수 있는데 필요한 사고 방법에 숙달과 응용을 만드는 수업이라고 할 수 있습니다.

또한 실제 사이트를 캡쳐하여 실습과 설명을 반복하면서
특정 상황에서의 의미 있는 태그 사용, 접근성 그리고 좋은 디자인과 크로스브라우징을 동시에 생각하여
그 중 가장 많은 것을 얻을 수 있는 방법을 해당 상황에서 선택하는 훈련을 하게 됩니다.

* CSS3 예시들

수강대상

line 이미지
  • 시각 디자인의 공부를 처음 시작하려는 분 이미지 ‘디자이너를 위한 HTML/CSS_실무 웹표준’ 워크샵을 수강하신 분들
    웹 디자인을 희망하는 예비 웹 디자이너
    웹 퍼블리싱 제작에 익숙하지 않은 웹 디자이너
  • 안경 아이콘 디자인된 작업물을 선명한 이해를 가지고 원하는 데로 응용 가능하게 만들고 싶은 분들
    HTML과 CSS로 웹 표준 사이트
    제작에 관심 있는 분
  • 안경 아이콘 기본기를 탄탄히 다지면서 웹 디자인 실력을 높이시고 싶으신 분
    float과 position을 다루어 보신
    분들, 코드가 낯설지 않으신 분들

커리큘럼

line 이미지
  • HTML5
  • HTML5 : HTML과의 차이점
    HTML5 태그 및 속성
    HTML5 작성 실습
line 이미지 2
  • CSS3
  • CSS3 소개
    CSS3 프로퍼티 소개 및 실습
    : border, background, transition, transform
    크로스브라우징 문제 해결 기법
line 이미지 2
  • HTML5를 활용한 웹사이트 제작
  • 메인화면
    - 공통영역 : 헤더, GNB, 푸터
    - 비주얼 및 메인 콘텐츠 영역
line 이미지 2
  • HTML5를 활용한 웹사이트 제작
  • 서브화면 : 비주얼 및 LNB
    - 콘텐츠 화면
line 이미지 2
  • 관리자 화면 제작 실습
  • 관리자 화면 레이아웃
    - Form 디자인
    - 주요 라이브러리 소개 : Chart, 주소, Editor 등
line 이미지 2
  • 반응형/모바일웹 제작 실습
  • 웹사이트
    - 메인화면 : 헤더, 비주얼 영역, 콘텐츠
line 이미지 2
  • 반응형/모바일웹 제작 실습
  • 모바일 사이트 메인화면 : 헤더, 비주얼 영역, 콘텐츠
    반응형 웹 만들기
line 이미지 2
  • 웹접근성 및 SEO 소개
  • 한국형 웹 콘텐츠 접근성 지침(KWCAG) 2.1 소개
       : 인식의 용이성, 운용의 용이성, 이해의 용이성, 견고성
    SEO 소개
line 이미지 2

 강사소개

line 이미지
이시영 선생님 이미지

강사
이시영


현) 디노웍스㈜ 대표
방위사업청 사업관리본부 운영 아키텍트
웹표준솔루션 포럼 회원사
KAIST 산업공학과 (석사)


주요프로젝트


주요 금융사 및 대기업 웹 접근성 개선 컨설팅 및 구축 사업
현대건설, CJ 그룹, 기아자동차, IBK 기업은행, 국민카드 등