첫째날 : 나모로 홈페이지 만들기

1) 나모로 홈페이지 제작에 들어가기에 앞서서..

나모는 정말 좋은 이지웍 에디터입니다. 한글로 문서를 만드는 것처럼 홈페이지를 만들 수가 있습니다. 지금부터 홈페이지를 만들고 싶으시다면 앞으로 진행되는 강좌를 꼭 따라하시기 바랍니다. 당연히 처음에는 지루할 수도 있지만 조금만 꾸준히 지켜보시면 홈페이지 만드는 제작의 기쁜맛에 빠져들게 될 것입니다. 또 그렇게 생각하시는 것만큼 어려운 것은 분명히 아닙니다. 첫장부터 서시히 읽어보시고 읽어보시면서 꼭 따라하시면 나모에 대해선 완벽하게 마스터 할 수가 있습니다. 그럼 첫날 강좌부터 시작해 볼까요?

 

2) 웹에디터의 필요성과 나모의 장점

인터넷 인구가 많아지고 정보에 대하 중요성이 높아짐에 따라 많은 사람들이 홈페이지를 갖고 싶어한다. 그렇지만 html의 복잡함을 먼저 접함에 따라 쉽게 포기를 한다. 그러나 이지웍 웹 에디터는 태그의 복잡함을 쉽게 워드에서와 같은 작접 환경으로 사용자가 쉽게 홈페이지를 작성하고 관리하게 하여 준다.

여기서는 국산이라는 이유를 먼저 내세우지 않아도 성능만으로도 최고의 에디터라고 생각하는 나모 웹에디터로 홈페이지를 만들고 관리하는 방법을 배운다.

(1) 한글과 익숙한 인터페이스

'아래아 한글' 같은 워드에 익숙해진 이들은 태그의 개념만 이해하면 금방 실전 홈페이지제작에 들어 갈 수 있을 정도로 쉬운 인터페이스를 자랑한다. 무엇보다 한글 웹에디터로 도움말의 친숙함은 단연 뛰어나다.

(2) 스타일 시트의 사용과 html 3.2 완벽지원

인터페이스 쉽게 적응하여 사용하다 보면 워드와 같은 기능으로 사용할 수 있는 스타일 시트의 유용함에 놀라게 된다. 웹에디터의 기본이라고 할 수 있다.

(3) 수정기능과 테이블,프레임 관련 편집기능

홈 페이지 제작시 수정작업할 일은 많아지게 된다. 나모는 이런 수정작업을 돌이킴 기능으로 전부 되돌릴 수 있을뿐만 아리나 직관적인 홈을 만들 수 있는 프레임 및 테이블 편집기능 역시 사용자가 원하는 프레임 형태를 고를 수 있게 할 뿐만 아니라 프레임 내에 세부적인 편집까지 쉬운 방법을 제시하고 있다.

(4) 이미지&사운드 등의 개체작업

개체 삽입이 쉬울 뿐 아니라 이미지나 사운드 삽입시 상태바에 편집 기능까지 제공하여 기본적으로 제공하는 클립아트와 더불어 홈페이지 제작시 그래픽과 관련한 부담을 덜어준다.

(5) 경제성 및 템플릿 등에 관한 일관성

툴박스의 효율적 화면 구성으로 여러 페이지 작업시 화면 전환이 타 에디터에 비해 월등하고 필요한 기능은 메뉴바에 전부 구현해 놓으므로써 작업 속도를 향상시킨다. 이와 더불어 기본적으로 제공하는 템플릿들로 간단한 홈을 제작하므로써 상위단계로 발전하는데 도움을 준다.

(6) 사후 관리 및 출판기능

홈페이지는 수시로 업데이트가 되어야 한다. 따라서 언제든지 보완하는 사후 관리가 할 수 있어야 하는데 프로트페이지에는 미치지 못하지만 사이트매니저의 출판기능과 링크 보완기능은 지속적 홈 관리에 도움을 준다.

 

3) 다양한 형식으로 홈페이지 문서 열기

지금부터 홈페이지를 만들어 보도록 하죠.

먼저 새로운 문서를 열으셔야겠죠. 파일 메뉴에 있는 새글을 눌러보세요. 그럼 열고자 하는 문서의 종류와 해당 문서에 들어갈 문서의 속성이 "문서","프레임셋","컴포넌트" 세가지 탭으로 구성되어 보여집니다.

"문서"에서는 새롭게 열고자 하는 문서의 형태를 결정하고 여는 것입니다. 해당 메뉴중 "보통"은 말그대로 아무런 형식이 없는 빈 문서를 새롭게 연다는 뜻이죠.

두 번째 "줄간격150%문서" 는 줄과 줄 간격을 150%으로 한 형식의 문서를 연다는 것입니다.

세 번째 "소제목과 본문" 을 클릭하여 열면 템플릿 형식으로 제목과 본문의 내용이 나모에서 정해진 임의의 문서로 열립니다. 우리는 여기에 알맞은 제목과 본문내용을 적기만 해도 구성되어진 형식에 의해 제목줄과 본문이 정리되게 되죠

네 번째 " 본문 오른쪽에 그림과 요약" 문서를 클릭하여 열면은 오른쪽에는 본문 내용이 보이고 옆에는 그림을 넣어서 설명할 수 있게 하는 문서가 열립니다.

나모에서는 이렇듯 일정 양식으로 다양하게 문서를 열어서 초기 작업을 편하게 할 수 있답니다. 여러분의 입맛대로 문서를 열어서 보시면 되겠죠.  그리고 이런 형태를 가진 문서를 먼저 열어놓은 문서에 "현재 문서에 삽입"을 체크하면 넣을 수도 있습니다.

다음장에는 새글의 두 번째 탭인 "프레임셋"으로 문서를 여는 예제에 대해서 공부 하겠습니다.

 

4) 프레임 셋으로 문서 열기

웹 서핑을 하다가 보면 하나의 웹페이지를 용도에 따라 나누어진 느낌을 들 게 하는 것이 있는데 이것은 프레임으로 나눈 것입니다. 나모에서는 처음에 새로운 문서를 열 때에도 다양한 프레임셋의 종류를 지원하여 열게할 수가 있습니다.

이번에는 다양한 "프레임셋"으로 문서를 열어 보겠습니다.

첫 번째 메뉴인 "배너와 차례"는 세 개의 프레임으로 문서를 나누고 위쪽 프레임에는 배너를 넣고 왼쪽 프레임에는 차례를 넣고 오른쪽 프레임에는 차례나 해당 문서의 설명을 넣을 수 있게 프레임을 나눈 것입니다.

두 번째 메뉴인 "배너와 머릿글"은 순서대로 위에서부터 세 개의 프레임으로 나누어 가장 위쪽 프레임에는 광고등 배너를 넣고 중간 프레임에는 문서의 제목에 해당하는 머릿글을 넣고 가장 아래의 프레임에는 문서의 본문을 적어 주게 하는 형식입니다.

세 번째 메뉴인 "차례"는 여러분이 웹서핑을 하시면서 가장 많이 본 프레임의 형태일 것입니다. 왼쪽과 오른쪽으로 프레임을 나누어 왼쪽에는 차례나 목차등을 지정하고 오른쪽 넓은 문서에는 해당 차례의 설명등이나 문서의 설명 내용을 적게 해주는 형식입니다.

나머지 메뉴들에 대해서도 위에서 설명한 것과 같은 형식들입니다. 해당 메뉴를 클릭하게 되면 오른쪽 미리보기에서 문서의 형태를 먼저 보여주게 되어있죠.

 

5) 새글중에서 컴포넌트

첫 번째 메뉴인 "드롭캡" 에서는 문서의 시작 글자를 크게 시작하는 문서를 열어줍니다.

두 번째 "드롭캡"에서는 돋움체의 형식으로 글자를 크게 시작하는 문서를 엽니다.

세 번째 "2단 편집"에서는 테두리가 보이지 않는 표 형식으로 문서를 세로로 2단으로 나누어진 형태로 문서를 열고 열어진 문서의 템플릿 형태에다 사용자가 편집만 새롭게 하면 됩니다.

네 번째 "3단편집 " 은 2단편집에서와 마찬가지로 표의 테두리가 보이지 않게 샘플문서를 세로3단으로 나누어서 엽니다.

다섯 번째 "참고문헌"은 우리가 레포트를 쓰고 제일 마지막에 참고문헌을 넣는 형식을 제목과 수평선으로 나누어서 열어주는 샘플문서입니다. 여기서도 사용자가 열어진 문서를 편집만 하면 되겠죠.

 여섯 번째 "4 라디오 단추폼"은 동그라미 안에 점으로써 체크를 하게 되는 것들을 웹페이지에서 많이 보셨죠. 그런 폼 형태로 문서를 열어줍니다.

나머지 메뉴들도 위에서 설명한 것과 같이 다양한 형식으로 된 샘플문서입니다. 여러분께서는 사용되고자 하는 형식으로 새글을 눌러서 원하는 형태를 지정하여 편집하여 사용하시면 됩니다.

다양한 효과를 주기 위해서 사용자가 직접 보통의 문서로 새글을 열어서 작업을 해야 가장 완벽하게 원하는 홈페이지를 만들 수 있겠죠.

 

6) 만들어진 홈페이지를 저장하기

새글을 열어서 여러분께서 편집을 하시던 직접 문서를 꾸미시던지 한 다음 문서를 다시 저장해야 겠죠. 워드에서와 마찬가지로 파일메뉴의 닫기를 누르면 저장할 것인가를 물어옵니다.

"다른 이름으로 저장"을 클릭하시면 여러분이 원하시는 위치와 파일명(확장자는 htm , html)으로 저장할 수가 있습니다. 그림파일들을 삽입하고 저장하게 되면 그림 파일 위치를 지정해야 하는 디렉토리 옵션이 보여지게 됩니다. 이럴 경우 여러분께서 불러와서 삽입한 그림의 위치와 나모에서 작업한 문서에 들어 있는 그림의 위치는 다를 수가 있습니다.  문서에 삽입된 그림 파일은 다시 웹 사이트로 올려야 합니다. 그러기 때문에 문서가 저장되는 디렉토리에 그림파일만 저장하는 폴더를 만들어 두시거나(예를 들어 "image"라는 이름은 그림파일만 모아 두는곳) 한폴더 안에 그림파일도 복사하는 옵션에 확인 버튼을 눌러서 최종적으로 저장해야 합니다. 그림이나 배경등의 이미지 삽입시 그림 복사라는 메뉴가 있는데 이것은 다른 폴더에 있는 그림을 여러분이 현재 작업하는 홈페이지공간으로 복사를 한다는 것을 뜻합니다. 그림 넣기에서 좀더 자세히 다루겠습니다.

많은 분들이 그림 파일의 디렉토리나 대,소문자 구별등을 정확하게 하지 않으셔서 만든 홈페이지 문서의 그림이 제대로 보이지 않는 경우가 많습니다. 여러분들은 주의깊에 디렉토리나 그림파일의 위치를 정확히 대소문자 구분하시고 경로를 지정하세요.

마지막으로 저장하는 방법은 해당 문서의 위쪽을 보면 문서가 여러개 열렸을 때 선택된 문서는 탭이 올라와 있죠. 이곳 문서의 제목이 적힌 탭이 있습니다. 이탭위에 마우스 오른쪽 버튼을 클릭하면 여러 가지 메뉴가 뜨는데 여기서도 저장과 닫기를 할 수가 있습니다.