<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	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:xhtml="http://www.w3.org/1999/xhtml"
>

<channel>
	<title>DesignWalker &#187; calendar</title>
	<atom:link href="http://www.designwalker.com/tag/calendar/feed" rel="self" type="application/rss+xml" />
	<link>http://www.designwalker.com</link>
	<description>ロサンゼルスで働くウェブデザイナーの日記。</description>
	<lastBuildDate>Wed, 29 Jun 2011 06:24:51 +0000</lastBuildDate>
	<language>ja</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.0</generator>
<xhtml:link rel="alternate" media="handheld" type="text/html" href="http://www.designwalker.com/tag/calendar/feed" />
		<item>
		<title>ブログに使えるカレンダーデザインまとめ</title>
		<link>http://www.designwalker.com/2007/11/calendar.html</link>
		<comments>http://www.designwalker.com/2007/11/calendar.html#comments</comments>
		<pubDate>Thu, 08 Nov 2007 19:15:21 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[インスピレーション]]></category>
		<category><![CDATA[calendar]]></category>
		<category><![CDATA[CSS]]></category>
		<category><![CDATA[まとめ]]></category>
		<category><![CDATA[カレンダー]]></category>
		<category><![CDATA[デザイン]]></category>
		<category><![CDATA[ブログ]]></category>

		<guid isPermaLink="false">http://new.designwalker.com/2007/11/%e3%83%96%e3%83%ad%e3%82%b0%e3%81%ab%e4%bd%bf%e3%81%88%e3%82%8b%e3%82%ab%e3%83%ac%e3%83%b3%e3%83%80%e3%83%bc%e3%83%87%e3%82%b6%e3%82%a4%e3%83%b3%e3%81%be%e3%81%a8%e3%82%81.html</guid>
		<description><![CDATA[
			
				
			
		
ブログのサイドバーや、記事タイトルの横などによく表示されているカレンダー。
日付も単純にテキストだけで表示するのではなく、ちょっと手を加えておしゃれ～に見せたいものですね・・・
っちゅう [...]]]></description>
			<content:encoded><![CDATA[<div class="tweetmeme_button" style="float: right; margin-left: 10px;">
			<a href="http://api.tweetmeme.com/share?url=http%3A%2F%2Fwww.designwalker.com%2F2007%2F11%2Fcalendar.html"><br />
				<img src="http://api.tweetmeme.com/imagebutton.gif?url=http%3A%2F%2Fwww.designwalker.com%2F2007%2F11%2Fcalendar.html&amp;style=normal&amp;b=2" height="61" width="50" /><br />
			</a>
		</div>
<p>ブログのサイドバーや、記事タイトルの横などによく表示されているカレンダー。</p>
<p>日付も単純にテキストだけで表示するのではなく、ちょっと手を加えておしゃれ～に見せたいものですね・・・</p>
<p>っちゅうわけで本日は、そんなカレンダーデザインをまとめてみました。</p>
<p><strong>1. <a href="http://www.smileycat.com/miaow/archives/calendar-date-picker-showcase.php" title="Calendar and Date Picker Design Showcase">Calendar and Date Picker Design Showcase</a></strong><br />
<br />
35個のカレンダーデザインがずら～っと並んでおります。どれもとってもきれいですね。</p>
<div align="center">
<a href="http://www.smileycat.com/miaow/archives/calendar-date-picker-showcase.php" title="Calendar and Date Picker Design Showcase"><br />
<img src="http://www.designwalker.com/img/calendar/calendar01.jpg" alt="Calendar and Date Picker Design Showcase" border="0" /><br />
</a>
</div>
<p></p>
<p><strong>2. <a href="http://www.smileycat.com/design_elements/calendars_date_pickers/index.php?page=1" title="Calendars &amp; Date Pickers (54 examples)">Calendars &amp; Date Pickers (54 examples)</a></strong><br />
<br />
こちらは、54個！4ページに分かれて紹介されています。↑と同じ方がまとめられて用なので、結構かぶっていますが。。参考までに。</p>
<div align="center">
<a href="http://www.smileycat.com/design_elements/calendars_date_pickers/index.php?page=1" title="Calendars &amp; Date Pickers (54 examples)"><br />
<img src="http://www.designwalker.com/img/calendar/calendar02.jpg" alt="Calendars &amp; Date Pickers (54 examples)" border="0" /><br />
</a>
</div>
<p></p>
<p><strong>3. <a href="http://veerle.duoh.com/blog/comments/a_css_styled_calendar/" title="A CSS styled calendar">A CSS styled calendar</a></strong><br />
<br />
おなじみveerle&#8217;s blogさんが紹介されている、カレンダーCSSです。</p>
<div align="center">
<a href="http://veerle.duoh.com/blog/comments/a_css_styled_calendar/" title="A CSS styled calendar"><br />
<img src="http://www.designwalker.com/img/calendar/calendar03.jpg" alt="A CSS styled calendar" border="0" /><br />
</a>
</div>
<p>仕上がりは↓こんな感じ。とってもきれいですね。。<br />
</p>
<div align="center">
<a href="http://veerle.duoh.com/blog/comments/a_css_styled_calendar/" title="A CSS styled calendar"><br />
<img src="http://www.designwalker.com/img/calendar/calendar04.jpg" alt="A CSS styled calendar" border="0" /><br />
</a>
</div>
<p></p>
<p><strong>4. <a href="http://mikecherim.com/experiments/css_list_calendar.php" title="MikeCherim.com - CSS: Unordered List Calendar">MikeCherim.com &#8211; CSS: Unordered List Calendar</a></strong><br />
<br />
MikeCherimさんが公開しているカレンダーXHMLとCSSのサンプルです。</p>
<div align="center">
<a href="http://mikecherim.com/experiments/css_list_calendar.php" title="MikeCherim.com - CSS: Unordered List Calendar"><br />
<img src="http://www.designwalker.com/img/calendar/calendar05.jpg" alt="MikeCherim.com - CSS: Unordered List Calendar" border="0" /><br />
</a>
</div>
<p></p>
<p><strong>5. <a href="http://www.cssplay.co.uk/menu/calendar3.html" title="A validating link calendar">A validating link calendar</a></strong><br />
<br />
CSSplayさんが紹介されているカレンダーは、月のリンクにマウスがオーバーするとカレンダーが右側に表示されます。</p>
<div align="center">
<a href="http://www.cssplay.co.uk/menu/calendar3.html" title="A validating link calendar"><br />
<img src="http://www.designwalker.com/img/calendar/calendar06.jpg" alt="A validating link calendar" border="0" /><br />
</a>
</div>
<p></p>
<p><strong>6. <a href="http://www.euphorish.com/2007/05/web-20-date-icons-for-your-blog/" title="Web 2.0 Date Icons For Your Blog">Web 2.0 Date Icons For Your Blog</a></strong><br />
<br />
こちらは、記事タイトルの横などに表示されている投稿日を日めくりカレンダー風に表示させるためのアイコンです。</p>
<div align="center">
<a href="http://www.euphorish.com/2007/05/web-20-date-icons-for-your-blog/" title="Web 2.0 Date Icons For Your Blog"><br />
<img src="http://www.designwalker.com/img/calendar/calendar07.jpg" alt="Web 2.0 Date Icons For Your Blog" border="0" /><br />
</a>
</div>
<p></p>
<p><strong>7. <a href="http://www.mahudsblog.ourgardenpath.com/?p=737" title="Create a Calendar style WordPress date format">Create a Calendar style WordPress date format</a></strong><br />
<br />
ワードプレスをお使いのユーザーさんは、こちらのタグで投稿日をカレンダー風に表示できます。</p>
<div align="center">
<a href="http://www.mahudsblog.ourgardenpath.com/?p=737" title="Create a Calendar style WordPress date format"><br />
<img src="http://www.designwalker.com/img/calendar/calendar08.jpg" alt="Create a Calendar style WordPress date format" border="0" /><br />
</a>
</div>
<p></p>
<p><strong>8. <a href="http://brainstormsandraves.com/archives/2007/02/22/csscalendar/" title="Creating a Blog Entry Date Calendar Icon Look with CSS, Mostly">Creating a Blog Entry Date Calendar Icon Look with CSS, Mostly</a></strong><br />
<br />
こちらも、投稿日をカレンダー風に表示するためのチュートリアル。ご参考に。</p>
<div align="center">
<a href="http://brainstormsandraves.com/archives/2007/02/22/csscalendar/" title="Creating a Blog Entry Date Calendar Icon Look with CSS, Mostly"><br />
<img src="http://www.designwalker.com/img/calendar/calendar09.jpg" alt="Creating a Blog Entry Date Calendar Icon Look with CSS, Mostly" border="0" /><br />
</a>
</div>
<p>
きれいなカレンダーが作れそうですね～。</p>
]]></content:encoded>
			<wfw:commentRss>http://www.designwalker.com/2007/11/calendar.html/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
	<xhtml:link rel="alternate" media="handheld" type="text/html" href="http://www.designwalker.com/2007/11/calendar.html" />
	</item>
	</channel>
</rss>

