저는 HTML을 처음 사용합니다. 목록에 대한 문서를 읽기 시작했을 때 매우 단순한 목록을 작성하는 경우에도 <ul>, <li> 구조가 사용되는 곳은 어디에도 없습니다.메뉴 목록에서 UL, LI 구조를 사용하는 것이 허용되는 이유는 무엇입니까?
하지만 나를 위해 그것의 CSS 만 <a> 요소를 사용하는 것이 가장 편안한 :
display: block;
/* and/or */
float: left;
그래서, 왜 <ul>, <li> 대신 <a>의 사용을?
고마워요.
구조적으로 그것들은 그 목적에 가장 적합한 요소이기 때문에. 또한 페이지의 요소를 올바르게 지시하는 측면에서 화면 판독기 사용자를 돕습니다.
HTML은 마크 업/콘텐츠 용입니다 (이 텍스트는 무엇이며 단락은 p 태그로 감싸는 것입니다). CSS는 스타일 용이고 JS는 동작 용입니다.
웹 페이지에는 수천 개의 앵커가있을 수 있지만 나열된 항목에 중첩 된 앵커를 다른 앵커와 다르게 스타일하려면 어떻게해야합니까? 당신이 일을 제대로 수행했다면
<ul>
<li><a href="#">blah</a></li>
</ul>
<a href="#">sfl</a>
, 당신의 CSS는
a { }
ul li a { }
SEO와 관련하여 - 나는 의미 론적으로 마크 업 된 코드가 RDF, HTML 5 요소와 같은 스펙을 많이 가지고 있지만 요즘은 의미가 점점 커지고 있다고 믿습니다. 네가 할 수있는만큼 의미 론적이다.
는 2010 년, 구글은 세 가지 형태 그들의 시스템은 웹 페이지 내에서 구조화 된 의미 론적 콘텐츠를 검색하는 데 사용할 구조화 된 메타 데이터의 를 지정했습니다. 페이지가 검색 목록에 나타날 때 이러한 정보, 리뷰, 개인 프로필, 업체 목록과 관련된 경우, 및 이벤트 에 구글에 의해 사용됩니다은 '조각', 또는 표시됩니다 인용 텍스트의 짧은 조각 을 향상 . Google은 데이터가 마이크로 데이터, 마이크로 포맷 또는 RDFa를 사용하여 주어진 일 수 있다고 명시합니다. [13] Microdata는 itemtype에 을 지정하고 기존 HTML에 itemprop 속성을 추가했습니다. 요소; microformat 키워드는 위에서 설명한 과 같이 클래스 속성 내에 입니다. RDFa는 rel, typeof 및 속성 속성 을 기존 요소에 추가합니다. [14]
마크 업은 표시 목적이 아닌 의미 론적이기 때문에
문서를 읽는 사람은 누구나 <ul><li>...</li></ul> 태그로 마크 업된 섹션이 목록임을 즉시 알 수 있습니다.
CSS는 설명하지 않습니다. 무엇 무엇이 렌더링되어야합니다. 이상적으로는 문서의 각 부분을 으로 나타내려면 마크 업해야하고 CSS를 사용하여 적절하게 렌더링해야합니다.
UL, LI 및 OL은 목록이라는 특정 목적으로 생성 된 HTML 요소이기 때문에. 적절한 마크 업을 사용하면 콘텐츠에 더 많은 정보를 추가함으로써 코드를 볼 수있는 자동화 된 도구가 목록임을 알고 그에 따라 행동 할 수 있습니다. 당신이 목록 항목 내부의 링크를 원하는 경우에
, 당신은 LI 안에 중첩하는 A 요소를 넣을 수 있습니다 : 의미로 충분히 확신하지 사람들을 위해
<ul>
<li><a href="example.com">Example</a></li>
</ul>
을, 나는 그것의 공정은 또한 목록을 사용하여 언급하는 생각 태그를 두 번째 레벨 탐색을 포함하도록 멋지게 확장 할 수 있습니다. 그런 다음 일부 CSS (그리고 IE 용으로 자바 스크립트)와 bosh ...을 추가하면 ... superfish 메뉴가 있습니다.
감사합니다. 검색 엔진에 영향을 미칩니 까? –