[TIL] 211122

---

느낀점

- 부트스트랩 진도를 오랫동안 나가고, 테일윈드 진도를 나가 배운점이 많이 없었던 것 같다. 그래도 아래와 같은 사항을 배웠다. 적더라도 배운 점이 있으니 차곡차곡 쌓이고 있다.

 

배운점

 

- clip 속성은 요소의 부분을 잘라주는 속성이다. position absolute일 때만 적용된다. 네이버는 clip 속성을 이용해서 ir을 적용한다. 그러나 clip은 현재 deprecated 됐고, clip-path가 새로 나왔다. 하지만 clip-path는 ie 10부터 지원이 되기 때문에 clip속성을 사용하는 듯 싶다.

 

- kraken optimizer를 사용하면 이미지 최적화를 시켜준다.

 

- css sprite기법은 여러 이미지를 하나의 파일에 배치해서 서버 부담을 줄이게 한다. 스프라이트로 만든 이미지 자체가 분할 된 이미지보다 크다면 사용하면 안된다. 적당한 크기로 사용해야한다. 업데이트가 되는 이미지에는 사용하면 안된다.

 

- 폰트를 다운받기 부담스럽다면, 아주 적은 부분 때문에 폰트를 다운받고 싶다면 그냥 이미지로 만들어버리는게 효율이 좋다.

 

- 레티나란 애플이 만든 인간의 눈으로는 화소를 구분할 수 없는 화소 밀도를 가진 브랜드 이름이다. 물리픽셀에 맞게 렌더링된 이미지가 논리픽셀만큼 커져버리게 돼서 화면에 이미지가 깨지기 때문에 화면에 그리고자하는 사이즈의 2*2배 되는 이미지를 준비하면 해결된다.

백그라운드 이미지를 두배로 줄이고 포지션 위치 역시 절반으로 줄여서 적용시킨다. device-pixel-racio로 알아보면 된다.

 

- 부트스트랩은 주제가 바뀔 때 마다 container를 쓴다. 디자인이 바뀌면 row로 묶는다.