[웹디자인기능사 실기] 공개문제 분석

 

 

안녕하세요 PNcoding입니다 :)

이번 포스팅에서는 공개문제를 분석을 한번 해보도록 하겠습니다.

 

시험 대비를 하실때에 공개문제만 제대로 시간 내에 푸는 연습만 하신다면 충분히 합격하실 수 있을거에요 :)

 

 

공개문제를 다운받지 못하셨다면 여기로 가셔서 다운로드를 받으시면 됩니다.

https://pncoding.tistory.com/15

[웹디자인기능사 실기] 공개문제 다운로드

 

---

 

 

 

2023년 기준으로 시험 타입이 A타입부터 ~ E타입까지 나왔습니다. 

각 타입별로 4개씩 해서 총 공개문제는 20개가 제공이 되어 있어요.

 

공개문제

 

 

20개라는 말을 듣자마자 "너무 많은게 아닌가? 시험 준비하기 어렵겠다..." 라는 생각을 하시겠지만,

각 타입별로 나오는 유형이 정해져 있으니 너무 걱정하지 않으셔도 됩니다.

 

 

 

---

 

 

1. 와이어프레임

 

각 타입의 와이어 프레임을 먼저 보도록 하겠습니다.

 

1) A 타입

a-1

 

2) B 타입

b-1

 

3) C 타입

c-1

 

4) D 타입

d-1

 

5) E 타입

e-1

 

 

 

---

 

이미지만 봐서는 잘 모르겠죠?

한번 간단하게 정리해 보도록 하겠습니다.

타입	내용 정리
A타입	wrap 영역의 가로크기 1200px 가운데 정렬
B타입	wrap 영역의 가로크기 브라우저 가득 100%, 그 안쪽 컨텐츠의 영역이 1200px 가운데정렬
C타입	wrap 영역의 가로크기 1000px 왼쪽정렬
D타입	wrap영역의 가로크기 100%, B영역의 크기는 calc함수 활용 계산
E타입	wrap영역의 가로크기 100%, 세로크기 100%,  B영역의 크기는 calc함수 활용 계산

 

각 타입별로 조금씩 다르긴 하지만 크게 다르지 않은것을 볼 수 있습니다.

 

 

 

---

 

 

 

반응형

 

 

이제 각 타입안의 컨텐츠들을 분석해 보도록 하겠습니다.

 

2. 컨텐츠 유형 분석

1) 로고

심벌 없이 직접 디자인	A1, A2, B1, B2, C1, C2, D3, D4
심벌 추가하고 직접 디자인	E2, E4
제공된 로고 사용하되 사이트의 주제에 맞게 색상 변경, 종횡비 유지	A3, A4, B3, B4, C3, C4
제공된 로고 사용하되 그대로 사용가능, 종횡비 유지	D1, D2, E1, E3

 

2) 메뉴

서브메뉴 전체 펼쳐지는 타입	A1, B1
와이어프레임 1200px 일시 헤더 전체 서브메뉴 펼쳐지는 타입	A2, A4
와이어프레임 100% 일시 헤더전체 서브메뉴 펼쳐지는 타입	B2, B4
메인메뉴의 서브메뉴만 펼쳐지는 타입	A3, B3
세로메뉴이며 서브메뉴가 아래로 펼쳐지는 타입	C1, C2, D1, D2, E1, E2
세로메뉴이며 서브메뉴가 옆으로 펼쳐지는 타입	C3, C4, E3, E4
세로메뉴이며 서브메뉴가 옆으로 펼쳐지지만 크기가 브라우저 가득차는 타입	D3, D4

메뉴 밑 스팟메뉴 추가

D1, D3, E1, E3

 

3) 슬라이드

좌우	A2, B1, B4, C3, C4, D2, E1, E4
위아래	A1, B2, B3, D1, E2, E3
fadeIn/Out	A3, A4, C1, C2, D3, D4

 

4) 탭

탭 구현	A1, A3, B1, C1, D1, D3
탭 미구현	A2, A4, B2, B3, B4, C2, C3, C4, D2, D4, E1, E2, E3, E4

 

5) 팝업

공지사항 첫번째 컨텐츠 클릭시

모든 타입

 

6) 갤러리

마우스 오버시 opacity 조절

A4, B3, C3, D4, E3

 

 

 

 

---

 

 

 

여기까지해서 전체 타입의 세부내용을 분석하여 보았습니다.

 

각 유형별로 나오는 형태는 정해져 있으니 공개문제를 보면서 모든 유형을 만드실 수 있으면 충분히 합격 하실 수 있을거에요 :)