티스토리 뷰
안녕하세요. 티스토리 파비콘 설정에 대하여 알아보겠습니다. 파비콘. 웹 디자이너가 아니라면 다소 생소할 수 있는 이름입니다. 즐겨찾기와 아이콘의 합성어로 브라우저의 즐겨찾기, 주소창, 탭 등 은근히 많은 곳에 쓰이는 아이콘입니다. 아래의 이미지를 보시면 각 탭의 사이트마다 다른 디자인의 파비콘이 있는 것을 확인하실 수 있습니다.
이렇게 각각의 사이트에 파비콘이 있듯이 티스토리 개인 블로그에도 나만의 파비콘을 갖고 있다면 훨씬 전문적이며 본격적이고 좋아보일 겁니다. 기본적으로 티스토리는 블로그의 파비콘을 설정하지 않았다면 티스토리 파비콘이 뜰 것입니다. (네 번째 T 도트 아이콘) 하지만, 우리는 더 애착을 갖고 관리를 하고 싶기 때문에 파비콘을 설정하겠습니다.
포토샵을 이용하겠습니다.
파비콘은 브라우저의 즐겨찾기 목록이나 탭에 표시되기 때문에 굉장히 작은 사이즈 입니다. 16px*16px입니다. 가로 세로 16px을 선택하고 enter를 누릅니다.
사이즈가 정말 작습니다.
저는 미리 만들어 놓은 공작소 아이콘이 있기 때문에, 모두 선택(ctrl + a)후 복사(ctrl + c)합니다.
아까 만들어 둔 16px*16px창에 붙여넣기(ctrl+v)합니다. 이때 기존의 아이콘 이미지가 너무 커서 화면 안에 다 안 들어오시는 것을 확인하실 수 있으실 겁니다.
ctrl+t를 누르면 사이즈를 조절할 수 있는 틀이 보입니다.
그 상태에서 포토샵 상단의 W와 H에 정확히 16px을 입력해주세요. (기본 상태에서는 %가 적용되기 때문에 px까지 입력해주세요.)
입력된 사이즈로 틀이 변경되어 있을겁니다. 중앙을 클릭한 상태로 드레그 하여 이미지 중앙까지 옮깁니다.
ctrl++로 확인하여 칸안에 잘 들어갔는지, 확인하신 후 enter를 눌러주세요.
저는 아이콘의 배경이 투명하길 바라기 때문에 Background 레이어의 눈을 클릭하여 잠시 배경을 보이지 않도록 해줍니다. 정사각형의 아이콘이나 원 아이콘이어도 보여도 상관없으신 분들은 이 과정을 지나치세요.
다 되었습니다. ctrl+s를 눌러 저장합니다.
투명한 파비콘을 원하실 경우 저처럼 PNG형식을, 아니시라면 JPG형식을 선택해주세요. 파일 형식을 정한 후 저장을 눌러주세요.
포토샵 작업을 마친 파비콘이 저장된 폴더에 갑니다. png 또는 jpg상태의 확장명을 ico로 변경해야 하는데 보통은 확장명이 보이지 않으실 겁니다.
폴더 좌측 상단의 파일을 눌러주신 후 폴더 및 검색 옵션 변경(O)을 클릭합니다.
폴더 옵션의 보기 탭의 고급 설정에 알려진 파일 형식의 파일 확장명 숨기기란에 체크가 되어있을 것입니다.
이것을 클릭하여 체크를 풀어주신 후 적용 & 확인을 눌러주세요.
이제 확장명이 잘 보일겁니다.
파일 우클릭으로 이름 바꾸기를 해주시거나 더블클릭보다 텀을 두고 클릭 후 파일 명을 한번 더 클릭해주시면 바로 파일 명을 변경할 수 있습니다. 보시는 대로 png 또는 jpg를 삭제하시고 ico로 변경합니다.
ico로 변경 시 확장명 변경에 대한 경고를 합니다. 확실하게 ico라고 입력했는지 확인 후 예를 클릭합니다.
사이트에 업로드할 준비가 완료되었습니다.
티스토리 관리란에 보시면 블로그 란이 있습니다.
블로그 관리란에 아이콘과 파비콘이 있을 겁니다. 파비콘란의 불러오기를 클릭하시어 만들어둔 ico파일을 선택합니다.
선택 후 변경사항 저장버튼을 클릭하여 반드시 저장을 해주셔야 합니다.
저장 완료 버튼이 보이시면 모든 설정이 끝이 났습니다. 이제 내 티스토리 블로그로 달려가 파비콘이 정상적으로 설정되었는지 확인해주세요.
저는 개인적으로 만족합니다. 파비콘의 사이즈가 16px*16px으로 너무 작아서 픽셀 아트적인 아이콘이 더 어울릴 수 있겠지만 서도 이미 만들어 둔 아이콘이 있기 때문에 그냥 사용해봤습니다. 결과적으로 마음에 들어서 쭉 사용할 생각입니다. 파비콘, 이 작은 게 무슨 소용인가 싶겠지만 생각보다 설정이 끝나고 나서 탭을 볼 때마다 뿌듯함이 있습니다. 나만의 공간이다 라는 느낌과 애착이 가기 때문에 이런 기분은 블로그나 개인 사이트를 가질 때 중요한 점이라고 저는 생각합니다.
어떤 분에게는 쉬울 수도 있지만, 디자인 툴을 잘 모르시는 초보자 분들을 위해 만들어 보았습니다.
도움이 되셨다면 좋겠습니다.