이미지 검색을 사용해 보세요
검색창 이전화면 이전화면
최근 검색어
인기 검색어

소득공제
아보느의 홈페이지형 블로그 만들기
윤호찬
아티오 2020.03.10.
베스트
웹사이트 top20 1주
가격
15,000
10 13,500
YES포인트?
750원 (5%)
5만원 이상 구매 시 2천원 추가 적립
결제혜택
카드/간편결제 혜택을 확인하세요

이미 소장하고 있다면 판매해 보세요.

  •  해외배송 가능?
  •  문화비소득공제 가능

Start up 스타트업 시리즈

상세 이미지

책소개

목차

Step 1 : 네이버 블로그 디자인의 비밀 살펴보기
1 블로그란? 홈페이지란?
2 다양한 블로그 스타일 구경하기(기본 블로그 vs 홈페이지형 블로그)
3 세로 5개의 투명 위젯 가이드라인의 이해하기
4 네이버 블로그 구조 이해하기

Step 2 : 블로그 기본 정보 입력 및 카테고리 생성하기
1 블로그 생성 및 관리자 로그인하기
여기서잠깐[블로그 쉽게 만들기] 내용 살펴보기
2 블로그 정보 변경하기(블로그명, 별명, 소개글, 프로필 이미지, 모바일앱 커버 이미지)
3 블로그 - 카테고리 관리에서 카테고리 메뉴 생성하기

Step 3 : 배경 이미지 넣기 & 로고/타이틀 영역 수정하기
1 꾸미기 설정 - 레이아웃 설정 - 메뉴 형태와 타이틀 위치 변경하기
Power Upgrade 배경 이미지 포토샵에서 작업하는 방법(가이드라인, 투명 위젯, 메뉴 위치 고려)
2 꾸미기 설정 - 세부 디자인 설정 - 스킨배경 - 스킨배경 직접 등록하기
3 타이틀 - 블로그명 제목 안 보이게 처리하기
4 타이틀 - 영역 높이 변경하기

Step 4 : 상단 메뉴 위젯 추가 후 투명 이미지 넣기
1 레이아웃의 구조 설명하기
2 꾸미기 설정 - 레이아웃 설정 - 메뉴 영역 추가하기
3 위젯 개념 알아보기
4 위젯 위치 이동하기
여기서잠깐 투명과 검은색 위젯 가이드 만드는 방법
5 투명 이미지를 원격 공간에 업로드 하기
6 투명 이미지 경로 주소 확인하기
7 위젯코드 입력(html 방식) - 위젯에 투명 이미지 넣기
8 타이틀과 메뉴 사이에 간격을 조절하기
여기서잠깐 세로 5개 가이드라인의 원리

Step 5 : 투명 위젯 링크 연결하기(이미지맵 사용)
1 상단 메뉴 링크 연결하기
2 전체 메뉴 카테고리별로 주소(URL) 확인하기
3 외부링크 html 작성하기
4 내부링크 html 작성하기
5 black.png 이미지를 transparent.png 투명 이미지로 변경하기

Step 6 : 공간 만들기 위젯 추가하기(테이블 문법)
1 공간을 주기 위한 br 위젯 5개 추가하기
2 br1~5 위젯 위치 이동하기
3 공간을 주기 위한 html 문법 설명 - 1(br 태그 사용하기)
4 공간을 주기 위한 html 문법 설명 - 2(table 태그 사용하기)

Step 7 : 블로그 썸네일 디자인 3종(정사각형, 직사각형, 원형) 만들어 보기
1 썸네일 권장 사이즈 확인하기
2 정사각형 썸네일 디자인하기
3 직사각형 썸네일 디자인하기
4 원형 썸네일 디자인하기
5 ‘From 블로그씨’ 안 보이게 하기
6 썸네일 3종 블로그에 글쓰기 후, PC 화면 vs 모바일 화면 썸네일 비교하기

Step 8 : 한 개 위젯으로 다수 SNS를 링크(이미지맵)시키고 검색 기능 추가하기
1 포토샵에서 SNS 링크 연결 영역 디자인(검색위치, SNS위치) 위치 확인하기
2 SNS 이미지가 포함된 배경 이미지를 불러와서 스킨배경 이미지로 등록하기
3 검색 위젯 추가하기
4 SNS 위젯 추가하기
5 이미지맵 자동 프로그램을 이용해서 좌표 구하기(Online Image Map Editor)
6 한 개의 위젯으로 SNS 다중 링크 연결하기
7 이미지맵 좌표 값 미세 수정하기

Step 9 : 푸터(footer) 만들기 - 하단 카피라이트 부분 추가하기
1 현 레이아웃에서 footer를 만들기 위한 모듈 선택 및 그 이유?
여기서잠깐 ‘타이틀’ 위젯 모듈의 3가지 특징
2 레이아웃 설정에서 ‘타이틀’ 영역 이동하기
3 mm1~mm5 위젯 코드를 테이블 문법으로 변경하기
4 위젯 변경 후 세부 내용 재수정하기

Step 10 : 서브메뉴 추가하기
1 서브메뉴를 추가하기 위한 레이아웃 구조 파악하기
여기서잠깐 링크를 연결하기 위한 아보느 공식 3단계
2 포토샵에서 서브메뉴 디자인 위치 확인하기(투명 가이드라인 활용)
3 서브메뉴 부분만 조각 이미지로 저장하기(이미지맵 좌표 용도)
4 작업한 배경 이미지 ‘스킨배경’으로 적용하기
5 메인메뉴 아래에 서브메뉴 3개 추가하기
6 서브메뉴의 url 주소 확인하기
7 br1 위젯에 투명 이미지 넣고 코드 수정하기
8 투명 이미지 height 높이를 강제로 늘이기
9 조각 이미지를 이용해서 이미지맵 좌표 구하고 링크 연결하기
10 이미지맵 좌표 값 미세 수정하기

| 부록 1 | 블로그로 수익 창출하기(네이버 애드포스트로 블로그에 광고 적용하기)
1 애드포스트 회원 가입하기
2 애드포스트에 미디어 등록하기
3 미디어 검수 결과 종류(검수중/보류/정상)
4 애드포스트 공식 가이드라인(NAVER 고객센터)
5 블로그 광고 노출 위치 및 수입 보고서

| 부록 2 | 블로그 제작 시 도움 되는 유용한 정보(팁) & 포토샵 사용법
1 유용한 사이트/정보(팁)
2 포토샵 사용법

저자 소개 1

아보느

IT 및 디자인 분야 유튜브 크리에이터로 활동하고 있으며, 홈페이지, 쇼핑몰 제작 업체를 10여년 넘게 운영해 온 경험을 재능 나눔하고 있다. 디자인과 프로그램 두 분야에 모두 관심이 많으며, 콘텐츠 기획 및 콘텐츠 마케팅 관련 일을 하고 있다. 부산대 정보컴퓨터공학 전공하였으며 포스트웹 대표이다.

품목정보

발행일
2020년 03월 10일
쪽수, 무게, 크기
260쪽 | 660g | 188*257*12mm
ISBN13
9791188059973

리뷰/한줄평23

리뷰

9.6 리뷰 총점

한줄평

9.6 한줄평 총점

클린봇이 부적절한 글을 감지 중입니다.

설정