<?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>新米デザイナーの日報&#124;design tracks &#187; HTML</title>
	<atom:link href="http://design-tracks.com/tag/html/feed/" rel="self" type="application/rss+xml" />
	<link>http://design-tracks.com</link>
	<description>新米webデザイナーとして日々気づいたことや感じたこと、webやDTP問わずデザインについて学んだことなどをブログを通して紹介します。</description>
	<lastBuildDate>Thu, 26 Aug 2010 22:24:41 +0000</lastBuildDate>
	<language>ja</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<xhtml:link rel="alternate" media="handheld" type="text/html" href="http://design-tracks.com/tag/html/feed/" />
		<item>
		<title>IEで表示確認する際に活用すると良いもの</title>
		<link>http://design-tracks.com/study/html-xhtml/ie%e3%81%a7%e8%a1%a8%e7%a4%ba%e7%a2%ba%e8%aa%8d%e3%81%99%e3%82%8b%e9%9a%9b%e3%81%ab%e6%b4%bb%e7%94%a8%e3%81%99%e3%82%8b%e3%81%a8%e8%89%af%e3%81%84%e3%82%82%e3%81%ae/</link>
		<comments>http://design-tracks.com/study/html-xhtml/ie%e3%81%a7%e8%a1%a8%e7%a4%ba%e7%a2%ba%e8%aa%8d%e3%81%99%e3%82%8b%e9%9a%9b%e3%81%ab%e6%b4%bb%e7%94%a8%e3%81%99%e3%82%8b%e3%81%a8%e8%89%af%e3%81%84%e3%82%82%e3%81%ae/#comments</comments>
		<pubDate>Thu, 26 Aug 2010 22:19:20 +0000</pubDate>
		<dc:creator>ts</dc:creator>
				<category><![CDATA[HTML・XHTML]]></category>
		<category><![CDATA[CSS]]></category>
		<category><![CDATA[HTML]]></category>
		<category><![CDATA[IE]]></category>
		<category><![CDATA[XHTML]]></category>

		<guid isPermaLink="false">http://design-tracks.com/?p=606</guid>
		<description><![CDATA[				
				IEでデバック、検証する際に使っているものをピックアップしました。
				改めてな部分満載ですが。
				
				xray
				ブックマークレット型で見たい部分をクリックするとDOM属性を表示 [...]]]></description>
			<content:encoded><![CDATA[				<p>
				<p>IEでデバック、検証する際に使っているものをピックアップしました。<br />
				改めてな部分満載ですが。</p>
				<div>
				<h3><a href="http://westciv.com/xray/" target="_blank">xray</a></h3>
				<p>ブックマークレット型で見たい部分をクリックするとDOM属性を表示してくれます。<br />
				ただ、細かく数値を変更したりはできず確認するだけなので、あんまり使用することはないです。</p>
				</div>
				<div>
				<h3><a href="http://getfirebug.com/firebuglite" target="_blank">firebug lite</a></h3>
				<p>よく使うのはfirefoxのアドオンでもおなじみの、firebugですね。<br />
				こちらもブックマークレット型で、機能に制限はあるものの十分です。</p>
				</div>
				<div>
				<h3><a href="http://www.microsoft.com/downloads/details.aspx?FamilyID=e59c3964-672d-4511-bb3e-2d5e1db91038&#038;displaylang=en" target="_blank">IE Developer Toolbar</a></h3>
				<p>これはIEのアドオンでリリース当時はめちゃくちゃ使ってました。<br />
				firebug liteを知ってからあまり使わなくなりましたが、たまに使ってます。</p>
				</div>
				<p>少しずつIEとは仲良くなっているものの、相変わらず苦労する時があるのですが、上記のモノは重宝してます。</p></p>
]]></content:encoded>
			<wfw:commentRss>http://design-tracks.com/study/html-xhtml/ie%e3%81%a7%e8%a1%a8%e7%a4%ba%e7%a2%ba%e8%aa%8d%e3%81%99%e3%82%8b%e9%9a%9b%e3%81%ab%e6%b4%bb%e7%94%a8%e3%81%99%e3%82%8b%e3%81%a8%e8%89%af%e3%81%84%e3%82%82%e3%81%ae/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
	<xhtml:link rel="alternate" media="handheld" type="text/html" href="http://design-tracks.com/study/html-xhtml/ie%e3%81%a7%e8%a1%a8%e7%a4%ba%e7%a2%ba%e8%aa%8d%e3%81%99%e3%82%8b%e9%9a%9b%e3%81%ab%e6%b4%bb%e7%94%a8%e3%81%99%e3%82%8b%e3%81%a8%e8%89%af%e3%81%84%e3%82%82%e3%81%ae/" />
	</item>
		<item>
		<title>Zen-Coding導入してみました。</title>
		<link>http://design-tracks.com/study/css/zen-coding%e5%b0%8e%e5%85%a5%e3%81%97%e3%81%a6%e3%81%bf%e3%81%be%e3%81%97%e3%81%9f%e3%80%82/</link>
		<comments>http://design-tracks.com/study/css/zen-coding%e5%b0%8e%e5%85%a5%e3%81%97%e3%81%a6%e3%81%bf%e3%81%be%e3%81%97%e3%81%9f%e3%80%82/#comments</comments>
		<pubDate>Thu, 18 Feb 2010 21:45:09 +0000</pubDate>
		<dc:creator>ts</dc:creator>
				<category><![CDATA[CSS]]></category>
		<category><![CDATA[HTML・XHTML]]></category>
		<category><![CDATA[HTML]]></category>
		<category><![CDATA[XHTML]]></category>

		<guid isPermaLink="false">http://design-tracks.com/?p=597</guid>
		<description><![CDATA[				
				個人的に最近目にしており、気になっていたので導入してみました。
				今回dreamweaverに導入しました。
				
				どういうものかというと（まだ慣れてないですが）、
				div#c [...]]]></description>
			<content:encoded><![CDATA[				<p>
				個人的に最近目にしており、気になっていたので導入してみました。<br />
				今回dreamweaverに導入しました。<br />
				<br />
				どういうものかというと（まだ慣れてないですが）、<br />
				div#container>ul.nav>li.item*3>a<br />
				<br />
				で、「control+,」<br />
				<br />
				<pre class="brush: xml;">
&lt;div id=&quot;container&quot;&gt;
&lt;ul class=&quot;nav&quot;&gt;
&lt;li class=&quot;item&quot;&gt;&lt;a href=&quot;&quot;&gt;&lt;/a&gt;&lt;/li&gt;
&lt;li class=&quot;item&quot;&gt;&lt;a href=&quot;&quot;&gt;&lt;/a&gt;&lt;/li&gt;
&lt;li class=&quot;item&quot;&gt;&lt;a href=&quot;&quot;&gt;&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;
&lt;/div&gt;
</pre>
				<br />
				のように展開してくれます。<br />
				サポートしているエディタも多いので、環境にはあまり左右されずにかつ、効率的に作業できそうです。</p>
]]></content:encoded>
			<wfw:commentRss>http://design-tracks.com/study/css/zen-coding%e5%b0%8e%e5%85%a5%e3%81%97%e3%81%a6%e3%81%bf%e3%81%be%e3%81%97%e3%81%9f%e3%80%82/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
	<xhtml:link rel="alternate" media="handheld" type="text/html" href="http://design-tracks.com/study/css/zen-coding%e5%b0%8e%e5%85%a5%e3%81%97%e3%81%a6%e3%81%bf%e3%81%be%e3%81%97%e3%81%9f%e3%80%82/" />
	</item>
		<item>
		<title>CSSスプライトはスパム判定されるのかどうか</title>
		<link>http://design-tracks.com/study/css/css%e3%82%b9%e3%83%97%e3%83%a9%e3%82%a4%e3%83%88%e3%81%af%e3%82%b9%e3%83%91%e3%83%a0%e5%88%a4%e5%ae%9a%e3%81%95%e3%82%8c%e3%82%8b%e3%81%ae%e3%81%8b%e3%81%a9%e3%81%86%e3%81%8b/</link>
		<comments>http://design-tracks.com/study/css/css%e3%82%b9%e3%83%97%e3%83%a9%e3%82%a4%e3%83%88%e3%81%af%e3%82%b9%e3%83%91%e3%83%a0%e5%88%a4%e5%ae%9a%e3%81%95%e3%82%8c%e3%82%8b%e3%81%ae%e3%81%8b%e3%81%a9%e3%81%86%e3%81%8b/#comments</comments>
		<pubDate>Fri, 18 Dec 2009 16:48:50 +0000</pubDate>
		<dc:creator>ts</dc:creator>
				<category><![CDATA[CSS]]></category>
		<category><![CDATA[HTML・XHTML]]></category>
		<category><![CDATA[HTML]]></category>

		<guid isPermaLink="false">http://design-tracks.com/?p=590</guid>
		<description><![CDATA[				
				先日googleのWebmaster Central Blogにて、cssを使用してtext-indent:-9999px;などとするやり方が良いかどうかということが書かれていました。
				
			 [...]]]></description>
			<content:encoded><![CDATA[				<p>
				先日googleの<a href="http://googlewebmastercentral-ja.blogspot.com/">Webmaster Central Blog</a>にて、cssを使用してtext-indent:-9999px;などとするやり方が良いかどうかということが書かれていました。<br />
				</p>
				<blockquote><p>判断に迷った際は、「たとえ検索エンジンが存在しなくてもそのテキストを書いたかどうか」と考えてみてください。もし検索エンジンが存在しなくても、そのテキストがユーザーの利便性のために必要なものであると思われる場合、おそらくそれはガイドライン違反ではありません。</p></blockquote>
				<p>
				ということなので、googleではスパムと判定されないと見ていいのかもしれません。<br />
				合わせてCSSの話が上がっていたので、もしかしたらCSSの内容も見られているのかなと気になるのですが、わかりませんでした。<br />
				<br />
				CSSスプライトを使用することで、サイト表示速度がずいぶん良くなったと聞いたこともあるので、社内で使用するかどうか検討していきたいと思います。<br />
				<br />
				現在サイト高速化＋SEO施策を考える為に、いろんな人に情報を共有してもらったりしています。マークアップやCSSコーディングをする際に、その辺の知識があるのとないのとでは随分違いがあるので、時間があるときに今まで組んだものも見直していきたいと思います。</p>
]]></content:encoded>
			<wfw:commentRss>http://design-tracks.com/study/css/css%e3%82%b9%e3%83%97%e3%83%a9%e3%82%a4%e3%83%88%e3%81%af%e3%82%b9%e3%83%91%e3%83%a0%e5%88%a4%e5%ae%9a%e3%81%95%e3%82%8c%e3%82%8b%e3%81%ae%e3%81%8b%e3%81%a9%e3%81%86%e3%81%8b/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
	<xhtml:link rel="alternate" media="handheld" type="text/html" href="http://design-tracks.com/study/css/css%e3%82%b9%e3%83%97%e3%83%a9%e3%82%a4%e3%83%88%e3%81%af%e3%82%b9%e3%83%91%e3%83%a0%e5%88%a4%e5%ae%9a%e3%81%95%e3%82%8c%e3%82%8b%e3%81%ae%e3%81%8b%e3%81%a9%e3%81%86%e3%81%8b/" />
	</item>
		<item>
		<title>先日作成した印刷用CSS</title>
		<link>http://design-tracks.com/study/css/%e5%85%88%e6%97%a5%e4%bd%9c%e6%88%90%e3%81%97%e3%81%9f%e5%8d%b0%e5%88%b7%e7%94%a8css/</link>
		<comments>http://design-tracks.com/study/css/%e5%85%88%e6%97%a5%e4%bd%9c%e6%88%90%e3%81%97%e3%81%9f%e5%8d%b0%e5%88%b7%e7%94%a8css/#comments</comments>
		<pubDate>Sun, 25 Oct 2009 12:03:51 +0000</pubDate>
		<dc:creator>ts</dc:creator>
				<category><![CDATA[CSS]]></category>
		<category><![CDATA[HTML・XHTML]]></category>
		<category><![CDATA[HTML]]></category>
		<category><![CDATA[IE]]></category>

		<guid isPermaLink="false">http://design-tracks.com/?p=517</guid>
		<description><![CDATA[				
				先日ほぼ社内用ですが印刷用CSSを作成したので備忘録までに。
				簡単な用件は社内向けということで、
				・対象ブラウザ→IE6、Firefox3.x
				・対象ページ　→簡単な計算式の結果 [...]]]></description>
			<content:encoded><![CDATA[				<p>
				先日ほぼ社内用ですが印刷用CSSを作成したので備忘録までに。<br />
				簡単な用件は社内向けということで、<br />
				・対象ブラウザ→IE6、Firefox3.x<br />
				・対象ページ　→簡単な計算式の結果画面<br />
				<br />
				そんなところで、とりあえず印刷できればいいという感じでした。<br />
				なんで、即席ですが大体以下のようになりました。<br />
				<pre class="brush: css;">
/*print*/
@media print {
body  {
      background:#fff;
      color:#000;
      font-size:12pt;
      zoom:87%;/*ie*/
}

不要な画像 {
      display:none;
}

モノクロ以外の色がついているテキスト {
      color:#000 !important;
}

table,
tr,
td {
      border-collapse:collapse;
      border-spacing:0;
      border:1px solid #666;
}

}
</pre>
				<br />
				もっといろいろと指定していますがざっくりとこんな感じです。<br />
				ポイントは、<br />
				・IE用にzoom指定<br />
				・不要な画像は非表示<br />
				・色はモノクロに<br />
				・リンクは非表示または、underlineを付けたりアドレスを出したり<br />
				ぐらいですかね。後は必要に応じて線を入れると見やすくなるときもあります。<br />
				注意すべきは、印刷用としてファイルを分けていないので、このやり方だとMac版IEでは認識してくれないみたいです。<br />
				<br />
				あまり印刷用CSSを作成する場面はないので、頼まれるごとに戸惑いますが、印刷したときに自分の思い通りに印刷されるととても気持ちがいいです。</p>
]]></content:encoded>
			<wfw:commentRss>http://design-tracks.com/study/css/%e5%85%88%e6%97%a5%e4%bd%9c%e6%88%90%e3%81%97%e3%81%9f%e5%8d%b0%e5%88%b7%e7%94%a8css/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
	<xhtml:link rel="alternate" media="handheld" type="text/html" href="http://design-tracks.com/study/css/%e5%85%88%e6%97%a5%e4%bd%9c%e6%88%90%e3%81%97%e3%81%9f%e5%8d%b0%e5%88%b7%e7%94%a8css/" />
	</item>
		<item>
		<title>寄付をしないでアイテムを買う「夢の病院をつくろうPROJECT」</title>
		<link>http://design-tracks.com/dailyreport/%e5%af%84%e4%bb%98%e3%82%92%e3%81%97%e3%81%aa%e3%81%84%e3%81%a7%e3%82%a2%e3%82%a4%e3%83%86%e3%83%a0%e3%82%92%e8%b2%b7%e3%81%86%e3%80%8c%e5%a4%a2%e3%81%ae%e7%97%85%e9%99%a2%e3%82%92%e3%81%a4%e3%81%8f/</link>
		<comments>http://design-tracks.com/dailyreport/%e5%af%84%e4%bb%98%e3%82%92%e3%81%97%e3%81%aa%e3%81%84%e3%81%a7%e3%82%a2%e3%82%a4%e3%83%86%e3%83%a0%e3%82%92%e8%b2%b7%e3%81%86%e3%80%8c%e5%a4%a2%e3%81%ae%e7%97%85%e9%99%a2%e3%82%92%e3%81%a4%e3%81%8f/#comments</comments>
		<pubDate>Wed, 14 Oct 2009 17:52:36 +0000</pubDate>
		<dc:creator>ts</dc:creator>
				<category><![CDATA[参考サイト]]></category>
		<category><![CDATA[日報]]></category>
		<category><![CDATA[HTML]]></category>
		<category><![CDATA[XHTML]]></category>
		<category><![CDATA[デザイン]]></category>

		<guid isPermaLink="false">http://design-tracks.com/?p=484</guid>
		<description><![CDATA[				
				
				
				駅前やコンビニやwebサイト等で募金を募っている場面は、何度か目にしたことがあります。たまに何に使われるのか細かく書かれていないモノがあったりしますが、やはり明確でないものは疑ってし [...]]]></description>
			<content:encoded><![CDATA[				<p>
				<a href="http://www.yumenobyouin.org/"><img src="http://design-tracks.com/wp-content/uploads/2009/10/yumenobyouin.jpg" alt="yumenobyouin" title="yumenobyouin" width="478" height="595" class="alignleft size-full wp-image-485" /></a><br />
				<br />
				駅前やコンビニやwebサイト等で募金を募っている場面は、何度か目にしたことがあります。たまに何に使われるのか細かく書かれていないモノがあったりしますが、やはり明確でないものは疑ってしまって行動を起こしにくいです。<br />
				ですが、このサイトはオンラインショッピングが浸透しているこの時代にあったやり方で、尚かつ何に使ってほしいかを選べるのが新しいなと思いました。<br />
				<br />
				本日はコーディング作業でtableに苦しめられていました。<br />
				幅とか色とか、colgroupかtrで指定できないものは仕方なくtdやthに。もっといいやり方があるとは思うのですがまだまだ知識不足です。<br />
				まあそんなことより、tableはきちんとマークアップをすれば意図した通りに音声ブラウザに読んでもらうことができるので、しっかりと抜かりなくマークアップしたいと思います。<br />
				最近iPhoneのClock RadioでHouseばかり聞いています。コーディングスピードが1.2倍になった気がするのでお気に入りです。</p>
]]></content:encoded>
			<wfw:commentRss>http://design-tracks.com/dailyreport/%e5%af%84%e4%bb%98%e3%82%92%e3%81%97%e3%81%aa%e3%81%84%e3%81%a7%e3%82%a2%e3%82%a4%e3%83%86%e3%83%a0%e3%82%92%e8%b2%b7%e3%81%86%e3%80%8c%e5%a4%a2%e3%81%ae%e7%97%85%e9%99%a2%e3%82%92%e3%81%a4%e3%81%8f/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
	<xhtml:link rel="alternate" media="handheld" type="text/html" href="http://design-tracks.com/dailyreport/%e5%af%84%e4%bb%98%e3%82%92%e3%81%97%e3%81%aa%e3%81%84%e3%81%a7%e3%82%a2%e3%82%a4%e3%83%86%e3%83%a0%e3%82%92%e8%b2%b7%e3%81%86%e3%80%8c%e5%a4%a2%e3%81%ae%e7%97%85%e9%99%a2%e3%82%92%e3%81%a4%e3%81%8f/" />
	</item>
		<item>
		<title>IE7、8でリストに隙間ができる</title>
		<link>http://design-tracks.com/study/css/ie7%e3%80%818%e3%81%a7%e3%83%aa%e3%82%b9%e3%83%88%e3%81%ab%e9%9a%99%e9%96%93%e3%81%8c%e3%81%a7%e3%81%8d%e3%82%8b/</link>
		<comments>http://design-tracks.com/study/css/ie7%e3%80%818%e3%81%a7%e3%83%aa%e3%82%b9%e3%83%88%e3%81%ab%e9%9a%99%e9%96%93%e3%81%8c%e3%81%a7%e3%81%8d%e3%82%8b/#comments</comments>
		<pubDate>Sat, 18 Jul 2009 03:05:12 +0000</pubDate>
		<dc:creator>ts</dc:creator>
				<category><![CDATA[CSS]]></category>
		<category><![CDATA[HTML・XHTML]]></category>
		<category><![CDATA[HTML]]></category>
		<category><![CDATA[XHTML]]></category>
		<category><![CDATA[コーディング]]></category>

		<guid isPermaLink="false">http://design-tracks.com/?p=349</guid>
		<description><![CDATA[				
				先日サイドナビゲーションの部分でつまずいたので、備忘録程度に書いておきます。
				デザインとしては、各都道府県が書かれた画像をサイドバーに、縦にずらーっと並べる形なんですが、
				IE7、8以外 [...]]]></description>
			<content:encoded><![CDATA[				<p>
				先日サイドナビゲーションの部分でつまずいたので、備忘録程度に書いておきます。<br />
				デザインとしては、各都道府県が書かれた画像をサイドバーに、縦にずらーっと並べる形なんですが、<br />
				IE7、8以外だとこんな感じでも問題ないです↓<br />
				<br />
				■html<br />
				<br />
				<pre class="brush: xml;">
&lt;ul&gt;
&lt;li&gt;&lt;a href=&quot;&quot;&gt;&lt;img src=&quot;&quot; /&gt;&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href=&quot;&quot;&gt;&lt;img src=&quot;&quot; /&gt;&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href=&quot;&quot;&gt;&lt;img src=&quot;&quot; /&gt;&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href=&quot;&quot;&gt;&lt;img src=&quot;&quot; /&gt;&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href=&quot;&quot;&gt;&lt;img src=&quot;&quot; /&gt;&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href=&quot;&quot;&gt;&lt;img src=&quot;&quot; /&gt;&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href=&quot;&quot;&gt;&lt;img src=&quot;&quot; /&gt;&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href=&quot;&quot;&gt;&lt;img src=&quot;&quot; /&gt;&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href=&quot;&quot;&gt;&lt;img src=&quot;&quot; /&gt;&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;
</pre>
				<br />
				■CSS<br />
				<br />
				<pre class="brush: css;">
ul {
list-style:none;
}

li {
margin-bottom:2px;
}
</pre>
				<br />
				<span id="more-349"></span><br />
				<br />
				まあすごい簡単な感じにCSSも書いてありますが。サイトによってリセットCSSが入っている場合が多いので諸々の部分は省いております。<br />
				<br />
				この際IE7で見ちゃうと大変なことに画像間の余白が予定より広くなることがありますので、<br />
				そのときの解決策はliに大してfont-size:1%;のようにするとなおります。<br />
				<br />
				しかし、このままでは、IE8でリスト4個置きぐらいに3px程度余計に余白が付くことがありますので、さらにliとその中のaに追記します。<br />
				<br />
				<pre class="brush: css;">
li {
line-height:0;
font-size:1%;
margin-bottom:2px;
}

li a {
line-height:normal;
}
</pre>
				<br />
				これでオッケーです。<br />
				まだまだIE問題は大変そうです。</p>
]]></content:encoded>
			<wfw:commentRss>http://design-tracks.com/study/css/ie7%e3%80%818%e3%81%a7%e3%83%aa%e3%82%b9%e3%83%88%e3%81%ab%e9%9a%99%e9%96%93%e3%81%8c%e3%81%a7%e3%81%8d%e3%82%8b/feed/</wfw:commentRss>
		<slash:comments>6</slash:comments>
	<xhtml:link rel="alternate" media="handheld" type="text/html" href="http://design-tracks.com/study/css/ie7%e3%80%818%e3%81%a7%e3%83%aa%e3%82%b9%e3%83%88%e3%81%ab%e9%9a%99%e9%96%93%e3%81%8c%e3%81%a7%e3%81%8d%e3%82%8b/" />
	</item>
		<item>
		<title>資生堂やソフトバンクの広告に関する歴史がわかる「宣伝部物語」</title>
		<link>http://design-tracks.com/dailyreport/%e8%b3%87%e7%94%9f%e5%a0%82%e3%82%84%e3%82%bd%e3%83%95%e3%83%88%e3%83%90%e3%83%b3%e3%82%af%e3%81%ae%e5%ba%83%e5%91%8a%e3%81%ab%e9%96%a2%e3%81%99%e3%82%8b%e6%ad%b4%e5%8f%b2%e3%81%8c%e3%82%8f%e3%81%8b/</link>
		<comments>http://design-tracks.com/dailyreport/%e8%b3%87%e7%94%9f%e5%a0%82%e3%82%84%e3%82%bd%e3%83%95%e3%83%88%e3%83%90%e3%83%b3%e3%82%af%e3%81%ae%e5%ba%83%e5%91%8a%e3%81%ab%e9%96%a2%e3%81%99%e3%82%8b%e6%ad%b4%e5%8f%b2%e3%81%8c%e3%82%8f%e3%81%8b/#comments</comments>
		<pubDate>Thu, 09 Jul 2009 14:34:24 +0000</pubDate>
		<dc:creator>ts</dc:creator>
				<category><![CDATA[日報]]></category>
		<category><![CDATA[CSS]]></category>
		<category><![CDATA[HTML]]></category>
		<category><![CDATA[コーディング]]></category>
		<category><![CDATA[セミナー]]></category>
		<category><![CDATA[デザイン]]></category>
		<category><![CDATA[広告]]></category>

		<guid isPermaLink="false">http://design-tracks.com/?p=331</guid>
		<description><![CDATA[				
				
				
				通勤時間を使って読んだのですが、内容が面白くあっという間に読み終えてしまいました。
				
				
				
				簡単な内容は、資生堂、サントリー、ソフトバンクがどのような広 [...]]]></description>
			<content:encoded><![CDATA[				<p>
				<img src="http://design-tracks.com/wp-content/uploads/2009/07/sendenbu1.jpg" alt="sendenbu1" title="sendenbu1" width="150" height="207" class="alignleft size-full wp-image-334" />
				<br />
				通勤時間を使って読んだのですが、内容が面白くあっという間に読み終えてしまいました。<br />
				<br />
				<span id="more-331"></span><br />
				<br />
				簡単な内容は、資生堂、サントリー、ソフトバンクがどのような広告を作り、どのように広めていったのかが書かれていました。改めて感じたのは、自分は今までありとあらゆるデザインされたもの（webサイトはもちろん、日常使っているトイレなど）を、表面的にしか見れていなかったなと。それと、売りたいモノや、伝えたいことを考えてデザインするとなると、ターゲットや価値、用途やその商品の特徴をしっかりと理解することが大事だと感じました。<br />
				本を読んだ後は、資生堂、サントリー、ソフトバンクに対する見え方が変わりました。将来関わることができればなと思います。<br />
				<br />
				昨日からモバイルサイトのコーディングをしているのですが、PCとは別物で正直頭で考えながらHTMLを書いて、CSSを…という流れがないので、物足りないです。ただテキストや絵文字を有効に使うという概念はPCにはないので、面白いのは若干あります。早いとこ終わらせないと明日のイベントに行けなくなるのでがむしゃらに頑張ります。<br />
				iPhone、いやiPod touchがすごく欲しい！</p>
]]></content:encoded>
			<wfw:commentRss>http://design-tracks.com/dailyreport/%e8%b3%87%e7%94%9f%e5%a0%82%e3%82%84%e3%82%bd%e3%83%95%e3%83%88%e3%83%90%e3%83%b3%e3%82%af%e3%81%ae%e5%ba%83%e5%91%8a%e3%81%ab%e9%96%a2%e3%81%99%e3%82%8b%e6%ad%b4%e5%8f%b2%e3%81%8c%e3%82%8f%e3%81%8b/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
	<xhtml:link rel="alternate" media="handheld" type="text/html" href="http://design-tracks.com/dailyreport/%e8%b3%87%e7%94%9f%e5%a0%82%e3%82%84%e3%82%bd%e3%83%95%e3%83%88%e3%83%90%e3%83%b3%e3%82%af%e3%81%ae%e5%ba%83%e5%91%8a%e3%81%ab%e9%96%a2%e3%81%99%e3%82%8b%e6%ad%b4%e5%8f%b2%e3%81%8c%e3%82%8f%e3%81%8b/" />
	</item>
		<item>
		<title>XHTMLのことは気にせずにHTMLに移行してもいい？</title>
		<link>http://design-tracks.com/study/html-xhtml/xhtml%e3%81%ae%e3%81%93%e3%81%a8%e3%81%af%e6%b0%97%e3%81%ab%e3%81%9b%e3%81%9a%e3%81%abhtml%e3%81%ab%e7%a7%bb%e8%a1%8c%e3%81%97%e3%81%a6%e3%82%82%e3%81%84%e3%81%84%ef%bc%9f/</link>
		<comments>http://design-tracks.com/study/html-xhtml/xhtml%e3%81%ae%e3%81%93%e3%81%a8%e3%81%af%e6%b0%97%e3%81%ab%e3%81%9b%e3%81%9a%e3%81%abhtml%e3%81%ab%e7%a7%bb%e8%a1%8c%e3%81%97%e3%81%a6%e3%82%82%e3%81%84%e3%81%84%ef%bc%9f/#comments</comments>
		<pubDate>Sat, 04 Jul 2009 10:39:25 +0000</pubDate>
		<dc:creator>ts</dc:creator>
				<category><![CDATA[HTML・XHTML]]></category>
		<category><![CDATA[HTML]]></category>
		<category><![CDATA[XHTML]]></category>

		<guid isPermaLink="false">http://design-tracks.com/?p=259</guid>
		<description><![CDATA[				
				先日「マイコミジャーナル」にて記事を見つけました↓
				
				http://journal.mycom.co.jp/news/2009/07/03/041/index.html
				
			 [...]]]></description>
			<content:encoded><![CDATA[				<p>
				先日「<a href="http://journal.mycom.co.jp/">マイコミジャーナル</a>」にて記事を見つけました↓<br />
				<br />
				<div class="mj-articles">http://journal.mycom.co.jp/news/2009/07/03/041/index.html</div>
				<script type="text/javascript" src="http://api.journal.mycom.co.jp/tensai/mj-tensai-single.js"></script>
				やっとほとんどのサイトがXHTMLの1.0や1.1で制作されているのにここでかと残念に思っていたのですが、<br />
				HTMLに移行しても問題なさげな気がします。<br />
				5は互換性があるみたいなので現状HTMLで組まれているサイトに関しては作業工数はかからなそうですね、<br />
				逆にXHTMLの場合は地味に工数が掛かってしまいますが。まあそれだけのメリットがある場合はうちの会社でも変える必要がでてくるかなと。</p>
]]></content:encoded>
			<wfw:commentRss>http://design-tracks.com/study/html-xhtml/xhtml%e3%81%ae%e3%81%93%e3%81%a8%e3%81%af%e6%b0%97%e3%81%ab%e3%81%9b%e3%81%9a%e3%81%abhtml%e3%81%ab%e7%a7%bb%e8%a1%8c%e3%81%97%e3%81%a6%e3%82%82%e3%81%84%e3%81%84%ef%bc%9f/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
	<xhtml:link rel="alternate" media="handheld" type="text/html" href="http://design-tracks.com/study/html-xhtml/xhtml%e3%81%ae%e3%81%93%e3%81%a8%e3%81%af%e6%b0%97%e3%81%ab%e3%81%9b%e3%81%9a%e3%81%abhtml%e3%81%ab%e7%a7%bb%e8%a1%8c%e3%81%97%e3%81%a6%e3%82%82%e3%81%84%e3%81%84%ef%bc%9f/" />
	</item>
		<item>
		<title>Webアクセシビリティ＠秋葉原</title>
		<link>http://design-tracks.com/study/seminar/web%e3%82%a2%e3%82%af%e3%82%bb%e3%82%b7%e3%83%93%e3%83%aa%e3%83%86%e3%82%a3%ef%bc%a0%e7%a7%8b%e8%91%89%e5%8e%9f/</link>
		<comments>http://design-tracks.com/study/seminar/web%e3%82%a2%e3%82%af%e3%82%bb%e3%82%b7%e3%83%93%e3%83%aa%e3%83%86%e3%82%a3%ef%bc%a0%e7%a7%8b%e8%91%89%e5%8e%9f/#comments</comments>
		<pubDate>Sun, 24 May 2009 19:10:22 +0000</pubDate>
		<dc:creator>ts</dc:creator>
				<category><![CDATA[アクセシビリティ]]></category>
		<category><![CDATA[セミナー・カンファレンス]]></category>
		<category><![CDATA[Flash]]></category>
		<category><![CDATA[HTML]]></category>
		<category><![CDATA[XHTML]]></category>
		<category><![CDATA[アドオン]]></category>
		<category><![CDATA[セミナー]]></category>

		<guid isPermaLink="false">http://www.design-tracks.com/?p=49</guid>
		<description><![CDATA[				
				Webアクセシビリティ＠秋葉原に行ってきました。
				Googleストリートビューのおかげで、ほとんど行ったことがない秋葉原ですが、迷わず会場にたどり着きました。
				
				セミナーの内容で [...]]]></description>
			<content:encoded><![CDATA[				<p>
				Webアクセシビリティ＠秋葉原に行ってきました。<br />
				Googleストリートビューのおかげで、ほとんど行ったことがない秋葉原ですが、迷わず会場にたどり着きました。<br />
				<br />
				セミナーの内容ですが、結構濃かったです。見せ方も会場にいる人だけでなく同時に動画で生中継したり、要約筆記もされていましたので、すごく良心的なセミナーだなと思いました。<span id="more-49"></span><br />
				それでは以下、プログラム順に内容について。<br />
				<br />
				■JIS X 8341-3改正のポイント<br />
				まずはJIS改正にあたっての背景などの説明がありました。<br />
				そこでポイント、問題となって挙げられたのが、<br />
				<br />
				ポイント<br />
				・JIS X 8341-1を国際提案したISO 9241-20の方向性をできるだけ取り入れる．<br />
				・WCAG 2.0の4原則，ガイドライン，達成基準と一致．その他，WCAG 2.0のnormativeもできるだけ取り入れる．<br />
				・プロセスに関する要件をさらに吟味<br />
				・適合性評価ができるようにする．できれば，WCAG 2.0と改正版JIS適合を同一にする．<br />
				・わかりやすさ，運用しやすさの向上．（でも，厳密性は保ちたい．）<br />
				・2004年度版からの移行ガイドを示す<br />
				<br />
				問題<br />
				・ WCAG 2.0とどこまで一致できるか？<br />
				→ WCAG 2.0は3レベル，JISは必須と推奨．<br />
				→ WCAG 2.0のGlossaryをすべて取り込めるか？<br />
				→ WCAG 2.0の規格としての欠点，文書の欠点，曖昧さをどう補うか<br />
				→ 適合性をWCAG 2.0と完全に一致？ 欧州の取り組みをどう取り込むか？<br />
				・ Accessibility Supported文書を誰が作成？ どうやって作成？<br />
				・WCAG 2.0の関連文書（Understanding，Techniquesなど）をどうするか？<br />
				・「（例を示す）わかりやすさ」か「厳密性」か？<br />
				・日本で適用できる達成基準であるか？<br />
				・なじみが薄い用語（ヒューリスティック，ロバスト）<br />
				<br />
				この中でも制作者として気になるのが、WCAG2.0と一致している点、一致していない点と、<br />
				どこまでやればOKとされるのかである。<br />
				利用上の注意として、<br />
				<br />
				・ JISはウェブコンテンツのアクセシビリティ向上のための憲法のようなもの<br />
				・ 達成基準の意図や具体例は「Understanding WCAG 2.0」参照．<br />
				・ 各達成基準を満たす具体的な実装方法は「Techniques for WCAG 2.0」が参考になる．<br />
				・ JISだけに頼らず，ユーザ（高齢者・障害者）の視点を忘れない．<br />
				・ 同時に，JISからかい離しない．<br />
				・ StandardはBestである必要はない．Betterであればよい．<br />
				・ 大事なのは，全員が同じStandardを用いること．つまみ食いや改変は駄目．<br />
				<br />
				まあ要するに、書いてあることに従うことで必ずしもユーザに受け入れられる訳ではなく、<br />
				そのサイトや、コンテンツを通して重視していくものを決めていくことでより良いモノになるのかなと思いました。<br />
				<br />
				■改正版JIS X 8341-3（予定）に適合した実装方法<br />
				主に制作者よりの話だったので、聞きやすく改めてなるほどと感心することが多かった。<br />
				久しぶりに植木さんを見た！！<br />
				<br />
				内容は簡単にまとめると、<br />
				・「AAAに絶対する」というのはやめた方がいい（WCAG2.0でも同じことを言っている）あったらいいねという感覚でとらえる。そもそもHTMLではないFlashでは同じことが言えるかそうでもなかったりで、なので、AAをめざしAAAで可能なものは作業をするという姿勢が良いらしいです。<br />
				・すべての機能をキーボードから利用できるようにする。<br />
				などなどありました。<br />
				日本で主流になっているPC-Talkerはページ内リンクに対応してないという事実があり、まだまだJAWSなどには追いついていない箇所もありますが、これからJISが新しくなることで開発される方ががんばってくれるのではないかと期待しています。<br />
				<br />
				■オープンソース・スクリーンリーダNVDA日本語版<br />
				今回のセミナーで一番聞きたかったモノです。<br />
				辻さんが事情により欠席されていたので残念だったのですが、中村さんの説明はわかりやすく、声も非常に聞き取りやすくよかったなと思いました。<br />
				<br />
				内容は、NVDAの紹介と、現状と課題、今後についてでした。<br />
				NVDAとは簡単に、オープンソースのスクリーンリーダーで、すでに20カ国語以上の言語に翻訳されているらしいです。（スゲェ！！！）ちなみに言語はPythonです。今年はJAVAや、PHPを少し学ぼうと考えていたのですが、悩ましげです。<br />
				<br />
				・NVDAの現状<br />
				→スクリーンリーダーとしての基本機能（音声エンジンの選択や、速度音量の調整が可能）<br />
				→優れている点（見出しを巡って読み進めることができる、音声を読み上げる内容を表示してくれるので音声エンジンがない制作者が自分が作成したサイトがどのように読まれるかの確認が可能）<br />
				→改良点（漢字変換の問題で読みはできるが書きが苦手、音声合成エンジンが付いていない）<br />
				<br />
				・NVDA日本語化プロジェクトの課題<br />
				→漢字変換時の変換候補の読み上げ<br />
				→カーソル移動時、必要に応じて詳細読みをさせる機能<br />
				→NVDA日本語版パッケージに同梱できる音声合成エンジン<br />
				<br />
				・NVDAの今後<br />
				→さらなる追加機能の実装（WAI-ARIA、Internet Explorer）<br />
				→OS関連の読み上げの強化（ログオン画面の読み上げ）<br />
				<br />
				まだまだ課題はあるものの、現状の段階まできているスピード感を考えるとすぐに解決されそうな予感がします。<br />
				どうしてもスクリーンリーダーを購入するとなると高価であまり手が出ないとですが、NVDAが広まると助かる人がたくさんいるのではないかと思います。自分はまだfirevoxでしか検証ができていないので、windowsにインストールしてみようと思います。<br />
				今後のカテゴリーは問わず、セミナーには参加していきたいと思います。その際にはアウトプットもしっかりと行います！</p>
]]></content:encoded>
			<wfw:commentRss>http://design-tracks.com/study/seminar/web%e3%82%a2%e3%82%af%e3%82%bb%e3%82%b7%e3%83%93%e3%83%aa%e3%83%86%e3%82%a3%ef%bc%a0%e7%a7%8b%e8%91%89%e5%8e%9f/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
	<xhtml:link rel="alternate" media="handheld" type="text/html" href="http://design-tracks.com/study/seminar/web%e3%82%a2%e3%82%af%e3%82%bb%e3%82%b7%e3%83%93%e3%83%aa%e3%83%86%e3%82%a3%ef%bc%a0%e7%a7%8b%e8%91%89%e5%8e%9f/" />
	</item>
		<item>
		<title>CSS Nite in Ginza, Vol.34</title>
		<link>http://design-tracks.com/study/css/css-nite-in-ginza-vol34/</link>
		<comments>http://design-tracks.com/study/css/css-nite-in-ginza-vol34/#comments</comments>
		<pubDate>Thu, 16 Apr 2009 14:13:03 +0000</pubDate>
		<dc:creator>ts</dc:creator>
				<category><![CDATA[CSS]]></category>
		<category><![CDATA[セミナー・カンファレンス]]></category>
		<category><![CDATA[HTML]]></category>
		<category><![CDATA[JavaScript]]></category>
		<category><![CDATA[コーディング]]></category>
		<category><![CDATA[ブログ]]></category>

		<guid isPermaLink="false">http://3rize.weblike.jp/wp/?p=23</guid>
		<description><![CDATA[				
				CSS Niteに行ってきました。
				
				セミナーの内容のこともあり、受講者はコーダーの方が７割近くいました！
				
				内容は、初耳のマインドマップや、プログラマ視点から見るマーク [...]]]></description>
			<content:encoded><![CDATA[				<p>
				CSS Niteに行ってきました。<br />
				<br />
				セミナーの内容のこともあり、受講者はコーダーの方が７割近くいました！<br />
				<br />
				内容は、初耳のマインドマップや、プログラマ視点から見るマークアップ、SOY CMSなどで<br />
				面白かったです。<br />
				<br />
				<span id="more-23"></span><br />
				<br />
				■マインドマップ<br />
				詳しくは使ってみないとわからないですが、デザインを考える際のアイデア出しや、<br />
				新しいコンテンツなどを考える際にも便利かなと思いました。動きも面白いので。<br />
				<br />
				■プログラマ視点から見るマークアップ<br />
				話の内容としては、マークアップ、JavaScriptプログラマ、プログラマの三者の情報の共有の大事さと、意味のあるマークアップを行う必要性。<br />
				詳しい内容としては、いくつかポイントがあり↓<br />
				<br />
				・プログラマとのコミュニケーション<br />
				作業領域の確認<br />
				マークアップの意図を伝える（class名、id名など）<br />
				プログラム後のソースをチェックする（Validata）<br />
				<br />
				・プロジェクト全体を考える<br />
				HTMLの共通化<br />
				JavaScriptが得意なことはJavaScriptで<br />
				フォームのマークアップ（form要素をCSSセレクタに書かない）<br />
				<br />
				・一歩先を行くマークアップ<br />
				カヤックが作ったXPathGraphを例にとり、id、class名の使い分けなど、<br />
				自分たちだけじゃなく、外部の人も触ると思ってマークアップをすることが大事である。<br />
				<br />
				装飾系男子、いいと思う。<br />
				<br />
				■SOY CMS<br />
				国産のCMSということもあり、日本語のページで、日本人のサポートが受けられ、英語が苦手な自分にとっては結構良さげだなと思った。<br />
				<br />
				■web0.5で考える<br />
				冒頭の「皮肉屋」の意味がなるほどなと思った。「自分屋24」や「ogoru.tv」など、考え方が面白かった。</p>
]]></content:encoded>
			<wfw:commentRss>http://design-tracks.com/study/css/css-nite-in-ginza-vol34/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
	<xhtml:link rel="alternate" media="handheld" type="text/html" href="http://design-tracks.com/study/css/css-nite-in-ginza-vol34/" />
	</item>
	</channel>
</rss>
