티스토리 뷰

킨 작업이 마무리 단계에 접어들고 있습니다.
아직 사이드바의 일부 기능(최근 덧글과 카테고리 등)을 구현하지 않았으나, 블로그를 돌아다니는데 큰 지장은 없습니다.
검색창은 제대로 작동하고 있고 페이지 네비게이션도 깔끔하게 돌아갑니다.

스트큐브는 스킨과 CSS의 덩치가 굉장히 큽니다.
각종 치환자나 강제적으로 삽입되는 자바스크립트 등, 다양한 요소들이 로딩시간을 잡아먹기 때문에 스킨을 가능한 컴팩트하게 짜는 것이 좋습니다.
하지만 웹디자인이나 프로그래밍이 본업도 아니고, 공부하면서 하는 마당에, 나름 최적화를 했다고 생각하지만 코드가 산으로 가고 있어서 적은 용량(현재 skin.html+ style.css 합쳐 70.1KB)에도 불구하고 효율적으로 만들어지지는 않은 것 같습니다.

재 가장 로딩이 오래 걸리는 요소는 역시나 구글 광고나, 링크 프라이스 광고 같은 녀석들입니다.
CSS 테스트는 에러없이 통과하지만, 역시 여기저기서 가져다 붙인 배너나 믹시, 다음뷰 같은 요소들이 로딩 시간을 상당히 잡아먹고 있네요.

무튼 CSS3를 최대한 사용해서 역동적인 페이지를 만들려고 노력해 봤지만 능력부족으로 이 정도에서 포기하고 완성시키려고 합니다.
IE8에서는 레이아웃이 깨지지 않는 정도로만 보이고, IE7과 IR6은 inline-block을 지원하지 않는 관계로 레이아웃이 깨지는 곳이 많을 겁니다.
한 마디로 IE로는 제대로 보이지 않으니 제 블로그를 보실 때는 가급적 구글 크롬(엄청 빠릅니다!)을 쓰시기 바랍니다.
IE만 쓰다가 크롬을 쓰면 날아다닌다는 것이 무슨 의미인지 알 수 있습니다.
이 블로그는 크롬에서 100% 접근성과 시각효과를 제공하며, 오페라에서는 그라디언트와 제목 마스크효과를 제외한 90% 정도의 시각효과를 제공합니다.
파폭에서는 애니메이션 효과와 마스크 효과가 제공되지 않는 75%정도를 제공합니다.
크롬>>오페라>파이어폭스 순으로 최적화되어 있으며, 테스트는 해 보지 않았지만 웹킷을 채용하고 있는 사파리 같은 브라우저에서도 아마 잘 보일 것입니다.

IE9가 CSS3를 "드디어[각주:1]" 지원한다고 하는데, 글쎄요.
아무튼 이 블로그는 IE시리즈와는 별로 안 친합니다.
가급적이면 크롬을 쓰세요. ^^
이 포스트는 BlogKorea [블코채널 : Image Generator]에 링크 되어있습니다.
  1. 다른 브라우저들은 애저녁부터 지원하고 있었는데 말이죠. [본문으로]
신고

'Gossip > Internet' 카테고리의 다른 글

PBTweet+의 만우절 장난  (2) 2010.04.01
블로그 스킨 V1.00 완성  (10) 2010.03.30
스킨 작업 마무리 단계  (13) 2010.03.26
새로운 스킨 제작중...-_-;;  (13) 2010.03.18
구글 애드센스, 웨스턴 유니언 지급 보류 대처법  (12) 2010.03.10
새 스킨 제작 중  (8) 2010.02.04
댓글
  • 프로필사진 Popeye 수고 많으셨군요.
    저도 css3를 공부할 겸 대충 바꿔 봤습니다만,
    웹 표준의 "통일"은 언제쯤에나 될런지...
    2010.03.27 20:57 신고
  • 프로필사진 FROSTEYe 동일은 요원한 일 아닐까요. 남북 통일 처럼 ^^;

    뽀빠이님 블로그 디자인 상당히 멋있네요!

    저도 살짝 영감을 얻어봅니다...
    2010.03.27 23:12 신고
  • 프로필사진 Popeye 저도 FROSTEYe님의 블로그를 통해 많이 배워요^^

    상단 메뉴가 ie에서 세로로 출력되는 것만 교정하시면..
    퍼펙트 할 것 같습니다. 방법이 있을듯 한데..
    모두들 ie는 포기하신다능 말씀으로 넘어 가 버리네요..
    ie가 귀찮고 미워도 사용률은 무시하지 못하는데..

    그래서 저는.. 무조건 ie를 배척하는 것은, 아직도 ie로 블로그에 접속하는 분들을 무시하는 것 같아서 늘 신경이 쓰여요...
    2010.03.28 15:16 신고
  • 프로필사진 FROSTEYe 세련된 검은색-보라 디자인이 괜춘합니다.

    저도 검은색 디자인으로 갈까했는데 이게 흰색 엘레먼트들하고 여러가지로 잘 안 맞아서 그냥 귀차니즘에 회색조로 복귀했씁니다. ㅜ_ㅜ
    2010.03.28 15:17 신고
  • 프로필사진 FROSTEYe ie6과 7은 display:inline-block 속성을 지원하지 않고 있습니다.
    하지만 웹킷(크롬)에서는 CSS3의 transform을 사용하려면 block이어야만 합니다.
    block을 가로로 풀어놓는 것은 inline-block 코드 한 줄이면 되지만, 바보 같은 IE는 이걸 안 먹으니, 결국 해결하자면 float 같은 걸 쓰면 됩니다.
    그러면 코드가 한없이 길어지겠죠 ㅜ_ㅜ
    당장은 일단 홈페이지 구현에만 신경쓰고 있어서 크로스브라우징은 차차 신경쓸 계획입니다.

    IE8에서는 inline-block이 잘 먹어서 레이아웃이 깨지지는 않습니다.
    2010.03.28 15:20 신고
  • 프로필사진 Popeye .menu ul li 에 { _display:inline; }
    을 추가해 보시죠... ie6과 7에서 일단 좀 나은듯 하네요..
    8 사용자도 7로 돌아가는 추세라서...
    2010.03.28 15:44 신고
  • 프로필사진 FROSTEYe IE hack이군요 ㅋㅋ 한 번 넣어보겠씁니다.

    무엇보다 제 PC환경에서는 IE6을 확인 할 수 없다보니 자연히 지원이 안 되고 있습니다. ^^;
    2010.03.28 15:47 신고
  • 프로필사진 FROSTEYe 웹상에서 확인할 수 있는 방법이 있나보지요? 신기하네요 *_* 2010.03.28 15:57 신고
  • 프로필사진 Popeye 위 태그를 넣은 뒤, 6과 7, 8 파폭, 사파리, 오페라, 크롬 등 대표적인 모든 브라우저에서 방금 확인해 봤습니다.
    모든 브라우저에 지장을 주지 않고, 6과 7에서 가로 출력을 제법 이쁘게 합니다.
    http://a1408973-5.textcube.com/
    2010.03.28 16:00 신고
  • 프로필사진 Popeye 취미가 같으니, 더욱 더 많은 교류 해요^^
    http://a1408973-5.textcube.com/ 은 테스트만 하고 바꿨어요^^
    2010.03.28 16:05 신고
  • 프로필사진 FROSTEYe 옙 뭔가 배운다는 것은 언제나 재미있는 일이죠 ^^

    제가 지금 집이 아니라서 작업환경이 약간 부실하기도 하고, 코딩만 하다보니 지쳐서 이제 잠시 쉬려고 합니다. 저녁때나 다시 손봐야 겠네요... ^^
    2010.03.28 16:05 신고
  • 프로필사진 아네모네 전에 메뉴들이 다 안보여 불편했는데, 이제는 잘 보입니다. ff3.6 사용하고 있습니다. ^^ 스킨이 좋아요 2010.03.29 11:37 신고
  • 프로필사진 FROSTEYe 주말 동안 카테고리와 새글 새댓글 등 사이드바 정리 작업을 좀 했습니다. ^^; 감사합니다. 2010.03.29 11:53 신고
댓글쓰기 폼