국비지원교육 17일차(4주차)

오늘은 강사님이 바뀌게 되면서 그동안 배웠던 내용을 복습했다.

매우 중요한 내용들이 많았다.

 

우선 엄청 중요한 사이트를 알게 되었는데

프론트엔드를 공부한다면 매우매우 유용한 사이트이다.

https://poiemaweb.com/

웹 프로그래밍 튜토리얼 | PoiemaWeb

 

여기서 페이지들을 넘어가면서 중요 내용과 복습을 진행했다.

 

HTML에 관한 내용을 복습했는데,

파란색이 태그 라고 하는 부분이고, 빨간색이 콘텐츠라고 하는 부분이다.

 

 

 

title

 

title은 요소에 관한 제목을 지정한다.
마우스를 올리면 그 내용에 대한 설명이 나온다.

hellow world 글자 위에 마우스를 올리면 [이게 타이틀입니당]이라는 글씨가 나오게 된다.

 

 

번외) title요소는 비장애인들을 위한 요소라기보단 장애인들을 위한 요소라고 생각하면 편하다. 예를들어 시각장애인의 경우 title로 내용들을 읽을 수 있는 프로그램으로 사용할 수 있기 때문이다.

이로인해 요즘 유럽에선 장애인 차별로 인한 소송이 많다고 한다. 혹시라도 추후에 한국도 이런것들이 생길 수도 있으니까 알아두면 유용하다고 생각한다. 무엇이든 모르는것보단 아는게 좋다 생각한다.

또한 강사님은 당연히 개발자로서 여러부분에 대한 배려들이 필요하기도 하니 생각해볼 부분이라며 추가로 설명해주시기도 한 부분이다.

 

 

 

주석

 

공부하는 입장에서 이 태그나 내용들이 왜 필요한지 주석을 달아두면 좋다.
습관들여놓으면 좋기 때문에 안쓸 이유가 없다. 습관 안들여놓으면 귀찮아서 못쓰게 된다.

아마 나의 개인적인 생각으로 회사에서는 프로젝트를 개인 개발이 아닌 모두가 다같이 만들기 때문이지 않을까 생각한다.

 

 

 

 

시맨틱요소

시맨틱은 "기계가 잘 알아들을 수 있는"이란 용어로 해석하면 편하다.

 

랜드마크 태그 종류

레이아웃 태그들인데, header nav aside 등이 있다.

 

vscode 간단한 이용법

 

단축키

◆바로 실행하기(작업하고 있는 화면을 바로 볼 수 있음)

Alt+L+O 바로 크롬창

◆ 한줄 복사
Alt+Shift+위
Alt+Shift+아래

◆ 한줄 이동
Alt+방향키(위아래)

 

 

table태그

 

table 태그는 무언가 추가 삭제, 중간 삽입 등이 어려워서 요즘은 잘 사용하지 않는 태그이다.
하지만 table태그로 모든 웹페이지를 만들 수 있음!!!!
예전엔 다 이렇게 만들어져 현 시중은 70%는 table로 만들어졌다고 한다. 그래도 지금은 table로 잘 안만들어지는 추세이다.

 

이미지태그

 

이미지 태그를 만들때는 alt 속성을 사용하면 좋다!
alt는 이미지 파일이 없을 경우 표시되는 문장으로 멍멍이 사진을 추후 추가할거면 dog이런식으로 작성해주면 페이지를 구현할때 더 편할 것이다.