18. 태그 종류에 상관없이 사용하는 글로벌 속성

태그들의 공통된 속성이다. 

안드로이드도 뷰들에 공통된 속성이 있잖은가? 물론 그건 뷰들이 View Class의 자식들이라서 그렇지만 무튼

layout_width,layout_height 등등 공통된 속성들이 있듯이. HTML에도 공통된 속성들이 있는데 그걸 글로벌 속성이라고 하는거같다. 

속성들을 보자면

 

글로벌 속성표

속성	값	설명
class	value	요소의 클래스값 세팅 CSS 클래스 선택자로 활용됨.
id	value	요소의 id값 세팅 CSS의 아이디 선택자로 활용됨.
style	style	요소에 인라인 스타일(스타일을 태그안에서 바로 정의하는것)을 지정한다.
title	text	요소의 추가 정보를 지정한다 마우스를 올리면(tooltip)으로 추가 정보가 표시됨.
lang	language code	요소에 사용한 텍스트의 언어 정보를 지정한다.
hidden	hidden	요소를 화면에 감춤
data-*	value	사용자가 임의의 속성을 만들수 있다.

다른것은 딱히 설명은 필요없을것같다. 어떠한 것들은 예제를 처리하면서 계속 써오던것들이고 어떤것들은 CSS에서 자세히 다룰것이므로 

표에서 값이라는것은 어떠한 형식을 나타내는것같다. 그냥 프로그래밍의 참조형 변수(Reference type 처럼 보면되는것)이고 조금 더 정리를 하고싶은 태그가 있는데. lang와 data-*속성이다.

 

1.lang 태그

해당 HTML문서의 기본 언어를 지정하는것으로 만약 lang = "ko" 로된 한글 문서안에 다른 언어가 들어갔을때 해당 요소에 속성으로 그 언어 코드를 지정해주면 그놈의 위대하고 경위롭고 신비로운 웹접근성에 큰 이바지를 할수 있다. (접근성은 참으로 중요한것 같다.) 내 생각이지만 영어로된 레퍼런스 페이지 번역시 lang속성을 지정하면 좀더 정확하게 번역되지 않을까? 한다.

 

2.data-*속성

말그대로 속성을 커스텀 할수 있는 기능인거같다. 뒤에 붙은 *(Astrisk 또는 별표라고 칭함)을 재정의 해서 사용한다. 
근데 이렇게 사용한 속성에대한 기능정의는 어떻게 처리되는지가 궁금해서 찾아보니까 해당 속성을 데이터셋 속성이라고 부르는것같고 javascript같은 프로그래밍 영역에서 사용할수 있는것같다. 일단은 HTML만을 위한 포스터이니 해당 부분은 그렇게만 알고 넘어가는것이 좋을것같다.

data-*속성 정의 예제.

 

See the Pen Untitled by Super Novice (@Super-Novice-the-typescripter) on CodePen.

설명

위에 코드 처럼 data-*(이부분을 변수처럼 정의)해서 사용가능하다. 
나중에 JavaScript를 공부할때 더욱 자세히 다루겠지.. 일단 여기까지 이해하고 넘어가면된다.

 

느낀점.

드디어 HTML의 기본적인 문법을 끝맞추었다. 하지만 다음은 css가 남았다. 

이런식으로 공부를 해본적이 너무 오래되었다. 일을 할당시에 공부하는 시절들이 그리웠는데.

막상 학생시절처럼 공부를 해보니까 생각보다 뭔가 엄청 힘들었다. 

일하면서 공부를 하는것은 무언가 응용하고 구조를 잡고 기본적인 개념을 다 배운상태에서 창조하는 재미를 느끼면서 공부를 해나가서 재미가 있었지만 HTML은 논리적인 사고로 문제를 푸는것도 아니였고 단순히 많은 태그들을 알아가는 공부였기때문에 조금 지루했고  블로그 작성이라는것이 시간을 더욱 잡아 먹기때문에 무언가 늪에 빠져서 허우적되는 느낌이였다. 

하지만 블로그를 작성하면서 배운 태그들이 더욱 기억에 남았고 table, caption, tr, th, td 태그 값은경우에는 코드펜으로 작성하면서 반복숙달을 할수 있었고. ul, ol, il, dt, dd등이 어떠한 의미의 약자인지를 작성하면서 기억이 더 남게되었다. 

어린시절 신입생활이 떠오른다. 아주 작은 4명의 회사에서 대학 졸업후 혼자 안드로이드개발을 하면서 삽질하고 커뮤니티에 질문하고 혼자 치킨 하나 시켜서 밤새 개발하던 시절에 블로그를 작성하면서 공부하였다면. 더욱 좋았을텐데... 그런 아쉬움이 남는다. 

지금도 주위 사람들이 놀고 있다고 생각한다. 빨리 일을 구해서 들어가서 배우라고 나에게 충고해준다. 무슨말인지는 알겠는데 그런식으로 배우면 깊이가 없다. 물론 매일 변화화는 기술을 따라잡고 공부하는것은 맞지만 기본적인 기능들은 거의 변하지 않는다. 그것은 확실하게 가지고 가야 나중에 문제가 안생긴다.

안드로이드도 얼마나 변했는가 이클립스에서 gradle도 없이 라이브러리 임포트 해서 개발하던시절부터 안드로이드 스트디오 까지 xml 레이아웃 작성하고 findByid로 매칭 하던 시절부터 DataBinding에 sqlite 부터 room까지 GCM 부터 FCM까지 ViewModel,LiveData,의존성주입 Hilt,Dagger까지 수도 없이 변했지만 Activity, Fragment, Service, 컨텍트 프로바이더,브로드캐스트 리시버의 개념이 변했나? 아니다. 기본은 그만큼 중요한것이다. Java로 개발하다 Kotlin으로 개발하든 람다 고차함수의 맛을보고 코루틴의 신을 경험하더라도 결국 화면은 Activity로 만들듯이(Compose가 무섭긴하지만) 웹도 화면은 HTML으로 구성하고 만들것이다. 그러므로 내가 지금 HTML을 배우는것은 결코 노는것이 아니고 시간낭비하는것이 아니라고 생각한다 !

자 css javascript를 넘어 리액트까지 달려보자~