본문 바로가기

IT

스킨 업데이트 v 2.0.1 초고해상도(1920px 이상)에서 탑바와 하단부가 삐져나가는 문제를 수정했습니다. 스킨의 컨테이너 최대크기는 1920px으로 잡아놓았기 때문에 그 이상으로는 안 커집니다. 모바일에서 좀 더 누르기 쉬운 버튼으로 상단 메뉴 디자인을 바꾸었습니다. 크기를 키우고 애니메이션을 제거하여 프레임 드랍도 줄였습니다. 티에디션에 있는 상단 슬라이더에 컨트롤 부가 마우스 호버시에만 노출됩니다. 섬네일 갯수를 12개에서 24개로 증가했습니다. 기타) 네이버 이웃커넥트 버튼이 추가 되었습니다. 더보기
Simple Calendar 이미지 없이 소프트웨어 랜더링으로만 구성된 위젯입니다.소스는 제가 쓴게 아니고 컨버전, 최적화용 세부수정 만 했습니다. 원본 소스& 저작자 - http://codepen.io/WhiteWolfWizard/pen/cFArl ※터치됩니다. 더보기
구글 유입이 폭발하고 있습니다. 사이트 구조만 HTML5의 시맨틱 구조로 전환 했을 뿐인데... 유입 경로 페이지에서 70%는 전부 구글입니다. @_@구글이 HTML5로 구성된 사이트에 보상의 의미로 검색 유입을 약간 더 몰아준다는 말은 암암리에 듣고 있었지만 엄청나네요...체감상 1.5배는 되는 것 같습니다. 헤헤 HTML5 Rocks 라고 구글에서 지원하는 프로잭트가 있습니다. 심심하면 들어가서 둘러보시는 것도 좋습니다. 더보기
구글 웹폰트 안티 얼라이징 문제 많은 티스토리 블로거 분들이 크로스 브라우징의 용이성 때문에 구글 웹폰트를 사용하고 계실 것입니다. 특히 IE9+와 파이어폭스에서는 보안상의 이유로 알 수 없는 게시자나 동일하지 않은 주소에서 호스팅을 하는 woff 폰트 파일은 다운로드 하지 않도록 설정 되어있습니다. 그렇다보니 티스토리의 스킨 폴더에 폰트를 올려놓고 로드를 시켜도 IE나 파이어폭스에서는 정상적으로 로드가 되지 않습니다. 그러나 구글 웹폰트는 정상적으로 로드가 잘 됩니다. 하지만 여기서 한가지 문제점이 있습니다. 지난 2012년 7월 업데이트 된 크롬 이후 부터는 윈도우에서 외부 woff 렌더링시 안티얼라이징이 지원되지 않고 있습니다. OS X나 리눅스에서 돌리는 크롬에서는 아무 문제가 없으며, 오직 윈도우에서만 발생하고 있는 버그로, .. 더보기
Simple Digital 폰트 없이 소프트웨어 랜더링으로만 구성된 위젯입니다. 소스는 제가 쓴게 아니고 컨버전만 했습니다. 원본 소스& 저작자 - http://codepen.io/mesutgok/pen/dlqGy 더보기
Syntax Highlighting 기능 추가 했습니다. 이전부터 Syntax Highlighting 에는 SyntaxHighligher를 사용해 왔으나, 이번에는 좀 더 커스텀을 많이 할 수 있는 Highligter.js로 갈아탔습니다. SH 보다 장점이라고 하면 더 광범위 하게 적용 되는 스타일이라고 보시면 됩니다. 게다가 테마도 많아서 굳이 새로 만들필요도 없더군요. 기존에 있던것 가져다가 약간 변형만 시켰습니다. SH는 브러시라는 개념으로 자신이 쓸 언어의 갯수만큼 스크립트 파일을 추가해줘야 하나, Highlight.js는 자체적으로 선택해서 단일 파일을 생성할 수 있는 점이 참 마음에 듭니다. 저 같은 경우 제가 현재 쓰고 있는 CSS,HTTP,Javascript,Ruby,CoffeeScript,PHP,Markdown,HTML/XML,Python,Ha.. 더보기
Fill Clock 이미지 없이 소프트웨어 랜더링으로만 구성된 위젯입니다. 소스는 제가 쓴게 아니고 컨버전 + 자잘한 수정만 했습니다. 웹폰트에서 시스템 폰트로 교체/ 색상 변경 원본 소스& 저작자 - http://codepen.io/laksamanakeris/pen/Drdvi 더보기
아이썅 마이크로소프트 개자식들 보시다시피 IE8 스텐다드뷰와 IE7 스텐다드 뷰가 다르게 뜹니다. 예전에 풍문으로 margin과 padding 처리 방식이 두개가 약간씩 다르다는 것을 알고 있었지만 이정도 일줄은 몰랐내요 -_-;; IE fallback 스킨은 IE8 기준으로 만들어져있어서 IE7에서는 레이아웃이 깨집니다. IE7용으로 스킨을 따로 만들어야겠습니다. 아오 귀찮. IE5 쿽스모드에서 신기하게도 문제 없이 잘뜹니다. (물론 레이아웃이 좀 깨지긴 하지만요) 근데 왜 IE 개발도구에는 IE6이 없는건지... (기왕이면 쿽스 모드라도 넣어줘 이 새끼들아) 더보기
스킨 구조 플로우 차트 심심해서 현재 사용중인 Life is a Journey v.2의 구조를 플로우 차트로 만들어 보았습니다. SVG이미지 이기 때문에 구형 브라우저에서는 보이지 않습니다. 구현방식이 꽤 삽질을 해서 알아낸 방식이라 그렇지 실제로는 정말 별거 아닙니다. 스크립트가 브라우저와 카테고리를 구분 시켜주고, 그에 맞게 CSS만 넣어주면 알아서 됩니다. 웹 언어 처음 배울때는 ‘도대체 이런걸 어떻게 하는 거지’ 했는데 점점 비슷한걸 만들어가고 있습니다. ㅎㅎ 더보기
티스토리 역사상 가장 막장스킨 후속작 한때 제 블로그에서 화제가 되었던 것 중 하나가 바로, 이 멋드지고 간지터는 IE 전용 스킨 입니다. 최신 브라우저 용 스킨보다 더 큰 호응을 받았던 작품으로 “흡사 눈뽕맞는 기분이 이렇지 않을까" 라는 과분한 평가까지 주변사람들이 해주었습니다. 그래서 이번에 차기 작은 어떻게 만들어야 할지 상당한 고민을 했습니다. 흰 바탕에 흰 글자로 써볼지, 아니면 빨간 바탕에 주황색 글자를 써볼지 등등 아주 여러가지 시안을 만들었습니다. 곰곰히 생각하다가 보니, 이번에는 그냥 흰 바탕에 검은 글씨를 쓰는게 어떨까? 라는 아주 좋은 아이디어가 나왔고 그에 맞춰 스킨을 만들었습니다. 이전에는 맞지도 않는 IE8에서 미디어 쿼리를 꼼수로 작동시킬 수 있다는 명분으로 기존 스킨을 어거지로 돌렸으나, 아무리 생각해도 제대로.. 더보기

티스토리툴바