HTML 웹 페이지를 최적화하는 방법

HTML에서는 멋진 웹페이지를 만들어야 할 뿐만 아니라 웹페이지의 최적화도 고려해야 한다는 것을 알고 있습니다. 그래서 오늘은 HTML 웹페이지를 최적화하는 방법에 대한 아이디어를 5가지로 요약해 보겠습니다. 한번 보세요.

테이블을 div 레이아웃으로 변경하세요

테이블 태그 레이아웃 html을 div 레이아웃으로 재구성해 보세요. 그러면 코드가 최소 40% 절약됩니다. div 코드가 테이블 레이아웃의 HTML 웹페이지보다 작기 때문에 검색 엔진 인덱스 가중치도 테이블 레이아웃의 HTML 웹페이지보다 좋습니다. div, span, ul li 및 기타 일련의 태그를 줄이고 간소화합니다.

DIV+CSS 웹 페이지를 레이아웃할 때 때로는 일부 DIV 레이아웃 코드를 저장하고 코드 양을 줄일 수 있습니다.

다음 사례 코드:

<div class="div"> 
　　<ul> 
　　<li>DIV</li> 
　　<li>DIV</li> 
　　<li>DIV</li> 
　　</ul> 
</div>

는 다음과 같이 변경할 수 있습니다.

lass="div"> 
　　<li>DIV</li> 
　　<li>DIV</li> 
　　<li>DIV</li> 
</ul>

로그인 후 복사

이렇게 하면 한 쌍의 div 태그를 저장할 수 있으므로 html 코드의 양이 줄어들고 html이 압축됩니다. 이러한 방식으로 ul에 대한 CSS 스타일 클래스의 이름을 직접 지정하면 페이지의 여러 위치에서 ul li 목록 태그의 사용을 구별할 수 있습니다.

Delete

과잉 공백 HTML 코드가 차지하는 바이트를 효과적으로 압축할 수 있는 여분의 공백과 줄 바꿈을 삭제합니다. 일반적으로 개발이 완료된 후 HTML 코드의 줄 바꿈과 공백을 삭제할 수 있습니다.

DW 소프트웨어를 사용하여 html에서 태그 사이의 공백을 일괄 삭제할 수 있습니다

예:

<div class="div"> 
　　<div ...></div> 
</div>

로그인 후 복사

공백과 줄바꿈을 삭제할 수 있습니다:

이렇게 하면 공백과 줄바꿈이 차지하는 바이트를 절약할 수 있습니다.

웹 게시 버전에서는 DW를 사용하여 중복된 공백과 빈 줄을 삭제할 수 있습니다. 다시 편집하려면 DW 소프트웨어로 이동하여 코드 형식을 지정하세요.

테이블

타입 레이아웃의 경우 div 레이아웃 대신 테이블을 사용하는 것이 적합합니다테이블 데이터 목록 레이아웃인 경우 div 레이아웃보다 테이블 레이아웃을 사용하는 것이 더 좋기 때문에 테이블을 선택하는 것이 좋습니다. 테이블 레이아웃을 사용하는 것이 div 레이아웃

html 태그

코드 및 CSS 스타일 저장보다 더 경제적입니다. 아래 표와 같이

데이터 유형

과 같이 TABLE 태그 + CSS 스타일 레이아웃 사용을 권장합니다. html 웹 페이지 코드 압축 테이블 태그 레이아웃 테이블

이 목록 유형 테이블 테이블과 유사하므로 사용을 권장합니다. 테이블 태그 레이아웃

웹 페이지 GZIP 압축

웹 페이지 Gzip 압축 기능은 자체 서버에 설정하는 것이 좋습니다.

1. GZIP을 열면 어떤 이점이 있나요?

답변: Gzip을 켜면 사용자 브라우저에 출력되는 데이터가 압축되어 네트워크를 통해 전송되는 데이터의 양이 줄어들고 탐색 속도가 빨라집니다.

2. IIS의 Gzip 압축 기능을 활성화하는 방법:

답변: 먼저 정적 파일(HTML)을 압축해야 하는 경우 하드 디스크에 디렉터리를 만들고 사용자에게 쓰기 권한을 부여해야 합니다. IUSR_머신 이름" . 동적 파일(PHP, asp, aspx)을 압축하는 경우 해당 페이지가 매번 동적으로 생성되고 압축 후에 포기되므로 필요하지 않습니다. 그런 다음 IIS 관리자에서 "웹 사이트" - 속성을 마우스 오른쪽 버튼으로 클릭합니다. 아래의 특정 사이트가 아니라 전체 웹 사이트입니다. "서비스" 탭으로 이동하여 동적 콘텐츠 압축 및 정적 콘텐츠 압축 활성화를 선택합니다. 그런 다음 웹 사이트에서 서버 확장을 선택하고 새 서버 확장을 만듭니다. 이름은 중요하지 않습니다. 아래 파일을 추가하는 경로는 c:windowssystem32inetsrvgzip.dll입니다. 그런 다음 이 확장을 활성화합니다. 이때 정적 콘텐츠는 압축이 가능하지만, 동적 콘텐츠의 경우 aspx 파일은 압축 범위에 포함되지 않습니다. 기본 압축 파일에는 이 확장자가 없기 때문입니다. 그리고 관리 인터페이스에서 확장을 추가할 수 있는 위치를 찾을 수 없습니다. 현재는

구성 파일

만 수정할 수 있습니다. c:windowssystem32inetsrv 아래에 MetaBase.xml 파일이 있습니다. 이를 메모장으로 열고 IIsCompressionScheme을 찾을 수 있습니다. 이름이 같은 세 개의 섹션, 즉 세 번째 섹션은 걱정하지 마세요. 두 섹션은 기본적으로 동일합니다. 매개변수, 이 두 단락의 HcScriptFileExtensions 매개변수 아래에 aspx 줄을 추가하세요. 압축할 다른 동적 프로그램이 있는 경우 여기에도 추가하세요. HcDynamicCompressionLevel이 9로 변경됩니다(0-10, 9가 가장 비용 효율적인 것입니다). 그런 다음 압축 후 속도를 경험하려면 IIS 서비스를 다시 시작해야 합니다. 이 사례를 읽으신 후 방법을 마스터하셨다고 생각합니다. 더 흥미로운 정보를 보려면 PHP 중국어 웹사이트의 다른 관련 기사를 주목하세요!


관련 읽기:

J가 창 개체 빨간색 상자를 작동하는 구현 단계

위 내용은 HTML 웹 페이지를 최적화하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!