1. 과정 커리큘럼(웹 개발자)
과정체계도
(웹퍼블리셔)
과정체계도
(웹 개발자)
커리큘럼
과정명 세부내용 배정시간
HTML&CSS
1. 선수학습 : 컴퓨터 기초
2. 소프트웨어 : 텍스트 에디터(Notepad, Editplus 등)
3. 학습내용
- 웹페이지 제작을 위한 하드코딩 방법 학습 (HTML, CSS)
30
웹표준 및
웹접근성
1. 선수학습 : HTML&CSS
2. 소프트웨어 : 텍스트 에디터(Notepad, Editplus 등)
3. 학습내용
- 웹표준 및 웹접근성에 대한 학습 (XHTML)
30
웹표준&CSS3
(주말과정)
1. 선수학습 : 컴퓨터 기초
2. 소프트웨어 : 텍스트 에디터(Notepad, Editplus 등)
3. 학습내용
- HTML, CSS, 웹표준, 웹접근성
(주-56)
HTML5 & jQuery
1. 선수학습 : HTML&CSS, 웹표준 및 웹접근성
2. 소프트웨어 : 텍스트 에디터(Notepad, Editplus 등)
3. 학습내용
- HTML5, javaScript, jQuery
60
프론트엔드개발자
1. 선수학습 : HTML&CSS, 웹표준 및 웹접근성, HTML5&jQuery
2. 소프트웨어 : 텍스트 에디터(Notepad, Editplus 등)
3. 학습내용
- 선수학습된 과정을 기반으로 프론트엔드 개발 실무
60
워드프레스&PHP
1. 선수학습 : HTML&CSS, 웹표준 및 웹접근성, HTML5&jQuery
2. 소프트웨어 : 워드프레스
3. 학습내용
- 웹 페이지 제작 실무
48
PHP&MySQL
1. 선수학습 : HTML&CSS, 웹표준 및 웹접근성, HTML5&jQuery
2. 소프트웨어 : 텍스트 에디터, APMSetup(Apache,PHP,MySQL)
3. 학습내용
- 서버 사이드 웹 페이지 제작 실무
60
(주-56)
2. 과정별 세부 커리큘럼
과 정 명 HTML&CSS
과정목표 - HTML&CSS를 이용한 웹페이지(하드코딩)를 제작할 수 있다.
선수과목 컴퓨터 기초
세부커리큘럼 (30시간)
단원명 세부내용 시간 결과물
HTML 기본
- HTML문서의 개념
- HTML의 구조 파악하기
- 사이트설정을 통해 로컬사이트와 웹사이트 개념 학습
- 미리보기기능을 통하여 여러 브라우저 설치
- 좋은 디자인과 나쁜 디자인의 비교
- 텍스트 관련 태그를 이용한 문단 정리
- 디자인모드에서의 문단 정리, 목록과 관련된 태그의 활용
- 이미지 태그를 사용하여 이미지 링크하기
6
하이퍼링크 및 테
이블
- 앵커태그를 이용한 text링크와 image링크
- 디자인모드에서 텍스트링크와 이미지링크 걸기
- 이미지 맵의 사용방법과 활용법, 롤오버이미지 만들기
- 네임앵커의 사용법과 활용법
- insert메뉴를 이용해 테이블 제작
- 속성패널에서 테이블 편집하기
- 테이블을 이용해 웹사이트 레이아웃 만들기
6
스타일 시트
- 프레임으로 웹사이트 다단나누기
- 하이퍼링크의 target속성으로 frame설정하기
- iframe의 이해, iframe으로 멀티미디어 삽입하기
- CSS(Cascading Style Sheet)의 이해
- 태그 및 문서 내부에서 정의하는 style로 문서꾸미기
- 태그선택자, 아이디선택자, 클래스 선택자의 이해
- Form문서의 이해, 여러 가지 문서 입력 양식만들기
6
프로토타입 제작
기본
- apDiv의 이해, apDiv로 자유롭게 레이아웃을 구성하기
- Form문서의 이해, 여러 가지 문서 입력 양식만들기
- 폼문서 만들기
6
프로토타입 제작
활용 및 사용성테
스트
- apDiv 팝업 만들기, 문서에서 div팝업 이동하기
- 브라우저팝업 만들기, 롤오버 메뉴바 만들기
- 무료호스팅에서 웹계정 만들기
- FTP프로그램의 사용방법과 활용
- 무료게시판 설치 하고 연결하기
6 ㅇ 웹 페이지 제작
3. 과정별 세부 커리큘럼
과 정 명 웹 표준 & 웹 접근성
과정목표
- 웹 표준과 웹 접근성을 준수하여 웹페이지를 제작 하며, 제작되어진 웹
페이지를 웹 표준, 웹 접근성을 감수하는 능력을 학습한다.
선수과목 HTML&CSS
세부커리큘럼 (30시간)
단원명 세부내용 시간 결과물
HTML 기본
- H.T.M.L의 기본 개념과 Markup언어의 개념
- html문서의 구조와 이해, htm언어의 문법과 DT설정
- meta태그의 이해, html주요 Element와 Attribute
- block요소와 inline요소의 차이(div요소와 span요소의 비교)
- 가시속성에 관한 개념과 다양한 속성을 통한 가시속성 적용
6
CSS의 개념이해
- 문서를 구조화하는 html의 주요 요소
- 문서구조화에서 태그의 의미적 요소의 중요성
- 의미적 마크업과 HTML5의 신규추가 태그
- CSS의 개념이해
- CSS선택자의 종류(기본 선택자, 응용선택자)
- 인라인 정의 방식(내부, 외부)
- style속성의 분류
6
웹표준 및 웹접근성
실무활용
- BoxModel의 개념
- position의 각 속성에 따른 위치
- position의 absolute와 relative관계
- float와 clear의 속성 활용법
- 장애인 차별 금지법과 웹접근성
- 웹접근성 연구소에 따른 표준마크업과 WA마크
- 웹접근성 22개 테스트 항목
- background-image속성에서 중첩 이미지의 사용
- background-repeat, background-size
- background-position등을 활용한 배경처리
- 이미지 좌표를 이용한 롤오버 효과(image IR)
- 여러 가지 코딩에디터의 소개와 효율적인 코딩
- zen-coding의 사용법과 단축키 안내, 설정방법
12
웹표준 및 웹접근성
적용 및 테스트
- IE(Internet Explorer)구버전에 대한 대응방안
- 멀티브라우저환경에서의 사이트 테스트하기
- 웹표준과 웹접근성을 활용한 인덱스문서 작성하기
6
ㅇ 웹표준 및 웹접근성을
준수한 웹페이지
4. 과정별 세부 커리큘럼
과 정 명 HTML&jQuery
과정목표
- HTML5 및 JQUERY기술 등 최신 웹 기술을 반영하여 웹표준 및 시맨
틱한 웹페이지 및 콘텐츠를 제작할 수 있다.
- HTML5, CSS3, JQUERY를 활용하여 스마트디바이스 플랫폼에서 구동
될 수 있는 웹 콘덴츠 제작 기술을 학습한다.
선수과목 HTML&CSS, 웹 표준&웹 접근성
세부커리큘럼 (30시간)
단원명 세부내용 시간 결과물
HTML5 & CSS3
- html4와 xhtml, html5의 버전 별 차이 및 DTD 이해
- 의미적마크업(Semantic Markup)/문서구조(document structure)
- 구조를 나타내는 요소, 콘텐츠 모델(Content Models)
- 아웃라인 알고리즘(Outline Algorithm)
- 박스 모델(Box Model) 및 콘텐츠 모델 (Content Model)
- 인터렉션 요소/html5 새로운 웹폼 관련 요소
- 동영상 및 오디오/vendor-prefix 이해 및 css3 활용
- CSS3 Transition 을 이용한 앱과 같은 화면 전환 효과
- 변형(Transform), perspective를 이용한 3D 큐브 제작
- 비트맵이미지(canvas) 및 API, 벡터이미지(svg) 및 API
- 지오로케이션및MAP API (google map API, naver map API)
18
javaScript &
jQuery
- javascript의 개요 및 문법(introduction & syntax)
- 객체의 이해 및 활용/이벤트 발생,전달, 제거
- javascript 라이브러리와 기본 선택자
- jQuery 이벤트 / 시각적 효과와 애니메이션
- jQuery 함수 및 $()의 의미, 래퍼(wrapper),
- 선택자(selector)와 메소드(method), 메소드체인(chain)
- 엘리먼트 제어(manipulation)
- 애니메이트(animate) 메소드, json 오브젝트 다루기
- 다양한 애니메이션 방법, callback 다루기
- easing 함수 다루기
- 이벤트 제어하기 / 이벤트 트리거 (trigger)
- 네비게이션 다루기 (navigation)
- 아코디언 메뉴 제작
- jQuery 플러그인과 활용
- 라이트박스(lightbox)를 활용한 갤러리
- jQuery 모바일
30
반응형/모바일
웹페이지 제작
- 미디어 쿼리(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
- 레티나 디스플레이 대응 방법, 모바일 페이지 제작
12
ㅇ 반응형 웹페이지
ㅇ 모바일 웹페이지
5. 과정별 세부 커리큘럼
과 정 명 프론트엔드개발자
과정목표
- HTML5 및 jQuery기술 등 최신 웹 기술을 교육훈련에 반영하여 웹표
준 및 시맨틱한 웹페이지 및 콘텐츠를 제작할 수 있다.
- HTML5, CSS3, jQuery, Ajax등을 활용한 스마트 디바이스 플랫폼에서
구동 될 수 있는 웹콘덴츠 제작 기술 습득 할 수 있다.
선수과목 HTML&CSS, 웹 표준&웹 접근성, HTML&jQuery
세부커리큘럼 (30시간)
단원명 세부내용 시간 결과물
프론트엔드 개발자
실무 활용 - I
ㅇ 최신 웹트렌드와 강의를 통해서 만들어볼 예제 살펴보기
ㅇ 작업환경 셋팅하기
ㅇ 자동으로 롤링되는 배너 만들기
ㅇ 애니메이션 만들기
ㅇ 동적으로 HTML문서를 읽어와 활용하기
- AJAX로 HTML문서를 읽어오기
ㅇ jQuery-UI Draggable, Droppable
- Draggable/Droppable 에서 제공하는 메서드와 옵션
ㅇ jQuery-UI Slider, Sortable
- Slider/Sortable 에서 제공하는 메서드와 옵션
ㅇ jQuery jPlayer jPlayer 에서제공하는메서드와옵션알아보기
- 크로스 브라우징을 지원하는 비디오 플레이어 만들기
- HTML5를 이용하여 비디오 플레이 시키기
ㅇ 이미지 갤러리 스크롤 메뉴 만들기
- Thumbnail 슬라이드 구현 및 이미지 활성화
ㅇ 2뎁스 메뉴 만들기
- 1뎁스 오버시 2뎁스 나오게 구현
- 2뎁스 메뉴 구현
- 링크주소를 읽어 해당 메뉴 활성화하기
ㅇ parallax scrolling 사이트 만들기
- i-OS와 같은 pull-to-refresh 메뉴 만들기
39 ㅇ 웹 페이지 제작
프론트엔드 개발자
실무 활용 - II
ㅇ 반응형웹
- PC와 모바일에서 다르게 동작하는 반응형 웹사이트 만들기
ㅇ CSS3 미디어쿼리
- CSS3 미디어쿼리를 적용하여 반응형웹 만들기
ㅇ i-Scroll라이브러리를 활용한 모바일 Flikking 만들기
- 모바일 환경에서는 i-Scroll을 적용하여 모바일 환경에
맞도록 변경해 주기
ㅇ CSS3 Animation 효과
- CSS3 2D transform, 3D transform, transition활용
ㅇ jQuery에서는 지원하지 않는 애니메이션 만들어 보기
- 3D CUBE만들어 보기
ㅇ 반응형 웹사이트 포트폴리오 만들기
- JavaScript Hash Event살펴보기
- CSS3 미디어쿼리를 활용하여 반응형 웹사이트 만들기
- 동적으로 페이지를 불러오고 애니메이션을 적용시켜 주기
- 브라우저의 백버튼을 누르면 이전 페이지를 다시 로드시키기
21
ㅇ 반응형 웹페이지
제작
6. 과정별 세부 커리큘럼
과 정 명 워드프레스 & PHP
과정목표
- 워드프레스(wordpress)라는 CMS를 이용하여 단기간에 최고의 효과를
낼 수 있는 사이트 제작을 통하여 웹 전반에 대한 기술과 개념을 확립
하고 실무에 적용한다.
선수과목 HTML&CSS, 웹 표준&웹 접근성, HTML&jQuery
세부커리큘럼 (48시간)
단원명 세부내용 시간 결과물
워드프레스 활용
- 워드프레스를 이해 /활용
- 웹환경의 변화
- 웹환경과 워드프레스
- 가입형 워드프레스 가입
- MySQL 기초 데이터 베이스 만들기
- 설치형 워드프레스 설치
- 설정하기
- 테마 선택하기
- 사이트 제작 실무
- 컨텐츠 제작
- 호스팅형 워드프레스 설치
- 워드프레스 설정
- 사이트 구조/메뉴 만들기
- 웹사이트 꾸미기
- 한국형 게시판 사용하기
- 테마 최적화
- 워드프레스 최적화
- 기능 추가 플러그인
- 테마 변형하기
- 헤더페이지 수정
- 풋터 페이지 수정
- 구조 변경하기
30
PHP 활용
- PHP 간단한 소개
- 웹과 웹 프로그래밍의 이해
- PHP 기본 문법
- 변수/연산자
- PHP 조건 처리 및 조건분기
- PHP 배열 및 처리
- MYSQL 쿼리
- 데이터 베이스 작성
- PHP 와 데이터 베이스연동
18 ㅇ 웹 페이지 제작
7. 과정별 세부 커리큘럼
과 정 명 워드프레스 & PHP
과정목표
- 기능성 홈페이지 구현을 위해 많이 사용되는 PHP와 MySQL에 대한 이
해 및 구현 방법을 습득하고 중․소형 서버에서 주로 사용되는 웹 어플
리케이션 구현 기술을 습득하여 회원가입 및 게시판 등 관리페이지 제
작 등의 업무를 수행할 수 있다.
선수과목 HTML&CSS, 웹 표준&웹 접근성, HTML&jQuery
세부커리큘럼 (48시간)
단원명 세부내용 시간 결과물
PHP & MySQL
- PHP 간단한 소개
- 웹과 웹 프로그래밍의 이해
- PHP 기본 문법
- 변수/연산자
- PHP 조건 처리 및 조건분기
- PHP 배열 및 처리
- 데이터베이스의 이해
- MYSQL 쿼리
- 데이터 베이스 작성
- PHP 와 데이터 베이스연동
- 게시판 페이지
- 게시판 입력 및 모듈화/게시판 수정 및 모듈화
- 게시판 삭제 / 검색 / 페이징 모듈
- 게시판 테이블 연결
- 세션/쿠키
- 로그인 시스템
- 게시판 작성 연습
33
PHP & MySQL
실무적용
- 실전 PHP 개발
- 베이스 모듈 개발
- 데이터 베이스 연동
- 수정입력삭제업데이트 모듈화
- 권한 관리모듈
- MVC 모델화
- 블로그 관리페이지
- 블로그 연동 및 연습
- 상품 관리 페이지
- 상품 카테고리
- 상품 판매 페이지
- 장바구니 시스템
- 집계 데이터 가공및 처리
- 프레임웍(CodeIgniter,Cake PHP)/CMS 소개
- 호스팅 환경의 이해
- 서버 호스팅을 포트폴리오 이전
- 포트폴리오 완성
27 ㅇ 개인 포트폴리오