<?xml version="1.0" encoding="UTF-8"?>
<?xml-stylesheet type="text/xsl" media="screen" href="/~d/styles/rss2full.xsl"?><?xml-stylesheet type="text/css" media="screen" href="http://feeds.feedburner.com/~d/styles/itemcontent.css"?><rss xmlns:content="http://purl.org/rss/1.0/modules/content/" xmlns:wfw="http://wellformedweb.org/CommentAPI/" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:sy="http://purl.org/rss/1.0/modules/syndication/" xmlns:slash="http://purl.org/rss/1.0/modules/slash/" xmlns:feedburner="http://rssnamespace.org/feedburner/ext/1.0" version="2.0">

<channel>
	<title>KapitalD1</title>
	
	<link>http://kapitald1.name/blog</link>
	<description />
	<lastBuildDate>Sat, 26 Jul 2008 16:55:20 +0000</lastBuildDate>
	<generator>http://wordpress.org/?v=2.8.4</generator>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
			<atom10:link xmlns:atom10="http://www.w3.org/2005/Atom" rel="self" type="application/rss+xml" href="http://feeds.feedburner.com/KapitalD1" /><feedburner:info uri="kapitald1" /><atom10:link xmlns:atom10="http://www.w3.org/2005/Atom" rel="hub" href="http://pubsubhubbub.appspot.com" /><item>
		<title>Life on Mars (2006)</title>
		<link>http://feedproxy.google.com/~r/KapitalD1/~3/GjzA5KjmZK4/</link>
		<comments>http://kapitald1.name/blog/2007/10/12/life-on-mars/#comments</comments>
		<pubDate>Thu, 11 Oct 2007 19:24:27 +0000</pubDate>
		<dc:creator>KapitalD1</dc:creator>
		
		<guid isPermaLink="false">http://kayd.name/blog/2007/10/12/life-on-mars/</guid>
		<description><![CDATA[
My name is Sam Tyler. I had an accident and I woke up in 1973. Am I mad, in a coma, or back in time?

며칠 전부터 재밌게 본 TV 시리즈입니다. 영드라 그런지 미드와는 또 다른 맛이 있네요.
간단히 내용을 소개하자면&#8230; 배경은 영국, 맨체스터. 주인공 샘 타일러(John Simm 분)는 경찰. 심한 교통사고를 당했다가 깨어나니 1973년이랍니다. 그는 자기가 ]]></description>
			<content:encoded><![CDATA[<div class="center"><object width="425" height="350"><param name="movie" value="http://www.youtube.com/v/yYz8N-lfVV4"></param><param name="wmode" value="transparent"></param><embed src="http://www.youtube.com/v/yYz8N-lfVV4" type="application/x-shockwave-flash" wmode="transparent" width="425" height="350"></embed></object></div>
<blockquote><p>My name is Sam Tyler. I had an accident and I woke up in 1973. Am I mad, in a coma, or back in time?</p>
</blockquote>
<p>며칠 전부터 재밌게 본 TV 시리즈입니다. <abbr title="영국 드라마">영드</abbr>라 그런지 <abbr title="미국 드라마">미드</abbr>와는 또 다른 맛이 있네요.</p>
<p><img class="left" src='http://kayd.name/blog/wp-content/uploads/2007/10/life_on_mars_logo.png' alt='Life on Mars 타이틀 이미지' />간단히 내용을 소개하자면&#8230; 배경은 영국, 맨체스터. 주인공 샘 타일러(John Simm 분)는 경찰. 심한 교통사고를 당했다가 깨어나니 1973년이랍니다. 그는 자기가 미친 건지 코마 상태에 있는 건지 아니면 진짜로 과거로 시간여행을 한 것인지 매우 혼란스러워합니다.</p>
<p><span id="more-48"></span></p>
<p>1973년에도 그는 경찰입니다. 하이드에서 맨체스터로 막 전출을 온 것으로 되어있습니다. 그 도중에 경미한 사고를 당해서 쓰러졌다 깨어난 것으로 되어있죠. 뭐 어쨌든 이곳에서도 경찰 노릇을 하게됩니다. 하지만 21세기 경찰 나리께서 1973년의 경찰 세계에 쉽게 섞여들리 만무합니다. 사사건건 그의 무대뽀 상사 진 헌트(Philip Glenister 분)와 부딪히게 됩니다.</p>
<p>라디오, 전화 등에서는 코마 상태에 빠진 자신의 상태를 설명하는 의사의 목소리, 사랑한다고 힘내라고 하는 가족들의 말 등이 들립니다. 때로는 상대방과 대화를 나누기도 합니다. 결국 그는 자신이 코마 상태에 빠져있고 자신의 정신이 무슨 이유에선지 1973년의 허구 세계를 만들어내고 있다고 생각합니다. 그리고 그 이유를 밝히게 되면 다시 21세기에서 깨어날 것이라고 믿습니다.</p>
<p>시리즈는 두개의 시즌으로 완전 종결되고 각 시즌은 8개의 에피소드로 구성됩니다. 각각의 에피소드는 주로 샘 타일러와 진 헌트가 티격태격하면서 사건을 해결해나가는 과정을 담고 있습니다. 근데 그 사건들이 미묘하게 21세기에서의 샘 타일러와 연관이 되어있습니다. 자신에게 말을 거는 목소리의 주인공 혹은 그와 관련된 인물을 1973년의 세계에서 만나게 된다거나 뭐 그런 겁니다.</p>
<p>소재도 나름 신선하지만 이 드라마의 진짜 재미는 개성 강한 캐릭터들에서 나온다고 말하고 싶습니다. 세련된 하지만 몹시 혼란스러운 21세기 경찰, 무대뽀 상사, 깐죽깐죽 시비거는 부하, 어리버리하지만 잘 따르는 또 다른 부하, 샘 타일러를 조금이나마 이해하려는 홍일점 여경 아가씨. 어찌보면 흔해빠진 등장인물들일 수도 있겠지만 각각의 개성을 잘 살렸다고 생각합니다.</p>
<div class="center"><object width="425" height="350"><param name="movie" value="http://www.youtube.com/v/piE-VEubGr4"></param><param name="wmode" value="transparent"></param><embed src="http://www.youtube.com/v/piE-VEubGr4" type="application/x-shockwave-flash" wmode="transparent" width="425" height="350"></embed></object></div>
<p>시즌 2 다섯번째 에피소드 인트로입니다. 70년대 아동 프로 &#8220;Camberwick Green&#8221;을 패러디한 거라고 하네요. 완전 귀여워요~ <img src='http://kapitald1.name/blog/wp-includes/images/smilies/icon_biggrin.gif' alt=':D' class='wp-smiley' /> </p>
<p>Life on Mars는 1971년에 발매된 <a href="http://en.wikipedia.org/wiki/David_Bowie" rel="external">David Bowie</a>의 Hunky Dory 앨범에 수록된 곡 제목입니다. 데이빗 보위가 이 이름을 사용 못하게 할까봐 조마조마(?)했다고 하네요. 드라마 중간 중간에 이 노래가 흘러나오는데 이 곡 때문에 별 관심 없던 데이빗 보위 음악을 들어보고 싶어져서 요즘 달리고 있습니다. +_+</p>
<div class="center"><object width="425" height="350"><param name="movie" value="http://www.youtube.com/v/ueUOTImKp0k"></param><param name="wmode" value="transparent"></param><embed src="http://www.youtube.com/v/ueUOTImKp0k" type="application/x-shockwave-flash" wmode="transparent" width="425" height="350"></embed></object></div>
<p>Life on Mars 뮤비인데&#8230; 대략 할 말을 잊게 만드는군요. 드라마의 영상과 함께 흘러나올 때가 훨씬 느낌이 좋았습니다. ㅡㅡ;; 어쨌든 즐감하시고 끌리시면 드라마도 한번 봐 보시길~ <img src='http://kapitald1.name/blog/wp-includes/images/smilies/icon_wink.gif' alt=';)' class='wp-smiley' /> </p>
<div class="feedflare">
<a href="http://feeds.feedburner.com/~ff/KapitalD1?a=GjzA5KjmZK4:mYjOXu_a3rA:yIl2AUoC8zA"><img src="http://feeds.feedburner.com/~ff/KapitalD1?d=yIl2AUoC8zA" border="0"></img></a> <a href="http://feeds.feedburner.com/~ff/KapitalD1?a=GjzA5KjmZK4:mYjOXu_a3rA:D7DqB2pKExk"><img src="http://feeds.feedburner.com/~ff/KapitalD1?i=GjzA5KjmZK4:mYjOXu_a3rA:D7DqB2pKExk" border="0"></img></a>
</div>]]></content:encoded>
			<wfw:commentRss>http://kapitald1.name/blog/2007/10/12/life-on-mars/feed/</wfw:commentRss>
		<slash:comments>12</slash:comments>
		<feedburner:origLink>http://kapitald1.name/blog/2007/10/12/life-on-mars/</feedburner:origLink></item>
		<item>
		<title>플러그인 없이 불여우의 Stop/Reload 버튼을 하나로…</title>
		<link>http://feedproxy.google.com/~r/KapitalD1/~3/TZUQFvQpfgU/</link>
		<comments>http://kapitald1.name/blog/2007/10/01/merge-firefox-stop-reload-button/#comments</comments>
		<pubDate>Mon, 01 Oct 2007 11:34:49 +0000</pubDate>
		<dc:creator>KapitalD1</dc:creator>
		
		<guid isPermaLink="false">http://kayd.name/blog/2007/10/01/%eb%b6%88%ec%97%ac%ec%9a%b0%ec%9d%98-stopreload-%eb%b2%84%ed%8a%bc%ec%9d%84-%ed%95%98%eb%82%98%eb%a1%9c/</guid>
		<description><![CDATA[사파리나 오페라는 상황에 따라 Stop 버튼과 Reload 버튼 둘 중 하나만 보여줍니다. 페이지가 아직 로딩 중일 때는 Stop 버튼을, 페이지가 다 로딩 되었을 경우에는 Reload 버튼 만을 보여주는 거죠. 어차피 두 버튼을 동시에 같이 사용할 일은 없으니깐요. 결론적으로 툴바에 버튼 하나만큼의 공간을 더 확보할 수 있게되는 겁니다.

불여우는 기본적으로는 Stop 버튼과 Reload 버튼을 둘다 가지고 있습니다. ]]></description>
			<content:encoded><![CDATA[<p><a href="http://www.apple.com/safari/" rel="external">사파리</a>나 <a href="http://www.opera.com/" rel="external">오페라</a>는 상황에 따라 Stop 버튼과 Reload 버튼 둘 중 하나만 보여줍니다. 페이지가 아직 로딩 중일 때는 Stop 버튼을, 페이지가 다 로딩 되었을 경우에는 Reload 버튼 만을 보여주는 거죠. 어차피 두 버튼을 동시에 같이 사용할 일은 없으니깐요. 결론적으로 툴바에 버튼 하나만큼의 공간을 더 확보할 수 있게되는 겁니다.</p>
<p><span id="more-47"></span></p>
<p>불여우는 기본적으로는 Stop 버튼과 Reload 버튼을 둘다 가지고 있습니다. 이를 앞서 말한 다른 브라우저들 처럼 하나로 합쳐주는 <a href="https://addons.mozilla.org/ko/firefox/addon/313" rel="external">플러그인</a>도 있습니다만 userChrome.css 파일에 몇 줄 추가해주는 것 만으로 이를 구현하는 방법도 있더군요.</p>
<p>userChrome.css 파일을 처음 수정하시는 분들은 아래의 경로에 있는 userChrome-example.css 파일 이름을 userChrome.css로 바꿔주세요.</p>
<p>각 운영체제별 userChrome.css 파일 위치 (xxxxxxxx는 임의의 값입니다.)</p>
<dl>
<dt>Windows XP/2000</dt>
<dd><code>C:\Documents and Settings\[User Name]\Application Data\Mozilla\Firefox\Profiles\xxxxxxxx.default\chrome\</code></dd>
<dt>Windows 95/98/Me</dt>
<dd><code>C:\WINDOWS\Application Data\Mozilla\Firefox\Profiles\xxxxxxxx.default\chrome\</code></dd>
<dt>Linux</dt>
<dd><code>~/.mozilla/firefox/xxxxxxxx.default/chrome/</code></dd>
<dt>Mac OS X</dt>
<dd><code>~/Library/Application Support/Firefox/Profiles/xxxxxxxx.default/chrome/</code></dd>
</dl>
<p>userChrome.css 파일이 준비 되셨다면 아래의 코드를 추가해줍니다.</p>
<pre><code>
/* Show Stop and Reload buttons smartly */
#stop-button[disabled] {display: none;}
#stop-button:not([disabled]) + #reload-button {display: none;}
</code>
</pre>
<p>이제 불여우를 띄워봅시다. 음&#8230; 아직도 두 버튼이 다 보이죠? 여기서 툴바에 마우스 우클릭해서 &#8220;사용자 지정&#8221;으로 Stop 버튼이 Reload 버튼 앞으로 오도록 위치를 바꿔줍니다. 이제 아마 Reload 버튼 만이 보일 겁니다. 물론 페이지를 로딩 중일 때는 Stop 버튼이 나오고요~ <img src='http://kapitald1.name/blog/wp-includes/images/smilies/icon_wink.gif' alt=';)' class='wp-smiley' /> </p>
<p>개인적으로 불여우에서 무척 아쉬웠던 부분인데 이렇게 간단하게 바꿔줄 수 있다니 재밌네요. <a href="http://lifehacker.com/software/firefox/geek-to-live--consolidate-firefoxs-chrome-210542.php" rel="external">여기</a>랑 <a href="http://www.mozilla.org/unix/customizing.html#usercss" rel="external">여기</a>에 다른 재미난 userChrome.css 수정 코드들도 있습니다. 한번 체크해보세요.</p>
<div class="feedflare">
<a href="http://feeds.feedburner.com/~ff/KapitalD1?a=TZUQFvQpfgU:KZaIro1BdkA:yIl2AUoC8zA"><img src="http://feeds.feedburner.com/~ff/KapitalD1?d=yIl2AUoC8zA" border="0"></img></a> <a href="http://feeds.feedburner.com/~ff/KapitalD1?a=TZUQFvQpfgU:KZaIro1BdkA:D7DqB2pKExk"><img src="http://feeds.feedburner.com/~ff/KapitalD1?i=TZUQFvQpfgU:KZaIro1BdkA:D7DqB2pKExk" border="0"></img></a>
</div>]]></content:encoded>
			<wfw:commentRss>http://kapitald1.name/blog/2007/10/01/merge-firefox-stop-reload-button/feed/</wfw:commentRss>
		<slash:comments>13</slash:comments>
		<feedburner:origLink>http://kapitald1.name/blog/2007/10/01/merge-firefox-stop-reload-button/</feedburner:origLink></item>
		<item>
		<title>Take me with you</title>
		<link>http://feedproxy.google.com/~r/KapitalD1/~3/TUWZ1Cfh26I/</link>
		<comments>http://kapitald1.name/blog/2007/09/24/take-me-with-you/#comments</comments>
		<pubDate>Mon, 24 Sep 2007 05:45:19 +0000</pubDate>
		<dc:creator>KapitalD1</dc:creator>
		
		<guid isPermaLink="false">http://kayd.name/blog/2007/09/24/take-me-with-you/</guid>
		<description><![CDATA[며칠 전부터 이 곡의 멜로디가 계속 입에서 맴돌았는데 정작 무슨 노래인지는 생각이 안났었습니다. 웬일인지 무슨 일본 애니에 삽입된 곡이라고 계속 생각하고 있었는데 Prince의 노래였습니다. 오늘 아침에 갑자기 떠올랐네요. ㅋ 근데 정작 Prince의 영상은 못찾고 Texas라는 밴드가 커버한 영상을 올립니다. 이 버전도 나름 괜찮네요]]></description>
			<content:encoded><![CDATA[<div class="center">
<object width="425" height="353"><param name="movie" value="http://www.youtube.com/v/QUY_K-RX5io"></param><param name="wmode" value="transparent"></param><embed src="http://www.youtube.com/v/QUY_K-RX5io" type="application/x-shockwave-flash" wmode="transparent" width="425" height="353"></embed></object>
</div>
<p>며칠 전부터 이 곡의 멜로디가 계속 입에서 맴돌았는데 정작 무슨 노래인지는 생각이 안났었습니다. 웬일인지 무슨 일본 애니에 삽입된 곡이라고 계속 생각하고 있었는데 <a href="http://en.wikipedia.org/wiki/Prince_%28musician%29" rel="external">Prince</a>의 노래였습니다. 오늘 아침에 갑자기 떠올랐네요. ㅋ 근데 정작 Prince의 영상은 못찾고 <a href="http://en.wikipedia.org/wiki/Texas_%28band%29" rel="external">Texas</a>라는 밴드가 커버한 영상을 올립니다. 이 버전도 나름 괜찮네요. <img src='http://kapitald1.name/blog/wp-includes/images/smilies/icon_smile.gif' alt=':)' class='wp-smiley' /> </p>
<p>아!! 모두 추석 연휴 잘 보내세요~ <img src='http://kapitald1.name/blog/wp-includes/images/smilies/icon_wink.gif' alt=';)' class='wp-smiley' /> </p>
<div class="feedflare">
<a href="http://feeds.feedburner.com/~ff/KapitalD1?a=TUWZ1Cfh26I:olXIzWGFXtE:yIl2AUoC8zA"><img src="http://feeds.feedburner.com/~ff/KapitalD1?d=yIl2AUoC8zA" border="0"></img></a> <a href="http://feeds.feedburner.com/~ff/KapitalD1?a=TUWZ1Cfh26I:olXIzWGFXtE:D7DqB2pKExk"><img src="http://feeds.feedburner.com/~ff/KapitalD1?i=TUWZ1Cfh26I:olXIzWGFXtE:D7DqB2pKExk" border="0"></img></a>
</div>]]></content:encoded>
			<wfw:commentRss>http://kapitald1.name/blog/2007/09/24/take-me-with-you/feed/</wfw:commentRss>
		<slash:comments>9</slash:comments>
		<feedburner:origLink>http://kapitald1.name/blog/2007/09/24/take-me-with-you/</feedburner:origLink></item>
		<item>
		<title>Image Replacement CSS 테크닉 정리</title>
		<link>http://feedproxy.google.com/~r/KapitalD1/~3/bu37SowWmc8/</link>
		<comments>http://kapitald1.name/blog/2007/09/21/image-replacement-css-techniques/#comments</comments>
		<pubDate>Fri, 21 Sep 2007 02:55:05 +0000</pubDate>
		<dc:creator>KapitalD1</dc:creator>
		
		<guid isPermaLink="false">http://kayd.name/blog/2007/09/21/image-replacement-css-%ed%85%8c%ed%81%ac%eb%8b%89-%ec%a0%95%eb%a6%ac/</guid>
		<description><![CDATA[CSS를 이용한 Image Replacement 테크닉은 기본적으로 인터넷 상에 웹 디자이너가 원하는 글꼴을 사용자에게 보여주기 위해서 도입된 기법입니다. 사용자의 환경에 따라서 웹 브라우저가 출력하는 글꼴들이 모두 제각각이기 때문에 생겨났다고 할 수 있습니다. 즉, 디자인적 요소로소 특정 글꼴을 꼭 사용하고 싶을 경우, 혹은 사이트의 로고 등을 출력하기 위해 많이 사용됩니다.

이 기법들의 기본 골자는 원래 내용을 사용자에게 보이지 ]]></description>
			<content:encoded><![CDATA[<p>CSS를 이용한 Image Replacement 테크닉은 기본적으로 인터넷 상에 웹 디자이너가 원하는 글꼴을 사용자에게 보여주기 위해서 도입된 기법입니다. 사용자의 환경에 따라서 웹 브라우저가 출력하는 글꼴들이 모두 제각각이기 때문에 생겨났다고 할 수 있습니다. 즉, 디자인적 요소로소 특정 글꼴을 꼭 사용하고 싶을 경우, 혹은 사이트의 로고 등을 출력하기 위해 많이 사용됩니다.</p>
<p><span id="more-45"></span></p>
<p>이 기법들의 기본 골자는 원래 내용을 사용자에게 보이지 않도록 감추고 이를 이미지로 대치하는 것입니다. 이를 구현하기 위한 방법도 여러가지가 있는데 이를 한자리에 정리해보고자 합니다. 각 방법마다 장단점이 있으며 아직 각 방법의 단점을 모두 커버할만한 기법은 없는 것 같습니다. 어쨌든 이 자리에서 각 기법을 설명하고 각각의 장단점을 언급해보도록 하겠습니다.</p>
<p>※ 이 글은 Dave Shea씨가 정리한 <a href="http://www.mezzoblue.com/tests/revised-image-replacement/" rel="external">Revised Image Replacement</a>를 풀어 쓴 것이며 이 곳에 사용한 코드들 또한 Dave Shea씨의 예제를 그대로 빌려왔음을 미리 밝힙니다.</p>
<h3 id="fir">Farhner Image Replacement (FIR)</h3>
<p>이 기법은 가장 먼저 소개된 Image Replacement 기법입니다. 이미지로 대치하고자 하는 내용(Revised Image Replacement)을 담고 있는 태그(&lt;h3&gt;)에 대치하고자 하는 이미지(sample-opaque.gif)의 크기를 지정하고 background-image 속성을 사용해서 이미지를 출력시킵니다. 그리고 대치하고자 하는 내용을 &lt;span&gt; 태그로 감싼 후 css로 <code>display: none;</code> 속성을 적용시켜 화면에 보이지 않도록 하여 배경에 지정한 이미지만 사용자에게 보여주는 기법입니다.</p>
<pre><code>
&lt;h3 id="header"&gt;
	&lt;span&gt;Revised Image Replacement&lt;/span&gt;
&lt;/h3&gt;

/* css */
#header {
	width: 329px;
	height: 25px;
	background-image: url(sample-opaque.gif);
	}
#header span {
	display: none;
	}
</code></pre>
<p>하지만 이 기법은 추가적인 &lt;span&gt; 태그를 사용해야 한다는 것과 보다 빠른 웹 브라우징을 위해 CSS는 키고 이미지는 끄고 웹 브라우저를 사용하는 사용자들에게는 아무 것도 보이지 않는다는 단점이 있습니다. 또한 이미지 리더 사용자들도 아무런 정보를 얻을 수 없습니다. Image Replacement 기법의 대표적 단점을 모두 가지고 있다고 할 수 있습니다.</p>
<h3 id="single-pixel">Single-pixel &lt;img&gt; Replacement</h3>
<p>이 기법은 &lt;h3&gt; 태그 안에 &lt;img&gt; 태그를 사용하여 1 픽셀짜리 이미지를 삽입함으로서 &lt;img&gt; 태그의 alt 속성을 사용함으로서 스크린 리더 사용자들에게 정보를 제공할 수 있습니다.</p>
<pre><code>
&lt;h3 id="header"&gt;
	&lt;img src="shim.gif" alt="Revised Image Replacement" /&gt;
	&lt;span&gt;Revised Image Replacement&lt;/span&gt;
&lt;/h3&gt;

/* css */
#header {
	width: 329px;
	height: 25px;
	background-image: url(sample-opaque.gif);
	}
#header span {
	display: none;
	}
</code></pre>
<p>하지만 아무 의미 없는 &lt;img&gt; 태그가 하나 더 추가되었습니다. ㅡㅡ;</p>
<h3 id="radu">Radu Method</h3>
<p>이 기법은 추가적인 태그는 사용하지 않습니다. &lt;h3&gt; 태그의 width 값과 margin 값을 이용하여 대치용 이미지의 크기를 정해줍니다. 이때 margin 값에 마이너스 값을 사용함으로서 &lt;h3&gt; 태그의 내용을 화면 밖으로 밀어내버립니다. 그리고 background-position 속성을 이용하여 배경에 사용된 이미지의 위치를 잡아줍니다.</p>
<pre><code>
&lt;h3 id="header"&gt;
	Revised Image Replacement
&lt;/h3&gt;

/* css */
#header {
	background: url(sample-opaque.gif) no-repeat top right;
	width: 2329px;
	height: 25px;
	margin: 0 0 0 -2000px;
	}
</code></pre>
<p>이 방법은 <abbr title="Internet Explorer">IE</abbr> 5에서도 제대로 출력되고 스크린 리더 사용자들에게 제대로 정보를 전달하며 추가적인 태그를 사용하지 않기는 하지만 CSS on/Image off 시의 문제는 해결하지 못합니다. 또한 레이아웃 잡을 때에도 여러 문제가 생길 수 있습니다.</p>
<h3 id="leahy-langridge">Leahy/Langridge Method</h3>
<p>이 방법은 &lt;h3&gt; 태그의 height 값을 0으로 지정하여 태그 내의 내용을 감추고 대신 padding 값을 사용하여 이미지의 크기를 지정해 줍니다.</p>
<pre><code>
&lt;h3 id="header"&gt;
	Revised Image Replacement
&lt;/h3&gt;

/* css */
#header {
	padding: 25px 0 0 0;
	overflow: hidden;
	background-image: url(sample-opaque.gif);
	background-repeat: no-repeat;
	height: 0px !important;
	height /**/:25px;
	}
</code></pre>
<p>하지만 이 방법을 사용하여 IE 5에서 제대로 출력하기 위해서는 Box model heck을 사용해야합니다. 게다가 이 방법도 CSS on/Image off 시의 문제는 해결하지 못합니다.</p>
<h3 id="phark">Phark Method</h3>
<p>이 방법은 &lt;h3&gt; 태그 내의 내용을 화면 밖으로 밀어낸다는 점에서 <a href="#radu">Radu Method</a>와 같습니다. 하지만 마이너스 margin 값을 이용하는 대신에 마이너스 text-indent 값을 사용합니다.</p>
<pre><code>
&lt;h3 id="header"&gt;
	Revised Image Replacement
&lt;/h3&gt;

/* css */
#header {
	text-indent: -100em;
	overflow: hidden;
	background: url(sample-opaque.gif);
	height: 25px;
	}
</code></pre>
<p>이 기법의 장점은 스크린 리더에서 제대로 정보를 전달한다는 것과 추가적인 태그를 사용하지 않는다는 것입니다. 하지만 역시 CSS on/Image off 문제는 해결을 못합니다. 게다가 IE 5와 Safari에서 제대로 적용되지 않습니다.</p>
<h3 id="phark-revisited">Phark Revisited</h3>
<p>이 방법이 요즘 가장 많이 사용되는 방법이 아닐까 합니다. 위의 방법의 IE 5와 Safari 문제를 해결한 방법입니다.</p>
<pre><code>
&lt;h3 id="header"&gt;
	Revised Image Replacement
&lt;/h3&gt;

/* css */
#header {
	text-indent: -5000px;
	background: url(sample-opaque.gif);
	height: 25px;
	}
</code></pre>
<p>하지만 역시 CSS on/Image off 문제는 해결하지 못합니다.</p>
<h3 id="dwyer">Dwyer Method</h3>
<p>이 기법은 <a href="#fir" title="Farhner Image Replacement">FIR</a> 기법과 상당히 유사합니다. 하지만 &lt;span&gt; 태그에 display: none;을 사용하는 대신 가로, 세로 크기를 0으로 지정함으로서 내용을 화면에 보이지 않도록 합니다.</p>
<pre><code>
&lt;h3 id="header"&gt;
	&lt;span&gt;Revised Image Replacement&lt;/span&gt;
&lt;/h3&gt;

/* css */
#header {
	width: 329px;
	height: 25px;
	background-image: url(sample-opaque.gif);
	}
#header span {
	display: block;
	width: 0;
	height: 0;
	overflow: hidden;
	}
</code></pre>
<p>이 기법을 사용하면 스크린 리더에서 제대로 정보를 전달하지 못하던 문제는 해결되지만 <a href="#fir">FIR</a> 기법과 마찬가지로 추가적 태그가 필요하고 CSS on/Image off 상황에서의 문제는 해결하지 못합니다.</p>
<h3 id="gilder-levin">Gilder/Levin Method</h3>
<p>추가적 &lt;span&gt; 태그를 사용하지만 앞서 살펴본 기법들과는 달리 내용을 감싸는게 아니라 아무런 내용도 담지 않습니다. 이 &lt;span&gt; 태그에 배경 이미지를 지정함으로서 원래의 텍스트를 가려버리는 방법입니다.</p>
<pre><code>
&lt;h3 id="header"&gt;
	&lt;span&gt;&lt;/span&gt;Revised Image Replacement
&lt;/h3&gt;

/* css */
#header {
	width: 329px;
	height: 25px;
	position: relative;
	}
#header span {
	background: url(sample-opaque.gif) no-repeat;
	position: absolute;
	width: 100%;
	height: 100%;
	}
</code></pre>
<p>이 방법을 사용하여 앞서 말한 문제점들을 대부분 해결합니다. 스크린 리더에서도 제대로 정보를 전달하고 CSS on/Image off 시에도 &lt;h3&gt; 태그 내의 내용을 제공합니다. 하지만 추가적인 &lt;span&gt; 태그를 사용해야 한다는 것과 투명한 배경을 사용한 이미지를 사용할 경우 이미지 밑의 텍스트가 비친다는 문제점이 있습니다.</p>
<h3 id="lindsay">Lindsay Method</h3>
<p>이 방법은 폰트 크기를 1 픽셀로 지정하고 폰트의 색상을 바탕 색과 같은 값을 사용함으로서 텍스트를 감춥니다.</p>
<pre><code>
&lt;h3 id="header"&gt;
	Revised Image Replacement
&lt;/h3&gt;

/* css */
#header {
	background: url(sample-opaque.gif) no-repeat;
	width: 329px;
	height: 25px;
	font-size: 1px;
	color: #xxxxxx;
	}
</code></pre>
<p>하지만 역시 CSS on/Image off 시에 아무 것도 보여주지 않으며 이미지의 배경이 단색일 경우에만 사용할 수 있습니다.</p>
<h3 id="css-on-image-off">CSS on/Image off?</h3>
<p>간단하게 Image Replacement 기법들을 살펴보았습니다. 이쯤에서 CSS on/Image off 문제를 한번 언급해야 할 것 같습니다.</p>
<p>각 인터넷 제공업체마다 광속을 자랑하는 우리에게는 별로 와닿지 않겠지만 해외에는 아직도 모뎀 사용자가 많습니다. 따라서 속도를 위해 이미지를 끄고 브라우징을 하는 경우도 있을 수 있습니다. 하지만 대부분의 사용자는 웹 브라우저에 그런 기능이 있는지도 모르는게 사실입니다. 그런데 이게 왜 그렇게 문제가 되냐고요? 문제는 속도입니다. 예전에 모뎀으로 인터넷을 사용해보신 분들은 아시겠지만 웹 페이지 하나 뜨는데 몇년 걸립니다. 이미지나 플래쉬를 많이 사용한 경우에는 더 말할 것도 없고요. 이럴 경우 이미지가 다 로딩되기 전까지는 Image Replacement 기법을 사용한 부분의 내용을 알 수 없습니다. 의도하지 않았지만 웹 브라우저에서 이미지를 끈 경우와 같은 상황이 벌어지는 것입니다. 실제로 저희 집에서 웹 서핑을 할 때도 이미지를 많이 사용한 사이트들의 로딩이 늦는 경우가 종종 있습니다. 따라서 CSS on/Image off 시의 문제점을 염려하는 것은 이러한 모든 경우를 고려해야 된다는 것입니다.</p>
<h3 id="which-method">그럼 어느 기법을 사용해야 하나?</h3>
<p>앞서 살펴본 여러 기법이 있지만 대체 어느 기법을 사용해야 하는지 고민이 생길 수도 있겠습니다. 이는 선택의 문제입니다. 모든 경우에 제대로 정보를 제공하기를 원한다면 추가적인 태그를 사용하더라도 <a href="#gilder-levin">Gilder/Levin Method</a>를 사용해야할 것이고 반대로 HTML 문서를 시멘틱하게 유지하고자 한다면 CSS on/Image off 시의 문제점을 감수하더라도 <a href="#phark-revisited">Phark Revisited</a> 등의 기법을 사용해야 하겠습니다.</p>
<p> <a href="http://www.mezzoblue.com/archives/2005/03/30/image_replac/" rel="external">Dave Shea씨의 글</a>에 따르면 근본적인 해결법은 CSS 3에서 제공하는 content 속성을 이용해서 <code>content: url(image.gif);</code>와 같은 방법으로 내용을 이미지로 대치하는 것이라고 합니다. 하지만 CSS 3 스펙이 완성되고 모든 브라우저에서 이를 제대로 제공하기까지는 앞으로 몇년이 걸릴지 알 수 없는 지금 상황에서는 어쩔 수 없이 위 방법들 중에서 선택하여 사용해야할 것 같습니다. ㅡㅡ;</p>
<p>이상. 긴 글 읽어주셔서 감사합니다. 도움이 되셨기를&#8230; <img src='http://kapitald1.name/blog/wp-includes/images/smilies/icon_wink.gif' alt=';)' class='wp-smiley' /> </p>
<p>※ Image Replacement를 위해서 <a href="http://www.mikeindustries.com/sifr">플래쉬를 이용하는 방법</a> 등도 있지만 제가 사용해 본 적도 없고 이 글은 CSS를 사용한 테크닉들을 정리한 글이기에 다루지 않았습니다.</p>
<div class="feedflare">
<a href="http://feeds.feedburner.com/~ff/KapitalD1?a=bu37SowWmc8:rjSO1A3tByc:yIl2AUoC8zA"><img src="http://feeds.feedburner.com/~ff/KapitalD1?d=yIl2AUoC8zA" border="0"></img></a> <a href="http://feeds.feedburner.com/~ff/KapitalD1?a=bu37SowWmc8:rjSO1A3tByc:D7DqB2pKExk"><img src="http://feeds.feedburner.com/~ff/KapitalD1?i=bu37SowWmc8:rjSO1A3tByc:D7DqB2pKExk" border="0"></img></a>
</div>]]></content:encoded>
			<wfw:commentRss>http://kapitald1.name/blog/2007/09/21/image-replacement-css-techniques/feed/</wfw:commentRss>
		<slash:comments>11</slash:comments>
		<feedburner:origLink>http://kapitald1.name/blog/2007/09/21/image-replacement-css-techniques/</feedburner:origLink></item>
		<item>
		<title>Screenalicio.us – 색상으로 사이트 검색</title>
		<link>http://feedproxy.google.com/~r/KapitalD1/~3/Di-XeRG9ww4/</link>
		<comments>http://kapitald1.name/blog/2007/09/12/screenalicious-search-sites-by-color/#comments</comments>
		<pubDate>Wed, 12 Sep 2007 07:14:45 +0000</pubDate>
		<dc:creator>KapitalD1</dc:creator>
		
		<guid isPermaLink="false">http://kayd.name/blog/2007/09/12/screenalicious-%ec%83%89%ec%83%81%ec%9c%bc%eb%a1%9c-%ec%82%ac%ec%9d%b4%ed%8a%b8-%ea%b2%80%ec%83%89/</guid>
		<description><![CDATA[요즘 인터넷 상에 멋진 디자인의 사이트들을 모아놓은 사이트들이 제법 많이 있습니다. Screenalicio.us도 그런 사이트 중 하나입니다. 그런데 이 사이트는 인상적인 기능이 하나 있군요]]></description>
			<content:encoded><![CDATA[<div class="center">
<img class="frame full" src='http://kayd.name/blog/wp-content/uploads/2007/09/color_search.png' alt='Screenalicio.us 색상 검색 캡쳐 이미지' />
</div>
<p>요즘 인터넷 상에 멋진 디자인의 사이트들을 모아놓은 사이트들이 제법 많이 있습니다. <a href="http://www.screenalicious.com/" rel="external">Screenalicio.us</a>도 그런 사이트 중 하나입니다. 그런데 이 사이트는 인상적인 기능이 하나 있군요. 각 사이트의 캡쳐 이미지 밑에 그 사이트에 사용된 색상표를 보여줍니다. 그 중 하나를 클릭하면 그 색상이 사용된 다른 사이트들을 보여줍니다. 이를 활용해서 주소창에<a href="http://www.screenalicious.com/color/ff0033" rel="external">http://www.screenalicious.com/color/ff0033</a> 와 같이 원하는 색상을 입력하면 바로 원하는 색상을 사용한 사이트들을 검색할 수 있습니다. 이 기능을 사이트 검색창에 직접 구현해 놓았다면 더 좋았겠습니다만 아쉽게도 직접 저렇게 입력해주어야 하네요. 어쨌든 사용하기에 따라서 유용한 사이트가 될 수 있을 것 같습니다.</p>
<div class="feedflare">
<a href="http://feeds.feedburner.com/~ff/KapitalD1?a=Di-XeRG9ww4:aG3Q_Gqb3Z8:yIl2AUoC8zA"><img src="http://feeds.feedburner.com/~ff/KapitalD1?d=yIl2AUoC8zA" border="0"></img></a> <a href="http://feeds.feedburner.com/~ff/KapitalD1?a=Di-XeRG9ww4:aG3Q_Gqb3Z8:D7DqB2pKExk"><img src="http://feeds.feedburner.com/~ff/KapitalD1?i=Di-XeRG9ww4:aG3Q_Gqb3Z8:D7DqB2pKExk" border="0"></img></a>
</div>]]></content:encoded>
			<wfw:commentRss>http://kapitald1.name/blog/2007/09/12/screenalicious-search-sites-by-color/feed/</wfw:commentRss>
		<slash:comments>9</slash:comments>
		<feedburner:origLink>http://kapitald1.name/blog/2007/09/12/screenalicious-search-sites-by-color/</feedburner:origLink></item>
		<item>
		<title>Mute Math</title>
		<link>http://feedproxy.google.com/~r/KapitalD1/~3/3tCn8zM84Qo/</link>
		<comments>http://kapitald1.name/blog/2007/09/12/mute-math/#comments</comments>
		<pubDate>Wed, 12 Sep 2007 05:27:05 +0000</pubDate>
		<dc:creator>KapitalD1</dc:creator>
		
		<guid isPermaLink="false">http://kayd.name/blog/2007/09/12/mute-math/</guid>
		<description><![CDATA[바로 전 포스트에서 소개한 사이트에서 발견한 앨범 커버가 시선을 끌어서 관심을 갖게 된 밴드. 2003년에 뉴올리언즈에서 결성. 4인조 구성. 자신들은 특별한 쟝르에 구애받지 않는 “밴드”라고 함. 트랜스포머 사운드트랙에도 “Transformer Theme”이란 곡으로 참여함. 하지만 영화에 직접 삽입되지는 않은 듯. 보다 많은 동영상은 아래의 유튜브 페이지를 참고]]></description>
			<content:encoded><![CDATA[<div class="center">
<object width="425" height="353"><param name="movie" value="http://www.youtube.com/v/b13rc6DY74A"></param><param name="wmode" value="transparent"></param><embed src="http://www.youtube.com/v/b13rc6DY74A" type="application/x-shockwave-flash" wmode="transparent" width="425" height="353"></embed></object></p>
<p>Typical</p>
</div>
<ul>
<p><a href="http://kayd.name/blog/2007/09/12/high-quality-album-cover/" rel="external">바로 전 포스트</a>에서 소개한 사이트에서 발견한 <a href="http://kayd.name/blog/wp-content/uploads/2007/09/66etnb5.jpg">앨범 커버</a>와 밴드 이름이 시선을 끌어서 관심을 갖게 된 밴드. 2003년에 뉴올리언즈에서 결성. 4인조 구성. 자신들은 특별한 쟝르에 구애받지 않는 “밴드”라고 함. 트랜스포머 사운드트랙에도 &#8220;Transformer Theme&#8221;이란 곡으로 참여함. 하지만 영화에 직접 삽입되지는 않은 듯. 보다 많은 동영상은 아래 링크의 유튜브 페이지를 참고.</p>
<ul>
<li>Discography
<ul>
<li><a href="http://en.wikipedia.org/wiki/Reset_%28EP%29">Reset EP (2004)</a></li>
<li><a href="http://en.wikipedia.org/wiki/Mute_Math_%28album%29">Mute Math (2006)</a></li>
<li><a href="http://en.wikipedia.org/wiki/Live_At_The_El_Rey_%28EP%29">Live At The El Rey (2006)</a></li>
</ul>
</li>
<li>Links
<ul>
<li><a href="http://www.mutemath.com/">Official website</a></li>
<li><a href="http://www.youtube.com/user/mutemath">Official YouTube page</a></li>
<li><a href="http://www.last.fm/music/Mute+Math">Mute Math @ Last.fm</a></li>
</ul>
</li>
</ul>
<div class="feedflare">
<a href="http://feeds.feedburner.com/~ff/KapitalD1?a=3tCn8zM84Qo:brX3qaDFBgQ:yIl2AUoC8zA"><img src="http://feeds.feedburner.com/~ff/KapitalD1?d=yIl2AUoC8zA" border="0"></img></a> <a href="http://feeds.feedburner.com/~ff/KapitalD1?a=3tCn8zM84Qo:brX3qaDFBgQ:D7DqB2pKExk"><img src="http://feeds.feedburner.com/~ff/KapitalD1?i=3tCn8zM84Qo:brX3qaDFBgQ:D7DqB2pKExk" border="0"></img></a>
</div>]]></content:encoded>
			<wfw:commentRss>http://kapitald1.name/blog/2007/09/12/mute-math/feed/</wfw:commentRss>
		<slash:comments>8</slash:comments>
		<feedburner:origLink>http://kapitald1.name/blog/2007/09/12/mute-math/</feedburner:origLink></item>
		<item>
		<title>고해상도 앨범 커버 받기</title>
		<link>http://feedproxy.google.com/~r/KapitalD1/~3/VPJMTagnrIc/</link>
		<comments>http://kapitald1.name/blog/2007/09/12/high-quality-album-cover/#comments</comments>
		<pubDate>Wed, 12 Sep 2007 02:44:56 +0000</pubDate>
		<dc:creator>KapitalD1</dc:creator>
		
		<guid isPermaLink="false">http://kayd.name/blog/2007/09/12/high-quality-album-cover/</guid>
		<description><![CDATA[iTS에서 고화질의 앨범 커버를 얻어오는 사이트 소개(?)]]></description>
			<content:encoded><![CDATA[<p><ins>Apple에서 다시 막아놓은 것 같습니다. 안되네요. ㅠㅠ</ins></p>
<p><img class="frame left" src='http://kayd.name/blog/wp-content/uploads/2007/09/jiaag.thumbnail.png' alt='Josh’s iTunes Album Art Grabber 사이트 캡쳐 이미지' /><a href="http://www.thejosher.net/iTunes/" rel="external">Josh&#8217;s iTunes Album Art Grabber</a></p>
<p>예전에 블로그를 뒤엎기 전에 <abbr title="iTunes Store">iTS</abbr>에서 고해상도의 앨범 커버를 얻어오는 사이트를 소개한 적이 있었는데요. Apple에서 앨범 커버 주소를 암호화해서 사용하기 시작하면서 그 사이트가 쓸모없게 되었었습니다. 그런데 애플이 다시 암호화한 것을 풀었다고 합니다. 그!래!서! 다시 고해상도 앨범 커버를 얻어올 수 있게 되었습니다! 그것도 무려 최대 1500&#215;1500 사이즈의 이미지를! 아마 <a rel="external" href="http://www.apple.com/macosx/leopard/features/frontrow.html">Front Row</a> 사용 시 고해상도의 이미지가 필요하기 때문에 애플측에서 이 정도의 고해상도 이미지를 제공하는게 아닐까 싶습니다. 아무튼 고해상도 앨범 커버가 필요하신 분들은 참고하세요.</p>
<p>※ 위 사이트에서 받은 이미지입니다. 역시 참고하세요. <img src='http://kapitald1.name/blog/wp-includes/images/smilies/icon_wink.gif' alt=';)' class='wp-smiley' /> </p>
<div><a href='http://kayd.name/blog/wp-content/uploads/2007/09/66etnb5.jpg' title='Mute Math - Mute Math'><img class="frame" src='http://kayd.name/blog/wp-content/uploads/2007/09/66etnb5.thumbnail.jpg' alt='Mute Math - Mute Math' /></a></div>
<div class="feedflare">
<a href="http://feeds.feedburner.com/~ff/KapitalD1?a=VPJMTagnrIc:NrjePFlNdH0:yIl2AUoC8zA"><img src="http://feeds.feedburner.com/~ff/KapitalD1?d=yIl2AUoC8zA" border="0"></img></a> <a href="http://feeds.feedburner.com/~ff/KapitalD1?a=VPJMTagnrIc:NrjePFlNdH0:D7DqB2pKExk"><img src="http://feeds.feedburner.com/~ff/KapitalD1?i=VPJMTagnrIc:NrjePFlNdH0:D7DqB2pKExk" border="0"></img></a>
</div>]]></content:encoded>
			<wfw:commentRss>http://kapitald1.name/blog/2007/09/12/high-quality-album-cover/feed/</wfw:commentRss>
		<slash:comments>8</slash:comments>
		<feedburner:origLink>http://kapitald1.name/blog/2007/09/12/high-quality-album-cover/</feedburner:origLink></item>
		<item>
		<title>Mac 2007-09-04</title>
		<link>http://feedproxy.google.com/~r/KapitalD1/~3/Z87_-_WVy-4/</link>
		<comments>http://kapitald1.name/blog/2007/09/04/mac-2007-09-04/#comments</comments>
		<pubDate>Tue, 04 Sep 2007 12:18:26 +0000</pubDate>
		<dc:creator>KapitalD1</dc:creator>
		
		<guid isPermaLink="false">http://kayd.name/blog/2007/09/04/mac-2007-09-04/</guid>
		<description><![CDATA[오랜만에 스샷 한번 찍어봤습니다. 요즘 테마질을 거의 안하고 디폴트로 사용하는데 요 바탕화면이 너무 맘에 들어서 스샷 찍고 싶은 충동을 참을 수가 없더군요. 그래서 날림샷 한방 박았습니다. 슈터즈에 스샷 올린지도 너무 오래된 것 같고 해서… ㅎㅎ]]></description>
			<content:encoded><![CDATA[<div class="center">
<object width="450" height="385"><param name="movie" value="http://backend.deviantart.com/embed/view.swf"></param><param name="flashvars" value="id=64072390" /><embed src="http://backend.deviantart.com/embed/view.swf" type="application/x-shockwave-flash" width="450" flashvars="id=64072390" height="385"></embed></object><br /><a href="http://www.deviantart.com/deviation/64072390/">Mac 2007-09-04</a> by ~<a class="u" href="http://kapitald1.deviantart.com/">KapitalD1</a> on <a href="http://www.deviantart.com">deviant</a><a href="http://www.deviantart.com">ART</a>
</div>
<p>오랜만에 스샷 한번 찍어봤습니다. 요즘 테마질을 거의 안하고 디폴트로 사용하는데 요 바탕화면이 너무 맘에 들어서 스샷 찍고 싶은 충동을 참을 수가 없더군요. 그래서 아이콘만 대충 바꾸고 날림샷 한방 박았습니다. <a href="http://deskshooters.com" rel="external nofollow">슈터즈</a>에 스샷 올린지도 너무 오래된 것 같고 해서… ㅎㅎ</p>
<p>바탕화면은 요즘 <a href="http://www.deviantart.com/" title="deviantART" rel="external nofollow">dA</a>에서 왕성한 활동을 보이고 있는 manicho의 <a href="http://manicho.deviantart.com/art/Concierto-Wallpaper-Pack-62530578" rel="external nofollow">Concierto</a>. 독 아이콘은 <a href="http://macthemes2.net/forum/" rel="external nofollow">MacThemes 포럼</a>에서 clarkkent라는 아이디로 활동 중인 Roberto Urso의 <a href="http://www.robertourso.com/?p=60" rel="external nofollow">The Kobhens</a>. 테마는 OS X 타이거 기본 테마입니다.</p>
<p><strong>보너스(?)</strong>: 보통 맥에서 시스템 아이콘 변경하실 때는 Panic社의 <a href="http://www.panic.com/candybar/" rel="external nofollow">CandyBar</a>를 많이 사용하실텐데요. 아시다시피 유료죠. 어둠의 경로를 통해 사용할 수도 있습니다만 프리웨어 중에도 비슷한 놈이 있더군요. 물론 .icontainer 파일을 지원하지는 않습니다만 아쉬운데로 사용할만 하더군요. Free Mac Soft에서 만든 <a href="http://www.freemacsoft.net/LiteIcon_en.html">LiteIcon</a>이라는 놈입니다. 사용법은 척! 보시면 척! 아실겁니다. 참고하세요. <img src='http://kapitald1.name/blog/wp-includes/images/smilies/icon_wink.gif' alt=';)' class='wp-smiley' /> </p>
<div class="center"><img src='http://kayd.name/blog/wp-content/uploads/2007/09/liteicon.png' alt='LiteIcon 스크린 캡쳐 이미지' /></div>
<div class="feedflare">
<a href="http://feeds.feedburner.com/~ff/KapitalD1?a=Z87_-_WVy-4:NgQD9ukFJMs:yIl2AUoC8zA"><img src="http://feeds.feedburner.com/~ff/KapitalD1?d=yIl2AUoC8zA" border="0"></img></a> <a href="http://feeds.feedburner.com/~ff/KapitalD1?a=Z87_-_WVy-4:NgQD9ukFJMs:D7DqB2pKExk"><img src="http://feeds.feedburner.com/~ff/KapitalD1?i=Z87_-_WVy-4:NgQD9ukFJMs:D7DqB2pKExk" border="0"></img></a>
</div>]]></content:encoded>
			<wfw:commentRss>http://kapitald1.name/blog/2007/09/04/mac-2007-09-04/feed/</wfw:commentRss>
		<slash:comments>10</slash:comments>
		<feedburner:origLink>http://kapitald1.name/blog/2007/09/04/mac-2007-09-04/</feedburner:origLink></item>
		<item>
		<title>PopCap 홈페이지에 들어가지 마세요.</title>
		<link>http://feedproxy.google.com/~r/KapitalD1/~3/oMmyoOawnhE/</link>
		<comments>http://kapitald1.name/blog/2007/09/02/popcap-games/#comments</comments>
		<pubDate>Sun, 02 Sep 2007 11:11:16 +0000</pubDate>
		<dc:creator>KapitalD1</dc:creator>
		
		<guid isPermaLink="false">http://kayd.name/blog/2007/09/02/popcap-games/</guid>
		<description><![CDATA[잠깐 기분 전환이나 할려고 PopCap 홈페이지에 들어갔다가 어제 하루 완전 놀아버렸습니다… 이럴 때가 아닌데… ㅡㅡ;

PopCap이야 Bejeweled, Insaniquarium 등으로 유명하지만 다른 게임들도 상당히 재밌네요. 어제 오늘 시간가는 줄 모르고 한 게임 몇가지 소개해볼까 합니다.
※ 이미지를 클릭하면 해당 게임 페이지로 이동합니다.

Rocket Mania




누가나 한번쯤은 해봤을 파이프 잊기류의 게임입니다. 로켓에 연결된 심지를 잘 이어서 레벨마다 정해진 갯수의 로켓을 시간 ]]></description>
			<content:encoded><![CDATA[<p>잠깐 기분 전환이나 할려고 <a href="http://www.popcap.com/online_games.php" rel="external nofollow">PopCap</a> 홈페이지에 들어갔다가 어제 하루 완전 놀아버렸습니다… 이럴 때가 아닌데… ㅡㅡ;</p>
<p><span id="more-31"></span></p>
<p>PopCap이야 <a rel="external nofollow" href="http://www.popcap.com/games/free/bejeweled2">Bejeweled</a>, <a rel="external nofollow" href="http://www.popcap.com/games/free/insaniquarium">Insaniquarium</a> 등으로 유명하지만 다른 게임들도 상당히 재밌네요. 어제 오늘 시간가는 줄 모르고 한 게임 몇가지 소개해볼까 합니다.</p>
<p>※ 이미지를 클릭하면 해당 게임 페이지로 이동합니다.</p>
<dl>
<dt>Rocket Mania</td>
<dd>
<div class="center">
<a rel="external nofollow" href="http://www.popcap.com/games/free/rocketmania"><img src='http://kayd.name/blog/wp-content/uploads/2007/09/rocketmania.png' alt='Rocket Mania® 스크린샷' /></a>
</div>
<p>누가나 한번쯤은 해봤을 파이프 잊기류의 게임입니다. 로켓에 연결된 심지를 잘 이어서 레벨마다 정해진 갯수의 로켓을 시간 내에 모두 쏘아올리는게 목적입니다. 한번에 대여섯개의 로켓을 쏘아올릴 때의 쾌감이 쏠쏠합니다.</p>
</dd>
<dt>Typer Shark</dt>
<dd>
<div class="center"><a rel="external nofollow" href="http://www.popcap.com/games/free/typershark"><img src='http://kayd.name/blog/wp-content/uploads/2007/09/typershark.png' alt='Typer Shark 스크린샷' /></a></div>
<p>이 게임을 하고 “타자 게임이 이렇게 재미있을 수도 있구나!!!”하고 외친…건 아니고 속으로 생각만 했습니다. ^^;</p>
<p>게임 방법은 다른 타자 게임과 별반 다르지 않습니다. 어쨌든 타자 게임이니깐요. 잠수부가 바닥에 닿을 때까지 오른편에서 나오는 상어와 피라냐의 몸통에 있는 단어와 문자를 타이핑해서 죽여야합니다. 헌데 요놈들이 몇가지 종류가 있는데 종류별로 특징이 있습니다. 몸통의 글씨가 무작위로 계속 바뀐다든지 단어를 두번 혹은 세번 쳐야한다던지… 유령 상어나 피라냐의 경우에는 화면 중간에 와서야 글씨를 보여줍니다. 이게 나중에 때거지로 나오고 속도까지 빨라지면 아주 피가 마릅니다. ㅎㅎ 하지만 우리의 주인공에게도 필살기가 있습니다. 적들을 어느정도 죽이면 화면 아래에 게이지가 차는데 이게 다 모이면 <strong>“한방”</strong>을 날릴 수 있습니다. 여차저차 무사히 바닥에까지 닿으면 산소가 다 닳기 전까지 화면에 나오는 단어들을 타이핑해서 보너스 점수를 얻을 수 있습니다.</p>
<p>여러모로 게임성이 뛰어난 타이핑 게임 같습니다. 다만 영어라는거~ 뭐, 영타 연습한다치고 한번씩 해보세요~ <img src='http://kapitald1.name/blog/wp-includes/images/smilies/icon_biggrin.gif' alt=':D' class='wp-smiley' /> </p>
</dd>
<dt>Talismania</dt>
<dd>
<div class="center"><a rel="external nofollow" href="http://www.popcap.com/games/free/talismania"><img src='http://kayd.name/blog/wp-content/uploads/2007/09/talismania.png' alt='Talismania' /></a></div>
<p>블록을 돌려서 시작 블록과 끝 블록 사이에 길을 만들어주면 이어진 블록들이 금화로 변합니다. 왼쪽의 저울이 다 찰때까지 금화를 모으면 됩니다. 중간 중간 보너스 블록이나 몬스터 블록도 나오고, 금화를 얼마 이상 모으면 마우스로 찍는 블록을 모두 금화로 만들 수 있는 보너스 타임도 있습니다.</p>
<p>별로 어렵지는 않지만 은근히 머리를 잘 써야 금화를 많이 얻을 수 있습니다. 그래픽도 아기자기해서 하다보면 시간가는 줄 모릅니다. <img src='http://kapitald1.name/blog/wp-includes/images/smilies/icon_biggrin.gif' alt=':D' class='wp-smiley' /> </p>
</dd>
</dl>
<p>위에 소개한 게임 모두 중독성이 심하지만 개인적으로는 Rocket Mania가 가장 재미있었습니다. 게임을 안할 때도 로켓 심지를 어떻게 이을까 고민할 정도로… ㅡㅡ;;</p>
<p>특별히 할 일 없을때 한번씩 즐겨보세요. 자기도 모르게 몇시간씩 즐기고 있을지도… ㅎㅎㅎ</p>
<div class="feedflare">
<a href="http://feeds.feedburner.com/~ff/KapitalD1?a=oMmyoOawnhE:29YAYYh_LXE:yIl2AUoC8zA"><img src="http://feeds.feedburner.com/~ff/KapitalD1?d=yIl2AUoC8zA" border="0"></img></a> <a href="http://feeds.feedburner.com/~ff/KapitalD1?a=oMmyoOawnhE:29YAYYh_LXE:D7DqB2pKExk"><img src="http://feeds.feedburner.com/~ff/KapitalD1?i=oMmyoOawnhE:29YAYYh_LXE:D7DqB2pKExk" border="0"></img></a>
</div>]]></content:encoded>
			<wfw:commentRss>http://kapitald1.name/blog/2007/09/02/popcap-games/feed/</wfw:commentRss>
		<slash:comments>9</slash:comments>
		<feedburner:origLink>http://kapitald1.name/blog/2007/09/02/popcap-games/</feedburner:origLink></item>
		<item>
		<title>뮤지컬 “싱글즈” 보고 왔습니다.</title>
		<link>http://feedproxy.google.com/~r/KapitalD1/~3/OeiUGEK8uEg/</link>
		<comments>http://kapitald1.name/blog/2007/08/26/singles-the-musical/#comments</comments>
		<pubDate>Sat, 25 Aug 2007 17:36:48 +0000</pubDate>
		<dc:creator>KapitalD1</dc:creator>
		
		<guid isPermaLink="false">http://kayd.name/blog/2007/08/26/%eb%ae%a4%ec%a7%80%ec%bb%ac-%e2%80%9c%ec%8b%b1%ea%b8%80%ec%a6%88%e2%80%9d-%eb%b3%b4%ea%b3%a0-%ec%99%94%ec%8a%b5%eb%8b%88%eb%8b%a4/</guid>
		<description><![CDATA[어떻게 공짜표가 생겨서 어제(8월 25일 8시 공연) 뮤지컬 “싱글즈”를 보고왔습니다. 내용은 영화 “싱글즈”와 같습니다. 몇년 전 영화로 봤을 때도 재미있게 보기는 했었는데 이번에 뮤지컬로 볼때는 감정이입이 팍!팍! 되어서인지 훨씬 재미있게 봤습니다. 어느덧 등장인물들과 같은 나이대에 접어들었기 때문에 그렇겠지요. 영화로 볼 때는 뭣 모르고 그냥 본거였죠 뭐…

뮤지컬을 본 경험이 손으로 꼽을 정도 밖에 안되지만 몇마디 적어보자면… ]]></description>
			<content:encoded><![CDATA[<p>어떻게 공짜표가 생겨서 <span class="vevent"><abbr class="dtstart" title="2007-08-25T20:00:00+09:00">어제(8월 25일 8시 공연)</abbr> <span class="summary">뮤지컬 “싱글즈”</span></span>를 보고왔습니다.</span> 내용은 영화 “<a href="http://movie.naver.com/movie/bi/mi/basic.nhn?code=36415">싱글즈</a>”와 같습니다. 몇년 전 영화로 봤을 때도 재미있게 보기는 했었는데 이번에 뮤지컬로 볼때는 감정이입이 팍!팍! 되어서인지 훨씬 재미있게 봤습니다. 어느덧 등장인물들과 같은 나이대에 접어들었기 때문에 그렇겠지요. 영화로 볼 때는 뭣 모르고 그냥 본거였죠 뭐…</p>
<p><span id="more-29"></span></p>
<p>뮤지컬을 본 경험이 손으로 꼽을 정도 밖에 안되지만 몇마디 적어보자면… 무대 사용이나 장면 전환이 훌륭했던 것 같습니다. 특히 장면 전환이 매우 자연스럽게 이루어진다는 느낌이었습니다. 그리고 무대를 객석으로까지 연장시킨 시도는 정말 좋았던 것 같습니다. 글로 설명하자니 조금 그렇긴 한데… 배우가 객석 사이로 들어와서는 관객들에게 특별히 무엇을 시키지도 않으면서 굉장히 자연스럽게 관객을 연극의 일부로 만들어버렸다고나 할까요… 뭐 원래 관객도 연극의 일부라고는 하지만 여튼 연출에 상당히 신경을 많이 쓴 것 같았습니다. 배우들 연기와 노래도 좋았구요.</p>
<p>저야 어떻게 공짜표가 생겨서 팔자에도 없는 문화생활을 즐기고 온거긴 하지만 일부러 돈주고 봐도 절대 아깝지 않을 공연이었습니다. 강추!!!</p>
<p>9월 9일까지 한다고 하니 관심있으신 분들은 끝나기 전에 다녀오세요~</p>
<p>링크: <a href="http://town.cyworld.com/aga99">악어컴퍼니 싸이월드 타운</a></p>
<p><ins>2007-08-26 15:48 &#8211; <a href="http://www.mncast.com/">엠엔캐스트</a>에 동영상이 좀 올라와 있더군요. 낼름 업어왔습니다.</ins></p>
<div class="center">
<object classid='clsid:d27cdb6e-ae6d-11cf-96b8-444553540000' codebase='http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=8,0,0,0' width='520' height='449' id='mncHMovie' align='middle'><param name='quality' value='high'><param name='bgcolor' value='#ffffff'><param name='movie' value='http://dory.mncast.com/mncHMovie.swf?movieID=10026454120070608125012&#038;skinNum=1'><param name='wmode' value='transparent' /><embed src='http://dory.mncast.com/mncHMovie.swf?movieID=10026454120070608125012&#038;skinNum=1' width='520' height='449' wmode='transparent'></embed></object></p>
<p>쇼케이스</p>
</div>
<div class="center">
<object classid='clsid:d27cdb6e-ae6d-11cf-96b8-444553540000' codebase='http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=8,0,0,0' width='520' height='449' id='mncHMovie' align='middle'><param name='quality' value='high'><param name='bgcolor' value='#ffffff'><param name='movie' value='http://dory.mncast.com/mncHMovie.swf?movieID=10026454120070704150330&#038;skinNum=1'><param name='wmode' value='transparent' /><embed src='http://dory.mncast.com/mncHMovie.swf?movieID=10026454120070704150330&#038;skinNum=1' width='520' height='449' wmode='transparent'></embed></object></p>
<p>쇼케이스 2</p>
</div>
<div class="center">
<object classid='clsid:d27cdb6e-ae6d-11cf-96b8-444553540000' codebase='http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=8,0,0,0' width='520' height='449' id='mncHMovie' align='middle'><param name='quality' value='high'><param name='bgcolor' value='#ffffff'><param name='movie' value='http://dory.mncast.com/mncHMovie.swf?movieID=10026454120070619165138&#038;skinNum=1'><param name='wmode' value='transparent' /><embed src='http://dory.mncast.com/mncHMovie.swf?movieID=10026454120070619165138&#038;skinNum=1' width='520' height='449' wmode='transparent'></embed></object></p>
<p>연습스케치</p>
</div>
<div class="center">
<object classid='clsid:d27cdb6e-ae6d-11cf-96b8-444553540000' codebase='http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=8,0,0,0' width='520' height='449' id='mncHMovie' align='middle'><param name='quality' value='high'><param name='bgcolor' value='#ffffff'><param name='movie' value='http://dory.mncast.com/mncHMovie.swf?movieID=10026454120070608153629&#038;skinNum=1'><param name='wmode' value='transparent' /><embed src='http://dory.mncast.com/mncHMovie.swf?movieID=10026454120070608153629&#038;skinNum=1' width='520' height='449' wmode='transparent'></embed></object></p>
<p>스팟</p>
</div>
<div class="center">
<object classid='clsid:d27cdb6e-ae6d-11cf-96b8-444553540000' codebase='http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=8,0,0,0' width='520' height='449' id='mncHMovie' align='middle'><param name='quality' value='high'><param name='bgcolor' value='#ffffff'><param name='movie' value='http://dory.mncast.com/mncHMovie.swf?movieID=10026454120070620100746&#038;skinNum=1'><param name='wmode' value='transparent' /><embed src='http://dory.mncast.com/mncHMovie.swf?movieID=10026454120070620100746&#038;skinNum=1' width='520' height='449' wmode='transparent'></embed></object></p>
<p>광고</p>
</div>
<div class="feedflare">
<a href="http://feeds.feedburner.com/~ff/KapitalD1?a=OeiUGEK8uEg:rvkAwWw20XA:yIl2AUoC8zA"><img src="http://feeds.feedburner.com/~ff/KapitalD1?d=yIl2AUoC8zA" border="0"></img></a> <a href="http://feeds.feedburner.com/~ff/KapitalD1?a=OeiUGEK8uEg:rvkAwWw20XA:D7DqB2pKExk"><img src="http://feeds.feedburner.com/~ff/KapitalD1?i=OeiUGEK8uEg:rvkAwWw20XA:D7DqB2pKExk" border="0"></img></a>
</div>]]></content:encoded>
			<wfw:commentRss>http://kapitald1.name/blog/2007/08/26/singles-the-musical/feed/</wfw:commentRss>
		<slash:comments>11</slash:comments>
		<feedburner:origLink>http://kapitald1.name/blog/2007/08/26/singles-the-musical/</feedburner:origLink></item>
	</channel>
</rss>
