이 두 가지 용어의 차이점
어떤 산업이나 직업과 마찬가지로 웹 디자인은 모든 언어가 있습니다. 업계에 들어가서 동료들과 이야기를 시작하면 의심 할 여지없이 새로운 용어와 문구가 나오지만 동료 웹 전문가의 방언이 흐릅니다. 듣게 될 용어 중 두 가지는 HTML "태그"와 "요소"입니다.
이 두 가지 용어를 사용하는 것을 들었을 때,이 두 용어가 다소 상호 교환 적으로 사용되고 있음을 알 수 있습니다. 따라서 많은 새로운 웹 전문가가 HTML 코드 작업을 시작할 때 갖는 한 가지 질문은 "HTML 태그와 HTML 요소의 차이점은 무엇입니까?"입니다.
이 두 용어는 의미가 비슷하지만 실제로 동의어는 아닙니다. 그렇다면이 두 용어의 유사점은 무엇입니까? 짧은 대답은 태그와 요소 모두 HTML을 작성하는 데 사용 된 마크 업을 가리킨다는 것입니다. 예를 들어,
태그를 사용하여 단락을 정의하거나 요소를 사용하여 링크를 작성한다고 말할 수 있습니다. 많은 사람들이 태그와 요소를 서로 바꾸어 사용할 수 있습니다. 웹 디자이너 나 개발자가 말한 내용을 이해할 수는 있지만 실제로는 두 용어 사이에 약간의 차이가 있습니다.
HTML 태그
HTML은 마크 업 언어 입니다. 즉, 먼저 컴파일 할 필요없이 사람이 읽을 수있는 코드로 작성되었습니다. 즉, 웹 페이지의 텍스트는 이러한 코드로 "마크 업"되어 텍스트를 표시하는 방법에 대한 웹 브라우저 지침을 제공합니다. 이러한 마크 업 태그는 HTML 태그 자체입니다.
HTML을 작성할 때 HTML 태그를 작성하고 있습니다. 모든 HTML 태그는 다음과 같은 여러 가지 특정 부분으로 구성됩니다.
- 보다 작음 기호 <
- 쓰여지고있는 태그를 결정하는 단어 또는 문자
- name = "value"쌍의 형식으로 된 임의의 수의 선택적 HTML 속성
- 그리고 마지막으로 더 큰 부호>
예를 들어 다음은 일부 HTML 태그입니다.
-
-
이들은 HTML 애트리뷰트가 추가되지 않은 모든 HTML 시작 태그입니다. 이 태그는 다음을 나타냅니다.
-
- 단락을 정의합니다.
- - 페이지를 HTML로 정의합니다.
- - 나눗셈을 정의합니다.
다음은 HTML 태그입니다.
-
이 예제에는 모두 시작 HTML 태그에 추가 된 속성이 포함됩니다.
-
- 은 ID 속성을 포함하는 정렬되지 않은 목록입니다.
- 부서에는 클래스 속성이 있습니다.
- 앵커 또는 링크 요소에는 'href'속성이 포함됩니다.
- "src"속성을 가진 이미지 태그
앵커 및 이미지 태그의 경우 속성은 실제로 선택 사항이 아니며 태그가 올바르게 표시되는 데 필요합니다. 링크 ( "href"의 역할)와 이미지의 표시 위치 ( "src"속성이 제공하는 것)를 링크에 알려줘야합니다.
HTML 요소 란 무엇입니까?
W3C HTML 사양에 따르면 요소 는 HTML의 기본 구성 요소 이며 일반적으로 시작 태그와 종료 태그라는 두 개의 태그 로 구성됩니다. 지금까지 요소를 시작하는 여는 태그 만 살펴 봤습니다. 해당 요소를 끝내려면 해당 종료 태그를 씁니다.
예를 들어 paragraph 요소의 경우 다음과 같이 작성합니다.
p>
이것은 우리가 잠시 전에 본 오프닝 태그와 닫는 태그로 구성됩니다 - p>. 닫는 태그는 실제로 여는 태그 일 뿐이며 "미만 기호"바로 뒤에 "슬래시"가 추가됩니다.
거의 모든 HTML 요소에는 여는 태그와 닫는 태그가 있습니다. 이 태그는 웹 페이지에 표시 할 텍스트를 둘러 쌉니다. 예를 들어 텍스트 단락을 작성하려면 페이지에 표시 할 텍스트를 작성한 다음이 태그로 둘러싸십시오.
웹 페이지에 표시 할 단락의 텍스트를 작성하는 곳입니다. p>
일부 HTML 요소에는 닫기 태그가 없습니다. 이를 "빈 요소"라고합니다. 때로는 " 싱글 톤 (singleton) "또는 "무효 (void)"요소라고도합니다. 빈 요소는 웹 페이지에 하나의 태그 만 포함시켜야하기 때문에 사용하기 쉽고 브라우저는 무엇을해야하는지 알 수 있습니다. 예를 들어 페이지에 한 줄 바꿈을 추가하려면 b
태그를 사용합니다.시작 태그 만 포함하는 또 다른 공통 요소는 "이미지"요소입니다. 예 :
이 예제를 더 일찍 보았지만이 이미지 요소에 닫기 태그가 없습니다. 브라우저는 단순히이 코드를 "href"속성에서 참조되는 이미지로 대체합니다. 이 경우 "logo.png"가됩니다.
일반적으로 HTML 요소 나 태그를 참조 할 때 "요소"라는 용어를 사용하여 요소의 모든 부분 (여는 태그와 닫는 태그 모두)을 나타냅니다. 나는 "태그"를 사용한다. 나는 정말로 하나 또는 다른 것을 말하는 것이다. 이것이이 두 용어의 올바른 사용법이며, 당신이 그것들을 적절하게 사용하도록 권장합니다. 그러나 조금 미끄러지고 상호 교환한다면, 당신은 여전히 새로운 웹 개발 동료들에 의해 이해 될 것입니다!
Jennifer Krynin의 원본 기사입니다. 제레미 지라드 편집 됨 : 7/21/17
-