캠퍼스선택바로가기 주메뉴바로가기 본문바로가기

HTML5&CSS3

  • 일반
  • 재직자
닫기

국가직무능력표준(NCS)은 무엇인가요?

국가직무능력표준(NCS, National Competency Standards)은 산업현장에서 직무를 수행하기 위해 요구되는 지식·기술·태도 등의 내용을 국가가 체계화한 것입니다.

닫기

다른 분야 · 훈련과정을 한 눈에 볼 수 있습니다.

HTML5%26CSS3

HTML5 & CSS3



HTML5는 HTML의 차기 주요 제안 버전으로 월드 와이드 웹의 핵심 마크업 언어입니다.

HTML5의 목적은 최신 멀티미디어 콘텐츠를 브라우저에서 쉽고 용이하게 볼 수 있게 하는 것입니다.
Active X의 설치 없이도 인터넷 익스플로러에서 멀티미디어 콘텐츠 사용이 가능하게 됩니다.
또한 다양한 웹 브라우저에서도 동일하게 기능이 구현이 되기 때문에 서로간의 호환성이 높아집니다.

HTML5 이전에는 임베디드 오디오/비디오 콘텐츠를 지원하기 위해서는 Flash를 사용하였습니다.
시대가 변하면서 Flash를 지원하지 않는 모바일 디바이스의 시장 확대로 인하여 HTML5가 이를 대체하는 cross-platform을 지원하는 시장의 표준으로 성장하고 있습니다.

HTML5에서는 Canvas 기능을 통해서 다양한 형태의 이미지를 만들어 낼 수 있고,
실시간으로 이미지 프로세싱이 가능한 기능을 가지고 있습니다.
차세대 웹 표준으로 향후 모바일 웹의 핵심 기술로 주목받고 있는 HTML5의 탄생 과정과 설계 원칙(호환성, 실용성, 상호운용성, 보편적 접근성) 등과 HTML5와 관련된 사양 전체를 개략적으로 학습합니다.
다양한 브라우져에서 최적의 웹 페이지를 구현합니다.

HTML5를 지원하는 브라우저는 또한 CSS3(Cascading Style Sheets) 표준을 준수하고 있습니다.

CSS3을 사용함으로써 오는 큰 이득이 있습니다. 이미지가 없어도 간단한 버튼을 만들 수 있으며,
파일크기를 작게 할 수 있거나 복잡한 스크립트, 라이브러리, 플래시를 사용하지 않아도 움직임이 있는
표현을 가능하게 해준다는 것입니다.

HTML5와 CSS3을 사용함으로써 더 나은 인터페이스 컨트롤을 사용자에게 제공을 합니다.
또한 스크린리더 같은 프로그램을 사용하여 보조 기술에 의존하는 사람들에게 더 좋은 웹 페이지 접근성을 제공할 수 있게 도와줍니다.

본 과정은 디자이너 및 웹퍼블리셔가 되기 원하는 이들에게 조금 더 수월하게 익힐 수 있도록 가장 기초적인 예제부터 실무적인 예제까지 다양하게 학습을 하여 전문성을 지닌 자신을 만날 수 있도록 도와줍니다.
강의대상
  • 웹 사이트를 제작에 필요한 다양한 툴을 익히고자 하는 분
  • 전문 디자인 작업을 배우고자 하는 예비 디자이너
  • 타 디자인분야에서 웹디자이너로서 모색 중인 디자이너
  • 웹 사이트 제작 노하우를 숙지하고자 하는 일반인
취업분야
  • 웹디자이너, 웹 퍼블리셔, 웹 기획자, 디지털컨텐츠 개발 및 기획자, 모바일 인터페이스 디자이너, 웹 에이전시, 쇼핑몰 디자이너 등
취득가능 자격증
  • 웹디자인 기능사, 멀티미디어 콘텐츠제작 전문가, 컴퓨터그래픽스운용기능사, GTQ 등
교육과목 교육내용
html5 개요 및
디지털 콘텐츠
제작 기술
  • - html4와 xhtml, html5의 버전 별 차이 및 dtd 이해
  • - 의미적 마크업(semantic markup)
  • - 문서 구조(document structure)
  • - 구조를 나타내는 요소, 콘텐츠 모델(content models)
  • - 아웃라인 알고리즘(outline algorithm)
  • - 박스 모델(box model) 및 콘텐츠 모델 (content model)
  • - 인터렉션 요소
폼요소 활용
  • - html5 새로운 웹폼 관련 요소
  • - 동영상 및 오디오
  • - vendor-prefix 이해 및 css3 활용
css3 활용
  • - css3 transition 을 이용한 앱과 같은 화면 전환 효과
  • - 변형(transform), perspective를 이용한 3d 큐브 제작
  • - 비트맵이미지(canvas) 및 api, 벡터이미지(svg) 및 api
  • - 지오로케이션 및 map api (google map api, naver map api)
반응형 웹페이지 제작
  • - 미디어 쿼리(media query)
  • - media query의 변화와 특징 (n-screen 대응)
  • - css3를 지원하지 않는 브라우저(ie)에서의 css3 적용
  • - 반응형 웹페이지 (responsive web design)
  • - 미디어 쿼리 분기점의 이해 (break points)
모바일 웹페이지 제작
  • - 클라이언트에 데이터를 저장
  • - 로컬저장소(local storage) vs 세션저장소(session storage)
  • - 모바일 웹의 이해, meta viewport 이해 및 적용하기
  • - screen density, css pixels / device pixels
  • - 레티나 디스플레이 대응 방법, 모바일 페이지 제작
  • 권예원
  • 이효정
  • 서은주
  • 박성영
  • 김정원
  • 김효원
  • 서경화
권예원
  • 권예원
  • 현) 그린컴퓨터아트학원 강사
  • 현) 예온리디자인 대표
  • 전) 낭만연구소 디자인 팀장
  • 정보처리기사
  • 사무자동화산업기사
  • CAD 국제공인자격증 1급
  • GTQ 그래픽기술자격 1급
  • PROJECT
이효정
  • 이효정
  • 현) 그린컴퓨터아카데미 강사
  • 전) 영남기술교육원 ERP정보시스템 전임교사
  • 전) 한국인적자원개발센터 고용유지훈련 담당교사
  • PROJECT
  • 정보처리기사
  • 사무자동화산업기사
  • 컴퓨터활용능력1급
  • 전산회계운용사1급
  • 전산세무2급/전산회계1급
  • TAT2급/FAT1급
  • ERP정보관리사 1급(회계/인사/물류/생산)
  • 유통관리사 2급
  • 직업훈련교사 2급(총무·일반사무)
  • 직업훈련교사 3급(회계)
  • 직업훈련교사 3급(재무)
  • 직업훈련교사 3급(생산관리)
  • 직업훈련교사 3급(무역유통관리)
서은주
  • 서은주
  • 현) 그린컴퓨터아트학원 회계 강사
  • 전) 계명문화대학교 산업체 겸임교원
  • 전) 영우제지 경리과 주임
  • 전공)부동산학 석사
  • PROJECT
  • 정보처리산업기사
  • 사무자동화산업기사
  • 전산세무 1급
  • 전산세무 2급
  • 전산회계 1급
  • 전산회계운용사 2급
  • ERP회계정보관리사 1급
  • ERP인사정보관리사 1급
  • ERP물류정보관리사 1급
  • ERP생산정보관리사 1급
  • 컴퓨터활용능력 2급
  • 직업훈련교사 3급 (회계)
  • 직업훈련교사 3급 (총무․;;;;일반사무)
  • 직업훈련교사 3급 (재무)
  • 직업훈련교사 3급 (일반판매)
  • 직업훈련교사 3급 (생산관리)
  • 직업훈련교사 3급 (e―비즈니스)
  • 교원자격증 실기교사(전자계산)
박성영
  • 박성영
  • 전공 회계학
  • 전) SK텔레콤 경리부장
  • 전) 대원인더스트리 무역과장
  • PROJECT
  • 직업능력개발훈련교사 회계 3급
  • 직업능력개발훈련교사 재무 3급
  • 직업능력개발훈련교사 무역·유통관리 3급
  • 직업능력개발훈련교사 사업관리 3급
  • 직업능력개발훈련교사 e―비즈니스 3급
김정원
  • 김정원
  • 현) 그린컴퓨터아트학원 강사
  • PROJECT
  • CAD 기술자격 2급/1급
  • CAD 공인강사자격증
  • 전산응용기계제도 기능사
  • 직업훈련교사 3급 (기계설계)
  • 직업훈련교사 3급 (건축설계,감리)
김효원
  • 김효원
  • [강의분야]
  • 정보처리, C/C++, JAVA, OA, MIDI(Cubase)
  • 현) 그린컴퓨터아트학원 신촌캠퍼스 강사
  • 현) 프리랜서 개발자
  • 창조공작소 Android Game개발 과장
  • PROJECT
  • [자격사항]
  • 직훈교사(OA3급)
  • 정보처리기사
  • 전자계산기조직응용기사
  • 무선설비산업기사
서경화
  • 서경화
  • 현) 그린컴퓨터아트학원 신촌캠퍼스 강사
  • 한국교육컨설팅
  • 경복비즈니스 고등학교 특강
  • PROJECT
  • [자격사항]
  • MOS
  • 정보처리산업기사
  • 사무자동화산업기사
  • 컴퓨터활용능력 2급
  • 워드프로세서 2급
  • 수강후기조권*

    약 두달간 컴퓨터 활용능력1급을 교육을 정미경 선생님에게 받았습니다 학생들이 어려워하는 포인트를 잘 잡아주시고 초반부의 이론위주의 교육과 후반부의문제풀이 위주의 교육이 좋았습니다. 상황이 안좋아 지금 시험자리가 안나와서 취득은 못하였지만 조만간 꼭 시험을 보고 합격하겠습니다
  • 하정화 선생님 감사합니다김수*

    안녕하세요
    김수연입니다.
    선생님 덕분에 일러스트 포토샵 많이 배웠습니다
    차근차근 가르쳐주시고 재밌게 해주셔서 너무 즐겁게 다녔습니다
    감사합니다.
    초급때 국비지원에도 후기를 남기고 싶었는데 
    시간이 지났다고 안된다고해서 여기로라도 남깁니다 감사합니다ㅎㅎ
  • 성준호 선생님 고생하셨습니다박형*

    근무하던 회사에 엑셀도 하나도 모른상태로 입사했다 고생한 경험이 있어서
    기초부터 확실하게 배우고 가자는 마음으로 신청했던 수업인데
    선생님의 꼼꼼한 지도와 가르침으로 많은 깨달음을 얻었습니다.
    코로나때문에 어수선한 분위기속에서도 초심을 잃지않고 열정적인 자세로
    학생들을 교육시키려는 모습에 감동도 받았습니다.
    앞으로도 좋은 기회가 된다면 또 다시 다른 수업으로 만나뵙고 싶습니다.
    감사합니다
  • 성준호 선생님 감사합니다!!주하*

    컴활 1급이 어렵다고 해서 막막했는데 선생님께서 이해하기 쉽게 잘 설명해주신 덕분에
    잘 따라갈 수 있었습니다
    천천히 따라 올 수 있도록 설명해주셔서 감사합니다!!
  • 컴퓨터활용능력 1,2급 취득과정 성준호 강사님*

    컴활 1급에 대해 어렵다고만 생각했는데 강사님께서 차근차근 천천히 잘 알려주셔서 금방 배울 수 있었습니다.
    엑셀은 많이 사용하였지만 액세스 부분은 아예 처음이라 걱정했지만 배우고 보니 그렇게 어렵지 않네요.
    강사님께서 잘 알려주신 덕분입니다~~~ 감사합니다~~~!
  • 성준호 선생님 감사합니다신상*

    아무래도 엑셀을 다룰줄 몰라 초반에 걱정많이 했는데 성준호 선생님께서 천천히 설명해주시고 복습시간도 충분히 주셔서 좀 더 엑셀을 활용할 수 있게 되었습니다. 긴 시간 강의 하는데도 피곤해하지 않으시고 수강생들 질문에도 성실히 답변해주셔서 좋았습니다.
수강후기 더 보기▶

그린이 추천하는 관련 교육과정

개강임박
  • 주소 : 서울시 강남구 역삼동 815-4 만이빌딩 5층, 10층
  • 대표자 : 김상곤
  • 담당자 : 강남점
  • 사업자등록번호 214-86-26812
  • 통신판매업신고 강남13717호
  • 학원등록번호 : 강남 제 1101호
  • COPYRIGHT ⓒ GITACADEMY. ALL RIGHTS RESERVED
상담
문의
02.6951.0523