본문 바로가기

Works/Blog Skin

[WIP] Meltdown Rev.2

이글루스를 시작으로 티스토리 스킨까지 기존에 있는 스킨들을 최신화, 코드 정리, 구조 / 속도 개선 작업을 할 예정이다. (사실 이거 2016년 7월에 했어야 했는데 1년이나 미루어졌다)



첫빠따(?)는 최초로 만든 이글루스 스킨인 Meltdown.


지금 와서 코드를 까보니 완전 개판오분전이다. 내가 이딴 스파게티 코드를 짜고 있었다니... 라고 자괴감이 드는 순간이다.



2014년에 짰던 코드 수준


지금 짜는 코드 수준


주요 변경 사항은 웹폰트 적용, compass 완전히 제거, 속도 개선, 자동 업데이트 기능 추가 등이다. 웹폰트와 rawgit의 속도 때문에 그다지 빠르진 않은 편이지만 일단 css가 케싱 되고 나면 퍼포먼스 상에 딱히 문제는 없어보인다. 어짜피 이글루스 구조도 개판인데 웹폰트 로딩이 개판으로 되는 것 쯤이야...


이게 3년전 스킨을 처음 만들었을때 포토샵으로 뽑은 목업이다.


이 때만 해도 css 왕초보 수준이라 꿈만 거창하게 머금고 만들어서 그런지 현실은 시궁창이었다.



특히 웹폰트에 대한 지식이 적을때라 (고작 할 줄아는 건 구글 폰트 땡겨오는 것), OFL로 제공되지마 구글 웹폰트에서 제공하지 않는 ostrich를 불러올 방법이 없었다. 티스토리 같으면 파일을 업로드해서 크롬이나 사파리에서 웹폰트가 나타나게 할 수 있지만, 파이어폭스에서는 불가능 하다.


결국 파이어폭스용 fallback을 만든다는 시도도 무참하게 실패하고 결국 비슷하게 생겨먹은 구글 폰트로 대체하는 것으로 타협을 본것이 내 이글루스 첫 스킨이다.



이후 코드를 좀 더 다듬어서 이글루스 스킨 벨리에서 바로 설치가 가능한 버전인 Meltdown 1.5를 만들었다.


결과물은 시궁창(...)이지만 뭐 간단하게 수정에서 올리는 게 이런 방법 밖에 없었으니 그러려니 한다.



어제, 오늘 만든 리비전2도 그 다지 썩 마음에 들진 않지만 (마음 같아서는 코드 다 갈아 엎고 새로 쓰고 싶지만) 고작 끽해야 20명 남짓이 쓰는 이글루스 스킨에 시간 쓰는 것은 전 우주적 낭비라고 생각함.