워드프레스 홈페이지, 만든 다음이 진짜입니다

하나. 새로 만들지 말지는 디자인이 아니라 이 숫자가 정합니다

한 달에 「이것 좀 고쳐 주세요」가 몇 번 생기는지 먼저 세어 보십시오.

제품 사진 한 장 바꾸는 데 업체에 메일을 보내고 답을 기다리신다면, 그건 홈페이지가 낡아서가 아니라 홈페이지가 담당자 손에 안 들어와 있어서입니다. 디자인을 새로 해도 이 구조가 그대로면 반년 뒤에 같은 자리로 돌아옵니다.

그래서 이번에는 기준을 하나 두고 만들었습니다. 제품 300종을 처음 올리는 날이 성공이 아니라, 301번째 제품을 담당자가 혼자 올리는 날이 성공이라고 봤습니다.

둘. 사진에서 눌러 들어가게 만드는 것 — 문제는 그 연결을 누가 바꾸느냐입니다

부품이나 기계처럼 종류가 많은 제품은 목록만 늘어놓으면 손님이 못 찾습니다. 그래서 완성품 사진 한 장을 띄우고 부품 자리를 누르면 그 제품으로 들어가게 만듭니다. 가방이면 가방 사진에서 버클을 누르면 버클 제품이 나오는 식입니다.

여기까지는 어느 업체나 만들어 드립니다. 어려운 건 그다음입니다.

제품이 단종되거나 사진이 바뀌면 그 연결도 같이 바뀌어야 합니다. 보통은 이 연결이 담당자가 못 여는 곳에 적혀 있습니다. 그러면 부품 하나 바뀔 때마다 다시 업체를 불러야 합니다.

그래서 이 부분을 관리자 화면 안으로 옮겼습니다. 사진을 띄우고, 마우스로 영역을 끌어 네모를 그리고, 아래 목록에서 제품을 고르면 연결됩니다. 숫자나 좌표는 화면에 나오지 않습니다. 잘못 그렸으면 지우고 다시 그리면 됩니다.

셋. 제품 300종을 한 건씩 올리면 처음에도 비싸고 나중에도 비쌉니다

한 건씩 등록하는 화면만 있으면 초기 등록 비용이 크게 잡힙니다. 더 문제는 그 비용이 나중에 제품을 추가할 때도 똑같이 든다는 것입니다.

그래서 엑셀로 한 번에 올리는 기능을 넣었습니다. 양식을 내려받아 제품명·유형·코드·재질·규격·색상을 채우고 올리면 한 번에 등록됩니다. 유형 칸에 없던 이름을 적으면 그 분류가 자동으로 생깁니다. 사진은 먼저 올려 두시면 됩니다 — 엑셀에 적으신 파일명과 같은 사진을 제품마다 넣어 줍니다. 이미 있는 제품과 코드가 겹치면 덮어쓸지 건너뛸지 고르실 수 있습니다.

거래처에서 받은 제품 목록이 이미 엑셀로 있는 경우가 많습니다. 그 파일을 그대로 쓸 수 있게 만드는 것이 핵심이었습니다.

넷. 손님이 문의 버튼을 눌렀는데 아무 일도 일어나지 않습니다

제품을 여러 개 담아 한 번에 문의하는 기능을 만들고, 문의 버튼에 메일 보내기를 걸어 뒀습니다. 많은 홈페이지가 이렇게 되어 있습니다.

직접 눌러 봤더니 컴퓨터에 깔린 메일 프로그램이 떴습니다. 평소에 쓰지 않는 프로그램이었습니다.

이 방식은 손님 컴퓨터에 설정된 메일 프로그램을 여는 것입니다. 그래서 이런 일이 생깁니다.

• 네이버나 구글 메일만 쓰시는 분은 안 쓰는 창이 뜹니다.
• 메일 프로그램을 한 번도 설정한 적 없는 컴퓨터에서는 아무 일도 일어나지 않습니다.
• 회사 컴퓨터에서 막아 둔 경우에도 아무 일이 없습니다.

여기서 진짜 손해는 문의 한 건이 아닙니다. 손님은 「버튼이 고장났나」 하고 그냥 나가고, 받는 쪽은 그런 일이 있었다는 것조차 모릅니다. 방문자 수에는 들어왔다 나간 것으로만 남습니다. 해외 거래처는 웹메일을 쓰는 분이 더 많아서, 못 받고 지나가는 문의가 더 많습니다.

그래서 메일로 여는 방식을 버리고 입력 칸으로 바꿨습니다. 회사명·담당자·연락처와 담은 제품 목록이 관리자 화면에 문의 목록으로 남습니다. 알림 메일은 그다음에 갑니다. 알림이 스팸함에 들어가도 문의 자체는 남습니다.

지금 쓰고 계신 홈페이지의 문의 버튼을 한 번 눌러 보십시오. 메일 프로그램 설정 창이 뜬다면 손님 쪽에서도 같은 일이 일어나고 있습니다.

다섯. 화면이 색으로만 알려 주면, 쓰는 사람은 그걸 못 봅니다

관리자 화면에서 아직 제품을 안 고른 자리를 처음에는 빨간색으로만 구분해 뒀습니다. 실제로 만져 본 사람이 그 색을 못 보고 지나갔습니다.

화면에 네모가 열 개쯤 떠 있으면 색깔 차이는 정보가 아니라 배경이 됩니다. 눈이 나쁘거나 색을 구분하기 어려운 분만의 이야기가 아닙니다.

그래서 색, 테두리 모양, 글자 세 가지로 같이 알리도록 바꿨습니다. 빠뜨린 자리는 점선 네모로 바뀌고 「제품 없음」이라고 적힙니다.

검사하는 방법은 간단합니다. 그 화면을 흑백으로 인쇄해 보시고 상태를 알 수 있으면 됩니다. 매일 보실 화면이라면 견적 단계에서 한 번 물어보실 만합니다.

어디에 맡기시든, 견적 받으실 때 이 다섯 가지는 물어보세요

견적서만 봐서는 「만든 다음」이 값에 들어가 있는지 알기 어렵습니다. 어느 업체에 물어보셔도 되는 질문으로 다섯 개만 적습니다.

• 제품을 새로 올릴 때 저희가 직접 하나요, 연락드려야 하나요.
• 제품 300개를 엑셀로 한 번에 올릴 수 있나요.
• 사진에서 눌러 들어가는 연결을 나중에 저희가 직접 바꿀 수 있나요.
• 문의가 들어오면 어디에 남나요. 메일로만 오나요.
• 기능을 더할 때 추가 프로그램을 깔아서 하나요. 그러면 몇 개까지 늘어나나요.

다섯 번째만 조금 설명드리면, 워드프레스는 기능이 필요할 때마다 추가 프로그램을 붙여 해결하는 경우가 많습니다. 처음에는 빠르지만 개수가 늘수록 사이트가 느려지고, 하나가 업데이트되면서 다른 하나가 멈추는 일이 생깁니다. 워드프레스가 느리다는 말은 대개 워드프레스 자체보다 이쪽 이야기입니다.

이번에 만든 것은 다루는 자료가 제품·부품 유형·연결 세 가지뿐이라 추가 프로그램 없이 화면을 직접 만들었습니다.

이 다섯 가지에 답이 나오는 곳이면 어디든 괜찮습니다. 다만 답이 흐리면 「만든 다음」이 견적에 안 들어가 있을 가능성이 큽니다.

만들어 둔 것

이 기록에 나온 화면은 아래에서 직접 만져 보실 수 있습니다. 가방 사진에서 부품을 눌러 보시면 됩니다.

showroom.psyone.kr

실제 발주를 받아 만든 건이 아니라, 「만든 다음」을 어디까지 넘길 수 있는지 확인하려고 처음부터 끝까지 직접 만들어 본 것입니다. 제품 22종, 부품 유형 16종, 가방 위 연결 11개가 들어 있습니다.