전세계에있는 네트워크의 중간에있는 다른 문서로 연결되는 문서의 링크를 만드는 기능은 틀림없이 World Wide Web이 발명 된 가장 중요한 단일 이유입니다. 하이퍼 링크라고하는 이러한 링크는 HTML - 하이퍼 텍스트 마크 업 언어의 "H"입니다. 하이퍼 링크가 없으면 웹이별로 유용하지 않을 것입니다. 검색 엔진, 소셜 미디어 또는 배너 광고는 없을 것입니다. (확인, 대부분의 사람들이 해당 광고를 볼 수 있습니다.)
자신 만의 웹 페이지를 만들 때 하이퍼 링크를 만들고 싶어하며 KompoZer 에는 모든 유형의 링크를 쉽게 추가 할 수있는 도구가 있습니다. 이 자습서에 나와있는 샘플 페이지에는 다른 웹 사이트에 대한 링크가 네 가지 범주로 나뉘며 동일한 웹 페이지의 다른 부분으로 연결되고 전자 메일 메시지가 시작됩니다. 나는 각 카테고리에 대해 제목과 4 개의 H3 제목으로 시작하겠습니다. 다음 페이지에서 몇 가지 링크를 추가하겠습니다.
01 / 05
Kompozer로 하이퍼 링크 만들기
KompoZer 의 하이퍼 링크 도구는 도구 모음의 링크 버튼을 클릭하여 액세스 할 수 있습니다. 하이퍼 링크를 만들려면 :
- 하이퍼 링크를 표시 할 페이지에 커서를 놓습니다.
- 도구 모음에서 링크 단추를 클릭하십시오. 링크 등록 정보 대화 상자가 나타납니다.
- 입력해야하는 첫 번째 필드는 링크 텍스트 상자입니다. 하이퍼 링크 페이지에 표시 할 텍스트를 입력하십시오.
- 입력해야 할 두 번째 필드는 링크 위치 상자입니다. 사용자가 클릭 할 때 하이퍼 링크로 연결될 페이지의 URL 을 입력하십시오. 브라우저의 검색 주소창에서 URL을 복사하여 붙여 넣는 것이 좋습니다. 이런 식으로 실수를하는 경향이 훨씬 적습니다. 적어도 링크를 만들 때 페이지가 살아 있고 링크가 깨지지 않았 음을 알고 있습니다.
- 확인을 클릭하면 링크 속성 대화 상자가 닫힙니다. 귀하의 링크가 귀하의 페이지에 나타납니다.
대부분의 브라우저에서 하이퍼 링크는 기본적으로 파란색 밑줄이 그어진 텍스트로 나타납니다. KompoZer를 사용하여 하이퍼 링크에 자신 만의 스타일을 적용 할 수는 있지만 지금은 기본 하이퍼 링크를 사용합니다. 웹 브라우저에서 페이지를 미리보고 링크를 클릭하여 제대로 작동하는지 확인하는 것이 좋습니다.
02 of 02
KompoZer로 앵커 링크 만들기
클릭하면 동일한 웹 페이지의 다른 부분으로 연결되는 또 다른 종류의 하이퍼 링크가 있습니다. 이러한 종류의 하이퍼 링크를 앵커 링크라고하며 해당 링크를 클릭 할 때 찍은 페이지 영역을 앵커라고합니다. 웹 페이지 맨 아래에 "맨 처음으로"링크를 사용한 적이 있다면 앵커 링크를 클릭하는 것입니다.
KompoZer를 사용하면 툴바의 앵커 도구를 사용하여 연결할 수있는 앵커를 만들 수 있습니다.
- 앵커가 필요한 페이지 영역을 클릭하십시오. 즉, 앵커 링크를 클릭 할 때 페이지 뷰어를 가져 오게 할 위치입니다. 이 예에서는 즐겨 찾는 음악 헤더의 "F"직전에 클릭했습니다.
- 도구 모음에서 앵커 단추를 클릭하십시오. 명명 된 앵커 속성 대화 상자가 나타납니다.
- 페이지의 각 앵커에는 고유 한 이름이 필요합니다. 이 앵커에 대해서는 "음악"이라는 이름을 사용했습니다.
- 확인을 클릭하면보아야하고 앵커를 원한 지점에 앵커 기호가 나타납니다. 이 기호는 웹 페이지에 표시되지 않으며 KompoZer가 앵커의 위치를 알려줍니다.
- 사용자가 이동할 수있게하려는 페이지의 다른 영역에 대해서도 절차를 반복하십시오. 머리글이나 다른 논리 구분선으로 구분 된 많은 텍스트가 페이지에있는 경우 앵커는 페이지를 탐색하기 쉬운 방법입니다.
다음으로 독자가 만든 앵커에 대한 링크를 만듭니다.
03 of 05
KompoZer로 페이지 탐색 생성하기
페이지에 앵커가 생겼으므로 앵커에 대한 바로 가기로 사용할 링크를 만들어 봅시다. 이 자습서에서는 페이지의 맨 위 헤더 아래에 1 행 4 열 테이블을 작성했습니다. 각 표 셀에는 페이지의 링크를 구분하는 데 사용되는 범주 머리글 중 하나와 동일한 텍스트가 포함됩니다. 각 테이블 셀의 텍스트를 해당 앵커에 대한 링크로 만듭니다.
04 / 05
KompoZer로 앵커에 하이퍼 링크 만들기
앵커가 입력되고 페이지 네비게이션에 사용할 텍스트가 입력되었으므로 일반 텍스트 청크를 링크로 변환 할 수 있습니다. 링크 버튼을 다시 사용 하겠지만 이번에는 조금 다른 방식으로 작동합니다.
- 링크로 바꿀 텍스트를 선택하십시오. 이 예에서는 페이지 상단의 첫 번째 표 셀에있는 "즐겨 찾는 음악"텍스트를 선택했습니다.
- 도구 모음에서 링크 단추를 클릭하십시오. 링크 등록 정보 대화 상자가 열립니다.
- 이 경우 링크 단추를 클릭하기 전에 텍스트를 선택 했으므로 창 링크 텍스트 섹션은 이미 채워져 있으므로 편집 할 수 없습니다. 링크 위치 섹션에서 아래쪽 화살표를 클릭하십시오. 이전 단계에서 작성한 앵커 목록이 표시됩니다. 이 예제에서는 #music 앵커를 선택합니다.
- 확인을 클릭하십시오. 탐색 모음의 "즐겨 찾는 음악"텍스트는 링크를 클릭하면 뷰어가 페이지의 해당 섹션으로 이동하게합니다.
드롭 다운 메뉴의 각 앵커 이름 앞에 "#"기호가 있음을 알 수 있습니다. 이것은 HTML에서 앵커에 대한 링크를 만드는 방법입니다. 앵커 이름 앞에있는 "#"은 브라우저가이 링크를 통해 같은 페이지의 다른 위치로 이동 함을 알립니다.
05/05
KompoZer를 사용하여 이미지에서 하이퍼 링크 만들기
이미지뿐만 아니라 텍스트로도 링크를 만들 수 있다는 것을 알고 계셨습니까? KompoZer를 사용하면 몇 번의 클릭만으로이 작업을 수행 할 수 있습니다. 여기에 페이지의 아래쪽에 위쪽으로 향하는 화살표와 "TOP"라는 텍스트를 보여주는 작은 아이콘 이미지를 삽입했습니다. 이 이미지를 링크로 사용하여 페이지 상단으로 돌아갈 것입니다.
- 이미지를 마우스 오른쪽 버튼으로 클릭하고 컨텍스트 레이블에서 이미지 및 링크 속성을 선택합니다. 이미지 등록 정보 대화 상자가 열립니다.
- 위치 탭에서 이미지의 파일 이름과 축소판보기가 이미 채워져 있습니다. 대체 텍스트 상자에 텍스트를 입력해야합니다. 이미지 위에 마우스를 올리면 표시되는 내용과 시각 장애인이 웹 페이지를 읽을 때 화면 판독기에서 읽는 내용입니다.
- 링크 탭을 클릭하십시오. 앵커 링크처럼 메뉴에서 앵커를 선택할 수 있습니다. 사실이 이미지는 앵커 링크로 사용됩니다. #Links_Of_ 관심있는 앵커를 선택했습니다.
- 확인을 클릭하십시오. 클릭하면 이미지가 페이지 상단으로 다시 연결됩니다.