<img>태그 회고

1. img 태그는 src속성을 반드시 갇는다.

2. alt 속성을 입력해주면 이미지가 보이지 않을 때 alt에 텍스트를 대신 보여준다.

3. alt값을 무조건 넣어줘야하는 건 아니다. 디자인을 위한 이미지는 굳이 넣을 필요가 없다.(스크린리더기를 사용 할 때 불필요한 alt가 많으면 사용자가 불편해진다.)

4. 위의 상황에서는 alt값을 공백으로 넣어둔다.

5. 절대경로: /는 루트 절대경로
상대경로: ./ 현재 위치
../ 하나 밖의 위치

serset

- serset은 브라우져가 최상의 이미지를 랜더링하는데 도움을 준다. 설정에 따라 두가지 이상의 이미지 선택권을 브라우져에게 준다.

- serset은 이미지가 큰거부터 작성해야한다.

- w서술자와 x 서술자는 동시에 사용할 수는 없지만 미디어쿼리를 이용하면 사용해질 수 있다.

X서술자 : 이미지 화소의 밀도에 따른 이미지 선택

W서술자: 화면의 넓이에 따라 이미지 선택

size속성: 뷰포트 조건에 따라 이미지의 사이즈를 결정한다.

<picture>

- 각기 다른 디스플레이 혹은 디바이스에 따라 조건에 맞는 이미지를 보여주는 요소이다.

-picture안에는 img 태그 필수이다.

점진적 향상 기법

전 버전에서 쓸수있게 하고 향상된 버전에서도 쓸 수 있게 만들어 놓는것을 뜻한다. 한번에 업데이트를 하지 않고 지속적으로 버전을 업그레이드 해 나가는 것을 뜻한다.

이미지 포맷의 종류

- Svg 단점: 이미지 모양이 복잡해지면 코드가 많아짐으로 용량이 기하 급수적으로 증가한다. 그래서 이모지 같은 단순한 이모티콘 회사로고 등에 자주 사용된다.

- Type속성의 입력한 포맷이 전부 사용가능하면 가장 먼저 입력한 포맷이 랜더링된다.