이제 웹 페이지에 다른 정렬로 일부 텍스트를 넣을 수 있습니다.

내 개인 페이지가 여기에 있습니다!

그들에게서 다음을 찾을 수 있습니다: - 나와 내 취미에 관한 이야기 - 내 사진.

내 페이지 중 하나에서 가능합니다
나에게 이메일을 보내주세요.

3. 웹 페이지 생성 도구

3.1 HTML 편집기

모든 사람은 웹 페이지를 만들기 위해 자신만의 도구를 선택합니다. 이는 MS FrontPage, Macromedia DreamWeaver, Allaire HomeSite 또는 1st Page일 수 있습니다. 그리고 누군가는 간단한 것을 사용합니다 텍스트 에디터, 예를 들어 메모장.

텍스트 편집기는 많은 단점이 있기 때문에 작은 페이지를 만드는 데만 사용할 수 있습니다. 프로젝트가 지원되지 않고 텍스트 "강조 표시"가 없으며 일반적으로 작업이 매우 불편합니다.

MS FrontPage의 가장 큰 단점은 매우 큰 HTML 코드(불필요한 내용이 너무 많음)를 생성하므로 페이지가 커져서 로딩 속도에 영향을 미친다는 것입니다. 또한 이 편집기에서 웹 페이지를 만들 때 한 가지를 볼 수 있지만 브라우저 창에서는 완전히 다른 것을 볼 수 있습니다. 페이지가 다소 비뚤어진 것으로 나타나므로 고품질 웹 페이지를 만들려면 아래에서 설명할 패키지를 사용하는 것이 좋습니다.

인기 있는 Macromedia DreamWeaver부터 시작하겠습니다. Macromedia는 웹 사이트 제작용 소프트웨어 생산의 선두주자이자 이 분야의 트렌드세터로 간주됩니다.

드림위버 3.0

그러나 DreamWeaver는 매우 깔끔한 HTML을 생성하기 때문에 다른 WYSIWYG 편집기보다 몇 단계 앞서 있습니다. DreamWeaver에서는 다음을 사용하여 페이지(예: 텍스트 레이아웃)를 만들 때 반복적인 작업을 제거할 수 있습니다. 옵션 "기록 명령 시퀀스"(생성한 명령의 순서를 기록한 다음 Ctrl+P 등을 누르면 DreamWeaver가 모든 명령을 동일한 순서로 재생합니다.

홈사이트 4.0

다음 편집기는 HomeSite 4입니다. 페이지를 수동으로 생성하는 데 사용됩니다. HTML 감정가를 위한 것입니다. HTML 코드를 완벽하게 제어할 수 있으며 널리 사용되는 세 가지 브라우저(MSIE, Google Phrome, Opera) 중 하나에 맞게 페이지를 최적화할 수 있습니다.

HomeSite에는 편집과 디자인이라는 두 가지 기본 모드가 있습니다. 디자인 모드는 HTML 코드를 생성하는 일종의 WYSIWYG 편집기로, 다른 사람의 HTML 코드를 로드하면 HomeSite가 모든 것을 자체 방식으로 다시 작성합니다.

다른 것 구별되는 특징 HomeSite는 Dreamweaver의 "접착제"입니다. HomeSite에는 "Dreamweaver" 버튼이 있으며 표준으로 포함되어 있습니다. 그러나 DreamWeaver에는 HTML 코드 편집을 위한 편집기로 HomeSite를 연결할 수도 있습니다.

최신 HTML 편집기 중 하나는 EVR Soft 1st Page v2입니다.

그의 슬로건은 "최고의 웹사이트를 만들어라!"입니다. ("훌륭한 웹사이트를 구축하세요!"). 편집기에는 일반, 쉬움, 고급/전문가 및 하드코어 등 여러 가지 모드가 포함되어 있습니다. 즉, 레벨을 선택하고 최종적으로 더 높은 레벨로 이동할 수 있습니다. 또 다른 기능은 JavaScript 및 DHTML로 된 상당히 큰 스크립트 모음입니다. 이 모든 것은 매우 편리하게 범주로 나뉩니다.

3.2 그래픽 편집기

그래픽을 만들고 최적화하는 것은 복잡하고 변덕스러운 작업입니다. 물론, 그래픽을 사용하지 않고 글꼴, 스크립트, 스타일 시트(CSS)를 사용하여 웹 페이지를 만드는 것이 가능하며 아름답고 스타일리쉬할 것입니다. 그러나 문서의 최종 모양은 브라우저 창의 너비, 사전 설정브라우저, 기본 글꼴 크기, 이름 및 색상. 또한 모든 스크립트와 스타일이 모든 브라우저에서 지원되는 것은 아닙니다. 그래픽을 사용하는 경우 귀하의 페이지 방문자는 귀하가 만든 것과 똑같은 그래픽을 보고 보게 됩니다.

웹 그래픽 작업의 가장 큰 어려움은 처리량대부분의 경우 인터넷 채널은 매우 낮으며 그래픽 파일의 크기를 작게 만드는 방법과 같은 문제에 즉시 직면하게 됩니다. 양질, 최적화할 때 사용할 프로그램과 기술.

이것이 바로 벡터 및 래스터 그래픽 편집기에 관한 섹션입니다. 강력한 도구유능한 손에서 이미지 처리.

벡터 및 래스터 그래픽 편집기를 고려하기 전에 이미지의 벡터 표현과 래스터 표현의 차이점을 이해해야 합니다.

래스터 그래픽그리드(래스터)이며 셀을 픽셀이라고 합니다. 래스터 이미지의 각 픽셀은 위치와 색상이 엄격하게 정의되어 있으므로 모든 객체는 프로그램에서 색상 픽셀 집합으로 표시됩니다. 이는 사용자가 래스터 이미지로 작업할 때 특정 개체에 대해 작업하는 것이 아니라 해당 개체를 구성하는 픽셀 그룹에 대해 작업한다는 의미입니다.

래스터 이미지는 매우 정확한 색상 및 색조 그라데이션과 높은 이미지 세부 묘사를 제공하므로 스캔한 사진과 같은 톤온톤 이미지를 표현하는 최적의 수단입니다.

이미지용 래스터 그래픽항상 고정된 수의 픽셀이 사용됩니다. 래스터 이미지의 품질은 장비의 해상도에 직접적으로 좌우됩니다. 이는 이미지의 모든 변화(회전, 확대 등)로 인해 이미지가 지속적으로 왜곡되고 객체의 경계가 고르지 않음을 의미합니다.

벡터 이미지벡터라고 불리는 수학적으로 기술된 도형을 기반으로 형성되며, 이미지의 모양은 벡터의 매개변수에 의해 결정됩니다. 즉, 벡터 그래픽은 좌표, 색상 및 기타 매개변수가 있는 곡선과 특정 색상으로 채워진 닫힌 영역으로 구성됩니다. 이 영역의 경계는 곡선으로도 설명됩니다. 벡터 이미지 파일에는 곡선의 좌표와 매개변수가 포함되어 있습니다.

벡터 이미지 처리 결과는 장비의 해상도에 의존하지 않으므로 매개변수(크기, 색상, 모양 등)를 임의로 변경할 수 있으며 품질이 저하되지 않습니다. 벡터 그래픽은 작은 포인트 크기(글꼴 크기)를 사용하여 디지털 개체를 만들거나 선명한 윤곽선과 무제한 확장성이 필요한 로고와 같은 개체를 만들 때 사용됩니다.

그래픽 패키지(편집기)도 래스터와 벡터의 두 가지 유형으로 나뉩니다. 이제 가장 인기있는 것을 살펴 보겠습니다.

A) 래스터 그래픽 편집기

Microsoft 그림판은 표준으로 포함된 간단한(더 잘 말하면 가장 단순한) 편집기입니다. 운영체제마이크로소프트. 간단한 그림을 만들 수 있는 간단한 기능(브러시, 연필, 지우개 등) 세트가 있습니다. 안타깝게도 그래픽 처리에는 사실상 적합하지 않습니다. 오른쪽에 보이는 그림이 이 편집자가 할 수 있는 최대치입니다.

어도비 포토샵- 오늘날 이는 전문 래스터 그래픽 처리를 위한 가장 강력한 패키지입니다. 이는 래스터 이미지를 수정할 수 있는 수많은 가능성이 있고 다양한 필터와 효과가 있으며 독립 제조업체의 도구를 연결할 수 있는 전체 복합체입니다.

예를 들어, 이 패키지는 손상된 이미지 복원, 사진 수정, 우리의 상상력이 상상할 수 있는 가장 환상적인 콜라주 생성을 위한 도구를 제공합니다. 전반적으로 이 패키지의 잠재력은 정말 엄청납니다. 버전 5.5부터 패키지에 프로그램이 포함되어 있습니다. 어도비 이미지레디, 웹용 그래픽 처리에 엄청난 기회를 제공합니다(이미지 최적화, 애니메이션 gif, 사진을 더 작은 사진으로 "자르기" 등). Adobe Photoshop 개발자의 모토인 "마음의 카메라"는 기술적인 우수성뿐만 아니라 이 프로그램을 사용하는 사람이 단순히 운명에 처하게 되는 완전한 창의성의 자유를 의미합니다.

포토페인트- Adobe Photoshop과 경쟁하는 래스터 그래픽 처리를 위한 또 다른 잘 알려진 그래픽 편집기(Corel Draw 패키지). 또한 그래픽 처리, 다양한 필터, 텍스처에 필요한 모든 도구가 있습니다. 유일한 차이점은 사용 용이성, 인터페이스 및 필터 적용 속도입니다. 응용 프로그램이 약간 느립니다.

화가- 편집기는 흑연, 분필, 오일 등 실제 그리기 도구를 에뮬레이트할 수 있는 훌륭한 기회를 제공합니다. 또한 재료의 표면 질감을 모방하고 페인팅하고 애니메이션을 만들 수도 있습니다. 개발에 매우 ​​편리함 배경 이미지또는 그림 스타일의 웹 페이지. 이 프로그램을 사용하면 실제 예술가가 된 듯한 느낌을 받을 수 있습니다.

편집자도 여럿 있습니다( 마이크로소프트 사진 편집기, 마이크로소프트 PhotoDRAW) 또한 가장 간단한 작업의 구현을 허용하지만 전문가의 요구를 충족시키지는 못합니다.

B) 벡터 그래픽 편집기

어도비 일러스트레이터 - 이 패키지를 사용하면 벡터 그래픽을 생성, 처리 및 편집할 수 있습니다. 전력면에서는 동급이다

래스터 편집기 Adobe Photoshop: 유사한 인터페이스가 있고 다양한 필터와 효과를 연결할 수 있으며 다양한 그래픽 형식을 이해합니다. cdr(Corel Draw) 및. swf(플래시).

코렐 드로우-물론 이러한 잘 알려진 그래픽 패키지는 벡터 그래픽 처리 도구 없이는 할 수 없습니다. 패키지는 거의 다음과 같이 강력합니다. 그래픽 편집자어도비 포토샵과 어도비 일러스트레이터. 벡터 그래픽 처리 외에도 이 패키지에는 래스터 그래픽 프로세서(Photo Paint), 이미지 추적기, 글꼴 편집기, 텍스처 준비 및 바코드 생성은 물론 대규모 이미지 컬렉션(CorelGallery)이 포함되어 있습니다.

어도비 합리화- 래스터 그래픽을 벡터 그래픽으로 추적(변환)하기 위해 설계된 또 다른 Adobe 제품입니다. 작지만 매우 유용하고 강력한 제품입니다. Flash 기술과 같은 벡터 그래픽을 사용하여 웹 페이지를 만드는 경우 특히 유용합니다.

4. 웹사이트 제작 CMS 도움말줌라 1.5.7

단순한 것에서 복잡한 것까지의 원칙에 따라 우리는 정적 WWW 페이지에서 동적 페이지로 원활하게 이동합니다. 이를 위해서는 웹 언어인 PHP, Jscript, Perl에 대한 지식이 필요합니다. jQuery그리고 적어도 구조화된 쿼리 언어인 MySQL이 필요합니다. 괜찮아요, 몇 년만 지나면 페이지가 즉석에서 생성되고 포럼 클라이언트, 로그인, 비밀번호, 식별, 인증, 연결 애니메이션에 대한 데이터베이스가 있는 다기능 사이트를 만들 수 있는 전문가가 됩니다. 그리고 훨씬 더.

그러나 역동적인 다기능 웹사이트를 만들기 위해 모든 언어에 대한 지식을 가질 필요는 없습니다. HTML, SCC, PHP, 3Ds Max, Photoshop, SMC Joomla에 대한 지식이 충분했습니다.

Joomla는 MySQL 데이터베이스를 저장소로 사용하여 PHP와 JavaScript로 작성된 콘텐츠 관리 시스템입니다. GNU GPL 라이센스에 따라 배포되는 무료 소프트웨어입니다.

주요 특징:

1. 추가 모듈(확장, 플러그인)을 사용하여 기능을 확장할 수 있습니다.

2. 사용자 및 관리자의 다단계 인증을 위한 보안모듈입니다.

3. 템플릿 시스템을 사용하면 사이트의 모양을 쉽게 변경할 수 있습니다.

4. 왼쪽, 오른쪽 및 중앙 메뉴 블록을 포함한 사용자 정의 가능한 모듈 레이아웃.

5. 시스템의 장점은 모든 모듈, 구성요소, 플러그인, 템플릿을 직접 작성할 수 있고 구조화된 확장 디렉토리에 배치하거나 재량에 따라 기존 확장을 편집할 수 있다는 사실을 포함합니다.

인터넷의 호스팅 서버에서 Joomla로 작업할 수 있습니다( 추가 비용, 그리고 인터넷 속도에 따라 많은 것이 달라집니다). 저는 로컬 서버에서 작업하는 것을 선호합니다. 이를 위해 127.0.0.1 포트 80에서 Apache/2.2.4 (Win32) mod_ssl/2.2.4 OpenSSL/0.9.8d PHP/5.2.4 서버를 선택했습니다.

그래서 설치한 로컬 서버. localhost/home/www/ 디렉토리에서 Joomla 자체를 배치할 폴더를 만듭니다. PHP5.3.1에서는 Joomla가 제대로 작동하지 않는다는 점을 알려드립니다. FireBoard 및 Kunena 포럼의 구성 요소는 사이트에서 지속적으로 오류를 생성하므로 편집해야 합니다. PHP 파일. ini를 실행하고 오류 메시지를 비활성화합니다. 작업 자체가 사이트에 예상치 못한 상황을 약속하기 때문입니다. 이러한 이유로 저는 모든 플러그인, 모듈 및 구성 요소에 대해 안정적인 작업을 제공하는 PHP 버전 5.2.4를 선택하는 것을 권장합니다. 후에 줌라 설치브라우저를 사용하여 MySQL에서 관리자를 생성하고 해당 사용자의 로그인 및 비밀번호를 사용하여 관리자 패널로 이동합니다. 다음으로 사이트에 대한 템플릿을 선택해야 합니다. 언뜻 보기에는 매우 쉬운 것처럼 보이지만 더 깊이 파고들면 이 템플릿을 현대화하는 데 80%의 시간이 소요된다는 것을 확신하게 될 것입니다. 따라서 표시할 모듈을 잊지 말고 귀하의 요구에 가장 적합한 템플릿을 선택하는 것이 좋습니다. 다음으로 등록, 포럼, 슬라이드 쇼, 배너, 레이싱용 파일, 온라인 비디오, 오디오, 편집, 표시된 모든 페이지 등 사이트의 모든 기능을 연결합니다. 우리는 주로 Index 파일을 사용하여 작업합니다. PHP와 템플릿. CSS를 사용하고 물론 우리는 연결된 모든 확장 프로그램을 직접 구성합니다. 그 중 Joomla용 확장 프로그램은 약 6000개입니다. 다음은 가장 중요한 부분인 웹사이트 디자인입니다. 래스터 사용 포토샵 프로그램및 3Ds Max(모든 기능을 갖춘 전문가용 소프트웨어 시스템 Autodesk에서 개발한 3차원 그래픽과 애니메이션을 만들고 편집하기 위해 아티스트와 멀티미디어 전문가를 위한 가장 현대적인 도구가 포함되어 있습니다) 우리는 템플릿 디자인을 만듭니다. 헤더를 편집하고 원하는 대로 보이게 만드세요.

결론

웹 프로그래밍의 급속한 발전과 다양한 CMS의 생성으로 인해 웹 디자이너의 작업이 더욱 쉬워졌습니다. 이제 다기능의 강력한 동적 웹 포털을 만들려면 여러 프로그래밍 언어(확장 및 스크립트를 추가하는 경우)를 마스터하고 그래픽 및 래스터 프로그램에 능숙하며 약간의 영감, 혁신 및 기술을 갖추는 것으로 충분합니다.

문학

1. Kotorev D.V., Kostarev A.F. "PHP 5 이상 완전한 가이드원본에서." 피터스버그 2005

2. A. Goncharov "HTML 자기 교사".

3. A. Matrosov, A. Sergeev, M. Chaunin “원본의 HTML 4.0”

4. 아이작스 S. "동적 HTML"

5. Bayens J. “웹 프로그래밍 장치”

6. 부르소프 M.V. "Dreamweaver HTML 편집기 작업의 기본 사항. 교육 매뉴얼"

7. Velikhov V. "HTML 4.0 핸드북"

HTML웹페이지의 구조를 기술하는 언어이다. 해당 도움말을 통해 생성된 페이지는 사용자의 컴퓨터에 설치된 특수 프로그램(브라우저)을 통해서만 볼 수 있습니다.

• HTML의 약어는 다음을 의미합니다. 시간야퍼 티내선 중아크업 엘 anguage(하이퍼텍스트 마크업 언어).
• 프로그래밍 언어가 아니라 마크업 언어라는 점을 기억하세요.
• HTML 사용 태그웹 페이지의 구조를 설명하는 마크업입니다.

태그

HTML 태그는 꺾쇠 괄호로 묶인 키워드 또는 문자입니다. ,

,

등. 태그에는 두 가지 유형이 있습니다. 더블스그리고 하나의(빈 상태라고도 함) 쌍을 이루는 태그는 여는 태그와 닫는 태그로 구성됩니다(예: ). 꺾쇠 괄호 뒤의 "/"는 태그가 닫는 태그임을 나타냅니다. 단일 태그는 여는 태그로만 구성됩니다. 예를 들면 다음과 같습니다.
. 태그는 대소문자를 구분하지 않으므로 대문자나 소문자로 작성할 수 있습니다.

와 같은 의미

태그는 HTML 요소가 시작되고 끝나는 위치를 정의합니다.

태그를 사용하면 브라우저는 텍스트의 구조와 의미를 인식합니다. 예를 들어 텍스트의 어느 부분이 제목인지, 새 단락이 시작되는 위치, 강조해야 할 부분, 이미지를 배치할 위치(그림) 등을 브라우저에 알려줍니다. ). 브라우저가 이 정보를 받으면 이러한 각 요소를 표시하는 방법에 대한 기본 규칙을 사용합니다.

참고: HTML 참조에서 관심 있는 태그의 기본 스타일을 볼 수 있습니다.

사용하지 않고 HTML 태그브라우저는 들여쓰기, 제목, 단락 등 없이 연속적인 텍스트 스트림을 표시합니다. 더 명확하게 설명하기 위해 예제를 사용하여 이를 더 자세히 살펴보겠습니다.

마크업 태그를 사용하는 페이지는 다음과 같습니다.

우리 카페의 음료

여러 과일 - 100 문지름.

오렌지와 파인애플 주스를 함유한 과일 음료입니다.

밀크쉐이크 - 150 문지름.

과일 과육이 섞인 크림 아이스크림.

동일하지만 태그를 사용하지 않습니다.

Multifruit 카페의 음료 - 100 문지름. 오렌지와 파인애플 주스를 함유한 과일 음료입니다. 밀크쉐이크 - 150 문지름. 과일 과육이 섞인 크림 아이스크림.

3. 하이퍼텍스트 언어 HTML

하이퍼텍스트는 단어로 시작하고 단어로 끝나야 합니다. 꺾쇠 괄호 안의 단어는 HTML에서는 태그라고 하고 프로그래밍에서는 설명자라고 합니다. 거의 모든 HTML 태그는 and, and 등으로 쌍을 이룹니다.

쌍을 이루는 태그는 "제목", "본문" 등 특정 하이퍼텍스트 조각을 강조 표시합니다. 첫 번째 태그는 조각을 시작하고 두 번째 태그는 조각을 완성합니다. 닫는 설명자는 이름 앞에 분수 기호 / 를 붙입니다.

일반 구조 HTML 언어로 작성된 하이퍼텍스트:

하이퍼텍스트::= 제목 본문

제목::= 제목

제목::= 제목

본문::= 텍스트

HTML 규칙에 따르면 하이퍼텍스트에는 "제목"과 "본문"이 있어야 합니다. 출판물로서 하이퍼텍스트는 저자와 저작권 보유자(사이트)에 대한 정보를 포함할 수 있고 포함해야 합니다.

하이퍼텍스트의 제목에는 "제목"이 포함되어야 하며, 이는 브라우저에 의해 컴퓨터 화면의 맨 윗줄에 표시됩니다. 제목은 출판물(페이지)의 주요 아이디어를 표현해야 합니다. 제목 없는 하이퍼텍스트는 제목 없는 기사와 같습니다.

하이퍼텍스트의 "본문"에는 텍스트, 표, 사진 및 그림이 포함되어야 합니다. 전자 하이퍼텍스트와 일반 종이 텍스트의 차이점은 하이퍼링크가 포함되어 있다는 점입니다. 클릭하면 새 하이퍼텍스트가 다운로드됩니다.

하이퍼텍스트의 예와 브라우저가 컴퓨터 화면에 표시한 결과:

하이퍼텍스트: 결과:

브라우저의 결과는 브라우저 창에 지정된 주소의 웹사이트에 저장된 하이퍼텍스트를 로드하고 표시하는 것입니다. 하이퍼텍스트가 너무 크면 브라우저는 화면 오른쪽이나 아래쪽에 하이퍼텍스트 드래그 버튼을 표시합니다.

컴퓨터 화면의 크기 범위는 다음과 같습니다. 최소 화면 크기는 640 x 480 픽셀입니다. 추가 표준 화면 크기는 800 x 600, 1024 x 768 및 1280 x 1024 픽셀입니다. 따라서 하이퍼텍스트는 화면에 따라 다르게 보일 수 있습니다.

하이퍼텍스트의 일반적인 구조와 컴퓨터 화면에 표시되는 내용:

하이퍼텍스트: 결과:

텍스트 부분은 제목이 있거나 없는 줄과 단락, 목록, 표, 메뉴로 구성될 수 있습니다.

본문::- 텍스트

텍스트::= 제목( 텍스트 ) |

목록(텍스트) |

테이블(텍스트) |

하이퍼텍스트의 제목은 다음과 같은 형식으로 지정됩니다.

제목::=

이름

제목::=

이름

제목::=

이름

여기서 H2, ..., h6 태그는 본문과 관련된 제목의 크기를 설정합니다.

하이퍼텍스트의 단락은 설명자로 시작됩니다.

하이퍼텍스트 |

이동 새 줄단락은 설명자로 표시됩니다. . p> 단락의 끝은 선택 사항이지만 단락 설명자에서 매개 변수를 사용할 때는 필수입니다.

단락의 주요 매개 변수는 정렬 - 컴퓨터 화면의 텍스트 정렬입니다. 텍스트 정렬은 컴퓨터 화면 크기에 따라 브라우저에서 자동으로 수행됩니다.

align=center - 화면 중앙에 위치:

align=왼쪽-왼쪽 가장자리로;

align=right - 오른쪽 가장자리로;

align=justify - 전체 화면.

단락을 정렬하려면 단일 공통 스타일을 선택하고 사이트의 모든 하이퍼텍스트에 적용해야 합니다.

하이퍼텍스트 디자인을 위해 HTML 마크업 언어에는 다양한 글꼴, 스타일 및 리소스가 있습니다. 가장 간단한 디자인 방법은 웹 사이트 독자의 관심을 텍스트의 개별 부분으로 끌기 위해 단어를 강조하는 것입니다.

다음 태그를 사용하면 굵게 또는 밑줄을 사용하여 하이퍼텍스트의 단어를 강조할 수 있습니다.

큰 기호

볼드체

이탤릭체 i>

밑줄을 긋다

건너뛰기

작은 문자

하이퍼텍스트의 글꼴 강조 표시는 태그로 지정됩니다. :fonts::=텍스트 글꼴>

글꼴 매개변수 - 크기 및 유형. 글꼴 크기는 매개변수 size = size로 지정됩니다.

크기는 +1, +2 증가 또는 -1, - 2 감소 형태로 1에서 6까지 명시적으로 표시됩니다.

글꼴 유형은 매개변수로 지정됩니다.

얼굴 = 글꼴

여기서 글꼴은 "Times", "Courier" 등의 표준 글꼴 중 하나입니다.

글꼴 색상은 co1og = color 매개변수로 지정됩니다. 여기서 color는 선택한 하이퍼텍스트 조각의 색상입니다. 예를 들어 텍스트를 빨간색으로 강조표시하면 다음과 같습니다.

텍스트 글꼴 >

HTML 언어의 표준 색상 이름:

빨간색 - 빨간색, 녹색 - 녹색, 파란색 - 파란색, 검정색 - 검정색,

흰색 - 흰색, 금색 - 황금색, 노란색 - 노란색 등

하이퍼텍스트 디자인은 전문 출판사에서 출판된 좋은 책이나 잡지, 혹은 전문적으로 디자인한 다른 사람의 책을 모델로 삼는 것이 가장 좋습니다. 전자책, 신문 또는 인터넷 웹사이트.

통일된 디자인 스타일은 책, 잡지, 웹사이트의 모든 출판물의 중요한 속성입니다. 앞으로는 사이트 생성 및 유지 관리 전체 기간 동안 허용되는 표준과 디자인 스타일을 준수하는 것이 가장 좋습니다.

하이퍼텍스트 조각은 동일한 사이트나 여러 사이트 또는 여러 서버에 있을 수 있습니다. 외부 하이퍼링크는 사이트, 서버 또는 인터넷에 있는 해당 파일의 이름을 나타냅니다.

외부 하이퍼링크의 일반적인 형태는 다음과 같습니다.

여기서 "주소"는 사이트 내 또는 다른 인터넷 서버에 있는 하이퍼텍스트의 주소입니다.

외부 하이퍼링크의 예:

a) 인터넷 웹사이트 주소:

http://bak2.nagod.gu

b) 웹사이트의 페이지 주소:

http: // bak2.nagod.gu / inrogl.html.

c) 사이트 폴더의 페이지 주소

http://bak2.nagod.gu/tests/test2.html.

테스트 2a>

하이퍼링크 장치를 사용하여 사이트의 모든 그림, 사진 및 기타 그래픽 일러스트레이션의 배치가 구성됩니다. 이를 위해 그래픽 일러스트레이션이 포함된 모든 파일이 사이트에 미리 기록되어 있습니다.

그래픽 파일은 일반적으로 웹사이트와 이미지라는 별도의 폴더에 배치됩니다. 사용자 컴퓨터 화면에 그림을 로드하는 작업은 운영자의 도움을 받아 브라우저에서 수행됩니다. :

그래픽 일러스트레이션을 로드하기 위한 연산자의 일반적인 형식:

컴퓨터 화면의 그림 위치는 정렬 매개변수에 의해 결정됩니다. align=왼쪽 - 왼쪽 가장자리를 따라, align=오른쪽 - 화면 오른쪽 가장자리를 따라. 그러면 텍스트가 오른쪽 그림 주위로 흐르거나 보이지 않게 됩니다.

그림은 화면의 상단 또는 하단 가장자리에 누를 수 있으며 매개변수에 의해 설정됩니다: align =top - 상단 가장자리, align=bottom - 화면 하단 가장자리 또는 화면 중앙에 정렬 - 정렬 = 중간.

컴퓨터 화면에 그림의 위치를 ​​지정하려면 로딩 문에서 그림의 너비와 높이를 지정할 수 있습니다.

높이:= 높이= "높이"

너비:= 너비= "길이"

그림의 크기는 화면 픽셀 수(픽셀 단위) 또는 컴퓨터 화면 높이나 너비의 백분율로 지정됩니다. 후자의 경우 그림은 화면마다 크기가 다릅니다. 최소 화면 크기에 대한 그림 배치를 계산하면 다른 크기의 화면에서도 그림 배치를 확인할 수 있습니다.

그림의 크기는 일반적으로 최소 크기의 컴퓨터 화면에서도 전체적으로 볼 수 있도록 선택됩니다. 컴퓨터 크레인이 더 크면 그림은 그 일부만 차지합니다.

하이퍼텍스트 목록은 목록 요소에 번호를 매기거나 강조 표시한 목록입니다. 모든 요소는 태그로 시작됩니다.

하이퍼텍스트 마크업은 화면의 어느 위치, 텍스트가 표시되어야 하는지, 하이퍼텍스트 데이터베이스를 구성하는 텍스트가 서로 어떻게 관련되어 있는지를 나타내는 데 사용됩니다. 이러한 목적을 위해 특수 제어 문자가 텍스트에 입력됩니다. 제어 문자가 포함된 텍스트는 ASCII 코드로 일반 텍스트 파일에 저장되며 거의 모든 텍스트 편집기에서 처리할 수 있습니다.

하이퍼텍스트 마크업 언어 HTML은 1989년 Tim Berners-Lee에 의해 제안되었습니다. 창작 당시에는 HTML 생성 HTML의 기반으로 채택된 인쇄 문서용 마크업 언어 표준인 SGML(Standard Generalized Markup Language)이 있었습니다. 그러한 솔루션은 기존 소프트웨어를 사용하여 새로운 언어를 해석하는 데 도움이 될 것이라고 가정했습니다.

HTML용 하이퍼텍스트 데이터베이스의 요소로 일반 텍스트 파일이 선택되었습니다. 파일 시스템컴퓨터 작동 환경.

따라서 WWW 개념의 하이퍼텍스트 데이터베이스는 다음을 정의하는 HTML로 작성된 텍스트 파일 세트입니다.

정보 제시 양식(마크업)

파일 간 파일 연결 구조(하이퍼텍스트 링크). 이 접근 방식은 구성 요소가 하나 더 있다고 가정합니다.

기술 - 언어 통역사. WWW에서 인터프리터의 기능은 하이퍼텍스트 데이터베이스 서버와 사용자 인터페이스로 나누어집니다. 서버는 문서에 액세스하고 하이퍼텍스트 링크를 처리하는 것 외에도 문서의 전처리 처리를 수행하는 동시에 사용자 인터페이스는 정보 표시와 관련된 언어 구성을 해석합니다.

1990년 HTML 0의 제로 버전이 나타났습니다.

첫 번째 버전(HTML 1.0)은 언어 자체를 표현하는 것을 목표로 했으며, 그 기능에 대한 설명은 본질적으로 다소 권고적이었습니다.

예측은 모든 일의 핵심이다 거래 시스템, 잘 쓰여진 글은 당신을 엄청난 부자로 만들 수 있습니다.

두 번째 버전(HTML 2.0)은 언어 구성을 사용하는 관행을 기록했으며 WWW 구축의 표준이 되었습니다.

버전 ++ HTML ++에는 과학 정보와 표를 표시하고 텍스트와 이미지의 레이아웃 스타일을 개선하는 새로운 기능이 도입되었습니다.

세 번째 버전(HTML 3.0)은 모든 혁신을 간소화하고 하이퍼텍스트 분산 시스템의 사용자 인터페이스를 공식화했습니다.

1996년 출시된 새 버전언어: 테이블 생성 도구, Java 언어 구성, 이미지 맵(클라이언트 시스템에 위치) 및 새로운 유형의 텍스트 형식을 포함하는 HTML 3.2.

HTML은 태그라고 하는 서식 지정 지침이 문서 텍스트에 포함되어 있는 텍스트 기반 언어입니다.

HTML 문서를 생성하는 과정은 정보 로드를 전달하는 서식 없는 텍스트 안에 태그를 포함하는 작업으로 구성됩니다.

HTML 태그는 보다 작음 기호(<) и заканчивающиеся знаком “больше” (>).

HTML의 대부분 서식 기능은 물리적 스타일이 아닌 논리적 스타일을 지정합니다. 예를 들어, 일반적으로 더 큰 문자 크기를 나타내는 제목 태그는 사용할 크기를 나타내지 않습니다. 클라이언트 프로그램 역할을 하는 브라우저는 제목에 대해 평소보다 더 큰 텍스트 크기를 선택합니다. 이 접근 방식을 사용하면 플랫폼을 제거할 수 있습니다. 즉, Macintosh에서 작성된 문서를 UNIX나 Windows에서 사용할 수 있습니다. 단점은 문서가 플랫폼마다 다르게 보인다는 것입니다.

WWW 브라우저는 HTML 문장을 구문 분석할 때 다음 규칙에 따라 작동합니다.

공백 및 기타 "보이지 않는" 문자는 무시됩니다.

모든 태그는 기본 태그, 서식 지정 태그, 구조 태그, 포인터 등의 그룹으로 나눌 수 있습니다.

서식 지정 태그는 소문자 및/또는 대문자로 작성할 수 있습니다.

대부분의 형식 지정 태그는 쌍으로 작성됩니다. 여는 태그는 이 효과를 활성화하고 닫는 태그는 이 효과를 끕니다. 한 쌍의 태그를 켜고 끄는 효과가 태그 안의 텍스트에 나타나기 때문에 컨테이너라고도 합니다. 예를 들어, 한 줄을 굵은 문자로 인쇄해야 함을 나타내려면 다음과 같이 작성합니다.< B >이 줄은 굵은 텍스트로 인쇄됩니다.

닫는 태그 안의 텍스트 앞에는 항상 백슬래시 문자가 옵니다. 기본 HTML 태그 중 이 규칙의 예외는 다음과 같습니다.< BASE >(기본 정보),< BR >(줄 끝),< HR >(가로 눈금자) 및< IMG >(영상). 이러한 태그는 단일 복사본에 존재합니다.

모든 HTML 문서에는 경계 태그가 있습니다.< HTML >그리고. 이 태그 쌍에는 웹 페이지의 다른 모든 태그와 문서의 모든 정보 콘텐츠가 포함되어 있습니다. 실제로 컨테이너의 모든 내용이 HTML 코드라고 선언합니다. 꼬리표< HTML >파일의 첫 번째 줄에 있어야 하며 태그는- 마지막에.

모든 HTML 문서에는 문서 헤드와 문서 본문이 포함되어 있습니다.

문서 제목은 문서를 식별합니다. 태그 바로 뒤에 와야 합니다.< HTML >그리고 시작하다< HEAD >. 제목은 태그로 끝납니다..

문서 제목에는 문서 이름과 기본 URL이 포함되어야 합니다.

문서 제목은 태그 사이에 위치합니다.< TITLE >그리고. 브라우저에서 사용되며 웹 서버. 이름의 길이는 40자를 초과할 수 없습니다. 문서의 제목은 정보를 제공해야 하며 문서의 내용을 반영하여 식별할 수 있어야 합니다. 이름은 Internet Explorer의 제목 표시줄, 기록 목록(기록) 및 "즐겨찾기"에 나타납니다.

기본 URL은 완전(절대)해야 하며 프로토콜, 인터넷 컴퓨터 주소 및 파일 이름을 포함해야 합니다. 태그에 표시되어 있어요< BASE HREF = “базовый_URL”>. 문서의 다른 모든 URL은 기본 URL을 기준으로 지정할 수 있습니다. 예를 들어 기본 URL이 다음과 같은 경우: http://www.microsoft.com/products/office/word/datasheets.html기능 파일의 URL을 지정해야 합니다. 동일한 서버의 /products/office/excel 디렉터리에 있는 index.html의 경우 ../excel/features를 지정할 수 있습니다. 전체 주소를 입력하는 대신 html을 사용하세요.

기호. ./는 기본 주소에서 한 디렉터리 수준 위로 이동해야 함을 나타냅니다.

기본 URL이 있으면 문서를 다른 서버로 더 쉽게 전송할 수 있습니다. 문서의 다른 모든 URL이 상대적인 경우 전송할 때 기본 URL의 서버 이름만 변경하면 되기 때문입니다.

문서 본문정보를 전달하는 모든 텍스트와 텍스트 형식을 지정하는 데 사용되는 모든 HTML 태그를 포함합니다. 문서 본문은 헤더 바로 뒤에서 시작되며 태그로 구분됩니다.< BODY >그리고.

예제 HTML-문서:

< TITLE >문서 이름

< BASE HREF = “базовый_URL” >

문서 본문에 사용되는 태그를 사용하면 다음 텍스트 마크업 요소를 지정할 수 있습니다.

단락의 시작과 줄의 끝

제목 스타일

물리적 스타일 - 논리적 스타일

특수 기호.

하이퍼텍스트 링크포인터와 URL의 두 부분으로 구성됩니다. 포인터는 사용자가 어딘가로 이동하기 위해 클릭해야 하는 텍스트입니다. URL은 사용자가 포인터를 클릭할 때 브라우저가 문서를 다운로드할 주소를 지정합니다.

그래픽 브라우저의 텍스트 안내선은 일반적으로 밑줄이 그어져 있고 색상으로 구분되어 있습니다. 순수 텍스트 브라우저에서는 굵은 글씨로 표시됩니다.

크기와 서식 기능에 관계없이 모든 텍스트를 색인으로 사용할 수 있습니다. 색인은 여러 문자, 단어 또는 텍스트 줄로 구성될 수 있습니다.

색인 형식:

< A HREF = “ URL ”>색인 텍스트 ,

태그에 문자 A가 어디에 있나요?< A HREF >앵커를 의미하고 HREF는 하이퍼텍스트 REFerence를 의미합니다. 태그 사이의 모든 것< A HREF = “ URL ”>그리고밑줄이나 굵은 글꼴로 화면에 나타나는 색인 텍스트입니다.

다른 형식화 ​​코드는 하이퍼텍스트 색인과 함께 사용될 수 있습니다. 예를 들어:

< A HREF = “ URL ”> < I > 또는

< I > < A HREF = “ URL ”>자세한 내용으로 이동

WWW 기술

월드와이드웹(WWW) 서비스는 가장 널리 사용되는 인터넷 서비스입니다. WWW는 웹 서버에 저장된 수억 개의 상호 연결된 전자 문서로 구성된 단일 정보 공간입니다. 웹을 구성하는 개별 문서를 웹 페이지라고 합니다. 주제별로 통합된 웹 페이지 그룹을 웹 사이트(웹 사이트)라고 합니다. 하나의 실제 웹 서버에는 꽤 많은 웹 사이트가 포함될 수 있으며 각 웹 사이트는 서버 하드 드라이브의 별도 디렉터리에 할당됩니다.

웹페이지는 특정 매체를 참조하지 않고 디자인된다는 점에서 일반 텍스트 문서와 다릅니다. 예를 들어, 종이에 인쇄된 Word 문서의 디자인은 특정 높이, 너비 및 여백 크기를 갖는 인쇄된 시트의 매개변수와 연결되어 있습니다. 전자 웹 문서는 PC 화면에서 볼 수 있도록 설계되어 있어 어느 화면인지 미리 알 수 없습니다. 따라서 웹 문서는 고정된 형식을 가질 수 없습니다. 디자인은 클라이언트의 PC에서 재생하는 동안 수행되며 시청을 수행하는 프로그램(브라우저)의 설정에 따라 수행됩니다. 브라우저는 웹 문서의 텍스트에 작성된 명령에 따라 문서를 표시합니다. 명령은 문서 작성자가 직접 작성하거나 웹 문서를 준비하는 자동 수단을 통해 구현할 수 있습니다.

이러한 명령을 태그라고 합니다. 태그는 괄호 안에 표시됩니다.<>. 대부분의 태그는 여는 태그와 닫는 태그의 쌍으로 사용됩니다.

다음을 제외한 복잡한 태그 예어추가 속성과 매개변수가 있습니다. 태그 작성 규칙은 특수 하이퍼텍스트 마크업 언어인 HTML(Hyper Text Markup Language)의 사양에 포함되어 있습니다. 즉, 웹 문서는 일반적인 문서입니다. 텍스트 문서, HTML 태그로 표시됩니다.

웹 문서의 가장 중요한 기능은 하이퍼텍스트 링크입니다. 하이퍼링크는 어떤 텍스트에도 설정할 수 있습니다. 쌍을 이루는 태그는 하이퍼링크를 생성하는 데 사용됩니다. . 이 태그에는 링크가 가리키는 문서의 URL을 지정하는 필수 HREF 속성이 포함되어 있습니다.

주소는 절대 또는 상대 형식으로 지정할 수 있습니다. 절대 주소는 프로토콜과 웹 사이트 주소로 시작됩니다. 이 항목은 방문자를 다른 웹 사이트로 안내해야 할 때 사용되며 외부 링크로 간주됩니다. 상대 주소를 사용하면 링크는 문서의 상대 검색 경로만 지정합니다. 이는 동일한 프로토콜과 동일한 웹 사이트가 사용되고 링크가 내부적인 것으로 간주된다고 가정합니다. 웹 사이트 전체의 주소가 변경되는 경우(예: 다른 서버로 변경되는 경우)에도 내부 링크는 계속 작동합니다. 전체 하이퍼링크 형식에는 페이지 내의 특정 위치로 연결하는 기능이 포함됩니다. 그러나 이는 귀하가 직접 디자인한 페이지에만 가능합니다. 이를 위해 링크가 배치되는 위치는 특수 앵커 요소를 사용하여 표시됩니다. 앵커는 쌍을 이루는 태그를 사용하여 설정됩니다. 필수 NAME 속성을 사용합니다. 이 속성의 값은 앵커 이름인 라틴 문자와 숫자의 임의 순서입니다. 앵커에 연결하려면 URL 끝의 # 기호 뒤에 앵커 이름이 표시됩니다.

용어 사전

브라우저는 현재 폴더에서 이 서버의 문서를 검색합니다.

미디 음악

브라우저는 http://www.midi.ru 사이트로 이동합니다.

WWW 서버에 저장된 수많은 하이퍼텍스트 문서의 총체는 이동이 가능한 고유한 하이퍼문서 공간을 형성합니다. 문서 간의 무작위 이동을 웹서핑이라고 하고, 목적이 있는 이동(검색을 목적으로 수행되는 것)을 말합니다. 필요한 정보) – 웹 탐색.

사이의 하이퍼텍스트 링크 엄청난 양다음에 저장된 문서 물리적 서버인터넷은 논리적인 WWW 공간의 존재 기반이다.

웹을 구성하는 하드웨어와 소프트웨어를 함께 살펴보겠습니다.

· 클라이언트와 서버.웹 서버는 인터넷에 연결되어 실행되는 컴퓨터입니다. 특별 프로그램, 웹 서버라고도 합니다. 이 프로그램의 작업에는 웹에서 특정 파일을 저장, 검색 및 배포하는 작업이 포함됩니다. 웹 클라이언트는 웹에서 파일을 요청하는 브라우저입니다. 클라이언트 컴퓨터가 파일 중 하나에 액세스하려고 하면 웹 서버로 요청이 전송됩니다. 서버는 지정된 파일을 찾아 전송합니다. 클라이언트 컴퓨터요청을 보낸 사람. 웹을 구성하는 수천 대의 컴퓨터는 하드웨어와 하드웨어의 다양한 조합을 나타냅니다. 소프트웨어. 클라이언트 컴퓨터가 파일을 요청할 때 요청된 파일이 저장된 서버의 세부 사항이나 서버에서 클라이언트로 가는 도중에 파일을 서로 전송하는 다른 컴퓨터에 대해 사실상 아무것도 모릅니다. 이러한 시스템이 작동하려면 하드웨어나 운영 체제에 독립적인 언어 및 프로토콜 집합을 사용해야 합니다.

· URL 및 데이터 전송 프로토콜.문서의 일부가 전 세계에 흩어져 있고 이를 사용자에게 전체적으로 보여주고 싶다면 일관성을 유지하세요. 유니폼 스타일문서"에는 아주 좋은 주소 지정 시스템이 필요합니다. 인터넷상의 모든 파일에는 URL(Uniform Resource Locator)이라는 주소가 있습니다. 정보 자원). 예: 유럽 연합 웹사이트 URL 축구 - http://ru.uefa.com.

URL의 첫 번째 부분은 컴퓨터가 파일에 액세스하는 방법, 즉 통신 프로토콜을 정의합니다. 대부분의 웹 페이지는 HTTP 프로토콜(Hypertext Transfer Protocol)을 사용하여 액세스됩니다. 이것이 바로 웹 주소가 일반적으로 "http"라는 문자를 사용하여 지정되고 브라우저가 사용자가 입력하는 웹 주소 앞에 자동으로 이러한 문자를 삽입하는 이유입니다. 종종 부분 http:// 주소는 URL 시작 부분에서 생략됩니다.

주소의 다음 부분은 웹 서버 호스트 이름입니다. 도메인 이름 시스템은 요청이 어디에 있든 웹 서버로 전달합니다.

일부 URL에는 웹 서버 호스트 이름 뒤에 정보가 포함되어 있습니다. 이 데이터는 보려는 파일과 해당 파일이 저장된 디렉토리를 정확하게 나타냅니다. 디렉터리 및 파일 이름을 지정하지 않으면 해당 웹 서버의 기본 웹 페이지가 표시됩니다.

· HTML(Hypertext Markup Language - 하이퍼텍스트 마크업 언어)는 웹의 보편적 언어입니다. 텍스트, 그래픽, 오디오 및 비디오 정보 등 웹에 게시된 정보를 재생할 수 있는 페이지를 레이아웃하는 데 사용됩니다.

· 자바와 자바스크립트. Java 언어는 웹을 통해 작은 응용 프로그램(애플릿 또는 Java 응용 프로그램이라고 함)을 전송하도록 설계되었습니다. 그리고 JavaScript는 HTML의 기능을 확장하여 작은 프로그램(또는 스크립트)을 웹 페이지에 포함시킵니다. 애플릿과 스크립트의 주요 목적은 웹 페이지를 보다 대화형으로 만드는 것입니다. 즉, 원격 웹 서버와 상호 작용하는 대신 컴퓨터에서 실행되는 애플릿 및 스크립트와 상호 작용합니다.

애니메이션을 구성하기 위한 Java 애플릿과 JavaScript 스크립트도 있으며, 이는 사용자 컴퓨터에서 실행되도록 네트워크를 통해 웹 서버에서 전송됩니다. 그들은 인터넷을 통해 애니메이션 프레임을 전송하는 것을 방지합니다. 설명된 프로세스는 일반적으로 사용자가 인지하지 못한 채 발생합니다.

· VBScript 및 ActiveX 컨트롤. VBScript 언어와 ActiveX 컨트롤은 표준 수단지원됨 인터넷 브라우저탐침.

VBScript는 언어의 단순화된 버전입니다. 비주얼 베이직, Microsoft에서 개발했습니다. 웹 페이지를 동적으로 만드는 스크립트를 만드는 데 사용할 수 있습니다. 따라서 VBScript는 기능면에서 JavaScript와 유사합니다.

Java 애플릿과 같은 ActiveX 컨트롤은 실행 가능한 프로그램을 웹 페이지에 포함시키는 데 사용됩니다. Internet Explorer는 ActiveX 컨트롤을 사용하는 웹 페이지를 발견하면 특정 컨트롤이 컴퓨터에 설치되어 있는지 확인하고 그렇지 않은 경우 설치합니다.

· XML 및 기타 고급 웹 언어. XML(Extensible Markup Language)은 웹용 애플리케이션 개발을 위한 언어로 HTML을 대체하도록 설정된 매우 강력한 언어입니다. HTML과 달리 XML에는 XML 문서에 설명된 데이터가 표시되는 방법에 대한 지침이 포함되어 있지 않습니다. 표시되는 방식은 스타일 설명 언어에 의해 결정됩니다. 스타일 설명 언어는 HTML에 대한 계단식 스타일 시트와 거의 동일한 역할을 XML에 대해 수행합니다. W3C 컨소시엄은 XSL(Extensible Style Language)과 CSS(Cascading Style Sheets)라는 두 가지 스타일 시트 사양으로 작동합니다. XML과 HTML의 또 다른 근본적인 차이점은 XML 사전 작성자가 사용하는 데 필요하다고 간주하는 모든 태그를 포함할 수 있다는 것입니다.

HTML의 고급 버전은 HTML, JavaScript 및 CSS의 세 가지 구성 요소를 포함하는 DHTML 언어(동적 HTML)입니다.

· 그래픽 개체.도면, 도면, 지도, 다이어그램 및 기타 그래픽 이미지웹에 제공되는 은 다양한 형식을 가질 수 있습니다. 가장 일반적인 디스플레이 형식 그래픽 정보 JPEG와 GIF입니다.

· 오디오 및 비디오 파일.웹은 통합을 통해 재생되는 다양한 오디오 및 비디오 파일을 제공합니다. 소프트웨어 모듈브라우저. 이러한 데이터를 전송하는 방법에는 두 가지가 있습니다. 브라우저는 이를 전체 파일로 다운로드할 수 있습니다(그런 다음 오디오 파일은 크고 비디오 파일은 간단하기 때문에 전체 정보 양을 재생해야 하며 시간이 많이 걸립니다). 거대) 또는 파일에서 재생산해야 하는 해당 부분만 가져오거나 이 순간. 두 번째 방법은 오디오 스트리밍 또는 비디오 스트리밍이라고 합니다.

하이퍼텍스트 마크업 언어(HTML) – 하이퍼텍스트 마크업 언어 – 월드 와이드 웹에 게시된 하이퍼텍스트 문서를 작성하기 위한 것입니다.

하이퍼텍스트 문서태그라고 불리는 특별한 표시가 있는 텍스트 파일입니다. 이 표시는 나중에 브라우저에서 인식되어 컴퓨터 화면에 파일 내용을 표시하는 데 사용됩니다. 이러한 표시를 사용하면 문서 제목을 강조 표시하고 문자의 색상, 크기 및 스타일을 변경하고 그래픽과 표를 삽입할 수 있습니다. 그러나 일반 텍스트에 비해 하이퍼텍스트의 가장 큰 장점은 문서의 내용에 추가할 수 있다는 것입니다. 하이퍼링크– 마우스를 클릭하여 다른 문서를 볼 수 있는 특수 HTML 언어 구성입니다.

하이퍼텍스트 문서를 작성하는 방법에는 두 가지가 있습니다. 내부 구조에 대한 특별한 지식이 필요하지 않은 WYSIWYG HTML 편집기(예: Microsoft FrontPage 등) 중 하나를 사용할 수 있습니다. 문서가 생성되는 중. 이 방법을 사용하면 HTML에 대한 지식 없이도 WWW용 문서를 만들 수 있습니다. HTML 편집기는 하이퍼텍스트 문서 생성을 자동화하고 일상적인 작업을 제거합니다. 그러나 기능이 제한되어 결과 파일의 크기가 크게 늘어나고 도움을 받아 얻은 결과가 항상 개발자의 기대를 충족시키지는 않습니다. 그러나 물론 이 방법은 하이퍼텍스트 문서를 준비하는 초보자에게 없어서는 안될 방법입니다.

대안은 일반 텍스트 편집기(NotePad)를 사용하여 문서를 만들고 마크업하는 것입니다. 이 방법을 사용하면 HTML 명령이 텍스트에 수동으로 삽입됩니다. 이런 방식으로 문서를 작성하면 현재 수행 중인 작업을 정확히 알 수 있습니다.

이미 언급했듯이 HTML 문서에는 문자 정보가 포함되어 있습니다. 그 중 한 부분은 텍스트 자체, 즉 문서의 내용을 구성하는 데이터입니다. 또 다른 - 태그(마크업 태그)라고도 함 마크업 플래그는 문서를 마크업하고 해당 표시를 제어하는 ​​데 사용되는 특수 HTML 언어 구성입니다. 텍스트가 어떤 형식으로 표시될지, 해당 구성 요소 중 하이퍼텍스트 링크로 작동할 구성 요소가 무엇인지, 문서에 포함되어야 하는 그래픽 또는 멀티미디어 개체가 무엇인지 결정하는 것은 HTML 언어 태그입니다. HTML 문서에 포함된 그래픽 및 오디오 정보는 별도의 파일에 저장됩니다. HTML 문서 뷰어(브라우저)는 마크업 플래그를 해석하고 이에 따라 화면의 텍스트와 그래픽을 배열합니다. HTML 문서가 포함된 파일의 경우 확장자 .htm 또는 .html이 허용됩니다.

대문자와 소문자태그는 녹음할 때 다르지 않습니다.대부분의 경우 태그는 쌍으로 사용됩니다. 쌍은 열기(시작 태그)와 닫기(끝 태그) 태그로 구성됩니다. 여는 태그 구문:

<имя_тега [атрибуты]>

구문 설명에 사용된 대괄호는 다음을 의미합니다. 이 요소누락되었을 수 있습니다. 닫는 태그의 이름은 앞에 슬래시가 있다는 점만 여는 태그의 이름과 다릅니다.

태그 속성은 다음 형식으로 작성됩니다.

이름[="값"]

인수 값을 지정할 때 따옴표는 선택 사항이며 생략할 수 있습니다. 일부 속성의 경우 값이 지정되지 않을 수 있습니다. 닫는 태그에는 속성이 없습니다.

쌍을 이루는 태그의 작업은 여는 태그가 있는 곳에서 시작하고 해당하는 닫는 태그가 있는 곳에서 끝납니다. 종종 여는 태그와 닫는 태그로 구성된 쌍을 호출합니다. 컨테이너, 여는 태그와 닫는 태그로 둘러싸인 텍스트 부분은 다음과 같습니다. 요소.

텍스트를 구성하는 일련의 문자는 공백, 탭, 줄 바꿈, 캐리지 리턴, 문자, 구두점, 숫자 및 기타 문자로 구성될 수 있습니다. 특수 문자(예: +, #, $, @), 제외한다음 4개의 문자는 HTML 특수의미:< (меньше), >(보다 큼), &(앰퍼샌드) 및 "(큰따옴표). 텍스트에 이러한 문자를 포함해야 하는 경우 특수 문자 시퀀스를 사용하여 인코딩해야 합니다.