모두 공짜로 만드는 네이버 모두 홈페이지 modoo! - 모바일 화면제작01

개인이 직접 홈페이지를 만들기 위해선 상당한 공부가 필요하고 전문가에게 맡기기는 비용면에서 너무 큰 부담이 되기 마련입니다. 도메인, 호스팅, 서버, ftp 등 말만 들어도 머리가 아프실 겁니다. 

 

이 모든 문제를 깔끔하게 해결할 수 있는 방법이 있는데 바로 네이버에서 서비스하는 모두(modoo!)홈페이지입니다. 전문지식이 없어도 기본 지식만 쌓으면 멋진 홈페이지를 만들 수 있습니다. 디자인에 대한 감각이 있으신 분이라면 쉽고 빠르게 부수입이 될 수도 있겠다(?)는 생각도 해 봅니다. 

 

그런데 모두 홈페이지가 마냥 좋은것은 아닙니다. 주소창에 OOOO.modoo.at 이런 식으로 모두에서 제작한 사이트라는 것을 알 수 있기 때문에 네이버 모두를 홍보해주는 역할을 하고 있습니다. 그리고 모두 홈페이지를 아는 사람은 '아, 공짜로 만든 거구나'하는 인식을 가지게 됩니다. 그런데 이러한 요소들은 일반 대중들에게는 그다지 중요한 요소는 아니므로 큰 문제가 안될 것 같습니다. (예외 : 홈페이지를 전문 제작하는 업체인데 모두 홈페이지로 홍보한다면 이상하겠죠?^^)

또 하나는 구글이나 다음같은 검색포탈에서는 노출이 후순위로 밀릴 수 있습니다. 독립적인 도메인에 비해 검색 노출이 약할 수밖에 없습니다.

 

이런 소소한(?) 단점에 비해 장점이 훨씬 많기 때문에 모두 홈페이지를 소개해 드리는 것이겠죠? 

모두 홈페이지의 장점은 무엇일까요? 

1. 모두 홈페이지는무료입니다. 도메인 비용, 호스팅 비용, 서버 관리비용, 홈페이지 제작비용 등 모두 무료입니다.

2. 디자인 감각이 없어도 템플릿을 이용해서 쉽게 만들수 있습니다.(단, 커스텀은 불가능합니다.)

3. SNS, 톡톡, 네이버스토어, 지도 연동이 클릭 한 번으로 가능합니다.

4. 모바일, pc 반응형을 지원합니다. 

5. 게시판, 문의하기 등의 폼을 무료 지원합니다.

6. 네이버 서비스인만큼 네이버 검색 노출이 잘 됩니다.

 

이렇게 보니 장점이 너무 많아서 모두 홈페이지를 만드는 것이 좋을 것 같네요. ^^

 

이제 본격적으로 만들어 보겠습니다. 우선 모두 홈페이지에 접속해 주세요.

www.modoo.at/home

누구나 쉽게 무료로 만드는 홈페이지

위배너를 클릭하시면 아래와 같은 메인화면이 나옵니다. 

우측 상단에 로그인 버튼을 클릭하시면 네이버 로그인 화면이 나옵니다. 네이버 가입이 안되어 있으면 가입 먼저 해 주시고 로그인해 주시면 됩니다. 

로그인 후 나도 시작하기 버튼을 클릭하면 아래 그림과 같은 상세화면으로 전환되며 우측 하단에 있는 'modoo! 시작하기' 버튼을 클릭해서 본격적으로 시작하면 됩니다.

시작하기 화면을 클릭하면 홈페이지 활용 안내를 받을 수 있는 방법을 선택할수 있는 화면이 나옵니다. 필요 없으면 그냥 확인 버튼을 눌러주면 됩니다.  

1단계로 홈페이지 제작에 대한 기본 정보를 묻는 화면이 나옵니다. 홈페이지제작 이미지 양과 지도, 블로그 등의 SNS, 쇼핑몰 연동 여부를 선택할 수 있는 화면입니다. SNS와 쇼핑몰은 되도록 네이버 서비스를 이용해 주시면 좋습니다. 최적화되어 있기도 하지만 네이버 검색 노출에 유리하기 때문입니다. 

2단계는 홈페이지 템플릿을 선택할 수 잇는 화면입니다. 본인의 사업과 가장 관련이 깊은 템플릿을 선택해 주세요. 가령 인테리어를 선택하면 견적 신청의 경우 주택유형/면적/방 등의 정보를 선택할 수 있는 추가 옵션을 제공해 줍니다. 다른 템플릿을 잘못 선택해서 작업하다 인테리어 견적 신청 페이지가 필요하다면 페이지 추가에서 해당 옵션을 설정해 줄 수도 있으므로 크게 걱정 안 하셔도 됩니다. (그래도 번거롭게 하지 않으려면 처음부터 제대로 선택해 주시는 것이 좋습니다.  

제작 화면으로 전환되면서 간단한 메뉴얼 설명이 나옵니다. 한 번씩 읽어보고 이해한 후 X 버튼을 눌러서 닫아 주십시오.

왼쪽에 있는 '첫페이지' 영역에는 총 5가지의 템플릿을 선택할 수 있는 메뉴가 있습니다. 각각의 템플릿 이름 바로 아래 '샘플보기' 글자를 클릭하면 아래 그림처럼 모바일에서 어떻게 보이는지 샘플을 확인할 수 있습니다. 화면에 보이는 비주얼만 보지 마시고 스크롤바를 아래로 드래그해서 콘텐츠 영역은 어떻게 디자인했는지 꼭 확인해 주세요. 

저는 개인적으로 버튼형 샘플이 가장 안정적이고 심플해 보여서 버튼형을 선택하고 시작해 보겠습니다. 좌측에서 버튼형을 선택한후 우측 상단에서 정보 수정 버튼을 클릭하면 아래와 같은 팝업창이 나타납니다.

홈페이지 필수정보와 검색설정, 로고를 등록할 수 있는 화면입니다.

관련 정보를 순서대로 빠짐없이 입력해 주세요. 아래 항목별로 부가 설명을 해 드립니다. 

 

· 홈페이지명 (15자이내) : 한글이나 영어 대문자* 주의 : g, j, q 같은 소문자는 아래 부분이 잘려 보입니다.

· 인터넷 주소 : 실시간 등록 불가능 여부 확인

· 웹마스터 도구 : 검색 노출 문구 입력

· 스크립트 복사 : 리디렉션 할 도메인에 소스 스크립트 붙여 넣기

· 대표 이미지 : 심볼 (Free Logo Maker) * 가장 큰 정원을 그렸을 때 잘리지 않도록 크기 조절

· 홈페이지설명홈페이지 설명(30자)

karmado.tistory.com/135

무료 로고 만들기 - Free Logo Maker(Squarespace)

이전 화면에 입력을 다 하셨으면 화면 아래쪽 노란색 바탕 영역에 '홈페이지 공개하기' 버튼이 있습니다. 나중에 서브페이지까지 전부 제작이 완료되면 이 버튼을 눌러서 검색에 노출되도록 바꿔 주어야 합니다. 혹시 까먹지 않도록 꼭 메모해 두시기 바랍니다. 정성스럽게 만들었는데 노출이 안되면 속상하지 않겠습니까? 

 

홈페이지 정보를 입력했으면 제목 오른쪽의 전화/톡톡 버튼을 클릭합니다. 아래 화면으로 전환되면 사무실 전화번호와 톡톡 사용을 선택해 줄 수 있습니다. 전부 완료했으면 '저장' 후 '닫기' 버튼을 누르십시오.

기본 편집 화면으로 돌아오면 홈페이지 정보 아래쪽에 홈 배경 이미지를 선택할 수 있는 버튼과 메인 컬러를 설정할 수 있는 버튼이 있습니다. 

이미지 올리기 버튼을 클릭하면 사진을 불러올 수 있는 팝업창이 나타납니다. 'PC 사진 추가'버튼을 눌러서 사진을 불러오면 좌측에 불러온 순서대로 섬네일이 나타납니다. 최대 4장까지 불러올 수 있으며 홈페이지 적용하면 여러 장의 이미지들이 전환되면서 보입니다. 주의해야 할 점은 PC 화면에도 보이기 때문에 가로 1920픽셀 이상되는 큰 사이즈의 이미지를 적용해 주셔야 합니다. 

아래 화면에서 큰 이미지의 초록색 박스는 실제 보이는 영역을 나타낸 것인데 박스 안쪽 영역을 드래그하면 박스를 이동할 수 있고 우측 하단의 화살표를 드래그하면 박스 영역 사이즈를 조절할 수 있습니다. 

사진을 불러오고 영역을 조절해 주었으면 이미지 등록을 클릭해서 완료해 주십시오. 홈 배경 이미지에 방금 등록한 이미지 섬네일 보일 것입니다. 오른쪽에 있는 '속도 설정' 메뉴를 클릭한 후 적당한 전환 효과 속도를 선택해 주십시오. 너무 빠르면 경박(?)스러워 보여서 저는 느리게 설정하는 것을 추천합니다. 

홈 배경 이미지 아래에서 '컬러 선택'을 누른 후 원하는 메인 색상을 선택해 줍니다. 

지금까지 작업한 내용이 반영된 부분은 아래 그림과 같습니다. 

*색상이 적용된 부분의 아이콘(전화, 오시는 길, 공유)은 아직 여러분들에게 보이지 않을 것입니다. 이 부분은 다음 강좌에서 설명드리겠습니다. 

다음 강좌에서 모바일 버전 나머지 부분을 완료하도록 하겠습니다. 

감사합니다.