글 목록에서 상세페이지로 이동하게 만들기

글의 이름과 주소 이름을 나눕니다

‘책상 아래 케이블을 정리하기 전에 확인할 세 가지’라는 제목을 그대로 주소에 넣을 필요는 없습니다. 관리자 화면의 제목에는 방문자가 읽을 한국어 문장을 쓰고, 주소 이름에는 cable-organizing 을 입력합니다. 그러면 글의 경로는 /posts/cable-organizing 이 됩니다. 앞부분의 도메인은 사이트를 가리키고 뒤의 경로는 그 사이트 안의 특정 글을 가리킵니다. 두 값을 구분하면 나중에 도메인을 연결할 때도 글마다 경로를 다시 만들 필요가 없습니다.

예제의 주소 이름은 영문 소문자와 숫자, 단어 사이의 하이픈으로 작성합니다. 띄어쓰기, 슬래시, 물음표를 넣지 않습니다. cable-organizing-2 처럼 숫자를 붙이는 것은 가능하지만, 주제를 알아보기 어려운 임시 번호를 계속 늘리면 글을 구분하기 힘듭니다. 같은 주제의 수정판이라면 새 주소를 만들기 전에 기존 글을 보완할 수 있는지 먼저 판단합니다. 날짜가 꼭 필요한 내용이 아니라면 주소에 오늘 날짜를 넣을 이유도 없습니다.

한 번 공개한 주소는 다른 사람이 저장하거나 다른 글에서 연결할 수 있습니다. 제목을 고치더라도 주소를 그대로 유지할 수 있으므로 두 값을 동시에 바꾸지 않아도 됩니다. 예제에는 이전 주소를 새 주소로 자동 이동시키는 기능이 없습니다. 이미 공유한 글의 슬러그를 바꾸면 예전 링크가 열리지 않을 수 있습니다. 주소를 바꿔야 한다면 기존 연결 위치를 확인하고 별도의 이동 처리를 추가한 뒤 적용해야 합니다.

같은 글의 주소를 세 곳에서 비교합니다

관리자의 주소 이름에 drawer-size를 입력하면 공개 주소는 /posts/drawer-size가 됩니다. 제목을 길게 바꾸더라도 주소 이름은 그대로 둘 수 있습니다. 글을 공개한 뒤 홈 카드와 직접 입력한 주소가 같은 글을 보여 주는지 보세요. 이후 수정본을 저장해도 마지막 공개본은 유지됩니다. 공개 중단을 누르면 공개 주소가 404로 바뀌고 홈 목록에서도 빠집니다.

시험할 글 한 편을 준비합니다

로컬 관리자에서 제목, 주소 이름, 카테고리, 요약과 본문을 입력합니다. 요약에는 ‘케이블 개수, 콘센트 위치, 책상 이동 여부를 먼저 확인하는 글’처럼 글을 열기 전에 알아둘 내용을 적습니다. 본문에는 각 확인 항목을 문단으로 나누어 넣습니다. 짧은 ‘테스트’ 한 단어만 넣으면 공개 전 기본 검사에서 막힐 수 있습니다. 실제 공개 여부와 무관하게 화면의 길이와 줄바꿈을 확인할 수 있는 내용을 준비합니다.

저장 버튼을 누르면 우선 초안으로 남습니다. 저장된 글 목록에서 해당 항목을 찾아 다시 열었을 때 제목과 본문이 유지되는지 확인합니다. 내용을 읽고 검수 완료로 바꾼 다음 지금 공개를 선택하면 로컬 공개 화면에서 확인할 수 있습니다. 이 단계에서 말하는 공개는 실행 중인 내 PC 화면의 상태입니다. 아직 인터넷에 배포하지 않았다면 외부 사람이 같은 주소로 읽을 수 있는 것은 아닙니다.

홈 화면을 새로 열면 글 제목과 요약이 나타납니다. 제목을 눌렀을 때 주소 표시줄이 /posts/cable-organizing 으로 끝나는지 봅니다. 이어서 상세페이지의 제목과 첫 문단을 관리자에 저장한 값과 비교합니다. 글이 여러 편이면 첫 번째 글만 누르지 말고 각 제목을 한 번씩 확인합니다. 카드가 모두 같은 주소를 가리키는 실수는 겉모양만 보아서는 알아채기 어렵습니다.

방문자가 실제로 이동하는 순서를 봅니다

처음 방문한 사람은 홈에서 글을 선택한 뒤 사이트 이름이나 메뉴를 눌러 다른 글로 이동합니다. 따라서 상세페이지가 열리는 것에 더해 돌아가는 경로도 있어야 합니다. 예제의 상단 사이트 이름을 눌러 홈으로 돌아가고, 카테고리를 선택해 관련 글만 보이는지 확인합니다. 브라우저 뒤로 가기만으로 이동할 수 있는 사이트보다 화면 안에서도 현재 위치와 이동 방법을 찾을 수 있어야 합니다.