웹 프론트엔드 HTML 튜토리얼 CSS_HTML/Xhtml_Webpage Production에서 XHTML 태그의 해당 속성 및 사용법

CSS_HTML/Xhtml_Webpage Production에서 XHTML 태그의 해당 속성 및 사용법

May 16, 2016 pm 04:43 PM
사용 할 수 있다 재산 검색 엔진 상표 용법 웹사이트 웹페이지


웹 페이지를 디자인하기 위해 처음 XHTML CSS를 접했을 때, 나는 태그 사용 경험이 거의 없었고, 효과를 얻을 수만 있다면 충분할 것이라고 생각하면서 생각나는 대로 사용하는 경우가 많았습니다. 하지만 검색 엔진 최적화 지식에 대한 연구와 이해가 깊어지면서 태그 사용이 실제로 과학이라는 것을 알게되었습니다. 우리는 Script Home - jb51.net의 CSS 튜토리얼 기사에서 의미론을 강조해왔는데, HTML 태그를 어떻게 사용합니까? 일반적으로 어디에 사용되나요?
처음 XHTML CSS 웹페이지 디자인을 접했을 때 태그 사용 경험이 거의 없었고, 효과를 얻을 수만 있다면 충분할 것이라고 생각하면서 생각나는 대로 사용하는 경우가 많았습니다. . 하지만 검색 엔진 최적화 지식에 대한 연구와 이해가 깊어지면서 태그 사용이 실제로 과학이라는 것을 알게되었습니다.
여기서는 CSS의 각 태그에 해당하는 속성과 사용법에 대해 자세히 소개하지 않겠습니다. 웹 페이지의 적용에만 집중하겠습니다. 모두에게 도움이 되기를 바랍니다.
1. DIV
DIV는 XHTML 웹사이트를 구축하는 사람들에게 익숙할 것입니다. 많은 웹사이트와 자료는 웹 표준 웹사이트 구축을 DIV CSS 웹사이트 구축이라고도 부릅니다. W3C에서는 웹 페이지의 레이아웃에 Table 태그를 사용하는 것을 권장하지 않으며, 레이아웃 태그인 DIV가 자연스럽게 레이아웃의 중요한 책임을 맡게 되므로 이렇게 부르는 것이 무리가 없습니다.
DIV는 큰 컨테이너라고도 할 수 있습니다. 웹페이지의 전체적인 구조적 레이아웃 외에도 웹페이지에서 상대적으로 독립적으로 보이는 영역을 분할하여 사용하는 것이 좋습니다. 신문과 마찬가지로 DIV의 기능은 다양한 콘텐츠를 구분하는 큰 컨테이너입니다. 다양한 영역에서는 특정 상황에 따라 적절한 라벨이 선택됩니다.
2. H 태그
H 태그는 제목 태그로, 문단의 의미를 나타내기 위해 문단 앞에 자주 사용됩니다. 표현의 정도와 표현하고자 하는 의미에 따라 H1~H6으로 나눌 수 있습니다.
H1은 가장 중요하며 전체 웹사이트의 기능과 성격에 대한 설명을 표현하거나 웹사이트의 대상 독자를 나타내는 데 자주 사용됩니다. 다른 태그는 레벨에 따라 특정 지역의 이름이나 특정 소개 텍스트에 대한 일반적인 설명을 표시하는 데 사용됩니다.
H 태그는 웹 사이트에 대한 일반적인 설명이나 텍스트의 특정 단락을 나타내기 때문에 검색 엔진에 비해 가치가 높습니다. 그러나 이것이 부담없이 사용할 수 있다는 의미는 아닙니다. 예를 들어, 일부 웹사이트에서는 특정 키워드에 대한 순위를 의도적으로 추구하기 위해 H 태그를 사용하여 텍스트 단락에 키워드를 표시합니다. 또는 H 태그를 컨테이너로 사용하여 웹 페이지를 레이아웃할 수도 있습니다. 이는 H 태그의 역할을 완전히 혼동하므로 권장되지 않습니다.
3. P
P는 텍스트 집합의 서로 다른 단락을 구별하는 데 사용되는 단락 태그입니다. 검색 엔진의 경우 크롤링 순서에 따라 첫 번째 P 태그의 텍스트도 높은 값을 갖습니다. Baidu와 마찬가지로 메타 태그 설명(설명)의 텍스트를 무시하고 첫 번째 P 태그의 내용을 가져옵니다(절대적인 것은 아님).
일부 웹사이트에서는 검색 엔진이 더 많은 콘텐츠를 크롤링하고 사용자에게 더 나은 탐색 환경을 제공할 수 있도록 분류할 때
태그를 사용합니다. 때로는 원하는 효과를 전혀 얻을 수 없다는 의미는 아닙니다. 엄격하게 입력된 문서의 경우
표현형식에 속하는 태그이므로 사용이 불가합니다.
대부분의 웹사이트에서는 전환 문서 유형을 사용하지만 텍스트 분할에는 사용하지 않는 것이 좋습니다.
4. UL 및 LI 태그
순서가 지정되지 않은 목록이고 UL 태그는 목록의 선언이며 LI는 목록 항목입니다. 프로젝트의 상대적인 독립성으로 인해 탐색, 뉴스 또는 기사 목록 등에 자주 사용됩니다. UL은 다양한 목록을 구별하는 컨테이너로도 사용할 수 있습니다.
일부 웹사이트는 "웹 표준"을 추구하고 테이블을 UL 및 LI로 변환할 수 있습니다. 이로 인해 웹 페이지를 읽고 유지 관리하기가 어려워집니다. 이는 웹 표준이 전달하는 개념에 어긋납니다.
5. 테이블
여기서는 테이블의 사용법에 대해 자세히 소개하지 않겠습니다. 단지 웹 표준이 테이블을 앞으로 사용할 수 없다는 의미는 아니지만 권장되지 않는다는 점만 말씀드리고 싶습니다. 레이아웃에는 테이블을 사용하고 사용할 시간만 표시합니다. 따라서 웹을 준수하는 웹페이지와 Table 태그를 사용하는 것에는 모순이 없습니다.
6. 검색 엔진을 위해 준비된 태그
(1) 제목: 웹 페이지의 제목과 웹 사이트에 대한 설명입니다. 하위 태그는 검색 엔진에도 유용하며 종종 대상 키워드를 포함합니다.
(2) 메타 키워드: 웹 페이지의 주요 키워드입니다. 원래는 검색 엔진이 쉽게 웹 사이트를 분류할 수 있도록 하기 위해 마련되었으나 나중에 많은 웹 사이트에서 키워드 순위를 더 유리하게 만들기 위해 이 태그를 부정 행위로 사용하는 경우가 많았기 때문에 이제 이 태그는 검색 엔진에서 거의 의미가 없습니다.
(3) 메타 설명: 웹페이지에 대한 설명입니다. 키워드와 마찬가지로 원래는 검색 엔진 분류를 용이하게 하기 위한 것이었습니다. 또한 많은 웹사이트에서 이 태그를 사용하여 속임수를 쓰기 때문에 더 이상 검색 엔진에 중요하지 않습니다. 현재 주류 검색 엔진 중 Google만이 여전히 콘텐츠를 크롤링하고 있지만, 콘텐츠를 기반으로 키워드를 결정하는 경우는 거의 없습니다.
사실 검색 엔진에서 가장 중요한 것은 콘텐츠의 품질입니다. 마찬가지로, 우리는 방문자에게 자신을 홍보하기 위해 웹사이트를 구축합니다. 신속성 때문에 기본을 잊지 마시기 바랍니다. 결국 사용자는 웹사이트 순위가 아니라 정보가 자신에게 필요한 것인지 여부에 관심을 갖습니다.
위 내용은 초보자가 혼동하기 쉬운 일반적으로 사용되는 태그입니다. 앞으로 새로운 문제가 발생하면 최근 계속 확장될 예정인 jb51.net의 업데이트된 CSS 튜토리얼에 주목해 주세요. .
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.

핫 AI 도구

Undresser.AI Undress

Undresser.AI Undress

사실적인 누드 사진을 만들기 위한 AI 기반 앱

AI Clothes Remover

AI Clothes Remover

사진에서 옷을 제거하는 온라인 AI 도구입니다.

Undress AI Tool

Undress AI Tool

무료로 이미지를 벗다

Clothoff.io

Clothoff.io

AI 옷 제거제

Video Face Swap

Video Face Swap

완전히 무료인 AI 얼굴 교환 도구를 사용하여 모든 비디오의 얼굴을 쉽게 바꾸세요!

뜨거운 도구

메모장++7.3.1

메모장++7.3.1

사용하기 쉬운 무료 코드 편집기

SublimeText3 중국어 버전

SublimeText3 중국어 버전

중국어 버전, 사용하기 매우 쉽습니다.

스튜디오 13.0.1 보내기

스튜디오 13.0.1 보내기

강력한 PHP 통합 개발 환경

드림위버 CS6

드림위버 CS6

시각적 웹 개발 도구

SublimeText3 Mac 버전

SublimeText3 Mac 버전

신 수준의 코드 편집 소프트웨어(SublimeText3)

Edge 브라우저에서 웹페이지를 데스크톱에 바로가기로 보내는 방법은 무엇입니까? Edge 브라우저에서 웹페이지를 데스크톱에 바로가기로 보내는 방법은 무엇입니까? Mar 14, 2024 pm 05:22 PM

Edge 브라우저에서 웹 페이지를 바탕 화면에 바로 가기로 보내는 방법은 무엇입니까? 많은 사용자들이 액세스 페이지를 직접 열 수 있는 편의를 위해 자주 사용하는 웹 페이지를 데스크탑에 바로가기로 표시하고 싶어하지만 어떻게 해야 하는지 알지 못합니다. 이 문제에 대해 이번 호의 편집자는 다음과 같은 내용을 공유합니다. 대다수의 사용자에게 솔루션을 제공하는 방법에 대해 알아보겠습니다. 오늘의 소프트웨어 튜토리얼에서 공유된 내용을 살펴보겠습니다. Edge 브라우저에서 웹 페이지를 데스크탑으로 보내는 바로 가기 방법: 1. 소프트웨어를 열고 페이지에서 "..." 버튼을 클릭합니다. 2. 드롭다운 메뉴 옵션의 "애플리케이션"에서 "이 사이트를 애플리케이션으로 설치"를 선택합니다. 3. 마지막으로 팝업창에서 클릭해주세요.

크리스탈디스크마크란 어떤 소프트웨어인가요? -크리스탈디스크마크는 어떻게 사용하나요? 크리스탈디스크마크란 어떤 소프트웨어인가요? -크리스탈디스크마크는 어떻게 사용하나요? Mar 18, 2024 pm 02:58 PM

CrystalDiskMark는 순차 및 무작위 읽기/쓰기 속도를 빠르게 측정하는 하드 드라이브용 소형 HDD 벤치마크 도구입니다. 다음으로 편집자님에게 CrystalDiskMark 소개와 crystaldiskmark 사용법을 소개하겠습니다~ 1. CrystalDiskMark 소개 CrystalDiskMark는 기계식 하드 드라이브와 솔리드 스테이트 드라이브(SSD)의 읽기 및 쓰기 속도와 성능을 평가하는 데 널리 사용되는 디스크 성능 테스트 도구입니다. ). 무작위 I/O 성능. 무료 Windows 응용 프로그램이며 사용자 친화적인 인터페이스와 다양한 테스트 모드를 제공하여 하드 드라이브 성능의 다양한 측면을 평가하고 하드웨어 검토에 널리 사용됩니다.

foobar2000을 어떻게 다운로드하나요? - foobar2000 사용법 foobar2000을 어떻게 다운로드하나요? - foobar2000 사용법 Mar 18, 2024 am 10:58 AM

foobar2000은 언제든지 음악 리소스를 들을 수 있는 소프트웨어입니다. 모든 종류의 음악을 무손실 음질로 제공합니다. 음악 플레이어의 향상된 버전을 사용하면 더욱 포괄적이고 편안한 음악 경험을 얻을 수 있습니다. 컴퓨터에서 고급 오디오를 재생합니다. 이 장치는 보다 편리하고 효율적인 음악 재생 경험을 제공합니다. 인터페이스 디자인은 단순하고 명확하며 사용하기 쉽습니다. 또한 다양한 스킨과 테마를 지원하고, 자신의 선호도에 따라 설정을 개인화하며, 다양한 오디오 형식의 재생을 지원하는 전용 음악 플레이어를 생성합니다. 또한 볼륨을 조정하는 오디오 게인 기능도 지원합니다. 과도한 볼륨으로 인한 청력 손상을 방지하려면 자신의 청력 상태에 따라 조정하십시오. 다음엔 내가 도와줄게

웹페이지의 이미지를 로드할 수 없으면 어떻게 해야 합니까? 6가지 솔루션 웹페이지의 이미지를 로드할 수 없으면 어떻게 해야 합니까? 6가지 솔루션 Mar 15, 2024 am 10:30 AM

일부 네티즌들은 브라우저 웹페이지를 열었을 때 웹페이지의 사진이 오랫동안 로드되지 않는다는 사실을 발견했습니다. 네트워크가 정상인지 확인했는데 무엇이 문제인가요? 아래 편집기에서는 웹 페이지 이미지를 로드할 수 없는 문제에 대한 6가지 해결 방법을 소개합니다. 웹페이지 이미지를 로드할 수 없습니다: 1. 인터넷 속도 문제 웹페이지에 이미지가 표시되지 않습니다. 이는 컴퓨터의 인터넷 속도가 상대적으로 느리고 컴퓨터에 열려 있는 소프트웨어가 더 많기 때문일 수 있습니다. 로딩 시간 초과로 인해 사진이 표시되지 않을 수 있습니다. 네트워크 속도를 차지하는 소프트웨어를 끄고 작업 관리자에서 확인할 수 있습니다. 2. 방문자가 너무 많으면 웹페이지에 사진이 표시되지 않는 경우, 우리가 방문한 웹페이지가 동시에 방문되었기 때문일 수 있습니다.

NetEase 메일박스 마스터를 사용하는 방법 NetEase 메일박스 마스터를 사용하는 방법 Mar 27, 2024 pm 05:32 PM

NetEase Mailbox는 중국 네티즌들이 널리 사용하는 이메일 주소로, 안정적이고 효율적인 서비스로 항상 사용자들의 신뢰를 얻어 왔습니다. NetEase Mailbox Master는 휴대폰 사용자를 위해 특별히 제작된 이메일 소프트웨어로 이메일 보내기 및 받기 프로세스를 크게 단순화하고 이메일 처리를 더욱 편리하게 만듭니다. 따라서 NetEase Mailbox Master를 사용하는 방법과 그 기능이 무엇인지 아래에서 이 사이트의 편집자가 자세한 소개를 제공하여 도움을 드릴 것입니다! 먼저, 모바일 앱스토어에서 NetEase Mailbox Master 앱을 검색하여 다운로드하실 수 있습니다. App Store 또는 Baidu Mobile Assistant에서 "NetEase Mailbox Master"를 검색한 후 안내에 따라 설치하세요. 다운로드 및 설치가 완료되면 NetEase 이메일 계정을 열고 로그인합니다. 로그인 인터페이스는 아래와 같습니다.

Baidu Netdisk 앱 사용 방법 Baidu Netdisk 앱 사용 방법 Mar 27, 2024 pm 06:46 PM

오늘날 클라우드 스토리지는 우리의 일상 생활과 업무에 없어서는 안 될 부분이 되었습니다. 중국 최고의 클라우드 스토리지 서비스 중 하나인 Baidu Netdisk는 강력한 스토리지 기능, 효율적인 전송 속도 및 편리한 운영 경험으로 많은 사용자의 호감을 얻었습니다. 중요한 파일을 백업하고, 정보를 공유하고, 온라인으로 비디오를 시청하고, 음악을 듣고 싶은 경우 Baidu Cloud Disk는 귀하의 요구를 충족할 수 있습니다. 그러나 많은 사용자가 Baidu Netdisk 앱의 구체적인 사용 방법을 이해하지 못할 수 있으므로 이 튜토리얼에서는 Baidu Netdisk 앱 사용 방법을 자세히 소개합니다. Baidu 클라우드 네트워크 디스크 사용 방법: 1. 설치 먼저 Baidu Cloud 소프트웨어를 다운로드하고 설치할 때 사용자 정의 설치 옵션을 선택하십시오.

BTCC 튜토리얼: BTCC 교환에서 MetaMask 지갑을 바인딩하고 사용하는 방법은 무엇입니까? BTCC 튜토리얼: BTCC 교환에서 MetaMask 지갑을 바인딩하고 사용하는 방법은 무엇입니까? Apr 26, 2024 am 09:40 AM

MetaMask(중국어로 Little Fox Wallet이라고도 함)는 무료이며 호평을 받는 암호화 지갑 소프트웨어입니다. 현재 BTCC는 MetaMask 지갑에 대한 바인딩을 지원합니다. 바인딩 후 MetaMask 지갑을 사용하여 빠르게 로그인하고 가치를 저장하고 코인을 구매할 수 있으며 첫 바인딩에는 20 USDT 평가판 보너스도 받을 수 있습니다. BTCCMetaMask 지갑 튜토리얼에서는 MetaMask 등록 및 사용 방법, BTCC에서 Little Fox 지갑을 바인딩하고 사용하는 방법을 자세히 소개합니다. MetaMask 지갑이란 무엇입니까? 3천만 명 이상의 사용자를 보유한 MetaMask Little Fox Wallet은 오늘날 가장 인기 있는 암호화폐 지갑 중 하나입니다. 무료로 사용할 수 있으며 확장으로 네트워크에 설치할 수 있습니다.

iOS 17.4 '도난 기기 보호'의 새로운 고급 기능을 사용하는 방법을 가르쳐주세요. iOS 17.4 '도난 기기 보호'의 새로운 고급 기능을 사용하는 방법을 가르쳐주세요. Mar 10, 2024 pm 04:34 PM

Apple은 화요일에 iOS 17.4 업데이트를 출시하여 iPhone에 수많은 새로운 기능과 수정 사항을 추가했습니다. 업데이트에는 새로운 이모티콘이 포함되어 있으며 EU 사용자는 다른 앱 스토어에서도 해당 이모티콘을 다운로드할 수 있습니다. 또한, 업데이트는 iPhone 보안 제어를 강화하고 사용자에게 더 많은 선택권과 보호 기능을 제공하기 위해 더 많은 "도난당한 장치 보호" 설정 옵션을 도입합니다. "iOS17.3에서는 최초로 '도난 기기 보호' 기능을 도입해 사용자의 민감한 정보에 대한 보안을 강화했습니다. 사용자가 집이나 기타 친숙한 장소를 떠나 있을 때 이 기능을 사용하려면 먼저 생체 정보를 입력해야 합니다. Apple ID 암호 변경, 도난 기기 보호 끄기 등 특정 데이터에 접근하고 변경하려면 정보를 다시 입력해야 합니다.

See all articles