초보 블로거도 쉽게 따라하는 네이버 블로그 홈페이지형 스킨 만들기! 홈페이지처럼 보이는 멋진 블로그, 한 번쯤 만들어보고 싶지 않으셨나요? 이 글은 네이버 홈페이지형 블로그 만들기 1편으로, 스킨 제작의 핵심인 사이즈 설정과 이미지 작업 방법을 기초부터 알려드립니다.
앞으로 총 7편으로 구성된 블로그 디자인 시리즈를 통해 홈페이지형 블로그를 완성해보세요!
*이 글은 유튜브 영상을 먼저 촬영한 후 캡처 화면을 활용해 작성되었기 때문에, 일부 이미지의 화질이 다소 낮을 수 있는 점 양해 부탁드립니다.
- 유튜브 강의 참고하기
- 벤치마킹(benchmarking)으로 레이아웃 감 잡기
- 블로그에 맞는 이미지 고르기
- 스킨 디자인 사이즈 설정
- 캔버스에 사진 옮기기
- PSD 파일 저장하기
- 최종 JPG 이미지 저장하기
네이버 블로그 홈페이지형 블로그 만들기는 영상으로도 제작되어 유튜브에서 시청할 수 있게 올려두었습니다. 영상을 보면서 부족한 부분은 앞으로 작성해서 업로드되는 포스트를 참고 부탁드립니다. 유튜브 영상 같이 첨부합니다. 구글 또는 유튜브에서 "여행하는 디자이너 트래블러"를 검색하시면 쉽게 찾을 수 있습니다.
유튜브 강의로 먼저 감 잡기
유튜브 검색창에 "여행하는 디자이너 트래블러"를 입력하면 쉽게 찾아볼 수 있어요.
강의 링크:
[ 기초1편 바로가기 ]
[ 기초2편 바로가기 ]
[ 기초3편 바로가기 ]
벤치마킹으로 레이아웃 참고하기
홈페이지형 블로그를 처음 만들 때는, 잘 만든 블로그를 참고하는 게 가장 빠릅니다. 저는 ‘체코관광청 블로그’를 벤치마킹해 기본형 구조를 따라가며 디자인했어요.
체코관광청 블로그 [여기]
수원시 공식 블로그 [여기]
한국관광공사 블로그 [여기]
디자인프레스 블로그 [여기]
1.스킨에 어울리는 이미지 선택하기
고화질 이미지 구하는 팁
- 여행 블로그라면 여행 이미지, 육아 블로그라면 귀여운 일상 이미지 등 주제에 맞춰 선택하세요.
- 언플래쉬(Unsplash): 고화질, 상업적 사용 가능한 무료 이미지 사이트 [ 언플래쉬 바로가기 ]
포토샵에서 이미지 불러오기
File > Open 클릭 후, 사용할 이미지를 불러옵니다.
2. 블로그 스킨 사이즈 정하기 (중요!)
홈페이지형 블로그에서 가장 중요한 것이 스킨 사이즈입니다. 너무 작으면 해상도가 깨지고, 너무 크면 로딩 속도가 느려질 수 있어요.
캔버스 설정 방법
- File > New
- 사이즈 입력:
세로(Height): 700px (디자인에 따라 조정 가능)
3. 이미지 캔버스로 옮기기
- 왼쪽 툴바에서 Move Tool(이동툴) 선택
- 이미지를 드래그하여 새 캔버스로 끌어오기
- 마우스 커서에 + 아이콘이 뜨면 성공적으로 이동됨
4. 이미지 배치 및 사이즈 조절
캔버스에 이미지가 들어오면 적절히 줄이거나 늘려야 합니다.
포토샵에서 이미지 사이즈 조절 방법
- Edit > Free Transform 또는 Ctrl+T
- Alt + Shift를 누른 채 모서리를 드래그하면 비율 유지하며 줄이기 가능
5. 스킨 원본 PSD 파일 저장하기
작업 중인 이미지는 원본 파일로 저장하는 게 중요합니다. 혹시 모를 수정에 대비하기 위해 꼭 .psd 파일로 저장해두세요.
- File > Save As → 형식: PSD
- 예시 파일명: home_skin_original.psd
6. 블로그에 적용할 JPG로 저장하기
최종 완성된 이미지는 블로그에 올리기 좋게 .jpg 형식으로 저장합니다.
- File > Save As → 형식: JPG
- 예시 파일명: home_skin_final.jpg
마무리 – 스킨 완성! 다음 단계는 메뉴 버튼 만들기
이제 네이버 블로그 설정에서 스킨 이미지를 배경으로 등록하면, 홈페이지형 블로그의 첫 인상이 완성됩니다! 다음 포스트에서는 ‘메뉴 버튼 만들기’ + ‘위젯에 링크 거는 법’ 을 알아볼 예정이니, 구독/스크랩 해두고 이어서 확인해 주세요!
댓글 쓰기