HOME>디지털 실무>웹기획제작>웹기획 홈페이지제작
ONLINE CLASS

웹기획 홈페이지제작

?

수강 전 꼭 확인하세요

수강 전 자주 묻는 내용을 간단히 안내드립니다.

Q초보자도 교재 없이 수강 가능한가요? 프로그램 정보는?
A

네, 영상과 실습자료로 쉽게 학습할 수 있습니다. 알지오는 원격평생교육원으로 프로그램 관련 정보는 제공하지 않습니다.

기업이 선택한 신뢰 강의

검증된 커리큘럼과 전문 강사진으로 높은 만족도를 제공합니다.

자세히 보기  >
수강료 일부는 사회환원에 사용됩니다.

작은 나눔이 더 나은 내일을 만듭니다.

자세히 보기  >
REAL REVIEW

수강생 리얼후기!

실제 수강생의 학습 경험을 확인해 보세요.

수강후기를 불러오는 중입니다.

웹기획 홈페이지제작 웹기획 홈페이지제작
  • 웹기획 홈페이지제작

  • 강의구성
  • (19강) 전체 : 12시간 11분|평균 : 38분28초
  • 이용기간/강사
  • 2개월
    알지오 R&D [IT]
  • 증빙가능
  • 수료증, 수강증, 학습진도
  • 수강료
  • 520,000할인260,000
  • 알지오 패키지
  • "5개월" 혜택!
?

수강 전 꼭 확인하세요

수강 전 자주 묻는 내용을 간단히 안내드립니다.

Q 초보자도 교재 없이 수강 가능한가요? 프로그램 정보는?
A

네, 영상과 실습자료로 쉽게 학습할 수 있습니다. 알지오는 원격평생교육원으로 프로그램 관련 정보는 제공하지 않습니다.

  • 01.29분 웹사이트 구축의 기본사항
    도메인, 호스팅, 트래픽 등 웹사이트를 구축함에 있어 기본적인 사항에 대해 알아보자
    웹기획 이란 무엇인가?/웹기획의 역할/웹사이트 구축단계/분석단계/설계/구현/검수/도메인 이란?/한국도메인 등록대행자/규칙1- 영문자(A-Z) 숫자(0~9) 하이픈(-)/규칙2- Name 의 길이는 최소 2자~63자/규칙3- 중복되지 않는 고유주소/도메인을 유용하게 활용하기 위한 방법/도메인에는 어떤게 있을까?/원하는 도메인 검색하기/웹 호스팅이란?/나만의 웹서버를 갖기위해선 웹 호스팅이 필요하다/호스팅의 종류/SSL/보안서비스를 받고있는지 확인실습/DB호스팅/이미지 호스팅/트래픽이란?/알기쉽게 트래픽에 대해 예를 들어봅시다/호스팅 서비스를 제공해주는 사이트에서 확인/내 홈페이지의 트래픽 확인해보기/계산하기/파악하면서 준비
  • 02.36분 쇼핑몰 제작 지식과 본격적인 웹 기획
    쇼핑몰 제작을 위해 필요한 지식을 공부하고 주의사항, 전략 에 대해 알아보자
    쇼핑몰 기본 시스템/업데이트시 자동설정 및 반영/상황별 sms/결제모듈/서비스, 만족, 배송/쇼핑몰 빌더임대/쇼핑몰 솔루션/쇼핑몰을 위해 준비된 별도의 프로그램 필요/쇼핑몰 솔루션(임대형, 독립형) 으로 나뉩니다/임대형의 장점/임대형의 단점/독립형의 장점/독립형의 단점/임대형, 독립형의 차이점/벤치마킹하고픈 쇼핑몰 파악하기/SSL 확인작업 실습/소스보기/SSL 찾기/SSL 이 없다면 보안인증 자체가 없거나, 자체 쇼핑몰/쇼핑몰 운영을 할때 알아야할 기술/웹기획-성격에 따른 콘텐츠, 사용자 분석/아이템 선정/시장조사및 분석/동종업계 분석/경쟁업체 장단점 파악/주의해야 할점/차별화 전략/웹사이트 제작 관련 홈페이지 만들기/홈페이지 해상도 사이즈/디스플레이 등록정보/사이트 가로 폭 길이
  • <제1 스타일 - 시안 디자인>
  • 03.26분 메인시안 - 스토리보드, 레이아웃, 로고
    스토리보드 소개/한계가 있는 주먹구구 방식/리뉴얼/홈페이지 10레벨 스킬학습?/소스를 구입해도 할수 없는것/일러스트/플래시/제작목적/제작시 실패원인/스토리보드/호스팅 후 셋팅/FTP/원격 파일 열기/디렉토리 경로 설정/고급 FTP 설정/화면개요/No Frame//공백/제로보드/메인시안 참조/신규 레이아웃/New Guide/Lock Guides/로고제작/실제내용사이즈/Navigator/폰트입력 및 셋팅/그라디언트 컬러, 제작/D제작/모양주기/Layers 정리/로고 배경만들기
  • 04.28분 메인시안 - 웹메뉴, 서브트리
    그라디언트 로컬 사용자 배려/메뉴제작/새문서 생성/Navigator/그라디언트/테두리 마감/배경색 채우기/그라디언트 웹상에서 효과 확인/Save for web/플래시무비를 먼저 포토샵에서한 이유/우측 메뉴(홈페이지 솔루션)/그라디언트 효과/레이어스타일 복사/메뉴 상단내용/동일하게 간격 변경/폰트 뭉그러지지 않게 처리/작은아이콘 제작시 상식/우측메뉴 완성/Color Libraries/하부트리 내용/구분선 삽입/하부트리 배경 및 라인/확대 작업/둥근테두리 적용시 문제점/레이어관리/폴더 복사/상품안내/여백 조정/Styles/Styles 변경
  • 05.29분 메인시안 - 로그인, 고객센터 배너
    우측상단 메뉴/Character/좌, 중앙, 우 1단 개별 사이즈/웹메뉴/홈페이지 컬러스타일/새문서 만들기/Color Picker/테두리/적용해보기/아이디, 비번 등 구성 기획/텍스트박스 등 1차작업/구도 설정/로그인버튼/Styles/Styles 수정/폰트 설정/회원가입, pw helf/사이즈 측정/Styles 수정/폴더 생성 후 스타일 복사/New Guide/상단에 넣어줄 말/배경색 지정이 안될때/레이어 폴더별정리/적용해보기/고객센터/색다른 박스/베드사례/굳 사례/Layer Style/고객지원센터 폰트 설정/내용정리
  • 06.33분 메인시안 - 중앙무비용 메인, 우측 배너
    배너작업 추가 보충/Modify/Feather/고객센터 비슷한 배경매칭/Color Picker/Color Libraries/중앙무비용 일러스트 구매시 주의점/일러스트 수정 후 포토샵 삽입/stroke/일러스트 작업/사이즈 조정/위치 변경/표지판에 글씨 삽입/포토샵 불러오기/우측배너 사이즈/배경작업/stroke/내부배너제작 그라디언트/작업내용-1/그림자 효과/작업내용-1-1/Character/작업내용-1-2/도형 만들기/링크용 버튼/중앙라인 분리/작업내용-2/작업내용-2-1/GO버튼/수정할수 있는 정돈된 폴더 및 레이어
  • 07.37분 메인시안 - 좌 BEST!!, 우 순위
    캔버스 늘리고/Canvas size/다중 가이드 셋팅 쉽게 계산된 방법/Style-Fixed size/Style-Normal/Lock Guide/제일팔고싶은 상품위치 제작/작업내용-1/사각 테두리 만들기/stroke/작업내용-2 배너공식/작업내용-3/Color Picker/Group/작업내용-4/작업내용-4-1/Opacity/작업내용-4-2/자간 간격/작업내용-5/Layer copy/GO 버튼 (핵심)/버튼 배경 생성/고객의 소리/배너 테두리 만들기/Fill/작업내용-1/작업내용-2/shape/이미지 회전/작업내용-3/완료 작업내용/우측배너/둥근사각 만들기/그라데이션/작업내용-1/작업내용-1-2/작업내용-1-3/작업내용-1-4/구분선 삽입/작업내용-2/작업내용-2-1/완성작 비교/오늘의 핵심
  • 08.33분 메인시안 - 중앙, 게시판 출력, 오버시 및 제작
    메인 가장중요한 위치설명/작품보고 더 좋은 아이디어!!/모나리자 예/원본제작의 어려움/중앙상단/1스타일- 상단배너/작업내용-1/contract selection/작업내용-1-2/smooth selection/내용넣기/상품명, 바로가기/버튼작업/버튼-둥근사각/버튼 완료 예/중앙우측 2배너/내용넣기/web design 넣기/간단하지만 눈에띄게, 스타일까지/알지오프로젝트 넣기/shape 넣기/abstract styles/중앙우측 3배너/2와 다른 내용스타일/서비스의 톡특화/원본비교/가이드 맞춰 재정렬/마우스 오버용 게시판버튼/버튼배경/버튼 사이즈/버튼 그라디언트/작업내용-1/질문답변버튼/질문답변_c 버튼/작업내용-1-1/잦은질문/잦은질문_c/공백 버튼제작/보드 라인작업/초이스시 나오는 선/질문답변 초이스시 나오는선/잦은질문 초이스시 나오는선/보드 통 라인/Rasterize Layer/상단 라인 지우기
  • 09.1시간 17분 메인시안 - 하 3단, 카피라이트 마무리
    하단에 들어갈 구도/하단 내용/image size/좌 내용/Rounded Rectangle/Color Picker/배경/테두리 지정/작업내용-1/타이틀 컬러/작업내용-1-2/화살표 만들기/작업내용-1-3/New/New Guide/Lock Guides/구분선/숫자/특색주기/go 버튼/Gradient/stroke/텍스트 입력/스타일 변형하기/내용 넣기/이후작업을 위한 확장/완성작/중앙하단작업-1/중앙하단작업-2/중앙하단작업-3/중앙하단작업-4/레이어 병합/수정 작업/중앙하단작업-5/페이지 분할/구분선 만들기/중앙하단작업 - 1단 내용/shaoe 삽입/중앙하단작업 - 2/3단 내용/완성작/강사도 몰랐던 기법 발견/배경 설정/Gradient Presets/우측배너 - 1/shaoe 삽입/우측배너 - 2/우측배너 - 3/배경 생성/우측배너 - 마무리/내용 넣기/view 버튼/완성작/메인홈페이지 확인/[01:00:01] 하단 카피라이트/[01:02:43] 로고 불러오기/[01:04:35] 로고 스타일 변경/[01:06:38] 하단 카피라이트 내용 넣기/[01:08:39] 배경 생성/[01:13:03] 완성 메인 시안
  • 10.51분 서브시안 - 좌/퀵 메뉴, 상단 무비용 제작|일러스트/ 포토샵/ 을 이용해 아이콘생성, 메뉴구성을 해 봅시다.
    스크롤바/서브페이지/홈페이지 하단/로그인 창 사이즈/만들 홈페이지 사이즈/일러스트 작업/일러스트 열기/그룹/각 카테고리 마다 하나의 아이콘 생성/레이어 생성/아이콘 생성/사이즈 포장/포토샵 시작/테두리 만들기/Layer Picker/원메뉴/둥근사각/타이틀/그라이언트 효과/모양내기/메뉴와 메뉴간 간격 조절/가이드 고정/width/height/원칙/position 설정/new guide/guide 고정/라인색/통합/화살표 만들기/화살표 내용 만들기/Custom shape tool/Fixed size/박스 스타일 만들기/Rounded Rectangle tool/스타일 변경/color overlay/레이어 폴더 만들기/Fixed size/만든 이미지 복사/카테고리별 메뉴 만들기/일러스트 아이콘 넣기/카테고리 copy /기준 잡기/레이어 폴더 만들기/카테고리 생성/일러스트 파일 가져오기/내용입력/Quick Menu/Rounded Rectangle Options/테두리 박스 라운드 처리/Rounded Rectangle tool/라인넣기/일러스트 아이콘 가져오기/카테고리 바로가기/이미지 수정
  • <제2 스타일 - 무비코딩>
  • 11.40분 무비제작 - 로고, 웹메뉴 제작
    배경깔기/웹용 저장하기/사용될 레이어 추가 및 설정/레이어 추가/레이어 이름 지정/마스크작업/Convert to Symbol/Insert Frame/결과 미리보기/Actions - Frame/로고 - 투명버튼, 하이퍼/Behaviors/반응 구성안내/배경만 png-8? png-24?/플래시 배경작업/서브트리 BG/새문서 생성/png, gif 저장시 차이점/서브 그래픽심볼/폴더 생성 및 정리/5 버튼심볼/내용 입력, 설정/over 설정/내용 배치/내용 복사/트리버튼 쉽게카피/Down, hit/개별액션 및 서브트리 반응 완료/movie clip/마스크작업/Actions - buttom/swap Symbol/Actions - Frame/결과 미리보기/오늘의 하이라이트
  • 12.34분 홈페이지 메인화면 일러스트를 이용한 중앙무비 만들기
    일러스트 수정하기/플레시에서 작업할수 있는것 /붙여넣기/포토샵에서 가져오기/웹용으로 저장/플레시 작업/size 지정/'0' 으로 되었는지 확인/표지판에 텍스트 입력/anti-alias 효과/애니메이션 효과/공백키프레임/끝까지 유지시키기/이미지 불러오기/Graphic Symbol 로 변환/순차적 이미지 액션/모션 주기/이미지 위치 지정/이미지 사이즈 조절/color : alpha/모션 주기/움직이는 효과 주기/가이드라인/물결형태로 움직임 주기/그린 선 모양대로 따라가기/동선따라 움직이지 않도록 처리/모션 주기/레이어 추가/Movie clip 생성/내용무비 불러와서 영역설정/'테두리' 레이어 잠금/shape tween/레이어 추가/Graphic Symbol 로 변환/커서가 깜빡거리는 효과/내용 삽입/커서 작업/글씨 내용 입력/한글자씩 나오도록 텍스트 속성 분해/액션 효과 주기/텍스트 스톱 작업/Timeline Control-stop /서브무비/Remove Frames
  • <제3 스타일 - 콘텐츠 제작>
  • 13.42분 메인상단 - css/플래시점선, 로고, 메뉴, 우상단
    강의를 이해하기위한 선수학습/css기능제작, 한파일 적용/에디트 플러스/st.css/문서 선택기 옵션/사이트 미리보기/나모 - 스타일 지정/드림위버 - 스타일 지정/플래시링크 점선, 배경/한배경 공유/편집기가 아닌 에디트가 편한 이유/주석처리/나모 - 문서 여백없애기/드림위버 - 문서 여백없애기/body/나모/드림위버 메인 테이블 작업/Border/드림위버 - 셀 합치기 작업/나모 - 셀 합치기 작업/작업소스 에디트 적용/공백 제거/플래시 링크스크립 구현, 로고/결과 확인/플래시 메뉴적용/결과 확인/우 상단내용 링크/제로보드 회원가입 링크/즐겨찾기 스크립 적용/소스보기/우상단 소스적용/프로젝트 확인/Home버튼 제작/좋은사례/나쁜사례/이미지 사이즈 쉽게 맞추고 소스적용/나모 - 이미지 원래 크기로/이미지 같은 셀 삽입시 문제점/표 속성/공백 제거/링크네임 넣기/프로젝트 확인/다음시간 전 알고 있을 프로그램
  • 14.47분 메인상단 - 로그인, 중앙무비, 우상단 Map
    Blur효과/Adjust color / Bevel 효과등/중앙무비 삽입/FTP실행/찾기/바꾸기/셀 합치기/로그인사이즈 정하기/중앙무비/우측배너/웹용으로 저장/이미지분할하면 안되는 이유/쉬운 삽입방법/이미지맵 확실히 알기/이미지맵 영역/usename/usemap=#imegemap1"복사/링크 점선 삭제하지 않는것이 좋다/링큰점선 없애는 법/좌측 고객지원 /쉽게 이미지 삽입/로그인창 코딩/로그인 후 비번찾기/ 로그아웃 버튼 제작/outlogin_skin/로그인BG/로그인 전/ 후 버튼 분할/영역확대/웹용으로 저장/표속성/로그인 테이블 맞추기//셀합치기/실제 로그인 전 페이지 스킨 코딩/홈 속성/제로보드에서 쓰는 아이콘 명으로 변경하기/스킨 이미지명 변경 후 적용/아웃로그인 스킨에 올리기/실제 로그인 되는 곳에 반영/폼 속성/스타일/색상지정/로그인 한 후 속성/스타일
  • 15.40분 메인핵심 - 중앙 최신 리스트, 좌 및 우배너
    살펴보기/우측 중앙 배너 수정/save for web/파일 불러오기/중앙리스트 개별저장, /이미지 분할/save for web/라인 수정하기/중앙 작업용 테이블 확장/tr 붙여넣기/공백 지우기/셀 합치기/표 만들기/best/이미지 맵/이미지가 나오게 하려면?/고객의 쓴소리/하이퍼링크 만들기/상단바/이미지 맵 처리/중앙 하단 2배너/이미지 맵 처리/구분선 삽입/우배너/이미지 맵 처리/중앙 게시판 알아둘 사항/버튼 및 내용 테이블/파일 인쿠르드/이미지 등록정보 확인/인쿠르드 대상파일/이미지 실수할수 있는 부분/이미지 경로/버튼 맵처리
  • 16.32분 메인하단 - 좌우 마무리 js오버연동
    이미지 불러오기/마우스 오버/사각 선택툴 /합성모드/이미지분할/웹 용으로 저장/드림위버/웹용HTML 저정/SIZE 지정/Find and Replce/이름 지정/Swap Image/Link 걸기/드림위버 작업소스 확인/타이틀변경/링크점선 없애기/스크립트 복사/웹용으로저장/바꾸기/자바스크립트를 가져와 홈페이지에 적용/홈페이지 우측 하단 이미지넣기/나모 웹에디터 실행/하이퍼링크 만들기/하단배너/EditPlus 에서 작업하기/이미지 파일명 수정/마우스 안나오게 숨기기/하단카피 제작/나모웹에디터/하이퍼링크 만들기/셀추가/셀합치기
  • 17.43분 서브 - 서브제작 1
    서브 만들기전 설계/새창열기/웹사이트 스토리/넓이/높이 입력/Rasterize 화 시키기/Stroke/공백지우기/레이어 병합/Smudge Tool/배경넣기/Custom Shape Tool /레이어 복사/Ctrl+T/레이어 복사/그룹설정/이미지분할/웹용으로 저장/아이콘 그림크기로 정렬/Quick menu 열기/Divide Slice/파일형식/필요없는 이미지 삭제/메뉴수정/웹코딩/디렉토리 만들기/좌측 구분선/셀속성/높이지정/셀선택/표 속성/구분선/셀합치기/셀 속성/웹용으로 저장/등록정보/파일/그림삽입하기/하이퍼링크 만들기/왼쪽으로 맞춤/포토샵으로 작업하기/Canvas Size 조정
  • 18.41분 서브 - 서브제작 2
    중간타이틀/테이블 생성/에디트플러스를 이용한 테이블 생성/이미지 사이즈 확인 및 적용/이미지 경로 지정/두번째 셀 생성/이미지 소스 쉽게 불러오는 방법/페이지 경로작업/나모-테이블 생성/Home에 하이퍼 링크/테이블 정렬 않먹힐때/결과값 붙여넣기/오른쪽 여백주기/빈셀을 이용한 사이즈 맞추기/구분선 색깔 변경하기/페이지별 구분 주석달기/좌 서브별통합 롤오버/타이틀 사이즈 확인 및 적용/마우스오버 적용/CEO 인사 추가하기/주소파일 불러오기/작업내용 테스트/회사연혁 추가하기/경영이념 추가하기/완성파일 확인/다른서브에 서브통합 쉽게 적용/왼쪽 메뉴 변경/서브별 다른 플래시메뉴/Publish Settings/결과물 확인/구분 작업/구분 작업 복사 및 적용/파일 업로드/바뀐메뉴 모든웹페이지 한번에 수정/확장성 위한 서브테이블 긴급수정/문제점 발생시 해결 방안/나모사용자 주의사항/서브 수정 완료/CEO 인사 적용하기
  • 19.33분 최종 - 보드, 회원가입, 마무리
    헤더, 푸터 파일폴더/고객센터 폴더 생성/보드용 좌메뉴/이미지 경로 일괄 변경/보드가 아닌 페이지 셋팅/홈페이지 확인/공지사항 헤더, 푸터/원격파일로 저장/타이틀 지정/홈페이지 확인/스킨 수정/플래시 변경/잔여 보드작업/완성페이지 확인/회원가입 페이지/member join/회원가입 페이지 확인/이용약관 낮게 나올때/게시판 CSS/홈페이지 확인/게시판 연동/최근게시물 테이블/소요되는 소스 및 셀작업/Loop/배경컬러 변경/실제출력 보면서 수정/글쓴이 아이디 출력/여백 조정/정렬값 넣기/보이는 글자수 수정/게시판 연동 설정/관리기술 일괄수정작업/새창 주문폼 열기/팝업네임의 중요성/하이퍼링크 속성/스크립 JS파일 생성후 연동/홈페이지 확인

강의목록 다운로드                        1:1 강의 질문&답변