본문 바로가기

IT

유투브를 블로그에서 빠르게 불러오기 이제 우리 생활에서는 뗄레야 땔 수 없는, 그야 말로 TV와 같은 존재가 되어 버린 것이 유투브 입니다. 티스토리에서도 게시글에 유투브를 넣으시는 분이 꽤 많으실겁니다. 하지만 유투브 동영상 한 두편이면 모를까 여러 편을 넣게 되면 사이트의 로딩 속도가 심각할 정도로 느려집니다. 특히 유투브 동영상을 게시글에 넣게 되면 해당 동영상을 보지 않아도 그 게시글을 클릭한 방문자는 유투브 플레이어를 모두 로드 하게 됩니다. 유투브 동영상이 삽입된 게시글을 클릭할 시에 브라우저의 프레임 드랍 만 봐도 결코 무시할만한 수준의 로드가 아니라는 것을 눈치챌 수 있습니다. 게다가 모바일로 접속시에는 상태가 더 심해집니다. 유투브 플레이어가 로드 되는 동안 스크롤링 조차 불가능 해질 정도 입니다. 물론 요즘은 브라우저 엔.. 더보기
스킨 V.2 업데이트 후기 + 디자인 사설 디자인과 속도. 웹 페이지를 만들 때 항상 충돌하게 되는 요소 입니다. 디자인에 신경을 쓰다 보면 웹 페이지 속도가 서서히 감소하는 것이 눈에 보일 것이고, 속도에 신경을 쓰다보면 정말 흰화면에 글자와 사진만 몇 개 떠다니는 수준이 되어버릴 수도 있습니다. 보통 스킨을 제작하게 되면 항상 고민하는 것이 바로 속도와 디자인 입니다. 늘 좀 더 새롭고 좋은 모습을 추구하면서도, 바라는 대로 무턱대고 만들어버리면 속도에 치명적인 영향을 미쳐버리고 맙니다. 그래서 스킨을 처음 만들 때 부터 지금까지도, 좋은 디자인을 가지면서 속도가 빠를 수는 없을까 라는 생각을 늘 상 하곤 했습니다. 이런 고민을 항상 하면서 스킨을 제작하다 보니 이전에는 단순한 구조임에도 속도가 한심할 정도로 느렸지만 지금은 숙련도가 쌓였는지.. 더보기
스킨 업데이트 계획 현재 사용하고 있는 스킨의 버전2를 제작하고 있습니다. Life is a Journey를 제작한 이후로도 여러 사이트를 돌아다니면서 영감을 많이 받았고, 여러가지 신기술도 많이 체험을 했습니다. 버전2를 통해서 이룰 것, 또는 이루고 싶은 것들을 간략하게 적어보겠습니다. 이미지 개수의 감소, SVG의 활용 이 부분은 애플 홈페이지의 영향을 많이 받았습니다. SVG가 혁신 적이긴 하지만 아직 다루기가 쉽지 않아 많이 쓰이지 않고 있는데요, 애플 홈페이지를 가보면 메인폰트인 lucia 이외에 모든 helvetica neue, Myriad Pro로 된 숫자나 문구를 SVG sprite로 만들어 넣는 미친짓(?)을 해놓았더군요. 상당히 인상 깊었고 한번 쯤은 도전해보고 싶은 요소 였습니다. 게다가 SVG는 CS.. 더보기
블로그 게시글 오버홀 중입니다. Overhaul [oʊvərhɔ:l] 사전적의미로 따져보면,분해 수리, 점검 정비; 음미, 검토; (비격식) 검진.라고 나와 있습니다. (출처: 다음사전) 블로그 스킨을 몇 번 전환하면서 게시글에 안 쓰는 코드 찌꺼기도 많이 남았고, 지금은 안 써도 되는 구식 방식으로 구현한 부분도 많아서 첫 게시글 부터 하나씩 코드를 개선하고 있습니다. 크롬에서 사용시에 고질적으로 따라 붙은 span 버그도 전부 제거 중이고, 자잘한 에디터 오류도 수정하고 있습니다. 특히 인라인 스타일을 최대한 제거해서 추후에 스킨을 바꾸게 될때도 게시글이 큰 문제 없이 뜨게 하기 위해 신경을 많이 쓰고 있습니다. 글이 좀 많아지니 편하려고 적었던 인라인 스타일이 오히려 발목을 잡고 있는 셈입니다. 귀찮기는 하지만 언젠가는 했어야 하.. 더보기
티스토리 링크 추가 버튼 만들기 티스토리는 네이버 블로그 처럼 네이버me가 있어서 이웃블로그의 일거수 일투족을 보여준다던가, 아니면 다음처럼 친구 맺기 기능이 있다던가, 이글루스처럼 키배를 뜰수 있는 옥타곤을 열어준다던가 하는 기능이 전혀 없습니다. 즉, 친목친목을 할 곳이 전혀 없다는 것이죠. 특별하게 RSS를 구독하거나 아니면 트위터를 팔로우하지 않는 이상은 해당 블로그에서 무슨일이 일어나는지는 알도리가 없습니다. 미약하게나마 티스토리에서도 타 블로거와의 교류를 위해서 링크기능을 제공합니다. 이 링크기능은 타 블로그와 자신 블로그 간의 교류상태를 간략하게 보여주며, 새글이 올라오면 표시도 뜹니다. 다만 새글 알림이 온다던가 하는 고차원의 기능은 없습니다. 그래서 결론은 너무 썰렁해서 무인도라고 불리우는 티스토리 이기는 하지만 서로 .. 더보기
Simple Analog Widget 이미지 없이 소프트웨어 랜더링으로만 구성된 위젯입니다. 소스는 제가 쓴게 아니고 컨버전만 했습니다. 원본 소스& 저작자 - http://codepen.io/martingrand/pen/aAldc 더보기
애플 iOS7.1 변경사항 심층분석 서론 UI 전화 음악 캘린더 키보드 사진 날씨 지도 비디오 미리알림 패스북 설정 손쉬운사용 잠금화면 알림센터 서론 저는 아이폰4를 사용 중입니다. 이제 사용 한지 3년 반이 넘어가고 있는데, iOS6 까지는 정말 최신 핸드폰 부러울 것 없이 잘 사용하고 있었습니다. 그러나 iOS7 이후로는 거의 지옥과도 같은 사용 환경을 맛보고 있었습니다. 베타1 부터 사용해 왔는데, 버벅거리는 것은 둘째고 시도 때도 없이 스프링 보드가 크래쉬하여 리스프링 되는 현상을 경험했습니다. 이게 베타라서 그러려니 했지만 정식 버전에서도 전혀 나아지는 점이 없더군요. 게다가 아이폰4는 사양이 딸려서 그렇다 쳐도, 아이폰5S나 아이패드 에어등도 메모리 부족으로 튕기거나 어플이 갑자기 꺼지는 상황이 발생한다는 이야기를 많이 들었습니.. 더보기
게임 카테고리 스킨 추가 압축 버전을 끝으로 '추가 스킨 제작은 끝~!' 이라고 선언했지만 사이트 몇 군데 돌아다니다가 본 마음에 드는 스타일 몇가지와, 헤더를 세로로 만들어보고 싶어 후딱 작업했습니다. 미디어 쿼리는 이론상으로 세로 해상도도 적용되는 걸로 알고 있어서 시험 삼아 적용 해보았는데, 실제로 세로 해상도 768px 이하로는 헤더가 사라집니다. 더보기
티스토리 운영체제 별 에디터/ 기본 단축키 분석 많은 분들이 아시다시피, 티스토리에는 자체 단축키가 있습니다. 무조건 마우스로 조져야 되는 네이버나, 이글루스 같은 여타 블로그와는 다르게 에디터나 블로그 전반에서 단축키를 지원하기 때문에, 이런 단축키를 몇 개만 알아두면 정말 빠르게 포스팅과 관리를 할 수 있습니다. 하지만 무슨 이유에서 인지 이전에는 에디터 내부에 도움말을 통해서 단축키 파악이 가능하였지만, 어느 새 그 메뉴가 없어졌습니다. 그래서 저도 최근에서야 알게 되어 뒤늦게 정리를 해봅니다. 아마도 이전 사진과 비교해보았을 때 메뉴에 마이피플 스티커가 추가되면서 빠진듯한데, 병크도 이런 병크가 없네요 -_- 시중에 단축키 관련 포스팅이 많이있지만, 운영체제 별로 분석해놓은 것은 없습니다. 윈도우에 IE 구버전 위주로 만들어진 티스토리 에디터는.. 더보기
빙(bing) 검색등록 + 웹마스터 도구 설치 검색엔진 중 마우스 오버시 동영상 미리보기 기능을 최초로 도입하여 성교육에 지대한 영향을 미쳤다는 공로를 받고 있는 빙 (일명 빙神)에 검색등록하는 방법을 알아보도록 하겠습니다. 그리고 한 가지 추가로 알고 계셔야 할 것은 야후와 빙이 검색 서비스를 같이 사용하고 있기 때문에 빙에 등록만 해도 야후에 등록이 동시에 된다는 것 입니다. 빙 웹 마스터 도구에 접속합니다. 그리고 사이트를 Bing에 제출을 누릅니다. 아래에 url과 captcha를 입력합니다. 검색 등록은 끝났습니다.추가로 빙 에서도 제공하는 자체 웹 분석 도구가 있습니다. 사용하려면 지금 등록을 누릅니다. 자신의 사이트 주소와 트래픽관련 사항을 입력합니다. 이제 자신의 사이트임을 증명하는 일만 남았는데요, 세가지 방법 중에서 티스토리는 2번.. 더보기