<div class="booklink-box" style="text-align:left;padding-bottom:20px;font-size:small;/zoom: 1;overflow: hidden;">
<div class="booklink-image" style="float:left;margin:0 15px 10px 0;"><a href="http://www.amazon.co.jp/exec/obidos/asin/4382055784/sackoh71-22/" target="_blank" ><img decoding="async" src="http://ecx.images-amazon.com/images/I/41LiU0PLGVL._SL160_.jpg" style="border: none;" /></a></div>
<div class="booklink-info" style="line-height:120%;/zoom: 1;overflow: hidden;">
<div class="booklink-name" style="margin-bottom:10px;line-height:120%"><a href="http://www.amazon.co.jp/exec/obidos/asin/4382055784/sackoh71-22/" target="_blank" >知的思考の技術―考えるフレームを強化する7つのステップの思考術 (SANNOマネジメントコンセプトシリーズ)</a></p>
<div class="booklink-powered-date" style="font-size:8pt;margin-top:5px;font-family:verdana;line-height:120%">posted with <a href="http://yomereba.com" rel="nofollow" target="_blank">ヨメレバ</a></div>
</div>
<div class="booklink-detail" style="margin-bottom:5px;">産業能率大学総合研究所知的思考の技術研究プロジェクト 産能大出版部 2007-12-13    </div>
<div class="booklink-link" style="margin-top: 5px"><a href="http://www.amazon.co.jp/exec/obidos/ASIN/4382055784/sackoh71-22/" name="booklink" rel="nofollow" target="_blank">Amazon.co.jp で詳細を見る</a></div>
</div>
<div class="booklink-footer" style="clear: left"></div>
</div>
<p>久しぶりにヒットした本です。</p>
<p>思考のプロセスに関しては、本書を叩き込めば網羅されているのではないかと思うほど濃いです。</p>
<h2>目的探索の思考</h3>
<ol>
<li>考え方のポイント
<ul>
<li>考えることを疎かにしがちな思考や行動の目的を明らかにするために、何かを始めるときには自分自身に対して「そもそも何のために？」という問いかけを行うことが大切である。</li>
</ul>
</li>
<li>陥りやすい失敗
<ul>
<li>そもそも目的を考えていない。</li>
<li>目的は考えてはいるが妥当性が引くい。</li>
<li>かつては高かった目的の妥当性がいつしか失われてしまった。</li>
</ul>
</li>
<li>主なツール
<ul>
<li>状況の構造化図</li>
<li>目的の連鎖</li>
</ul>
</li>
</ol>
<h2>観察の思考</h3>
<ol>
<li>考え方のポイント
<ul>
<li>心理的要因や発信者の意図に惑わされない。</li>
<li>偏りなく多面的に物事を捉える。</li>
</ul>
</li>
<li>陥りやすい失敗
<ul>
<li>バイアスによる阻害。</li>
<li>他社の主張をそのまま受け入れてしまう。</li>
<li>ウソに騙されてしまう。</li>
</ul>
</li>
<li>主なツール
<ul>
<li>4分割マトリックス</li>
</ul>
</li>
</ol>
<h2>発想の思考</h3>
<ol>
<li>考え方のポイント
<ul>
<li>豊かなアイデアを得るためには、3つのブロックで思考を足止めされることなく自ら積極的に思考し、「量が質を生む」の原則を貫きとおすことが大切である。</li>
<li>偏りなく多面的に物事を捉える。</li>
</ul>
</li>
<li>陥りやすい失敗
<ul>
<li>アイデアが天から降ってくるのを期待して、思考することなく、ただ待ち続けてしまう。</li>
<li>発散思考と収束思考を同時に使って、思考の効率が低下する。</li>
<li>認識、感情、文化の3つのブロックに足止めされてしまい、モノの見方・考え方が偏ってしまう。</li>
</ul>
</li>
<li>主なツール
<ul>
<li>ブレイン・ストーミング法（BS法）</li>
<li>属性列挙法</li>
<li>チェックリスト法</li>
<li>欠点列挙法</li>
<li>希望点列挙法</li>
<li>ゴードン法</li>
<li>NM法</li>
</ul>
</li>
</ol>
<h2>分類の思考</h3>
<ol>
<li>考え方のポイント
<ul>
<li>分類とは、思考対象となる情報をその思考の目的に従って「違う」部分で分け、「同じ」部分でくくること。</li>
<li>分類することによって、わからないことがわかるようになる。複雑なものが単純化され、あいまいな状況が解明され、物事が整理されて使いやすくなるといったさまざまなメリットを享受できる。</li>
</ul>
</li>
<li>陥りやすい失敗
<ul>
<li>事象や問題を漠然と捉えてしまう。</li>
<li>思考の目的にあわない分類基準を設定してしまう。</li>
<li>分ける際にモレやダブリがある。</li>
</ul>
</li>
<li>主なツール
<ul>
<li>目的にあった分類基準を設定する。</li>
<li>抽象水準を統一する。</li>
<li>モレなくダブリなく分ける。（MECE）</li>
</ul>
</li>
</ol>
<h2>構造化の思考</h3>
<ol>
<li>考え方のポイント
<ul>
<li>構造化とは、思考対象について分類した構成要素（部分）がどのような関係（つながり方）にあるのかを明らかにし、思考対象（全体）の意味を理解すること。</li>
<li>この世の中に存在するものは、さまざまな要素が依存しあい、影響をあたえあい、関連しあって存在している。何かを知ろうとして思考するためには、それらすべての関係を押さえなければならない。</li>
</ul>
</li>
<li>陥りやすい失敗
<ul>
<li>組織設計、企画書、プレゼンテーションなど、あらゆるビジネスシーンで分類することはできても、「くくる」「まとめる」という構造化の思考が弱い。</li>
<li>部分は理解できるが、全体として何を伝えたいのかわからなくなってしまう。</li>
<li>人は「木を見て森を見ないタイプ」と「森を見て木を見ないタイプ」に分かれる。木も森も両方捉えるものの見方ができない。</li>
</ul>
</li>
<li>主なツール
<ul>
<li>ツリー構造</li>
<li>マトリックス構造</li>
<li>プロセス構造</li>
</ul>
</li>
</ol>
<h2>意思決定の思考</h3>
<ul>
<li>意思決定には、とっさの意思決定とじっくり考える意思決定がある。</li>
<li>特にとっさの意思決定の際には、意思決定の先送りはしない。</li>
<li>じっくり考える意思決定から&#8221;正しい反応パッケージ&#8221;を複数用意しておく。</li>
<li>反復訓練により迅速に”正しい反応パッケージ”を選択できるようにしておく。</li>
</ul>
<h2>表現の思考</h3>
<ul>
<li>思考の幅を広げるためには表現の手段を多く持つこと。</li>
<li>どのようなことでも言葉で表現（文章に書く）することを習慣付けること。</li>
<li>数字で表現することに日頃から慣れておくこと。</li>
<li>図解は見栄えではなく、シンプルでわかりやすいこと。</li>
</ul>


知的思考の技術―考えるフレームを強化する7つのステップの思考術

<p>テキストボックスを分けずに、入力パターンを制御してくれるjQueryプラグインformatter.jsを使ってみた。</p>
<p>生年月日や電話番号など、テキストボックスを分けずに1つでも意図した値を得ることができそうと思ったのがきっかけ。</p>
<p>&nbsp;</p>
<p>まずはこちらからソースをダウンロード</p>
<p><a href="https://github.com/firstopinion/formatter.js" target="_blank">https://github.com/firstopinion/formatter.js</a></p>
<p>ファイルがいろいろ入っているが、jQueryとformatter.jsを読みこめば良い。</p>
<p>あとは入力フォームを用意して(maxlengthは設定したほうが良い)</p>

		<div id="crayon-64953fd593468984901578" class="crayon-syntax crayon-theme-monokai crayon-font-monaco crayon-os-mac print-yes notranslate" data-settings=" minimize scroll-mouseover wrap" style=" margin-top: 12px; margin-bottom: 12px; font-size: 13px !important; line-height: 18px !important;">
		
			<div class="crayon-toolbar" data-settings=" mouseover overlay hide delay" style="font-size: 13px !important;height: 19.5px !important; line-height: 19.5px !important;"><span class="crayon-title"></span>
			<div class="crayon-tools" style="font-size: 13px !important;height: 19.5px !important; line-height: 19.5px !important;"><div class="crayon-button crayon-nums-button" title="Toggle Line Numbers"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-plain-button" title="Toggle Plain Code"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-wrap-button" title="Toggle Line Wrap"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-expand-button" title="Expand Code"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-copy-button" title="Copy"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-popup-button" title="Open Code In New Window"><div class="crayon-button-icon"></div></div><span class="crayon-language">XHTML</span></div></div>
			<div class="crayon-info" style="min-height: 19.5px !important; line-height: 19.5px !important;"></div>
			<div class="crayon-plain-wrap"><textarea  class="crayon-plain print-no" data-settings="dblclick" readonly style="-moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4; font-size: 13px !important; line-height: 18px !important;">
&lt;input type="text" class="input" id="serial" maxlength="19"&gt;</textarea></div>
			<div class="crayon-main" style="">
				<table class="crayon-table">
					<tr class="crayon-row">
				<td class="crayon-nums " data-settings="show">
					<div class="crayon-nums-content" style="font-size: 13px !important; line-height: 18px !important;"><div class="crayon-num" data-line="crayon-64953fd593468984901578-1">1</div></div>
				</td>
						<td class="crayon-code"><div class="crayon-pre" style="font-size: 13px !important; line-height: 18px !important; -moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4;"><div class="crayon-line" id="crayon-64953fd593468984901578-1"><span class="crayon-r ">&lt;input </span><span class="crayon-e ">type</span>=<span class="crayon-s ">"text"</span><span class="crayon-h"> </span><span class="crayon-e ">class</span>=<span class="crayon-s ">"input"</span><span class="crayon-h"> </span><span class="crayon-e ">id</span>=<span class="crayon-s ">"serial"</span><span class="crayon-h"> </span><span class="crayon-e ">maxlength</span>=<span class="crayon-s ">"19"</span><span class="crayon-r ">&gt;</span></div></div></td>
					</tr>
				</table>
			</div>
		</div>

<p>JSを実行する。</p>

		<div id="crayon-64953fd59346c407465045" class="crayon-syntax crayon-theme-monokai crayon-font-monaco crayon-os-mac print-yes notranslate" data-settings=" minimize scroll-mouseover wrap" style=" margin-top: 12px; margin-bottom: 12px; font-size: 13px !important; line-height: 18px !important;">
		
			<div class="crayon-toolbar" data-settings=" mouseover overlay hide delay" style="font-size: 13px !important;height: 19.5px !important; line-height: 19.5px !important;"><span class="crayon-title"></span>
			<div class="crayon-tools" style="font-size: 13px !important;height: 19.5px !important; line-height: 19.5px !important;"><div class="crayon-button crayon-nums-button" title="Toggle Line Numbers"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-plain-button" title="Toggle Plain Code"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-wrap-button" title="Toggle Line Wrap"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-expand-button" title="Expand Code"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-copy-button" title="Copy"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-popup-button" title="Open Code In New Window"><div class="crayon-button-icon"></div></div><span class="crayon-language">JavaScript</span></div></div>
			<div class="crayon-info" style="min-height: 19.5px !important; line-height: 19.5px !important;"></div>
			<div class="crayon-plain-wrap"><textarea  class="crayon-plain print-no" data-settings="dblclick" readonly style="-moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4; font-size: 13px !important; line-height: 18px !important;">
$ (document ).ready( function()
{
	var serial = document.getElementById('serial');
	if ( serial )
	{
		new Formatter( serial,
		{
			'pattern': '{{9999}}-{{9999}}-{{9999}}-{{9999}}'
		});
	}
});</textarea></div>
			<div class="crayon-main" style="">
				<table class="crayon-table">
					<tr class="crayon-row">
				<td class="crayon-nums " data-settings="show">
					<div class="crayon-nums-content" style="font-size: 13px !important; line-height: 18px !important;"><div class="crayon-num" data-line="crayon-64953fd59346c407465045-1">1</div><div class="crayon-num crayon-striped-num" data-line="crayon-64953fd59346c407465045-2">2</div><div class="crayon-num" data-line="crayon-64953fd59346c407465045-3">3</div><div class="crayon-num crayon-striped-num" data-line="crayon-64953fd59346c407465045-4">4</div><div class="crayon-num" data-line="crayon-64953fd59346c407465045-5">5</div><div class="crayon-num crayon-striped-num" data-line="crayon-64953fd59346c407465045-6">6</div><div class="crayon-num" data-line="crayon-64953fd59346c407465045-7">7</div><div class="crayon-num crayon-striped-num" data-line="crayon-64953fd59346c407465045-8">8</div><div class="crayon-num" data-line="crayon-64953fd59346c407465045-9">9</div><div class="crayon-num crayon-striped-num" data-line="crayon-64953fd59346c407465045-10">10</div><div class="crayon-num" data-line="crayon-64953fd59346c407465045-11">11</div></div>
				</td>
						<td class="crayon-code"><div class="crayon-pre" style="font-size: 13px !important; line-height: 18px !important; -moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4;"><div class="crayon-line" id="crayon-64953fd59346c407465045-1"><span class="crayon-sy">$</span><span class="crayon-h"> </span><span class="crayon-sy">(</span><span class="crayon-r">document</span><span class="crayon-h"> </span><span class="crayon-sy">)</span><span class="crayon-sy">.</span><span class="crayon-e">ready</span><span class="crayon-sy">(</span><span class="crayon-h"> </span><span class="crayon-t">function</span><span class="crayon-sy">(</span><span class="crayon-sy">)</span></div><div class="crayon-line crayon-striped-line" id="crayon-64953fd59346c407465045-2"><span class="crayon-sy">{</span></div><div class="crayon-line" id="crayon-64953fd59346c407465045-3"><span class="crayon-h">	</span><span class="crayon-t">var</span><span class="crayon-h"> </span><span class="crayon-i">serial</span><span class="crayon-h"> </span>=<span class="crayon-h"> </span><span class="crayon-i">document</span><span class="crayon-sy">.</span><span class="crayon-e">getElementById</span><span class="crayon-sy">(</span><span class="crayon-s">'serial'</span><span class="crayon-sy">)</span><span class="crayon-sy">;</span></div><div class="crayon-line crayon-striped-line" id="crayon-64953fd59346c407465045-4"><span class="crayon-h">	</span><span class="crayon-st">if</span><span class="crayon-h"> </span><span class="crayon-sy">(</span><span class="crayon-h"> </span><span class="crayon-i">serial</span><span class="crayon-h"> </span><span class="crayon-sy">)</span></div><div class="crayon-line" id="crayon-64953fd59346c407465045-5"><span class="crayon-h">	</span><span class="crayon-sy">{</span></div><div class="crayon-line crayon-striped-line" id="crayon-64953fd59346c407465045-6"><span class="crayon-h">		</span><span class="crayon-r">new</span><span class="crayon-h"> </span><span class="crayon-e">Formatter</span><span class="crayon-sy">(</span><span class="crayon-h"> </span><span class="crayon-i">serial</span><span class="crayon-sy">,</span></div><div class="crayon-line" id="crayon-64953fd59346c407465045-7"><span class="crayon-h">		</span><span class="crayon-sy">{</span></div><div class="crayon-line crayon-striped-line" id="crayon-64953fd59346c407465045-8"><span class="crayon-h">			</span><span class="crayon-s">'pattern'</span><span class="crayon-sy">:</span><span class="crayon-h"> </span><span class="crayon-s">'{{9999}}-{{9999}}-{{9999}}-{{9999}}'</span></div><div class="crayon-line" id="crayon-64953fd59346c407465045-9"><span class="crayon-h">		</span><span class="crayon-sy">}</span><span class="crayon-sy">)</span><span class="crayon-sy">;</span></div><div class="crayon-line crayon-striped-line" id="crayon-64953fd59346c407465045-10"><span class="crayon-h">	</span><span class="crayon-sy">}</span></div><div class="crayon-line" id="crayon-64953fd59346c407465045-11"><span class="crayon-sy">}</span><span class="crayon-sy">)</span><span class="crayon-sy">;</span></div></div></td>
					</tr>
				</table>
			</div>
		</div>

<p>&nbsp;</p>
<p>パターンは{{}}で囲う必要があり、それぞれ以下のように指定する。</p>
<p>数字(0-99) → 9</p>
<p>英字(A-Za-z) → a</p>
<p>全て(A-Za-z0-9) → *</p>
<p>&nbsp;</p>
<p>デモはこちら</p>
<p><a class="demo" href="/demo/hoshino/48/test.html">demo</a></p>
<p>&nbsp;</p>
<p>しかし、使ってみてわかったが、2つ大きな欠点がある。</p>
<p>&nbsp;</p>
<p>1. 日本語が使えない</p>
<p>姓名の間にスペースを入れるなどのフォーマットはできない。</p>
<p>それは良いとしても、記号や空白文字列も使えないので、結構困る。</p>
<p>正規表現が使えれば良いのだが、対応してないみたい。</p>
<p>&nbsp;</p>
<p>2. 桁数がフレキシブルじゃない</p>
<p>例えば日本の電話番号だと</p>
<p>03-…の場合もあれば080…の場合もある。</p>
<p>しかしこちらのプラグインでは桁数は予め決めた桁数からの過不足は認められない。</p>
<p>なので使うのであれば完全に桁数が決まっていなければならない。</p>
<p>&nbsp;</p>
<p>用途は限られるが、特にシリアルなどはわかりやすいので使ってみようと思う。</p>

入力パターンをかっこよく制御してくれるjQueryプラグイン formatter.js

<p>Photoshopを使い始めて数年経ちましたが、</p>
<p>最近になってようやく知った、便利なショートカットを少しだけご紹介します。</p>
<p>&nbsp;</p>
<h2>移動ツール選択中に「ctrl(command) + 左クリック」</h3>
<p>このショートカットを使うと、Illustratorでオブジェクトを選択するときと同じように、</p>
<p>クリックした場所にある要素のレイヤーを選択することができます。</p>
<p>大量のレイヤーの中から、目的の要素があるレイヤーを選択するのに便利です。</p>
<p><img decoding="async" loading="lazy" alt="ss" src="/uploads-archive/2013/11/ss00.jpg" width="656" height="525" /></p>
<p>↓</p>
<p><img decoding="async" loading="lazy" alt="ss" src="/uploads-archive/2013/11/ss01.jpg" width="656" height="525" /></p>
<p>&nbsp;</p>
<h2>移動ツール選択中に「ctrl(command) + J」</h3>
<p>このショートカットを使うと、選択しているレイヤーを複製することができます。</p>
<p>同じ要素を多数複製したりする場合に便利です。</p>
<p><img decoding="async" loading="lazy" alt="ss" src="/uploads-archive/2013/11/ss02.jpg" width="656" height="525" /></p>
<p>&nbsp;</p>
<p>覚えるととても便利なショートカットですので、</p>
<p>使ったことのない方は、是非使ってみてください。</p>


ひそかに便利なPhotoshopのショートカット（レイヤー系）

MATCH Against In Boolean Mode

<p>こんなものがあるなんて今まで知りませんでした・・・</p>
<p>なぜ知らなかったのでしょう。勉強不足ですね。。。</p>
<p>&nbsp;</p>
<p>今日紹介するのは、photoshopの「CSS3Ps」というエクステンションです。</p>
<p>&nbsp;</p>
<p>シェイプレイヤーやテキストレイヤーのをcssで書き出しくれるという代物です。</p>
<p>もちろん名前の通りcss3対応です。</p>
<p>&nbsp;</p>
<p>どんな風に書きだされるのかが気になる所かと思いますが、</p>
<p>順をおって説明していきます。</p>
<p>&nbsp;</p>
<h2>まずはダウンロード</h3>
<p>&nbsp;<br />
まずは下記URLからダウンロードします。</p>
<p><a href="http://css3ps.com/" target="_blank">http://css3ps.com/</a></p>
<p>右上の「free download」をクリックです！<br />
&nbsp;</p>
<h2>ダウンロードしたファイルを開く</h3>
<p>ダウンロードしたファイルを開くと勝手にphotoshopへインストールしてくれます。</p>
<p>以下のような画面が立ち上がると思います。<br />
&nbsp;<br />
<img decoding="async" loading="lazy" class="alignnone size-full wp-image-3568" alt="スクリーンショット 2013-11-12 13.47.09" src="/uploads-archive/2013/11/93dc3066d35b9c3171a9d6eedaa5d1d5.png" width="550" height="408" srcset="/uploads-archive/2013/11/93dc3066d35b9c3171a9d6eedaa5d1d5.png 825w, /uploads-archive/2013/11/93dc3066d35b9c3171a9d6eedaa5d1d5-300x222.png 300w, /uploads-archive/2013/11/93dc3066d35b9c3171a9d6eedaa5d1d5-228x169.png 228w" sizes="(max-width: 550px) 100vw, 550px" /></p>
<p>&nbsp;</p>
<h2>photoshopを開いて、エクステンションを表示</h3>
<p>&nbsp;<br />
もし今まで開いていたのであれば、<br />
１回終了してからまた開いてください。</p>
<p>そうすると、ウィンドウ &gt; エクステンションの所にcss3Psと表示されるのでクリックします。<br />
&nbsp;<br />
<img decoding="async" loading="lazy" class="alignnone size-large wp-image-3569" alt="スクリーンショット 2013-11-12 14.20.17（2）" src="/uploads-archive/2013/11/b93c7373d0ba4c103252450e5d7d55f2-1024x201.png" width="607" height="119" srcset="/uploads-archive/2013/11/b93c7373d0ba4c103252450e5d7d55f2-1024x201.png 1024w, /uploads-archive/2013/11/b93c7373d0ba4c103252450e5d7d55f2-300x59.png 300w, /uploads-archive/2013/11/b93c7373d0ba4c103252450e5d7d55f2-228x44.png 228w, /uploads-archive/2013/11/b93c7373d0ba4c103252450e5d7d55f2.png 1220w" sizes="(max-width: 607px) 100vw, 607px" /></p>
<p>&nbsp;</p>
<h2>シェイプ選んでクリック</h3>
<p>シェイプレイヤーを選択状態にし、下の画面のCSS3Psの箇所をクリックします。<br />
&nbsp;<br />
<img decoding="async" loading="lazy" class="alignnone size-large wp-image-3570" alt="スクリーンショット 2013-11-12 14.00.57" src="/uploads-archive/2013/11/9520b27b5058b0b976ecfec9cc317953-1024x641.png" width="600" height="375" srcset="/uploads-archive/2013/11/9520b27b5058b0b976ecfec9cc317953-1024x641.png 1024w, /uploads-archive/2013/11/9520b27b5058b0b976ecfec9cc317953-300x188.png 300w, /uploads-archive/2013/11/9520b27b5058b0b976ecfec9cc317953-228x142.png 228w, /uploads-archive/2013/11/9520b27b5058b0b976ecfec9cc317953.png 1241w" sizes="(max-width: 600px) 100vw, 600px" /></p>
<p>&nbsp;</p>
<h2>cssの書きだしが完了！</h3>
<p>新規ブラウザウィンドウが立ち上がり、数秒待つと、<br />
cssが表示されます。<br />
そちらをコピーして後は自由に使用すると言った感じですね。<br />
&nbsp;<br />
<img decoding="async" loading="lazy" class="alignnone size-large wp-image-3571" alt="スクリーンショット 2013-11-12 14.04.49" src="/uploads-archive/2013/11/9571ea2391a4939314df01247606dc99-1024x569.png" width="601" height="334" srcset="/uploads-archive/2013/11/9571ea2391a4939314df01247606dc99-1024x569.png 1024w, /uploads-archive/2013/11/9571ea2391a4939314df01247606dc99-300x166.png 300w, /uploads-archive/2013/11/9571ea2391a4939314df01247606dc99-228x126.png 228w, /uploads-archive/2013/11/9571ea2391a4939314df01247606dc99.png 1191w" sizes="(max-width: 601px) 100vw, 601px" /></p>
<p><img decoding="async" loading="lazy" class="alignnone size-large wp-image-3572" alt="ページの画像" src="/uploads-archive/2013/11/ef53f8098831daf49546c5fe9056c1ac-1024x571.jpg" width="601" height="335" srcset="/uploads-archive/2013/11/ef53f8098831daf49546c5fe9056c1ac-1024x571.jpg 1024w, /uploads-archive/2013/11/ef53f8098831daf49546c5fe9056c1ac-300x167.jpg 300w, /uploads-archive/2013/11/ef53f8098831daf49546c5fe9056c1ac-228x127.jpg 228w, /uploads-archive/2013/11/ef53f8098831daf49546c5fe9056c1ac.jpg 1201w" sizes="(max-width: 601px) 100vw, 601px" /></p>
<p>&nbsp;</p>
<h2>複数も可能</h3>
<p>複数のレイヤーを選択して書き出すことも可能です。</p>
<p>以下のような形で書きだすと、<br />
<img decoding="async" loading="lazy" class="alignnone size-large wp-image-3573" alt="スクリーンショット 2013-11-12 14.05.10" src="/uploads-archive/2013/11/63436627b8e7740850eb461d21141ea3-1024x639.png" width="601" height="375" srcset="/uploads-archive/2013/11/63436627b8e7740850eb461d21141ea3-1024x639.png 1024w, /uploads-archive/2013/11/63436627b8e7740850eb461d21141ea3-300x187.png 300w, /uploads-archive/2013/11/63436627b8e7740850eb461d21141ea3-228x142.png 228w, /uploads-archive/2013/11/63436627b8e7740850eb461d21141ea3.png 1244w" sizes="(max-width: 601px) 100vw, 601px" /></p>
<p>&nbsp;</p>
<p>以下の様に表示されます。<br />
&nbsp;<br />
<img decoding="async" loading="lazy" class="alignnone size-large wp-image-3574" alt="ページの画像2" src="/uploads-archive/2013/11/7ecc9d9f4ed4cf790d01e7bb44209428-706x1024.jpg" width="527" height="764" srcset="/uploads-archive/2013/11/7ecc9d9f4ed4cf790d01e7bb44209428-706x1024.jpg 706w, /uploads-archive/2013/11/7ecc9d9f4ed4cf790d01e7bb44209428-206x300.jpg 206w, /uploads-archive/2013/11/7ecc9d9f4ed4cf790d01e7bb44209428-228x330.jpg 228w, /uploads-archive/2013/11/7ecc9d9f4ed4cf790d01e7bb44209428.jpg 1186w" sizes="(max-width: 527px) 100vw, 527px" /></p>
<p>レイヤー重ねていても、それぞれのレイヤーを個々に書き出してくれます。</p>
<p>どこまでcssで書き出しくれるかもサイトに載っておりますので、</p>
<p>ぜひ使ってみて下さい！</p>
<p>&nbsp;<br />
<a href="http://css3ps.com/" target="_blank">http://css3ps.com/</a><br />
&nbsp;</p>


知らなかった！photoshopでcssを書き出してくれる無料のエクステンション「CSS3Ps」

<p>今日はMySQLの外部参照について話したいと思います。<br />
慣れないキーワードがちょっと出てきますが、安心してください。<br />
MySQLの外部参照はこれだけで覚えます。</p>
<h2>キーワード</h3>
<p>CONSTRAINT<br />
REFERENCES<br />
RESTRICT<br />
NO ACTION<br />
CASCADE<br />
SET NULL</p>
<h2>基本用法</h3>
<p></p>

		<div id="crayon-64953fd593043722562159" class="crayon-syntax crayon-theme-monokai crayon-font-monaco crayon-os-mac print-yes notranslate" data-settings=" minimize scroll-mouseover wrap" style=" margin-top: 12px; margin-bottom: 12px; font-size: 13px !important; line-height: 18px !important;">
		
			<div class="crayon-toolbar" data-settings=" mouseover overlay hide delay" style="font-size: 13px !important;height: 19.5px !important; line-height: 19.5px !important;"><span class="crayon-title"></span>
			<div class="crayon-tools" style="font-size: 13px !important;height: 19.5px !important; line-height: 19.5px !important;"><div class="crayon-button crayon-nums-button" title="Toggle Line Numbers"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-plain-button" title="Toggle Plain Code"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-wrap-button" title="Toggle Line Wrap"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-expand-button" title="Expand Code"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-copy-button" title="Copy"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-popup-button" title="Open Code In New Window"><div class="crayon-button-icon"></div></div></div></div>
			<div class="crayon-info" style="min-height: 19.5px !important; line-height: 19.5px !important;"></div>
			<div class="crayon-plain-wrap"><textarea  class="crayon-plain print-no" data-settings="dblclick" readonly style="-moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4; font-size: 13px !important; line-height: 18px !important;">
CREATE TABLE 子テーブル名(子カラム名 データ型,
  CONSTRAINT キー名 FOREIGN KEY (子カラム名)
  REFERENCES 親テーブル名(親カラム名)
  ON DELETE reference_option
  ON UPDATE reference_option
) ENGINE=InnoDB;</textarea></div>
			<div class="crayon-main" style="">
				<table class="crayon-table">
					<tr class="crayon-row">
				<td class="crayon-nums " data-settings="show">
					<div class="crayon-nums-content" style="font-size: 13px !important; line-height: 18px !important;"><div class="crayon-num" data-line="crayon-64953fd593043722562159-1">1</div><div class="crayon-num crayon-striped-num" data-line="crayon-64953fd593043722562159-2">2</div><div class="crayon-num" data-line="crayon-64953fd593043722562159-3">3</div><div class="crayon-num crayon-striped-num" data-line="crayon-64953fd593043722562159-4">4</div><div class="crayon-num" data-line="crayon-64953fd593043722562159-5">5</div><div class="crayon-num crayon-striped-num" data-line="crayon-64953fd593043722562159-6">6</div></div>
				</td>
						<td class="crayon-code"><div class="crayon-pre" style="font-size: 13px !important; line-height: 18px !important; -moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4;"><div class="crayon-line" id="crayon-64953fd593043722562159-1"><span class="crayon-e">CREATE </span><span class="crayon-i">TABLE</span><span class="crayon-h"> </span>子テーブル名<span class="crayon-sy">(</span>子カラム名<span class="crayon-h"> </span>データ型<span class="crayon-sy">,</span></div><div class="crayon-line crayon-striped-line" id="crayon-64953fd593043722562159-2"><span class="crayon-h">&nbsp;&nbsp;</span><span class="crayon-i">CONSTRAINT</span><span class="crayon-h"> </span>キー名<span class="crayon-h"> </span><span class="crayon-e">FOREIGN </span><span class="crayon-e">KEY</span><span class="crayon-h"> </span><span class="crayon-sy">(</span>子カラム名<span class="crayon-sy">)</span></div><div class="crayon-line" id="crayon-64953fd593043722562159-3"><span class="crayon-h">&nbsp;&nbsp;</span><span class="crayon-i">REFERENCES</span><span class="crayon-h"> </span>親テーブル名<span class="crayon-sy">(</span>親カラム名<span class="crayon-sy">)</span></div><div class="crayon-line crayon-striped-line" id="crayon-64953fd593043722562159-4"><span class="crayon-h">&nbsp;&nbsp;</span><span class="crayon-e">ON </span><span class="crayon-e">DELETE </span><span class="crayon-e">reference_option</span></div><div class="crayon-line" id="crayon-64953fd593043722562159-5"><span class="crayon-e">&nbsp;&nbsp;</span><span class="crayon-e">ON </span><span class="crayon-e">UPDATE </span><span class="crayon-i">reference_option</span></div><div class="crayon-line crayon-striped-line" id="crayon-64953fd593043722562159-6"><span class="crayon-sy">)</span><span class="crayon-h"> </span><span class="crayon-i">ENGINE</span>=<span class="crayon-i">InnoDB</span><span class="crayon-sy">;</span></div></div></td>
					</tr>
				</table>
			</div>
		</div>

<p> </p>
<h2>reference_option</h3>
<h3>RESTRICT</h4>
<p>ON DELETE句やON UPDATE句にRESTRICTを指定した場合は、親テーブルに対して更新や削除を行うとエラーが発生します。RESTRICTはON DELETE句やON UPDATE句を明示的に指定しなかった場合に設定される値です。</p>
<h3>NO ACTION</h4>
<p>ON DELETE句やON UPDATE句にNO ACTIONを指定した場合は、親テーブルに対して更新や削除を行うとエラーが発生します。MySQLにおいてはNO ACTIONとRESTRICTは同じ挙動となります。</p>
<h3>CASCADE</h4>
<p>ON DELETE句やON UPDATE句にCASCADEを指定した場合は、親テーブルに対して更新を行うと子テーブルで同じ値を持つカラムの値も合わせて更新されます。また親テーブルに対して削除を行うと子テーブルで同じ値を持つデータが削除されます。</p>
<h3>SET NULL</h4>
<p>ON DELETE句やON UPDATE句にSET NULLを指定した場合は、親テーブルに対して更新を行うと子テーブルで同じ値を持つカラムの値がNULLに更新されます。また親テーブルに対して削除を行うと子テーブルで同じ値を持つデータのカラムの値がNULLに更新されます。</p>
<h2>参考リンク</h3>
<p><a href="http://dev.mysql.com/doc/refman/5.1/ja/innodb-foreign-key-constraints.html" target="_blank">http://dev.mysql.com/doc/refman/5.1/ja/innodb-foreign-key-constraints.html</a><br />
<a href="http://www.dbonline.jp/mysql/table/index12.html" target="_blank">http://www.dbonline.jp/mysql/table/index12.html</a></p>

【MySQL】外部参照について

<p>文章はほとんどのHPにあると思いますが、</p>
<p>その文章でちょっと悩ませるのが折り返しについてです。</p>
<p>&nbsp;</p>
<p>紙とは違い完全に思い通りにはならないものなのですが、</p>
<p>cssでいろいろな設定をすることができます。</p>
<p>&nbsp;</p>
<p>その主要なものが以下になります。</p>
<h3>word-wrap</h4>
<p><strong>normal</strong><br />
単語の途中で改行はせず、必要に応じて表示範囲を拡大。<br />
<strong>break-word</strong><br />
必要に応じて単語の途中で改行</p>
<h3>word-break</h4>
<p><strong>normal</strong><br />
英語等は単語の途中では改行せず、単語で改行。日本語等は表示範囲に合わせて改行され、単語の途中で改行されることもある。<br />
<strong>break-all</strong><br />
言語に関係なく表示範囲に合わせて改行。単語の途中で改行されることもある。<br />
<strong>keep-all</strong><br />
言語に関係なく単語の途中では改行せず、単語で改行。</p>
<h3>white-space</h4>
<p><strong>normal</strong><br />
ソース中の連続する半角スペース・タブ・改行を、1つの半角スペースとして表示。ボックスの大きさが指定されている場合には、その大きさに応じて自動的に改行。<br />
<strong>pre</strong><br />
ソース中の連続する半角スペース・タブ・改行を、そのまま表示。<br />
<strong>nowrap</strong><br />
ソース中の連続する半角スペース・タブ・改行を、1つの半角スペースとして表示。ボックスの大きさが指定されている場合にも、自動的に改行されない。</p>
<p>&nbsp;</p>
<p>となっておりますが、</p>
<p>言葉で説明されてもあまりピンとこないと思いますので、</p>
<p>英語と日本語で実際にhtmlで作成してみましたので、</p>
<p>ご覧ください。<br />
<a class="demo" href="/demo/abe/35/" target="_blank">DEMO</a></p>
<p>あまり変わらないような感じがしますね・・・</p>
<p>word-breakのbreal-allとwhite-spaceのpreが目に見えて違いますが、</p>
<p>おそらくhtmlの状況によって変わってくるのだと思います。</p>
<p>簡単な参考にしてください。</p>
<p>&nbsp;</p>
<p>ちなみに、DEMOに入ってるテキストは、</p>
<p>以下のサイトで生成されたものを使用しています。</p>
<p>テキスト何入れようかと迷った時はいいですね！</p>
<p>日本語<br />
<a href="http://www.blindtextgenerator.com/lorem-ipsum" target="_blank">http://www.blindtextgenerator.com/lorem-ipsum</a></p>
<p>英語<br />
<a href="http://lipsum.sugutsukaeru.jp/index.cgi" target="_blank">http://lipsum.sugutsukaeru.jp/index.cgi</a></p>


cssで制御する折り返しのまとめ

<p>&nbsp;</p>
<p>Android4.4が発表されましたので、備忘録を兼ねてまとめてみました。</p>
<p>個人としては、Nexus7（2013）を初めて本格的に保有するAndroid端末として購入しました。</p>
<p>ipadも保有しておりますが、一言で比較をすると、Android断片化の影響を強く受けていると感じました。</p>
<p>ipadであれば、画面サイズが決まっているため、アプリにしろWebにしろ、最適化されたサイズ操作性というものが用意されていることが多かったのですが、Androidの7インチ端末となると、アプリがスマートフォンの比率で表示されたりすることがあるため、異様にボタンの類が大きかったり、WebではPCサイトのまま表示されると7インチでは非常に小さくなってしまったりと、CPUスペックも解像度も十分で動作は申し分ないのですが、UXの部分で厳しさを感じました。</p>
<p>上記の感想を抱いていただけに、Android4.4の発表は非常に興味深いものでした。</p>
<p>&nbsp;</p>
<p>Nexus5と同時に発表されたものですが、主なポイントは下記になります。</p>
<ul>
<li>低スペックの端末でも動作可能</li>
<li>マルチタスキングの高速化</li>
<li>統合されたメッセージアプリHungout</li>
<li>絵文字の改良</li>
</ul>
<p>ここで、述べた興味深い内容というのが、低スペックの端末でも動作が可能というところです。</p>
<p>新興国ではいまだにメモリ512MBなど日本の主流端末の1/4ほどのスペックが多いとのことですが、そのような端末でも動作が可能になるように隅々まで効率化と最適化をしたとのことです。</p>
<p>バージョンアップをするにつれて、機能が増え、表現がリッチになり要求スペックを挙げていき、低スペック端末を切り捨てていくというのがソフトウェア開発の主たる流れなのかと思っていましたが、Googleのこの判断は素晴らしいと思います。</p>
<p>私がフラッグシップ端末を買って、感じていた断片化をまず、GoogleがOSレベルで収束をさせようとしているため、今後に期待です。</p>
<p>&nbsp;</p>
<h2><span style="font-size: 1em;">アップデートの提供は18ヶ月以内の発売端末に限る</span></h3>
<p>また 、リリース時期について、確認をしていたのですが、驚くべきことが分かりました。</p>
<p>GoogleのOSアップデートの提供基準が18ヶ月以内に発売された端末のみということです。</p>
<p>下記URLによると、GalaxyNEXUSは対象外になるということです。</p>
<p>断片化を取り除きつつもアップデートが18ヶ月以内というのは何とも矛盾するポリシーになっていますが、ここも今後に期待したいところです。</p>
<p><a href="https://support.google.com/nexus/answer/3507867?hl=ja&amp;ref_topic=3415518" target="_blank">https://support.google.com/nexus/answer/3507867?hl=ja&amp;ref_topic=3415518</a></p>
<p>&nbsp;</p>
<h2>参考サイト</h3>
<p><a href="http://www.android.com/versions/kit-kat-4-4/" target="_blank">http://www.android.com/versions/kit-kat-4-4/</a></p>
<p><a href="http://www.android.com/versions/kit-kat-4-4/" target="_blank">http://jp.techcrunch.com/2013/11/01/20131031android-4-4-kitkat-google/</a></p>
<p><a href="http://jp.techcrunch.com/2013/11/01/20131031android-4-4-kitkat-google/" target="_blank">http://smhn.info/201311-what-change-android-kitkat </a></p>
<p>&nbsp;</p>


Android4.4の発表アップデートの提供は18ヶ月以内の発売端末？

<h2>FULLTEXT</h3>
<p>FULLTEXTとは全文検索インデックスの事です。</p>
<p>利用できるデータベースはMyISAM型データベースのみです。</p>
<p>MyISAM型はテーブル作成時に設定できます。</p>

		<div id="crayon-64953fd592e56315761904" class="crayon-syntax crayon-theme-monokai crayon-font-monaco crayon-os-mac print-yes notranslate" data-settings=" minimize scroll-mouseover wrap" style=" margin-top: 12px; margin-bottom: 12px; font-size: 13px !important; line-height: 18px !important;">
		
			<div class="crayon-toolbar" data-settings=" mouseover overlay hide delay" style="font-size: 13px !important;height: 19.5px !important; line-height: 19.5px !important;"><span class="crayon-title"></span>
			<div class="crayon-tools" style="font-size: 13px !important;height: 19.5px !important; line-height: 19.5px !important;"><div class="crayon-button crayon-nums-button" title="Toggle Line Numbers"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-plain-button" title="Toggle Plain Code"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-wrap-button" title="Toggle Line Wrap"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-expand-button" title="Expand Code"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-copy-button" title="Copy"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-popup-button" title="Open Code In New Window"><div class="crayon-button-icon"></div></div></div></div>
			<div class="crayon-info" style="min-height: 19.5px !important; line-height: 19.5px !important;"></div>
			<div class="crayon-plain-wrap"><textarea  class="crayon-plain print-no" data-settings="dblclick" readonly style="-moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4; font-size: 13px !important; line-height: 18px !important;">
CREATE TABLE table_name (
  id INT
) ENGINE=MyISAM;</textarea></div>
			<div class="crayon-main" style="">
				<table class="crayon-table">
					<tr class="crayon-row">
				<td class="crayon-nums " data-settings="show">
					<div class="crayon-nums-content" style="font-size: 13px !important; line-height: 18px !important;"><div class="crayon-num" data-line="crayon-64953fd592e56315761904-1">1</div><div class="crayon-num crayon-striped-num" data-line="crayon-64953fd592e56315761904-2">2</div><div class="crayon-num" data-line="crayon-64953fd592e56315761904-3">3</div></div>
				</td>
						<td class="crayon-code"><div class="crayon-pre" style="font-size: 13px !important; line-height: 18px !important; -moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4;"><div class="crayon-line" id="crayon-64953fd592e56315761904-1"><span class="crayon-e">CREATE </span><span class="crayon-e">TABLE </span><span class="crayon-e">table_name</span><span class="crayon-h"> </span><span class="crayon-sy">(</span></div><div class="crayon-line crayon-striped-line" id="crayon-64953fd592e56315761904-2"><span class="crayon-h">&nbsp;&nbsp;</span><span class="crayon-e">id </span><span class="crayon-t">INT</span></div><div class="crayon-line" id="crayon-64953fd592e56315761904-3"><span class="crayon-sy">)</span><span class="crayon-h"> </span><span class="crayon-i">ENGINE</span>=<span class="crayon-i">MyISAM</span><span class="crayon-sy">;</span></div></div></td>
					</tr>
				</table>
			</div>
		</div>

<p> </p>
<p>また、既存のテーブルをMyISAM型に設定する事も出来ます。</p>

		<div id="crayon-64953fd592e5a133533955" class="crayon-syntax crayon-theme-monokai crayon-font-monaco crayon-os-mac print-yes notranslate" data-settings=" minimize scroll-mouseover wrap" style=" margin-top: 12px; margin-bottom: 12px; font-size: 13px !important; line-height: 18px !important;">
		
			<div class="crayon-toolbar" data-settings=" mouseover overlay hide delay" style="font-size: 13px !important;height: 19.5px !important; line-height: 19.5px !important;"><span class="crayon-title"></span>
			<div class="crayon-tools" style="font-size: 13px !important;height: 19.5px !important; line-height: 19.5px !important;"><div class="crayon-button crayon-nums-button" title="Toggle Line Numbers"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-plain-button" title="Toggle Plain Code"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-wrap-button" title="Toggle Line Wrap"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-expand-button" title="Expand Code"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-copy-button" title="Copy"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-popup-button" title="Open Code In New Window"><div class="crayon-button-icon"></div></div></div></div>
			<div class="crayon-info" style="min-height: 19.5px !important; line-height: 19.5px !important;"></div>
			<div class="crayon-plain-wrap"><textarea  class="crayon-plain print-no" data-settings="dblclick" readonly style="-moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4; font-size: 13px !important; line-height: 18px !important;">
 ALTER TABLE table_name ENGINE MyISAM; </textarea></div>
			<div class="crayon-main" style="">
				<table class="crayon-table">
					<tr class="crayon-row">
				<td class="crayon-nums " data-settings="show">
					<div class="crayon-nums-content" style="font-size: 13px !important; line-height: 18px !important;"><div class="crayon-num" data-line="crayon-64953fd592e5a133533955-1">1</div></div>
				</td>
						<td class="crayon-code"><div class="crayon-pre" style="font-size: 13px !important; line-height: 18px !important; -moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4;"><div class="crayon-line" id="crayon-64953fd592e5a133533955-1"><span class="crayon-h"> </span><span class="crayon-e">ALTER </span><span class="crayon-e">TABLE </span><span class="crayon-e">table_name </span><span class="crayon-e">ENGINE </span><span class="crayon-i">MyISAM</span><span class="crayon-sy">;</span><span class="crayon-h"> </span></div></div></td>
					</tr>
				</table>
			</div>
		</div>

<p> </p>
<h2>Fulltextの設定</h3>
<p></p>

		<div id="crayon-64953fd592e5b154149767" class="crayon-syntax crayon-theme-monokai crayon-font-monaco crayon-os-mac print-yes notranslate" data-settings=" minimize scroll-mouseover wrap" style=" margin-top: 12px; margin-bottom: 12px; font-size: 13px !important; line-height: 18px !important;">
		
			<div class="crayon-toolbar" data-settings=" mouseover overlay hide delay" style="font-size: 13px !important;height: 19.5px !important; line-height: 19.5px !important;"><span class="crayon-title"></span>
			<div class="crayon-tools" style="font-size: 13px !important;height: 19.5px !important; line-height: 19.5px !important;"><div class="crayon-button crayon-nums-button" title="Toggle Line Numbers"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-plain-button" title="Toggle Plain Code"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-wrap-button" title="Toggle Line Wrap"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-expand-button" title="Expand Code"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-copy-button" title="Copy"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-popup-button" title="Open Code In New Window"><div class="crayon-button-icon"></div></div></div></div>
			<div class="crayon-info" style="min-height: 19.5px !important; line-height: 19.5px !important;"></div>
			<div class="crayon-plain-wrap"><textarea  class="crayon-plain print-no" data-settings="dblclick" readonly style="-moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4; font-size: 13px !important; line-height: 18px !important;">
CREATE TABLE table_name (
       id INT UNSIGNED AUTO_INCREMENT NOT NULL PRIMARY KEY,
       title VARCHAR(200),
       body TEXT,
       FULLTEXT (title,body)
  );</textarea></div>
			<div class="crayon-main" style="">
				<table class="crayon-table">
					<tr class="crayon-row">
				<td class="crayon-nums " data-settings="show">
					<div class="crayon-nums-content" style="font-size: 13px !important; line-height: 18px !important;"><div class="crayon-num" data-line="crayon-64953fd592e5b154149767-1">1</div><div class="crayon-num crayon-striped-num" data-line="crayon-64953fd592e5b154149767-2">2</div><div class="crayon-num" data-line="crayon-64953fd592e5b154149767-3">3</div><div class="crayon-num crayon-striped-num" data-line="crayon-64953fd592e5b154149767-4">4</div><div class="crayon-num" data-line="crayon-64953fd592e5b154149767-5">5</div><div class="crayon-num crayon-striped-num" data-line="crayon-64953fd592e5b154149767-6">6</div></div>
				</td>
						<td class="crayon-code"><div class="crayon-pre" style="font-size: 13px !important; line-height: 18px !important; -moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4;"><div class="crayon-line" id="crayon-64953fd592e5b154149767-1"><span class="crayon-e">CREATE </span><span class="crayon-e">TABLE </span><span class="crayon-e">table_name</span><span class="crayon-h"> </span><span class="crayon-sy">(</span></div><div class="crayon-line crayon-striped-line" id="crayon-64953fd592e5b154149767-2"><span class="crayon-h">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; </span><span class="crayon-e">id </span><span class="crayon-t">INT</span><span class="crayon-h"> </span><span class="crayon-t">UNSIGNED</span><span class="crayon-h"> </span><span class="crayon-e">AUTO_INCREMENT </span><span class="crayon-st">NOT</span><span class="crayon-h"> </span><span class="crayon-t">NULL</span><span class="crayon-h"> </span><span class="crayon-e">PRIMARY </span><span class="crayon-i">KEY</span><span class="crayon-sy">,</span></div><div class="crayon-line" id="crayon-64953fd592e5b154149767-3"><span class="crayon-h">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; </span><span class="crayon-e">title </span><span class="crayon-e">VARCHAR</span><span class="crayon-sy">(</span><span class="crayon-cn">200</span><span class="crayon-sy">)</span><span class="crayon-sy">,</span></div><div class="crayon-line crayon-striped-line" id="crayon-64953fd592e5b154149767-4"><span class="crayon-h">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; </span><span class="crayon-e">body </span><span class="crayon-i">TEXT</span><span class="crayon-sy">,</span></div><div class="crayon-line" id="crayon-64953fd592e5b154149767-5"><span class="crayon-h">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; </span><span class="crayon-e">FULLTEXT</span><span class="crayon-h"> </span><span class="crayon-sy">(</span><span class="crayon-i">title</span><span class="crayon-sy">,</span><span class="crayon-i">body</span><span class="crayon-sy">)</span></div><div class="crayon-line crayon-striped-line" id="crayon-64953fd592e5b154149767-6"><span class="crayon-h">&nbsp;&nbsp;</span><span class="crayon-sy">)</span><span class="crayon-sy">;</span></div></div></td>
					</tr>
				</table>
			</div>
		</div>

<p> </p>
<h2>MATCH &#8230;. AGAINST</h3>
<p>⬆に作成したテーブルに対して検索を行う場合は以下のように書きます。</p>

		<div id="crayon-64953fd592e5d956525213" class="crayon-syntax crayon-theme-monokai crayon-font-monaco crayon-os-mac print-yes notranslate" data-settings=" minimize scroll-mouseover wrap" style=" margin-top: 12px; margin-bottom: 12px; font-size: 13px !important; line-height: 18px !important;">
		
			<div class="crayon-toolbar" data-settings=" mouseover overlay hide delay" style="font-size: 13px !important;height: 19.5px !important; line-height: 19.5px !important;"><span class="crayon-title"></span>
			<div class="crayon-tools" style="font-size: 13px !important;height: 19.5px !important; line-height: 19.5px !important;"><div class="crayon-button crayon-nums-button" title="Toggle Line Numbers"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-plain-button" title="Toggle Plain Code"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-wrap-button" title="Toggle Line Wrap"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-expand-button" title="Expand Code"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-copy-button" title="Copy"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-popup-button" title="Open Code In New Window"><div class="crayon-button-icon"></div></div></div></div>
			<div class="crayon-info" style="min-height: 19.5px !important; line-height: 19.5px !important;"></div>
			<div class="crayon-plain-wrap"><textarea  class="crayon-plain print-no" data-settings="dblclick" readonly style="-moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4; font-size: 13px !important; line-height: 18px !important;">
SELECT * FROM table_name WHERE MATCH (title,body) AGAINST ('database mysql');</textarea></div>
			<div class="crayon-main" style="">
				<table class="crayon-table">
					<tr class="crayon-row">
				<td class="crayon-nums " data-settings="show">
					<div class="crayon-nums-content" style="font-size: 13px !important; line-height: 18px !important;"><div class="crayon-num" data-line="crayon-64953fd592e5d956525213-1">1</div></div>
				</td>
						<td class="crayon-code"><div class="crayon-pre" style="font-size: 13px !important; line-height: 18px !important; -moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4;"><div class="crayon-line" id="crayon-64953fd592e5d956525213-1"><span class="crayon-e ">SELECT *</span><span class="crayon-h"> </span><span class="crayon-e">FROM </span><span class="crayon-e">table_name </span><span class="crayon-e">WHERE </span><span class="crayon-e">MATCH</span><span class="crayon-h"> </span><span class="crayon-sy">(</span><span class="crayon-i">title</span><span class="crayon-sy">,</span><span class="crayon-i">body</span><span class="crayon-sy">)</span><span class="crayon-h"> </span><span class="crayon-e">AGAINST</span><span class="crayon-h"> </span><span class="crayon-sy">(</span><span class="crayon-s">'database mysql'</span><span class="crayon-sy">)</span><span class="crayon-sy">;</span></div></div></td>
					</tr>
				</table>
			</div>
		</div>

<p>「title」「body」の中に「database」と「mysql」という文字郡を検索する。<br />
結果として「database」と「mysql」が含まれるレコードが、<br />
順位づけられて返ってきます。</p>

FULLTEXT と MATCH &#8230;.AGAINST

<p>今日はmysqlの予約語について、やさしい話をしましょう。</p>
<h2>「予約語」と「識別子」</h3>
<p>mysqlには、select、from、 insert、into、joinなどの特定語があります。それらを「予約語」といいます。<br />
mysqlのテーブル名やカラム名といった「識別子」には、基本的に「予約語」が使えません※。</p>
<p>※「予約語」を「`」で囲んだら使えますが、<a href="http://ja.wikipedia.org/wiki/%E3%82%AA%E3%83%96%E3%82%B8%E3%82%A7%E3%82%AF%E3%83%88%E9%96%A2%E4%BF%82%E3%83%9E%E3%83%83%E3%83%94%E3%83%B3%E3%82%B0" target="_blank">ORM</a>を用いる各言語のフレームワークが対応していない場合があるため、「予約語」を「識別子」として使うことはお勧めできません。</p>
<p>例えば、注文のテーブルを作ろうとして、テーブル名をorderと命名するとします。</p>
<p></p>

		<div id="crayon-64953fd592c74079833880" class="crayon-syntax crayon-theme-monokai crayon-font-monaco crayon-os-mac print-yes notranslate" data-settings=" minimize scroll-mouseover wrap" style=" margin-top: 12px; margin-bottom: 12px; font-size: 13px !important; line-height: 18px !important;">
		
			<div class="crayon-toolbar" data-settings=" mouseover overlay hide delay" style="font-size: 13px !important;height: 19.5px !important; line-height: 19.5px !important;"><span class="crayon-title"></span>
			<div class="crayon-tools" style="font-size: 13px !important;height: 19.5px !important; line-height: 19.5px !important;"><div class="crayon-button crayon-nums-button" title="Toggle Line Numbers"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-plain-button" title="Toggle Plain Code"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-wrap-button" title="Toggle Line Wrap"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-expand-button" title="Expand Code"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-copy-button" title="Copy"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-popup-button" title="Open Code In New Window"><div class="crayon-button-icon"></div></div></div></div>
			<div class="crayon-info" style="min-height: 19.5px !important; line-height: 19.5px !important;"></div>
			<div class="crayon-plain-wrap"><textarea  class="crayon-plain print-no" data-settings="dblclick" readonly style="-moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4; font-size: 13px !important; line-height: 18px !important;">
create table order (id int, name varchar(255)...);</textarea></div>
			<div class="crayon-main" style="">
				<table class="crayon-table">
					<tr class="crayon-row">
				<td class="crayon-nums " data-settings="show">
					<div class="crayon-nums-content" style="font-size: 13px !important; line-height: 18px !important;"><div class="crayon-num" data-line="crayon-64953fd592c74079833880-1">1</div></div>
				</td>
						<td class="crayon-code"><div class="crayon-pre" style="font-size: 13px !important; line-height: 18px !important; -moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4;"><div class="crayon-line" id="crayon-64953fd592c74079833880-1"><span class="crayon-e">create </span><span class="crayon-e">table </span><span class="crayon-e">order</span><span class="crayon-h"> </span><span class="crayon-sy">(</span><span class="crayon-e">id </span><span class="crayon-t">int</span><span class="crayon-sy">,</span><span class="crayon-h"> </span><span class="crayon-e">name </span><span class="crayon-e">varchar</span><span class="crayon-sy">(</span><span class="crayon-cn">255</span><span class="crayon-sy">)</span><span class="crayon-sy">.</span><span class="crayon-sy">.</span><span class="crayon-sy">.</span><span class="crayon-sy">)</span><span class="crayon-sy">;</span></div></div></td>
					</tr>
				</table>
			</div>
		</div>

<p>ではSQL syntaxエラーが出ますが、</p>
<p></p>

		<div id="crayon-64953fd592c78010795743" class="crayon-syntax crayon-theme-monokai crayon-font-monaco crayon-os-mac print-yes notranslate" data-settings=" minimize scroll-mouseover wrap" style=" margin-top: 12px; margin-bottom: 12px; font-size: 13px !important; line-height: 18px !important;">
		
			<div class="crayon-toolbar" data-settings=" mouseover overlay hide delay" style="font-size: 13px !important;height: 19.5px !important; line-height: 19.5px !important;"><span class="crayon-title"></span>
			<div class="crayon-tools" style="font-size: 13px !important;height: 19.5px !important; line-height: 19.5px !important;"><div class="crayon-button crayon-nums-button" title="Toggle Line Numbers"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-plain-button" title="Toggle Plain Code"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-wrap-button" title="Toggle Line Wrap"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-expand-button" title="Expand Code"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-copy-button" title="Copy"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-popup-button" title="Open Code In New Window"><div class="crayon-button-icon"></div></div></div></div>
			<div class="crayon-info" style="min-height: 19.5px !important; line-height: 19.5px !important;"></div>
			<div class="crayon-plain-wrap"><textarea  class="crayon-plain print-no" data-settings="dblclick" readonly style="-moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4; font-size: 13px !important; line-height: 18px !important;">
create table `order` (id int, name varchar(255)...);</textarea></div>
			<div class="crayon-main" style="">
				<table class="crayon-table">
					<tr class="crayon-row">
				<td class="crayon-nums " data-settings="show">
					<div class="crayon-nums-content" style="font-size: 13px !important; line-height: 18px !important;"><div class="crayon-num" data-line="crayon-64953fd592c78010795743-1">1</div></div>
				</td>
						<td class="crayon-code"><div class="crayon-pre" style="font-size: 13px !important; line-height: 18px !important; -moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4;"><div class="crayon-line" id="crayon-64953fd592c78010795743-1"><span class="crayon-e">create </span><span class="crayon-i">table</span><span class="crayon-h"> </span><span class="crayon-sy">`</span><span class="crayon-i">order</span><span class="crayon-sy">`</span><span class="crayon-h"> </span><span class="crayon-sy">(</span><span class="crayon-e">id </span><span class="crayon-t">int</span><span class="crayon-sy">,</span><span class="crayon-h"> </span><span class="crayon-e">name </span><span class="crayon-e">varchar</span><span class="crayon-sy">(</span><span class="crayon-cn">255</span><span class="crayon-sy">)</span><span class="crayon-sy">.</span><span class="crayon-sy">.</span><span class="crayon-sy">.</span><span class="crayon-sy">)</span><span class="crayon-sy">;</span></div></div></td>
					</tr>
				</table>
			</div>
		</div>

<p>と書けば、syntaxエラーがでません。</p>
<h2>mysqlの内部関数名はどうなる？</h3>
<p>mysqlの内部関数名（例えば、count関数）は、「予約語」ではないので、「識別子」として使えます。<br />
また、mysqlの内部関数を使うときは、その直後に「スペース」の使用は許可されていません。<br />
なぜなら、直後に「スペース」を使うと、それが関数名か、もしくはテーブル名（カラム名）か分からなくなるからのです。</p>
<h2>mysqlの予約語一覧</h3>
<p>下記リンクからご覧いただけます。<br />
<a href="http://dev.mysql.com/doc/refman/5.1/ja/reserved-words.html" target="_blank">http://dev.mysql.com/doc/refman/5.1/ja/reserved-words.html</a></p>

【MySQL】予約語について

<p>インラインSVGはブラウザの制約等により、管理画面などを除いては、なかなか目にする機会が少ないですが、</p>
<p>インラインSVGによるグラフィックとアニメーションを大胆に使ったサイトが面白かったのでご紹介いたします。</p>
<p>&nbsp;</p>
<p>↓サイトはこちらです↓</p>
<p>「<span style="color: #000000; font-family: monospace; font-size: medium; line-height: normal; white-space: pre-wrap;">Fontwalk</span>」<a href="http://www.fontwalk.de/" target="_blank">http://www.fontwalk.de/</a></p>
<p><a href="http://www.fontwalk.de/" target="_blank"><img decoding="async" loading="lazy" title="Fontwalk" alt="Fontwalk" src="/uploads-archive/2013/10/nino_image01.jpg" width="328" height="224" /></a></p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>まずはこちらのシーン</p>
<p><img decoding="async" loading="lazy" alt="シーン１" src="/uploads-archive/2013/10/nino_image02.jpg" width="328" height="224" /></p>
<p>変化する図形や背景の情報などが大きな数字によって表示されていて、印象的です。</p>
<p>真ん中の回転する分度器のようなものはSVGならではという印象です。</p>
<p>&nbsp;</p>
<p><img decoding="async" loading="lazy" alt="シーン2" src="/uploads-archive/2013/10/nino_image03.jpg" width="328" height="224" /></p>
<p>つづいて、車で走っているようなアニメーションです。</p>
<p>画面いっぱいに広がるグラフィックを表示しても軽いのもSVGの魅力ですが、</p>
<p>こちらではその利点が最大限に活かされている印象です。</p>
<p>&nbsp;</p>
<p><img decoding="async" loading="lazy" alt="シーン3" src="/uploads-archive/2013/10/nino_image04.jpg" width="328" height="223" /></p>
<p>筆記体で文字が書かれていくアニメーションです。</p>
<p>WEB上ではFlashを除いてSVGでなければ、このようなアニメーションを表示できないのではないでしょうか。</p>
<p>&nbsp;</p>
<p><img decoding="async" loading="lazy" alt="シーン4" src="/uploads-archive/2013/10/nino_image05.jpg" width="328" height="224" /></p>
<p>フォントが徐々に変化するアニメーションです。</p>
<p>パッと見たときは気づきませんでしたが、</p>
<p>とても凝ったアニメーションです。</p>
<p>&nbsp;</p>
<p>画面いっぱいにアニメーションを表示する場合に、</p>
<p>SVGが大きな力を発揮するということを、</p>
<p>今回改めて感じました。</p>


SVGとスクロールによるアニメーションを使ったインパクトのあるサイト

<p>MTのサイトで複数条件検索を作る必要があり、MTのテーブル構造について調べた。</p>
<p>&nbsp;</p>
<p>今回は例えば金額やエリアなどカスタムフィールドを多様しているため</p>
<p>mt_entryテーブルではなくmt_entry_metaから検索する必要があり、中身を調査した。</p>
<p>以下が簡単な構造</p>
<table>
<tbody>
<tr>
<td>entry_meta_entry_id</td>
<td>エントリーID</td>
</tr>
<tr>
<td>entry_meta_type</td>
<td>指定したテンプレートタグ</td>
</tr>
<tr>
<td>entry_meta_vchar</td>
<td>チェックボックスで設定された値</td>
</tr>
<tr>
<td>entry_meta_vchar_idx</td>
<td>テキストボックスで設定された値</td>
</tr>
<tr>
<td>entry_meta_vdatetime</td>
<td>日付で設定された値</td>
</tr>
<tr>
<td>entry_meta_vdatetime_idx</td>
<td>?</td>
</tr>
<tr>
<td>entry_meta_vinteger</td>
<td>チェックボックスの値?</td>
</tr>
<tr>
<td>entry_meta_vinteger_idx</td>
<td>チェックボックスの値?</td>
</tr>
<tr>
<td>entry_meta_vfloat</td>
<td>?</td>
</tr>
<tr>
<td>entry_meta_vfloat_idx</td>
<td>?</td>
</tr>
<tr>
<td>entry_meta_vblob</td>
<td>?</td>
</tr>
<tr>
<td>entry_meta_vclob</td>
<td>テキストエリアで設定された値</td>
</tr>
</tbody>
</table>
<p>&nbsp;</p>
<p>検索をかけたい項目(値段やエリアなど)に対してentry_meta_typeで絞り込み、</p>
<p>それに対する値をその後の適切なカラムから取得する。</p>
<p>注意点としては同一のエントリーIDで複数レコードあるため、</p>
<p>条件をレコードごとにマッチさせなければいけない。</p>
<p>AND検索であれば4つ条件を出したら4レコードの条件が合致しているかということをプログラムで判断する必要がある。</p>
<p>&nbsp;</p>
<p>あと、検索は上記で問題ないのだが、最も大変だったのが検索したエントリーのパスを取得すること。</p>
<p>パーマリンクの精製方法など色々と調査したが、mt_fileinfoというテーブルを発見。</p>
<p>結局これで行けそうだ。</p>


MTのテーブル構成について

<h2>レスポンシブコーディングの手順</h3>
<p>コーディングする際に焦りがちの私、結局修正が山ほど出てきて、より遅くなる。<br />
「急がば回れ」のどおり、今回は落ち着いて、コーディング作業に入る前に、<br />
以下の手順を心がけて行うようにした。<br />
&nbsp;<br />
&nbsp;<br />
・コーディングに入る前に、PCデザインとスマホデザインを比べてコーディング手順を考える<br />
&nbsp;<br />
・どの部分が共通できて、どこが要素ごと入れ替えないといけないかを決める<br />
&nbsp;<br />
・PCデザインがスマホデザインで共通できる部分があれば、<br />
  どの要素をどのような順番で作れば、スマホの場合うまくいくかを考える。<br />
&nbsp;<br />
・画像スライドする際もスマホ用の画像とpc用の画像の名前を分かるようにルールを決める。<br />
&nbsp;<br />
後、実際にコーディングに入るときには、<br />
・子要素を出来るだけwidthを指定しないでpaddingやmarginで指定する<br />
&nbsp;<br />
&nbsp;<br />
以前はどこの要素でもwidthを指定しがちですが、<br />
必要でないところで指定しているとスマホの場合うまくいかない事がよくありました。</p>


レスポンシブコーディングの手順

【codemirror】twig mode

<p>いよいよ、igoogleの終了が迫ってきましたね。igoogleがスタートして以来、RSSリーダーが発展しようがソーシャルメディアが出てこようが、私のブラウザのホームボタンはいつもigoogleでした。</p>
<p>調べて見ると、2005年に始まったサービスのようです。私も学生時代から使っていたことを記憶していますので、7年以上のお付き合いになるかと思います。</p>
<p>この一覧性による「新聞の一面だけ見ておけ的な」サービスが好きです。</p>
<p>ということで、googleの戦略を考えるとigoogleに留まって欲しくないのは必然だろうなと惜しまれつつも終了が近づいているので、移行先を探しています。</p>
<p>igoogle代替のサービスとして<a href="http://www.symbaloo.com/">Symbaloo</a>、<a href="http://www.ighome.com/">igHome</a>、<a href="http://www.netvibes.com/ja-jp">Netvibes</a>などが名乗りを挙げており、特に<a href="http://www.netvibes.com/ja-jp">Netvibes</a>を押すブログが多いのですが、私はあえてMy　Yahoo!を選択しました。</p>
<h2>My Yahoo!</h3>
<p><a href="/uploads-archive/2013/10/Yahoo__JAPAN-6.jpg"><img decoding="async" loading="lazy" class="alignnone size-medium wp-image-3496" alt="Yahoo__JAPAN-6" src="/uploads-archive/2013/10/Yahoo__JAPAN-6-300x142.jpg" width="300" height="142" srcset="/uploads-archive/2013/10/Yahoo__JAPAN-6-300x142.jpg 300w, /uploads-archive/2013/10/Yahoo__JAPAN-6-228x107.jpg 228w, /uploads-archive/2013/10/Yahoo__JAPAN-6.jpg 959w" sizes="(max-width: 300px) 100vw, 300px" /></a></p>
<p>&nbsp;</p>
<p>まず、My Yahoo!への遷移ですがなんとTOPページの右横にあります。力を入れている証拠でしょうか？</p>
<p><a href="/uploads-archive/2013/10/3b76771c30e7f4a62524fe3cb5dcd512.jpg"><img decoding="async" loading="lazy" class="alignnone size-medium wp-image-3497" alt="My_Yahoo__-_Myページ-6" src="/uploads-archive/2013/10/3b76771c30e7f4a62524fe3cb5dcd512-300x167.jpg" width="300" height="167" srcset="/uploads-archive/2013/10/3b76771c30e7f4a62524fe3cb5dcd512-300x167.jpg 300w, /uploads-archive/2013/10/3b76771c30e7f4a62524fe3cb5dcd512-1024x572.jpg 1024w, /uploads-archive/2013/10/3b76771c30e7f4a62524fe3cb5dcd512-228x127.jpg 228w, /uploads-archive/2013/10/3b76771c30e7f4a62524fe3cb5dcd512.jpg 1355w" sizes="(max-width: 300px) 100vw, 300px" /></a></p>
<p>デフォルトのトップページです。右上の領域は広告が入っています。これは固定で動かすことが出来ません。</p>
<p>&nbsp;</p>
<h3>igoogle設定エクスポート</h4>
<p><a href="/uploads-archive/2013/10/3a53b4077ab6e6901cca74c790fff10f.jpg"><img decoding="async" loading="lazy" alt="iGoogle_の設定" src="/uploads-archive/2013/10/3a53b4077ab6e6901cca74c790fff10f-300x118.jpg" width="300" height="118" /></a></p>
<p>それでは、移行の準備をしましょう！</p>
<p>igoogle&gt;igoogleの設定から最下部でエクスポートができます。</p>
<h3>igoogle移行ツール</h4>
<p>そしてここからが、My Yahoo!の真骨頂です。</p>
<p>なんとigoogleの移行ツールが用意されています。</p>
<p>広告の少し上の帯か以下のURLからアクセスしてください。</p>
<p><a href="http://docs.my.yahoo.co.jp/st/promo/change/" target="_blank">http://docs.my.yahoo.co.jp/st/promo/change/</a></p>
<p><a href="/uploads-archive/2013/10/3573bb63cb2593989d1af3436688de93.jpg"><img decoding="async" loading="lazy" class="alignnone size-medium wp-image-3498" alt="My_Yahoo_へカンタン引っ越ししよう！_-_Yahoo__JAPAN" src="/uploads-archive/2013/10/3573bb63cb2593989d1af3436688de93-300x273.jpg" width="300" height="273" srcset="/uploads-archive/2013/10/3573bb63cb2593989d1af3436688de93-300x273.jpg 300w, /uploads-archive/2013/10/3573bb63cb2593989d1af3436688de93-228x207.jpg 228w, /uploads-archive/2013/10/3573bb63cb2593989d1af3436688de93.jpg 973w" sizes="(max-width: 300px) 100vw, 300px" /></a></p>
<p><span style="font-size: 0.83em;">上記サイトから先ほどエクスポートをしたファイルをアップロードするだけです。</span></p>
<p><a href="/uploads-archive/2013/10/My_Yahoo__-_Home-2.jpg"><img decoding="async" loading="lazy" class="alignnone size-medium wp-image-3500" alt="My_Yahoo__-_Home-2" src="/uploads-archive/2013/10/My_Yahoo__-_Home-2-300x160.jpg" width="300" height="160" srcset="/uploads-archive/2013/10/My_Yahoo__-_Home-2-300x160.jpg 300w, /uploads-archive/2013/10/My_Yahoo__-_Home-2-1024x548.jpg 1024w, /uploads-archive/2013/10/My_Yahoo__-_Home-2-228x122.jpg 228w, /uploads-archive/2013/10/My_Yahoo__-_Home-2.jpg 1343w" sizes="(max-width: 300px) 100vw, 300px" /></a></p>
<p>急上昇ランキングなど、GoogleのサービスでYahoo!で類似のものを持っている場合は、置き換えれるようです。</p>
<p>素敵な機能ですね！</p>
<h2>まとめ</h3>
<ul>
<li>igoogleのバックアップはお早めに！</li>
<li>My Yahoo!最大の利点はigoogle移行ツールが用意されている</li>
<li>Google独自サービスでYahoo!に類似があれば代替してくれる</li>
<li>Yahoo!検索もGoogleと同じアルゴリズムなので、検索結果に差はない</li>
</ul>
<p>ということで、Yahoo!の依存度が高くなりそうな予感をしつつ様子を見てみたいと思います。</p>


igoogleの移行先はMy Yahoo!推し

<p>フラットデザインが流行っているのと共に、</p>
<p>ロングシャドウもじわじわと流行りつつあるようです。（もしかしたらもう流行ってる？？）</p>
<p>&nbsp;</p>
<p>ロングシャドウってなに？？っていう人は、</p>
<p>以下のサイトをご覧ください。</p>
<p>&nbsp;</p>
<p><a href="http://www.webdesignerdepot.com/2013/07/flat-design-casts-a-long-shadow/">Flat design casts a long shadow | Webdesigner Depot</a></p>
<p>&nbsp;</p>
<p>要はやたら長いドロップシャドウみたいな感じですね。</p>
<p>フラットデザインと相まっていい感じですね！！</p>
<p>&nbsp;</p>
<p>そんなドロップシャドウを簡単に作れる無料PSDがあります！</p>
<p>斜め45度限定になりますが、十分でしょう！</p>
<p>&nbsp;</p>
<p>以下からダウンロードして下さい！</p>
<p>&nbsp;</p>
<p><a href="http://graphicburger.com/long-shadow-generator/">Long Shadow Generator | GraphicBurger</a></p>
<p>&nbsp;</p>
<p>実際にPSDを開いてみると、</p>
<p>レイヤーがこんな感じになっているので、</p>
<p><a href="/uploads-archive/2013/10/1b2ed9122fec6408646c5689415e10db.png"><img decoding="async" loading="lazy" class="alignnone size-full wp-image-3491" alt="スクリーンショット 2013-10-28 21.43.04" src="/uploads-archive/2013/10/1b2ed9122fec6408646c5689415e10db.png" width="342" height="327" srcset="/uploads-archive/2013/10/1b2ed9122fec6408646c5689415e10db.png 342w, /uploads-archive/2013/10/1b2ed9122fec6408646c5689415e10db-300x286.png 300w, /uploads-archive/2013/10/1b2ed9122fec6408646c5689415e10db-228x218.png 228w" sizes="(max-width: 342px) 100vw, 342px" /></a></p>
<p>Your design hereに合わせて、右クリックで、</p>
<p>「コンテンツを置き換え」をするとそのコンテンツに合わせてシャドウが生成されます。</p>
<p>テキスト、アイコンなんでもOKっぽいです。</p>
<p>&nbsp;</p>
<p>上のメインビジュアルが実際に作ってみたものになります。</p>
<p>&nbsp;</p>
<p>これはPSDですが、</p>
<p>htmlを生成してくれるサイトもあり、css3を使って表現しているようです。</p>
<p>以下のサイトになります。</p>
<p>&nbsp;</p>
<p><a href="http://sandbox.juan-i.com/longshadows/">Long Shadows Generator &#8211; by Juani</a></p>
<p>&nbsp;</p>
<p>実に簡単にできますね！！</p>
<p>これでロングシャドウは怖くないぞ！！</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>おまけ：</p>
<p>iOS７のカラーコードを一覧にしているサイトがあります。</p>
<p>カラーの参考にぜひどうぞ！</p>
<p>&nbsp;</p>
<p><a href="http://ios7colors.com/">iOS 7 colors</a></p>
<p>&nbsp;</p>


流行りつつあるロングシャドウを作れる無料PSD

<p>9月27日に経済産業省がEC市場調査結果を発表したのでまとめ。</p>
<p>2012年EC市場規模<br />
<a href="http://www.meti.go.jp/press/2013/09/20130927007/20130927007.html" target="_blank">http://www.meti.go.jp/press/2013/09/20130927007/20130927007.html</a></p>
<h2>国内EC</h3>
<p>・2012年のBtoC市場規模は9.5兆円(前年比 112.5%)<br />
・EC化率は3.1%(前年比 +0.35)<br />
・物販では「1位：総合小売業1兆8910億円」(前年比 106.1%)「2位：自動車・パーツ、家具・家庭用品・電気製品小売業の1兆4260億円」(前年比 114.4%)「3位：食品小売業」の6050億円(前年比 113.7%)</p>
<h2>越境EC</h3>
<p>・日本人が米国及び中国からECで購入した額は155億円(前年比 106.9%)<br />
・米国人が日本及び中国からECで購入した額は757億円(前年比 70.4%)<br />
・中国人が日本及び米国からECで購入した額は2,868億円(前年比 123%)</p>
<p>・2020年は、日本人が米国及び中国からECで購入した額は427億円<br />
・2020年は、米国人が日本及び中国からECで購入した額は1,732億円<br />
・2020年は、中国人が日本及び米国からECで購入した額は21,022億円</p>
<p>・日本の越境EC利用率は17.6%<br />
・中国の越境EC利用率は57.3%<br />
・米国の越境EC利用率は44.7%</p>
<p>・米国が日本から越境ECで購入しているものは<br />
「書籍、雑誌(電 子書籍のダウンロードは含まない)(29.7%)」「衣類、アクセサリー(23.6%)」「音楽、 映像のソフト(CD、DVD など)(コンテンツのダウンロードは含まない) (21.4%)<br />
・中国が日本から越境ECで購入しているものは<br />
「衣類、アクセサリー(29.6%)」「書籍、雑誌(電子書籍のダウンロードは含まない)(29.4%)」「医薬、化粧品(24.9%)」</p>
<p>また、矢野経済研究所から2013年のスマホECの市場規模予想が10月22日発表された。<br />
<a href="http://www.yano.co.jp/press/press.php/001167" target="_blank">http://www.yano.co.jp/press/press.php/001167</a></p>
<p>2012年に8,450億円だった市場規模が、2013年には159.4%の1兆3,469億円になると予想されている。<br />
スマホEC利用者比率が最も高いのは<br />
「1位：女性20代」(74.0%)「2位：女性10代」(55.0％)「男性30代」「女性30代」(50.0％)<br />
とのこと。</p>


EC市場規模

<p><a href="/officer/ios%E3%81%AE%E3%81%8A%E6%8E%83%E9%99%A4%E3%82%BD%E3%83%95%E3%83%88%E3%80%8Cphoneclean%E3%80%8D.html">iOSのお掃除ソフト「PhoneClean」</a>という記事を書いていたところ、お問い合わせフォームから「PhoneClean」の開発会社の中の方からバージョンアップのご連絡を頂きました。 さらに、PRO版（有償版）のコードをくれるということでした。ブログを書いていて、このような接点があるというのは、とても嬉しいですね。早速、簡単ですが、PRO版の機能も含めてバージョンアップした「PhoneClean」をご紹介したいと思います。 無料版とPRO版の機能比較は以下をご覧下さい。 <a href="http://www.imobie.jp/phoneclean/upgrade-mac.htm" target="_blank">http://www.imobie.jp/phoneclean/upgrade-mac.htm</a></p>
<h2>Phone Clean</h3>
<p><img decoding="async" loading="lazy" class="alignnone size-medium wp-image-3463" alt="PhoneClean_Pro 8" src="/uploads-archive/2013/10/PhoneClean_Pro-8-300x186.jpg" width="300" height="186" srcset="/uploads-archive/2013/10/PhoneClean_Pro-8-300x186.jpg 300w, /uploads-archive/2013/10/PhoneClean_Pro-8-228x141.jpg 228w, /uploads-archive/2013/10/PhoneClean_Pro-8.jpg 1000w" sizes="(max-width: 300px) 100vw, 300px" /></p>
<p>まず、ご覧いただくと分かるように、Ver3から日本語に対応しています。まだ、機械翻訳といった形ですが、意味は捉えられるレベルなので使用には問題ないと思います。   iphoneを接続するとメニューが表示されます。 クイッククリーンとディープクリーンがあり、このディープクリーンはPRO版のみの機能となっております。</p>
<h3>クイッククリーン</h4>
<p><img decoding="async" loading="lazy" class="alignnone size-medium wp-image-3411" alt="PhoneClean_Pro 2" src="/uploads-archive/2013/10/PhoneClean_Pro-2-300x186.jpg" width="300" height="186" srcset="/uploads-archive/2013/10/PhoneClean_Pro-2-300x186.jpg 300w, /uploads-archive/2013/10/PhoneClean_Pro-2-228x141.jpg 228w, /uploads-archive/2013/10/PhoneClean_Pro-2.jpg 1000w" sizes="(max-width: 300px) 100vw, 300px" /></p>
<p>クイッククリーンは前バージョンから存在した機能ですね。 選択してスキャン開始でツーステップです。</p>
<p><a href="/uploads-archive/2013/10/PhoneClean_Pro-5.jpg"><img decoding="async" loading="lazy" class="alignnone size-medium wp-image-3417" alt="PhoneClean_Pro 5" src="/uploads-archive/2013/10/PhoneClean_Pro-5-300x186.jpg" width="300" height="186" srcset="/uploads-archive/2013/10/PhoneClean_Pro-5-300x186.jpg 300w, /uploads-archive/2013/10/PhoneClean_Pro-5-228x141.jpg 228w, /uploads-archive/2013/10/PhoneClean_Pro-5.jpg 1000w" sizes="(max-width: 300px) 100vw, 300px" /></a></p>
<p>この記事を書く数日前にクリーンアップしたばかりですので、400MB程度でした。 むしろ、数日で400MBのファイルが溜まってしまうと考えたほうがよいかもしれません。</p>
<p><img decoding="async" loading="lazy" class="alignnone size-medium wp-image-3418" alt="PhoneClean_Pro 6" src="/uploads-archive/2013/10/PhoneClean_Pro-6-300x186.jpg" width="300" height="186" srcset="/uploads-archive/2013/10/PhoneClean_Pro-6-300x186.jpg 300w, /uploads-archive/2013/10/PhoneClean_Pro-6-228x141.jpg 228w, /uploads-archive/2013/10/PhoneClean_Pro-6.jpg 1000w" sizes="(max-width: 300px) 100vw, 300px" /></p>
<h3>ディープクリーン</h4>
<p><img decoding="async" loading="lazy" class="alignnone size-medium wp-image-3410" alt="PhoneClean_Pro 3" src="/uploads-archive/2013/10/PhoneClean_Pro-3-300x186.jpg" width="300" height="186" srcset="/uploads-archive/2013/10/PhoneClean_Pro-3-300x186.jpg 300w, /uploads-archive/2013/10/PhoneClean_Pro-3-228x141.jpg 228w, /uploads-archive/2013/10/PhoneClean_Pro-3.jpg 1000w" sizes="(max-width: 300px) 100vw, 300px" /></p>
<p>次に、ディープクリーンをご紹介します。 より、細かいファイルをクリーンアップすることが項目から分かります。 ここでも全選択でスキャン開始です。</p>
<p><img decoding="async" loading="lazy" class="alignnone size-medium wp-image-3419" alt="PhoneClean_Pro 7" src="/uploads-archive/2013/10/PhoneClean_Pro-7-300x195.jpg" width="300" height="195" srcset="/uploads-archive/2013/10/PhoneClean_Pro-7-300x195.jpg 300w, /uploads-archive/2013/10/PhoneClean_Pro-7-228x148.jpg 228w, /uploads-archive/2013/10/PhoneClean_Pro-7.jpg 594w" sizes="(max-width: 300px) 100vw, 300px" /></p>
<p>すると、ディープクリーンは必ず、バックアップが走ります。 よほど、デリケートな部分を触るということの表れなのかもしれません・・・・。 バックアップは12GB前後の容量で5分程度でした。</p>
<p><a href="/uploads-archive/2013/10/PhoneClean_Pro-9.jpg"><img decoding="async" loading="lazy" class="alignnone size-medium wp-image-3462" alt="PhoneClean_Pro 9" src="/uploads-archive/2013/10/PhoneClean_Pro-9-300x186.jpg" width="300" height="186" srcset="/uploads-archive/2013/10/PhoneClean_Pro-9-300x186.jpg 300w, /uploads-archive/2013/10/PhoneClean_Pro-9-228x141.jpg 228w, /uploads-archive/2013/10/PhoneClean_Pro-9.jpg 1000w" sizes="(max-width: 300px) 100vw, 300px" /></a></p>
<p>アプリをたくさん入れるとごちゃごちゃになる通知もクリーンにしてくれるんですね。</p>
<p>容量よりも精神衛生的に良さそう。</p>
<p><a href="/uploads-archive/2013/10/PhoneClean_Pro-10.jpg"><img decoding="async" loading="lazy" class="alignnone size-medium wp-image-3466" alt="PhoneClean_Pro 10" src="/uploads-archive/2013/10/PhoneClean_Pro-10-300x201.jpg" width="300" height="201" srcset="/uploads-archive/2013/10/PhoneClean_Pro-10-300x201.jpg 300w, /uploads-archive/2013/10/PhoneClean_Pro-10-228x152.jpg 228w, /uploads-archive/2013/10/PhoneClean_Pro-10.jpg 594w" sizes="(max-width: 300px) 100vw, 300px" /></a></p>
<p>クリーンアップを選択すると、またポップアップで進行しました。</p>
<p><a href="/uploads-archive/2013/10/PhoneClean_Pro-11.jpg"><img decoding="async" loading="lazy" class="alignnone size-medium wp-image-3467" alt="PhoneClean_Pro 11" src="/uploads-archive/2013/10/PhoneClean_Pro-11-300x201.jpg" width="300" height="201" srcset="/uploads-archive/2013/10/PhoneClean_Pro-11-300x201.jpg 300w, /uploads-archive/2013/10/PhoneClean_Pro-11-228x152.jpg 228w, /uploads-archive/2013/10/PhoneClean_Pro-11.jpg 594w" sizes="(max-width: 300px) 100vw, 300px" /></a></p>
<p>さらにiphone自体に再起動が掛かりました。ディープクリーンは再起動が伴う処理を行っているんですね。</p>
<p><a href="/uploads-archive/2013/10/PhoneClean_Pro-12.jpg"><img decoding="async" loading="lazy" class="alignnone size-medium wp-image-3468" alt="PhoneClean_Pro 12" src="/uploads-archive/2013/10/PhoneClean_Pro-12-300x186.jpg" width="300" height="186" srcset="/uploads-archive/2013/10/PhoneClean_Pro-12-300x186.jpg 300w, /uploads-archive/2013/10/PhoneClean_Pro-12-228x141.jpg 228w, /uploads-archive/2013/10/PhoneClean_Pro-12.jpg 1000w" sizes="(max-width: 300px) 100vw, 300px" /></a></p>
<p>&nbsp;</p>
<p>クリーンアップが完了しました。</p>
<p>端末のほうを見てみると確かに、通知が綺麗さっぱり消えていました。う〜ん清々しい。</p>
<p><img decoding="async" loading="lazy" class="alignnone size-medium wp-image-3409" alt="PhoneClean_Pro 4" src="/uploads-archive/2013/10/PhoneClean_Pro-4-300x186.jpg" width="300" height="186" srcset="/uploads-archive/2013/10/PhoneClean_Pro-4-300x186.jpg 300w, /uploads-archive/2013/10/PhoneClean_Pro-4-228x141.jpg 228w, /uploads-archive/2013/10/PhoneClean_Pro-4.jpg 1000w" sizes="(max-width: 300px) 100vw, 300px" /></p>
<p>他にもツールボックスではいろいろなことが個別で出来ます。</p>


Company

Our Solutions

Support

News

Blog

Blogブログ

カテゴリーから探す

年別から見る

記事一覧

2013/11/13

2013/11/13

2013/11/13

2013/11/13

2013/11/12

2013/11/12

2013/11/07

2013/11/07

2013/11/06

2013/11/06

2013/10/31

2013/10/31

2013/10/30

2013/10/29

2013/10/29

2013/10/29

2013/10/23

2013/10/23