본문 바로가기

티스토리

스킨 제작 상황 - 끝없는 삽질의 연속 테스트 용 블로그에 적용 성공했습니다.사진을 보시면 아시듯이 좀 깨집니다.사실 좀 많이 깨져요.일단 안되는 것 나열 해보면검색안됨. 메인화면 안뜸. 티스토리 툴바 안뜸. 최근 글 안뜸. 댓글 작성 안됨. 방명록 안써짐. 단축키 안됨(이건 이해가 안되네요 -_-),안됨 안됨 안됨 하여튼 다 안됨아... 멘붕입니다. -_-body 안에 태그를 전부 갈아엎어야 할것 같네요티스토리 기본 스킨 내용물 긁어다가 그대로 복붙하고 그거 바탕으로 스타일링하는게 더 빠를것 같습니다.xhtml로 된건 시멘틱 태그로 바꿔주고.... 아이고 힘들어... 더보기
반응형 스킨제작시 스프라이트 이미지 때문에 발생하는 애로사항들... 현재 로딩속도 비약적 향상을 목표로 삼고 베경 이미지를 제외한 모든 이미지 요소를 스프라이트로 대체 했습니다. 하지만 이에 따른 예상치 못한 문제들이 속속들이 드러나고 있습니다. (오른쪽 플로팅 메뉴 주목) 하지만 옆에 플로팅 요소를 보면 아시듯이 스프라이트를 사용하면 img 요소로 바로 심는 것이 아니라 div나 span을 놓고 거기에 background-img를 사용해서 스프라이트를 CSS로 넣는 방식으로 가야합니다. 사실 이미지 파일 주소를 일일히 쳐넣는 것보다 단일 이미지 파일에 스프라이트 위치만 불러오면 되어 스타일링이 상당히 빠르고 편하지만 요소자체의 크기는 변하되 배경 이미지의 크기는 변하지 않아 반응형 이미지의 구현이 쉽지 않다는 단점이 있습니다. 다음도 현재 개편을 하여 큼직큼직한 스프라.. 더보기
PROTOTYPE 디자인 초안 입니다. 큰 변화 없이 이대로 만들어 지고 있어서 디자인 할때 사용한 PSD 파일의 모습을 공개합니다. 이대로 완성까지 만들어지면 정말 좋겠지만... HTML한계상 타협을 봐야 하는 점은 바뀔수도 있습니다. ^^; 더보기
코딩은 뒷전이고 워크 플로만드는데 시간 다 보내고 있네요 시간 좀 아껴보려고 오만 꼼수를 동원해서 워크 플로를 짜고 있는데 이것 때문에 시간이 더 걸리네요 -_-; 대충 구축한 워크 플로는 Coda2 + Zen Coding 조합으로 뺑이 없는 초고속 마크업 달성.CodeKit + Compass 로 쾌속 Sass 컴파일 달성. (심지어 자동 스프라이트 생성도 됩니다. ㄷㄷ)오토 리프레시로 옆에다 브라우저 띄워놓고 바로 마크업 하면 실시간으로 반영됩니다. 이거 뭐 초등학생때 나모 웹에디터 쓰는 기분이 나네요 ㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋ (나모 아직도 나오려나...) 구성하기가 좀 까다롭지만 해놓고 나니 전부 한방입니다. -_-b프레임웍 기반이지만 단일 CSS를 사용합니다. 모든 CSS를 하나로 컴파일 시켜버렸는데요, 그래서 무지막지하게 CSS 파일이 큽니다. -_- (압축.. 더보기
스킨 제작 상황 업데이트 프로토타입 스킨은 100% 모바일 퍼스트로 제작이 되었습니다. (모바일 퍼스트: 기존의 반응형 웹페이지가 PC 페이지를 축소시키는 방식 대신에 역순으로 모바일 페이지를 확장하는 방식으로 만드는 방식입니다.)모바일 뷰에서는 기본 메뉴 대신 별도의 메뉴를 따로 제공합니다.기본적인 마크업은 이제 다 끝났고 스타일링만 남았습니다.스타일링 끝나면 티스토리 최적화 작업도 해야하네요이전보다 많이 가볍긴한데.... 티스토리 CDN이 워낙 구려서... 실제 적용해봐야 퍼포먼스를 제대로 알수 있을듯 합니다. ^^ P.S 그나저나 Placeholder로 괭이 사진을 쓰고 있는데... 자꾸 괭이를 보니 집사가 되고 싶네요... 더보기
프로토타입 블로그 스킨 디자인 완료 이제 지옥의 마크업만이 남았네요 ㅋㅋ 요번에는 Sass로 작업을 해볼까합니다. 믹신이나 코드 네스팅도 참신하고 여러모로 작업량도 줄어들기 때문에 상당히 매력적이더군요 하지만 작성시 바로 압축해주는 프로그램이 없기 때문에 에디터에서 압축용 프로그램을 한번 거쳐야 한다는게 좀 까다롭긴 하네요... 아마 대중화가 되면 한방에 되는 프로그램도 나올것 같습니다. ^^ 더보기
또 또 스킨 깎습니다. 이번에는 배포용 스킨입니다. 현재 쓰고 있는 스킨이 좀 무겁다는 생각이 들어서 가볍게 만들 생각이고, 스킨을 깎을때마다 향상되는 마크업 실력을 늘이기 위함도 있습니다. -ㅁ- ㅋㅋ 현재 PSD를 열심히 깎고 있는데요, 그것보다 익숙하지 않은 Sass를 사용하는게 쵸큼 걱정이 됩니다. 쓰다보면 익숙해지긴 하겠지만 아직도 Mixin 같은것은 생소한지라 ^^; 레거시 지원은 힘닿는데까지 해보겠지만 IE7까지 지원할수 있을지도 약간 묘연합니다. 귀찮아서 IE는 접근시 다른브라우저 쓰라는 팝업하나만 달랑 띄워놓을까... 라는 위험한 생각을 잠시 하기도 했습니다. ^^; (빌 게이츠:하지만 방문자 통계를 보면 넌 그럴용기가 나지 않겠찌....) 더보기
저 빼고 다들 티스토리 초ㄷㅐ장 받으신것 같네요 [SIGH] 에라이... 뭐가 문제인진 몰라도 왜 나는 초대장을 안 주는거지... - 한숨쉬는 에스토크 보시다 시피 저는 요번달 초대장을 한장도 못 받았답니다. (제목을 저 따구로 적은건 티스토리가 제목만 보고 자동으로 글을 가져가서 초대장 베포란에 가져놓기 때문입니다.) 도대체 뭘 잘못한걸까? 티스토리에는 네이버에 비해서 포스팅에 쌍욕도 많이 안적었는데 이유가 뭘까? 저번에 대놓고 욕질한것 때문일까?? - 절규하는 에스토크 안 그래도 비도 추적 추적 오는데 초대장도 안주고 -_- 그래서 너무......... . . . . . . . . . . . . . . . . . . . . . . . 햄볶아요!!!!!!!!!!!!! 하하하하하하하하하 비꼬는게 아니라 저는 누구 줄지 대빵많이 고민하는 스타일인데 아예 안들어오니까.. 더보기
티스토리 속도향상 프로잭트 - 페이지 압축하기 Google Inspactor나 Site analysis의 권고 사항에는 html,css,js의 압축을 명시하고 있습니다. 따라서 페이지를 압축하면 비약적인 속도향상을 이뤄 낼수 있습니다. 페이지 압축을 위해 HTML compressor에 접속합니다. 제작자가 비트코인이나 라이트 코인으로 기부를 받고 있으니 채굴 좀 많이 하신 분이라면 기부를 하셔도 될 듯 합니다. ^^; 여기서 자신의 skin.html, css, 그리고 자신이 사용중인 자바스크립트를 붙여 넣고 하단에 compress를 누릅니다. 옆에 속성을 설정하는 메뉴가 있긴하지만 자동인식을 하기 때문에 귀찮게 따로 선택해줄 필요는 없습니다. 조금만 기다리면 압축률과 압축된 코드가 나옵니다. 제 블로그의 CSS의 같은 경우 77% 압축이 되었네요. .. 더보기
오픈케스트 페이지를 통째로 박아 넣었습니다. 매번 오픈케스트 들어가서 관리하기도 김귀찮이라서... 공지글 하나 작성해서 오픈케스트를 통으로 넣어버렸습니다. -ㅁ- ㅋㅋ http://est0que.tistory.com/notice/945 ※오픈케스트 페이지는 PC에서만 정상작동합니다. 더보기

티스토리툴바