이 기사에서는 이전의 완벽한 동화에 나오는 html 태그에 주의를 기울입니다. 이 태그는 해롭고, 나쁘고, 명백히 보기 흉하며, 표준 HTML에서 제외되어야 합니다. 작업을 절반만 수행하려면 브라우저를 바꾸거나 더 간단하고 권장되는 새 태그를 사용하세요. 라벨.
이전 기본 튜토리얼에서는 표준에 맞는 제안을 제공했지만 초보자에게는 기초가 다르거나 잘못된 연습이 있습니다.
HTML은 성능에서 의미론으로 전환한 다음 의미론(HTML)과 성능(CSS)을 분리하려고 합니다. 단일 표시 지시문(CSS 파일)을 여러 페이지에서 사용할 수 있기 때문에 이는 웹 페이지에서 널리 사용되었습니다. 이렇게 하면 웹사이트 관리가 더 쉬워지고, 사이트 전체를 변경하고 싶을 경우에는 심플코드만 변경하면 됩니다.
일부 유해한 태그는 실제로는 CSS에서 동일한 의미를 갖는 코드로 대체될 수 있는 간단한 표시 태그(예: 소형)입니다. 다른 태그는 표현력이 없지만 불필요하거나(예: 글꼴 태그) 사용성에 해롭습니다(예: 깜박임).
태그
아래 나열된 태그는 더 나은 옵션을 사용할 수 있습니다.
b 태그는 굵게 표시됨을 의미합니다. 대신에 Strong을 사용하거나 CSS에 Font-Weight:bold를 추가할 수 있습니다.
i는 기울임꼴 요소를 나타냅니다. 대신 em을 사용하거나 CSS에 글꼴 스타일: 기울임꼴을 추가할 수 있습니다.
Big은 큰 텍스트를 표현하는 데 사용됩니다. 대신에 제목에 h1, h2 등을 사용할 수 있습니다. 다른 것들은 cssfont-size에서 구체적으로 제어할 수 있습니다.
Small은 작은 텍스트를 표현하는 데 사용되며 cssfont-size로 제어할 수 있습니다.
hr은 수평선을 나타내며, CSS에서는 border-top이나 border-bottom으로 대체할 수 있으며, 이미지로도 표현할 수 있습니다.
위에서 언급한 태그는 모두 최신 HTML 표준을 따르지만 콘텐츠에 의미론적 의미를 부여하지는 않습니다. 더 많은 용도로 사용될 수 있지만 크게 해롭지는 않으며 아래의 형편없는 라벨 위에 서 있을 때 실수를 저지르기가 매우 쉽습니다.
u는 밑줄 친 요소를 나타냅니다. 연결처럼 텍스트에 밑줄이 그어진 상태를 유지하므로 이 태그가 사라진 이유일 수 있습니다. 사람들은 연결되지 않은 텍스트에 밑줄을 긋는 것을 정말 좋아하지 않습니다.
center 요소를 중앙에 배치할 수 있습니다. CSS 속성 text-align은 중앙 중앙뿐만 아니라 왼쪽, 오른쪽 및 양쪽 맞춤도 가능합니다. menu는 메뉴 목록을 만드는 데 사용됩니다. ul보다 더 훌륭하지만 순서가 지정되지 않은 목록이 더 일반적이며 ul이 메뉴를 대체합니다.
레이어 요소는 div 요소와 매우 유사하지만 이전 버전의 Netscape 브라우저에서만 작동하며 거의 사용되지 않습니다.
깜박이거나 선택 윤곽. 그들에게 단호하게 거절하십시오.
글꼴은 글꼴의 이름, 크기 및 색상을 정의하는 데 사용할 수 있습니다. 페이지 전체에 지속적으로 글꼴 태그를 사용하는 오래된 웹사이트(심지어 최신 웹사이트도 포함)는 흰개미 전염병과 같습니다. 웹 제작 소프트웨어의 일부는 각 요소 주위에 글꼴 태그를 배치하여 텍스트 색상이나 크기를 제어합니다. 글꼴 태그를 사용하여 모든 요소에 적용할 수 있습니다. CSS로 표현하면 간단한 문장만으로도 사이트 전체에서 변경할 수 있습니다. 이 방법을 사용하면 웹페이지의 크기를 줄일 수 있을 뿐만 아니라 간단한 CSS 문만 변경하면 글꼴이 나타내는 내용도 변경할 수 있습니다. 이렇게 하면 웹사이트 스타일이 일관되게 유지됩니다. 글꼴 태그와 표의 오용은 웹 페이지가 커지는 주요 원인입니다.
속성
이제 라벨을 올바르게 사용하고 있을 수 있지만 맛이 나빠질 수 있는 성가신 기생 특성이 있습니다.
name은 입력과 같은 양식 요소에서 완벽하게 작동하는 요소에 이름을 할당하지만 다른 곳에서는 이름의 작업이 id 속성에 의해 인계됩니다.
text 및 bgcolor는 열린 body 태그의 기본 텍스트 색상과 배경색을 지정하는 데 사용됩니다. CSS의 색상 및 배경색 속성은 본문 선택기에 잘 적용될 수 있습니다.
background는 body 태그의 배경 이미지를 지정할 수 있습니다. CSS는 background-image와 같은 더 나은 배경 이미지 속성을 제공할 수 있습니다.
link, alink, vlink는 body 태그의 링크 색상을 지정할 수 있습니다. CSS 속성: :link, :active, :visited는 동일한 효과를 갖습니다. align은 <div align="center">Stuff</div>와 같은 요소의 배열을 제어할 수 있지만 center 태그와 마찬가지로 CSS에서 text-align 속성을 사용할 수 있습니다.
<a href="wherever.html" target="_blank">도움말</a> 새 창을 여는 등 다양한 상태로 대상 링크가 열립니다. 듣기에는 좋지만 사이트에 익숙하지 않은 것 같습니다. 사용자는 이러한 기능(예: 새 창 열기)이 마술처럼 나타날 것이라고 기대하지 않습니다. 대부분의 사용자는 "뒤로" 버튼을 사용하는 것을 좋아하며 새 창을 열면 이 기능이 비활성화됩니다. 이미지의 너비와 높이, 테이블의 셀 패딩 및 셀 간격과 같은 태그의 성능 속성에 따라 다양한 요소에 대한 다양한 속성의 적용이 결정됩니다. 완벽한 솔루션은 아니지만 페이지에 이미지나 표가 많으면 실행 가능한 다른 옵션이 없을 수도 있습니다.
설명할 수 없는 프레젠테이션 속성의 대부분은 textarea 태그에 속합니다. 이 태그에는 열과 행의 유효한 속성이 있을 뿐만 아니라 최신 HTML 표준에서도 이를 요구합니다.
좋은 라벨, 나쁜 적용.
집에 들어가려면 무릎을 꿇고 개구멍을 통해 기어야 할 수도 있지만 잠깐만요, 사람들을 위해 특별히 디자인된 문 장식이 있습니다. 손잡이, 하하, 보세요, 문은 사람들이 지나갈 수 있는 적당한 크기입니다.
HTML 태그는 세부 사항을 고려하여 설계되었으며 믿거나 말거나 올바르게 사용하면 최상의 결과를 얻을 수 있습니다.
HTML이 의미론적이면 웹 페이지는 ul 태그를 사용하여 목록을 강조하거나 h1 또는 h2 태그를 사용하여 제목을 강조하는 스크린 리더와 같이 장애가 있는 사용자에게 더 유용합니다.
HTML의 가장 심각한 남용은 테이블이 레이아웃에 사용되지만 테이블 형식 데이터를 나타내는 데만 사용됩니다. 테이블 레이아웃을 사용하지 않는 아이디어는 불교처럼 깨달음을 구하려는 것이 아닙니다. 웹 페이지의 크기를 줄일 수 있을 뿐만 아니라 웹 페이지를 더 쉽게 유지하고 다시 디자인할 수 있다는 실질적인 이점이 있습니다.
때때로 일부 디자이너는 일부 태그와 속성을 사용하여 과도기적 디자인(특히 테이블 레이아웃)을 완성합니다. 첫째, 이전 버전의 브라우저(Netscape 4)를 지원할 수 있습니다. 테이블은 Netscape 4에서 CSS보다 성능이 좋았지만 사용자가 매우 적었고 모바일 사용자가 늘어나면서 테이블 레이아웃이 매우 나빴습니다. 위에서 언급한 테이블의 장점은 단점보다 훨씬 크며, 그 이유는 페이지가 가능한 한 최소한의 스타일로 모든 브라우저 기능을 고려해야 하기 때문입니다.
프레임
Goldilocks는 죽 한 그릇으로 그녀를 도와주는 것이 아주 좋은 생각이라고 생각하지만 세 명의 큰 포식자가 나타나 그녀를 창 밖으로 내던집니다. 틀은 곰의 죽 한 그릇과 같습니다. 보기에는 좋아 보이지만 위험은 항상 존재합니다.
대부분의 웹사이트는 프레임을 사용하지 않으며, 대부분의 웹사이트 사용자는 단일 페이지만 사용합니다.
그러나 어떤 이유로 사용자가 북마크에 특정 페이지를 추가하지 못하도록 해야 하거나 특정 페이지가 이메일이나 인스턴트 메시징을 통해 소개되는 것을 방지해야 하거나 사용에 또 다른 수준의 전반적인 복잡성을 추가하려는 경우에는 어떻게 해야 할까요? 화면 읽기 프레임 사이를 탐색해야 하는 브라우저 비활성화 사용자 또는 검색 엔진 지옥에 들어가고 싶은 경우 프레임을 사용하세요.
기본적으로 프레임워크는 복잡성을 추가하고 유용성을 잃습니다.
마지막으로, 아래 규칙을 따르면 크게 잘못되지는 않을 것입니다.
1) 라벨이나 속성의 이름이 비교적 낯선 경우에는 주석을 달거나 사용하지 않는 것이 좋습니다. 이런 식으로 CSS 사용의 효율성이 향상됩니다.
2) 레이블이 이름에 따른 작업을 수행하도록 하십시오. 테이블은 테이블 형식 데이터에 사용됩니다. 제목 등을 제목으로 사용하세요.
3) 콘텐츠가 명확할 경우 적절한 태그를 사용하세요. 목록에는 목록을 사용하고 제목에는 제목 등을 사용하십시오.