|
웹사이트 구축과 관리를 위한 템플릿
Visio 2007는 웹사이트를 구축하고 관리하기 위한 템플릿을 제공하고 있습니다.
1. [파일]-[새로 만들기]-[시작] 메뉴를 이용하면 다양한 템플릿을 선택할 수 있습니다.
그 중 [네트워크] 또는 [소프트웨어 및 데이터 베이스] 범주에서 웹사이트 템플릿을 찾을 수 있습니다.
| 웹사이트 개념도 |
|
잘 구성된 웹 사이트를 만들려면 먼저 계획을 세워야 합니다. 계획을 수립하는 첫 번째 단계는 사이트의 목적, 콘텐츠, 전체 구성 등 전반적인 밑그림에 대해 브레인스토밍하기 위한 것입니다.
홈페이지, 웹사이트, 하이퍼링크로 연결된 문서 등의 개념도와 고급 아키텍처를 디자인할 수 있습니다. |
| 웹 사이트 맵 |
|
HTTP 서버, 네트워크 서버 및 로컬 하드 드라이브에서 웹 사이트의 사이트 맵을 생성합니다.
자동으로 사이트 주소의 링크 정보를 읽어와 트리구조로 맵을 생성하며, 깨진 링크 정보, 콘텐츠 정보등을 쉽게 파악할 수 있습니다. |
2. 아래 이미지는 Visioplus.com 사이트 기획 당시 [웹 사이트 개념도]를 이용하여 사이트를 기획한 결과물입니다. [웹 사이트 개념도]는 아래와 같이 웹 사이트의 콘텐츠, 메뉴 구분, 디렉터리 구분 등 관리자와 개발자 사이에 커뮤니케이션을 편리하게 하기 위해 사용합니다.
3. [웹 사이트 개념도]를 이용하는 방법은 순서도, 조직도 그리는 방법과 유사합니다.
웹사이트 개념도에서 제공하는 [웹 사이트 개념도 셰이프]를 이용하여 적절히 관계를 연결하면 됩니다. 이전 팁들을 통해 셰이프를 연결하고 활용하는 방법을 알아봤으므로, 이번 팁은 [웹사이트 맵]을 위주로 진행하겠습니다.
4. Visio 2007을 실행시키고 [템플릿 범주]에서 [소프트웨어 및 데이터베이스]를 선택하고 [웹 사이트 맵]을 클릭합니다.
5. 웹사이트 맵을 시작하면 다음과 같이 웹 주소를 넣을 수 있는 창이 나타납니다.
자주 들어오는 오피스튜터 사이트는 어떻게 관리되고 있는지 한번 확인해볼까요?
[주소] 입력란에 http://www.officetutor.co.kr 을 입력합니다.
|
[팁 속의 팁]
주소란 밑에 설명과 같이 확인하려는 사이트의 주소를 명확하게 넣어야 정확한 사이트 맵을 그릴 수 있습니다. 그 예로 보통 http://www.mcirosoft.com 을 입력하는 경우 자동으로 http://www.microsoft.com/default.asp로 연결된다면 default.asp 까지 주소란에 입력해주면 정확한 웹사이트 맵을 생성할 수 있습니다. |
6. 만일 사이트를 읽어올 때, 읽혀지는 사이트의 설정을 조정하고 싶다면, [설정] 메뉴를 클릭합니다.
1) [웹사이트 맵 설정]의 [레이아웃]탭에서 읽어오려는 링크의 최대 수와 링크 수준 (depth) 등을 조절할 수 있습니다.
[기본 셰이프 텍스트]는 사이트를 읽어서 그 사이트를 표시할 때 주소를 표시하도록 하거나 HTML 제목을 표시하면, 확인하기에 편리합니다.
지금은 기본 설정인 [상대 URL]을 선택합니다.
|
[팁 속의 팁]
최대 수준의 수나 최대 링크 수의 크기에 따라 사이트 맵을 그리는 시간이 늘어나게 되므로, 너무 큰 수를 넣지 않는 것이 좋습니다. |
2)[확장명],[프로토콜],[특성] 탭에서는 인식할 수 있는 웹 사이트의 형식, 종류를 구분하여 선택할 수 있습니다.
① [프로토콜] 탭
Visio 2007의 경우 HTTP, HTTPS, File, FTP, GOPHER, MailTo, NEWS, NNTP, PROSPERO, TELNET, WAIS 등의 프로토콜을 지원합니다.
② [특성] 탭
웹 사이트 맵은 HTML내의 하이퍼링크 값을 읽어서 표현하게 된다. 상황에 따라서 아래와 같은 HTML 태그 내부에 정의된 속성의 링크 값들은 표시하지 않도록 조절할 수 있다.
| 속성 |
HTML 요소 또는 태그 |
| ACTION |
<FROM> |
| BACKGROUND |
<BODY> |
| CODE |
<APPLET> |
| HREF |
<A>,<AREA>,<BASE>,<LINK> |
| SRC |
<BGSOUND>,<DYNSRC>,<EMBED>(Netscape 2), <FRAME>, <IFRAME>,<IMG>,<SCRIP> |
3) [고급] 탭에는 사이트 맵을 그리기 위한 영역을 설정합니다.
① 검색조건
다음 3가지 다른 방법 중 한 가지 검색 방법을 선택합니다.
I. 검색한 모든 파일 분석 : 조건 없이 모든 링크된 사이트를 검색합니다.
II. 지정한 도메인에 있는 파일 분석 : 입력 주소의 도메인 내부에 포함된 사이트를 검색합니다.
III. 지정한 디렉터리에 있는 파일 분석 : 입력 주소와 같은 폴더 내의 사이트를 검색합니다.
② HTTP 인증
만일, 웹 서버에 접근할 때에 암호 인증이 필요하다면, HTTP 인증란에 아이디와 패스워드를 입력합니다.
|
[팁 속의 팁]
입력된 암호는 생성된 사이트 맵 문서 내에만 기억되고, Visio 2007 프로그램에는 흔적을 남기지 않으므로, 걱정 없이 사용하셔도 됩니다. |
7. [설정] 메뉴의 모든 옵션을 기본 상태로 유지하기 위해 [웹 사이트 맵 설정] 창의 [취소] 버튼을 누르고 빠져나옵니다.
8. 마지막 단계로 웹 사이트 맵을 그리기 위해 [사이트 맵 생성] 창에서 [확인]을 클릭합니다.
9. 드디어 입력한 사이트의 웹사이트 맵이 그려졌습니다.
10. 각 아이콘이 무엇을 나타내는지는 [웹 사이트 맵 셰이프]의 셰이프를 확인하면 알 수 있습니다.
11. 대부분의 맵 셰이프 옆에는 아래와 같이 군인 마크와 같은 모양이 덧붙여져 있습니다.
이 표시는 이 사이트를 확장할 수 있다는 표시입니다.
12. 마우스 오른쪽 버튼을 클릭한 후 바로 가기 메뉴 중 [하이퍼링크 확장]을 선택하여 사이트의 링크 정보를 트리 구조로 확인할 수 있습니다.
13. [하이퍼링크 확장]메뉴를 클릭하면 모든 트리의 마지막에 선택한 셰이프의 복사본과 그와 링크된 사이트들이 추가로 표시됩니다.
14. 사이트 맵 중간에 아래와 같이 X 표시가 빨갛게 되어 있는 사이트도 있습니다.
이미지의 X 표시는 읽어온 콘텐츠에 연결된 하이퍼링크 주소가 정확하지 않을 경우 나타납니다. 웹 사이트에 잘못된 주소가 없는지 확인하는 것도 웹 사이트 맵을 그리는 가장 큰 이유 중 하나입니다.
15. 사이트 맵으로 그려진 구조가 너무 복잡하거나 콘텐츠가 너무 많을 경우, 그 종류에 따라 구분하여 볼 수 있도록 [필터 창]과 [목록 창]을 제공하고 있습니다.
각 창의 리스트 앞에 있는 체크박스의 선택을 해제하면 해당되는 페이지와 그와 연결된 하이퍼링크, 또는 해제된 종류의 콘텐츠는 사이트 맵에서 지워지게 됩니다.
16. 마지막으로 웹사이트 맵이 제공하는 또 하나의 멋진 기능인 [보고서]를 이용해 보도록 하겠습니다. [웹 사이트 맵]-[보고서]를 클릭합니다.
사이트 맵을 이용하여 깨진 링크, 등록된 콘텐츠, 사이트의 구조 등을 시각화하여 파악하기도 이 사이트 맵을 텍스트로 표시하여 엑셀 파일로 변환하여 모든 링크 정보를 표시하거나, 오류를 가진 링크 정보를 보고서로 출력할 수 있습니다.
17. [보고서] 리스트에서 웹 사이트 맵 링크(오류 포함)을 선택하여 보고서를 작성해 보겠습니다. [보고서] 창의 보고서 목록 중 [웹 사이트 맵 링크(오류 포함)]을 선택하고 [실행]을 클릭합니다.
18. [보고서 실행] 창의 [보고서 형식 선택] 목록 중에서 [Excel]을 선택하고 [확인]을 클릭합니다.
19. 오피스튜터 사이트는 1개의 링크가 깨져있고, 이 링크는 비트맵 파일과 연결된 링크입니다.
실전 응용
관리자님을 대신하여 제가 깨진 링크를 확장하여 어떤 비트맵 파일인지 확인해보겠습니다.
위에서 다룬 방법 중 사이트를 선택하여 마우스 오른쪽 메뉴를 보면 [하이퍼링크 확장]이 있었죠.
이 기능을 이용하여 깨진 사이트를 확장하였더니 아래와 같은 트리가 생성이 되었습니다.
자 이제 어떤 경로에 있는 그림인지 파악이 되시죠?
링크가 정상인 사이트는 하이퍼링크를 이용하여 그 콘텐츠를 확인할 수 있습니다.
| 
