웹 브라우저 개발자 도구 [F12]
주요 웹 브라우저에서 F12 키를 누르면 개발자 도구를 활성화 할 수 있다. 이것을 이용하여 웹 페이지를 디버그 하거나 테스트, 속도를 향상 시킬 수도 있다. 개발자 도구는 각각의 브라우저마다 조금씩 모습이 다르지만 기능은 비슷하다.
[개발자 도구 활용]
Ctrl + 마우스 휠을 이용해 가장 많이 이용하는 배율로 (100% 혹은 110%) 맞추어 놓고 이 개발자 도구를 이용하면 블로그나 홈페이지를 제작할 때 필요한 타이틀 이미지 크기 혹은 비율 등을 알아낼 수 있다. 우측에 html로 표기되는 값들에 마우스를 가져다 대면, 좌측 화면에 자신이 마우스를 갖다 댄 부분이 푸르스름하게 표기되며 그 부분의 사이즈가 픽셀 단위로 표기된다.
[픽셀 표기]
이렇게 픽셀로 표기된 이미지 사이즈를 알아냈다면 포토샵이나 기타 이미지 편집프로그램을 이용해 이미지를 제작할 때 캔버스사이즈를 이에 맞춰 제작하면 된다.
[포토샵 캔버스 사이즈 조절]
'성장과정 > 블로그' 카테고리의 다른 글
2017 블로그 결산, 2017 티스토리 결산 (0) | 2018.01.11 |
---|---|
티스토리 포토업로더 오류해결 (0) | 2017.06.01 |
티스토리 블로그 카테고리 펼쳐놓는 방법 (1) | 2017.05.31 |
구글 애드센스 사이트 추가 방법 (0) | 2017.03.07 |
네이버에 티스토리 블로그 노출시키는 간단한 방법 (0) | 2017.03.05 |