<p>中国ではECサイトなど会員登録をする際、メールアドレスではなくSMS(電話番号)を使うということを聞き、日本のサービスでそのようなことができるのかを調べてみた。</p>
<p>&nbsp;</p>
<h2>7サービス比較</h2>
<table>
<tbody>
<tr>
<td></td>
<td>初期費用</td>
<td>月額</td>
<td>送信料</td>
<td>受信料</td>
<td>API</td>
</tr>
<tr>
<td>AOS SMS</td>
<td>0</td>
<td>0</td>
<td>15円</td>
<td>15円</td>
<td>◯</td>
</tr>
<tr>
<td>TWILIO</td>
<td>0</td>
<td>0</td>
<td>1.5〜9.6円</td>
<td>1円</td>
<td>◎</td>
</tr>
<tr>
<td>Media SMS</td>
<td>0</td>
<td>0</td>
<td>〜15円</td>
<td>&#8211;</td>
<td>◯</td>
</tr>
<tr>
<td>空電プッシュ</td>
<td>&#8211;</td>
<td>&#8211;</td>
<td>&#8211;</td>
<td>&#8211;</td>
<td>◯</td>
</tr>
<tr>
<td>EXLINK-SMS</td>
<td>&#8211;</td>
<td>&#8211;</td>
<td>&#8211;</td>
<td>&#8211;</td>
<td>◯</td>
</tr>
<tr>
<td>EZ sms</td>
<td>0</td>
<td>0</td>
<td>10〜50円</td>
<td>&#8211;</td>
<td>◯</td>
</tr>
<tr>
<td>SMS DIRECT</td>
<td>&#8211;</td>
<td>&#8211;</td>
<td>&#8211;</td>
<td>&#8211;</td>
<td>◯</td>
</tr>
</tbody>
</table>
<p>&nbsp;</p>
<p>提供している会社が意外と多いことに少し驚いた。</p>
<p>上記7社はネット上の口コミや内容から筆者が個人的な判断で選んだもの。</p>
<p>以下はそれぞれの特徴と個人的な感想</p>
<p>&nbsp;</p>
<h3>AOS SMS</h3>
<p>日本国内の会社なので安心感がある。</p>
<p>実績も多く価格も明瞭。</p>
<p>難点としてはAPIの情報が少なく、ライブラリなどの提供があるのかが心配になる</p>
<p>&nbsp;</p>
<h3>TWILIO</h3>
<p>アメリカに本社があり日本はKDDIが代理店</p>
<p>価格も安くAPIも充実。</p>
<p>プログラマーであればおそらくこれ以外の選択肢は無い</p>
<p>&nbsp;</p>
<h3>Media SMS</h3>
<p>SMSに特化した会社のようで、SMSに対する愛を強く感じる</p>
<p>管理画面が充実している印象</p>
<p>APIはあるが、システムとの連携は強くはなさそう</p>
<p>&nbsp;</p>
<h3>空電プッシュ</h3>
<p>NTTグループ</p>
<p>その時点で少し高いが抜群の安定感であることが予想できる</p>
<p>開示情報としては少ないので判断できないが、APIなどもしっかりしてそう</p>
<p>&nbsp;</p>
<h3>EXLINK-SMS</h3>
<p>音声や動画といった分野に特化したシステム会社</p>
<p>個人的な見解だが、SMS込みでシステム開発をまるっと依頼する場合は最もよさそう</p>
<p>&nbsp;</p>
<h3>EZ sms</h3>
<p>日本の会社ながら海外のサービスを思わせるサイト</p>
<p>代表のお名前から中東の方の模様</p>
<p>前払ポイント制で個人事業主に対応している</p>
<p>&nbsp;</p>
<h3>SMS DIRECT</h3>
<p>PR会社のガイアコミュニケーションズの提供</p>
<p>マーケティング有りきでの導入はこちらがよいかもしれない</p>
<p>&nbsp;</p>
<p>結論としては、「会員登録」という意味では</p>
<ul>
<li>APIが充実していること</li>
<li>プログラマーに優しいこと</li>
<li>トランザクション費が安いこと</li>
</ul>
<p>が条件として重要になるが、そうなってくるとTWILIOが最良と個人的には思った。</p>
<p>ただ、プログラマーの有無など置かれている環境にもよるのと、使い方によって大きく変わるので詳細は問い合わせてみることをおすすめする</p>


SMS送信サービス7社

<p><img decoding="async" src="/uploads-archive/2015/11/symfony2-300x103.png" alt="symfony2" width="80%"/></p>
<p>MySQLにはテーブルにデータを挿入した順番に値を付けてくれるauto_incrementという機能（PostgreSQLではserial、SQLServerではidentityと呼ばれる）があるのですが、<br />
Symfony2を使用している上でその値を取得する方法を記載します。</p>
<p>&nbsp;</p>
<h2>Symfony2を利用していない場合</h2>
<p>mysql_query();によるMySQLへのデータ登録後、下記のPHPあるいはMySQLの関数を利用する。</p>
<h3>PHPの関数</h3>
<p></p>

		<div id="crayon-649540158d73f432719506" 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">PHP</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;">
$auto_increment_id = mysql_insert_id();</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-649540158d73f432719506-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-649540158d73f432719506-1"><span class="crayon-v">$auto_increment_id</span><span class="crayon-h"> </span>=<span class="crayon-h"> </span><span class="crayon-e">mysql_insert_id</span><span class="crayon-sy">(</span><span class="crayon-sy">)</span><span class="crayon-sy">;</span></div></div></td>
					</tr>
				</table>
			</div>
		</div>

<p></p>
<h3>MySQLの関数</h3>
<p></p>

		<div id="crayon-649540158d743961777036" 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">PHP</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;">
$auto_increment_id = last_insert_id();</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-649540158d743961777036-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-649540158d743961777036-1"><span class="crayon-v">$auto_increment_id</span><span class="crayon-h"> </span>=<span class="crayon-h"> </span><span class="crayon-e">last_insert_id</span><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>
<h2>Symfony2を利用している場合</h2>
<p>実は、何もしなくてもSymfonyが勝手にやってくれています。<br />
Symfony2ではデータをテーブルに登録後（Symfony2の場合、flush();という関数を発行することで、自動的にクエリを送信してくれますが）、auto_incrementの値を自動的に取得し、Entityに持たせてくれています。<br />
なのでDB登録後、getId();等のアクセッサーを利用することで取得できます。<br />
とても分かりやすく、親切ですね。</p>
<p>しかし、最近Symfony2を使用し始めたこともあり、上記のことを知らず、auto_incrementの取得に若干苦労しました…。<br />
今後、精進致します。</p>

Symfony2で新規挿入されたデータのauto_incrementの値を取得する

<p>「TTS」って聞いた事があるような無いような感じですが、「Text To Speech」の略でテキストを音声にして読み上げてくれるシステムを指します。他には「合成音声」と言ったり、スピーチシンセサイザーなんて呼ぶ場合もあるようです。</p>
<p>おそらくTTSで検索すると為替に関する用語にもあるらしく、そちらが多く表示されるので「Text To Speech」で検索した方がいいかもしれません。</p>
<p>TTSについては数年前くらいから、youtubeでナレーションとして使用されたり、地上波でもバラエティ番組のナレーションに使われたりしています。最近はよく利用されているので珍しくもなくなりましたが、海外向けの動画を制作する場合にナレーションって英語で入れたら親切だなと思いちょっと調べてみました。</p>
<p>TTSは特殊なソフトウェアが必要そうなイメージですが、実はgoogle翻訳を利用すると簡単にできます。</p>
<p><a class="demo" href="http://translate.google.com/translate_tts?tl=ja&amp;q=%E3%82%B9%E3%82%BF%E3%83%BC%E3%83%95%E3%82%A3%E3%83%BC%E3%83%AB%E3%83%89">demo</a></p>
<p><a class="demo" href="http://translate.google.com/translate_tts?tl=en&amp;q=sterfield">demo</a></p>
<p>上のdemoから開けるページで右クリックをすればMP3の音声ファイルとして保存する事ができます。</p>
<p>「<strong>http://translate.google.com/translate_tts?tl=ja&amp;q=</strong>」こちらがそのURLになりますが、最後=の後に、しゃべらせたい言葉を入力すればＯＫです。滑らかなTTSが多くなってくると、逆にこのぎこちなさが良く感じてきたりもします。</p>
<p>ちなみ「<strong>tl=ja</strong>」の部分を<strong>「tl=en」</strong>に変えてあげれば英語に変更できます。</p>
<p><a href="http://soundoftext.com/"><img decoding="async" loading="lazy" class="alignnone size-full wp-image-8507" src="/uploads-archive/2015/11/1.jpg" alt="1" width="640" height="341" srcset="/uploads-archive/2015/11/1.jpg 640w, /uploads-archive/2015/11/1-300x160.jpg 300w, /uploads-archive/2015/11/1-228x121.jpg 228w" sizes="(max-width: 640px) 100vw, 640px" /></a></p>
<p><a href="http://soundoftext.com/">http://soundoftext.com/</a></p>
<p>こちらのサイトはgoogle翻訳を使ったTTSを使いやすくしてくれています。若干日本語入力にバグがあるかもしれませんが。</p>
<p>&nbsp;</p>
<h2>テレ東のバレエティ番組のナレーションで使われているアレ</h2>
<p><a href="http://www.oddcast.com/home/demos/tts/tts_example.php"><img decoding="async" loading="lazy" class="alignnone size-full wp-image-8509" src="/uploads-archive/2015/11/2.jpg" alt="2" width="528" height="564" srcset="/uploads-archive/2015/11/2.jpg 528w, /uploads-archive/2015/11/2-281x300.jpg 281w, /uploads-archive/2015/11/2-228x244.jpg 228w" sizes="(max-width: 528px) 100vw, 528px" /></a></p>
<p>こちらはTexr-to-Speechのデモ画面です。LanguageをJapaneseにして、VoiceをShouに、Effectはnoneのままでテキストを入力してみてください。</p>
<p>バラエティ番組のナレーションをして使用されているTTSの声でしゃべらせる事ができます。知っている方は「あっ、聞いた事がある」と思うはずです。</p>
<p>このデモ画面にあるリンク先では、写真などから２Ｄまたは3Dのキャラクターを作り、しゃべらせるというサービスを提供しているようです。</p>
<p><a href="/uploads-archive/2015/11/3.jpg"><img decoding="async" loading="lazy" class="alignnone size-full wp-image-8510" src="/uploads-archive/2015/11/3.jpg" alt="3" width="640" height="657" srcset="/uploads-archive/2015/11/3.jpg 640w, /uploads-archive/2015/11/3-292x300.jpg 292w, /uploads-archive/2015/11/3-228x234.jpg 228w" sizes="(max-width: 640px) 100vw, 640px" /></a></p>
<p><a href="http://www.sitepal.com/">http://www.sitepal.com/</a></p>
<h2>最新のTTSは感情も表現できる</h2>
<p>メガネメーカーのイメージが強いHOYAですが、意外にもグループ会社の中にはTTSのサービスを提供している会社があります、その名もHOYAサービス株式会社。こちらで提供しているのが<strong><a href="http://voicetext.jp/">VOICE TEXT</a></strong>というサービスです。</p>
<p>どうやら先ほど上で紹介したバラエティ番組のナレーションについてもHOYAサービスで開発されたようです。気になる方はこちらに詳しく書いてあります。<a href="http://voicetext.jp/show/">http://voicetext.jp/show/</a></p>
<p>VOICE TEXTのでもページを見てみると、話し方にかなり自然で聞き取りやすい印象を受けます。</p>
<p>さらに新しい取り組みとして公開されていたのは、なんと感情を表現できるというものです。</p>
<p><a href="http://voicetext.jp/voicetextlab/"><img decoding="async" loading="lazy" class="alignnone size-full wp-image-8511" src="/uploads-archive/2015/11/4.jpg" alt="4" width="640" height="472" srcset="/uploads-archive/2015/11/4.jpg 640w, /uploads-archive/2015/11/4-300x221.jpg 300w, /uploads-archive/2015/11/4-228x168.jpg 228w" sizes="(max-width: 640px) 100vw, 640px" /></a></p>
<p>まだ試作段階のようですが、デモページで実際に試してみると、確かに感情が伝わってきます。今後、開発がさらに進めば、本当の人間が話しているのか、TTSなのかわからなくなるかもしれません。</p>
<p>知り合いのナレーターさんとTTSについて話した事が以前ありましたが、かなり戦々恐々としていました。その方は独特の声をお持ちなのですが、一度声をサンプリングしてしまえば、自分がいなくてもナレーションができてしまうと言っていました。そうなると、有名なナレーターが声を一般に売るという時代が来るかもしれません。</p>
<p>ちょっと話が飛躍してしまいましたが、今後期待の持てる分野です。</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>


意外と知らないTTSの世界

<p>facebookのいいねボタンをサイトに設置することはもうお決まりのようなパターンになっております。</p>
<p>お決まりのソースを手元に用意してありますが、たまにちゃんとfacebookdeveloperからコードを取得してくることがあります。</p>
<p>そこで、最新のコードをゲットして使用したら、<br />
お客さんに「いいねボタンを押したら変な風になる」を言われました。</p>
<p>今までは押すと、数字が触れてキャンセルできるよう✕マークが表示される感じでしたが、<br />
最新のものは、押すと、shareボタンみたいに、ボックスが表示されコメントを記入することが出来るようになっています。<br />
(URLがよろしくない場合や設定されてない場合、一度「確認」という表示に代わり、確認を押すと「いいね」か「キャンセル」を選択するようになってます)</p>
<p>そして、大きく変わったのは取得するコードが一択になったところです。<br />
下の画像を見ると、今までiframeとかなんやら選択出来たんですが、それがありません。</p>
<p><img decoding="async" loading="lazy" class="alignnone  wp-image-8461" src="/uploads-archive/2015/11/22ad233a73b61d62a6d557939a55f65d.png" alt="スクリーンショット 2015-11-17 14.29.38" width="626" height="464" /></p>
<p>facebookはどんどん仕様が新しくなっていきますね！</p>
<h2>バージョンの注意</h2>
<p>今までのいいねボタンですと、そのうち使えなくなってしまうので注意が必要です！</p>
<p>facebookのバージョン管理のルールでは、<br />
バージョンが次のバージョンが出てから2年後に期限が切れてしまうようです。</p>
<blockquote><p>2014年4月30日にAPIバージョン2.0がリリースされ、2014年5月30日にAPIバージョン2.1がリリースされる場合、v2.1のリリースから2年後の2016年5月30日にv2.0の期限が切れます。</p></blockquote>
<p>詳しくは下記URLで。<br />
<a href="https://developers.facebook.com/docs/apps/versions?locale=ja_JP" target="_blank">Facebook Platform Versioning &#8211; App Development</a></p>
<p><img decoding="async" loading="lazy" class="alignnone  wp-image-8463" src="/uploads-archive/2015/11/0957865e9e0ce58822f517120483a768.png" alt="スクリーンショット 2015-11-17 14.38.50" width="633" height="231" /></p>
<p>やっかいなことにバージョンは勝手に判断してもらえるものではなく、指定していないとダメらしく、<br />
バージョン指定がないと、ver1と判断されてしまいます(たぶん。。。)</p>
<p>なのでまだ今のままのいいねボタンがいいという人は、取り急ぎバージョン指定をすることをお薦めします！！</p>
<p>弊社サイトで仕様していたコードを以下に貼ります。<br />
hrefのところはwordpressのタグのままなので任意のものに変更してください。</p>
<p>以前の場合、</p>

		<div id="crayon-649540158d554162522802" 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;iframe src="http://www.facebook.com/plugins/like.php?href=&lt;?php the_permalink(); ?&gt;&amp;amp;layout=button_count&amp;amp;show_faces=false&amp;amp;action=like&amp;amp;colorscheme=light&amp;amp;height=21&amp;amp;width=90" scrolling="no" frameborder="0" style="border:none; overflow:hidden; height:21px; width:105px;" allowtransparency="true"&gt;&lt;/iframe&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-649540158d554162522802-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-649540158d554162522802-1"><span class="crayon-r ">&lt;iframe </span><span class="crayon-e ">src</span>=<span class="crayon-s ">"http://www.facebook.com/plugins/like.php?href=<span class="crayon-ta">&lt;?php</span><span class="crayon-h"> </span><span class="crayon-e">the_permalink</span><span class="crayon-sy">(</span><span class="crayon-sy">)</span><span class="crayon-sy">;</span><span class="crayon-h"> </span><span class="crayon-ta">?&gt;</span>&amp;amp;layout=button_count&amp;amp;show_faces=false&amp;amp;action=like&amp;amp;colorscheme=light&amp;amp;height=21&amp;amp;width=90"</span><span class="crayon-h"> </span><span class="crayon-e ">scrolling</span>=<span class="crayon-s ">"no"</span><span class="crayon-h"> </span><span class="crayon-e ">frameborder</span>=<span class="crayon-s ">"0"</span><span class="crayon-h"> </span><span class="crayon-e ">style</span>=<span class="crayon-s ">"border:none; overflow:hidden; height:21px; width:105px;"</span><span class="crayon-h"> </span><span class="crayon-e ">allowtransparency</span>=<span class="crayon-s ">"true"</span><span class="crayon-r ">&gt;</span><span class="crayon-r ">&lt;/iframe&gt;</span></div></div></td>
					</tr>
				</table>
			</div>
		</div>

<p>バージョンを記入した場合、</p>

		<div id="crayon-649540158d559904714560" 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;iframe src="http://www.facebook.com/v2.0/plugins/like.php?href=&lt;?php the_permalink(); ?&gt;&amp;amp;layout=button_count&amp;amp;show_faces=false&amp;amp;action=like&amp;amp;colorscheme=light&amp;amp;height=21&amp;amp;width=90" scrolling="no" frameborder="0" style="border:none; overflow:hidden; height:21px; width:105px;" allowtransparency="true"&gt;&lt;/iframe&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-649540158d559904714560-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-649540158d559904714560-1"><span class="crayon-r ">&lt;iframe </span><span class="crayon-e ">src</span>=<span class="crayon-s ">"http://www.facebook.com/v2.0/plugins/like.php?href=<span class="crayon-ta">&lt;?php</span><span class="crayon-h"> </span><span class="crayon-e">the_permalink</span><span class="crayon-sy">(</span><span class="crayon-sy">)</span><span class="crayon-sy">;</span><span class="crayon-h"> </span><span class="crayon-ta">?&gt;</span>&amp;amp;layout=button_count&amp;amp;show_faces=false&amp;amp;action=like&amp;amp;colorscheme=light&amp;amp;height=21&amp;amp;width=90"</span><span class="crayon-h"> </span><span class="crayon-e ">scrolling</span>=<span class="crayon-s ">"no"</span><span class="crayon-h"> </span><span class="crayon-e ">frameborder</span>=<span class="crayon-s ">"0"</span><span class="crayon-h"> </span><span class="crayon-e ">style</span>=<span class="crayon-s ">"border:none; overflow:hidden; height:21px; width:105px;"</span><span class="crayon-h"> </span><span class="crayon-e ">allowtransparency</span>=<span class="crayon-s ">"true"</span><span class="crayon-r ">&gt;</span><span class="crayon-r ">&lt;/iframe&gt;</span></div></div></td>
					</tr>
				</table>
			</div>
		</div>

<p>ちなみに、弊社のサイトでは最新のコードを貼り付けているので、ぜひ押してみてください！<br />
(とはいえ、「確認」という表示に変わるかと思いますが・・・)</p>

facebookのいいねボタンの挙動が変わった(version2.5)

<p>ツイッターで企業アカウントがフォロワーを増やすときに注意すべき点をまとめました。</p>
<h2>【王道】フォロワーを増やす方法</h2>
<p>フォロワーを増やす方法について、ジャーナリストの津田大介氏は著書の中で以下のように述べています。</p>
<blockquote>
<p>       １ 自分自身がツイッターでフォローを増やす<br />
       ２ 有用な情報を発信することによってフォロワーに貢献する<br />
       ３ 自分の日常の様子やアイデアを書いて自身についても興味を持ってもらう<br />
       ４ それをくり返す</p>
<p>    （津田大介著『<a href="http://www.amazon.co.jp/%E3%82%B4%E3%83%9F%E6%83%85%E5%A0%B1%E3%81%AE%E6%B5%B7%E3%81%8B%E3%82%89%E5%AE%9D%E7%9F%B3%E3%82%92%E8%A6%8B%E3%81%A4%E3%81%91%E5%87%BA%E3%81%99-%E3%81%93%E3%82%8C%E3%81%8B%E3%82%89%E3%81%AE%E3%82%BD%E3%83%BC%E3%82%B7%E3%83%A3%E3%83%AB%E3%83%A1%E3%83%87%E3%82%A3%E3%82%A2%E8%88%AA%E6%B5%B7%E8%A1%93-PHP%E3%83%93%E3%82%B8%E3%83%8D%E3%82%B9%E6%96%B0%E6%9B%B8-%E6%B4%A5%E7%94%B0-%E5%A4%A7%E4%BB%8B/dp/4569816738">ゴミ情報の海から宝石を見つけ出す これからのソーシャルメディア航海術</a>』）
</p></blockquote>
<p>正論です。<br />
ですが、実際それがすんなりできたら苦労はないわけです。</p>
<p>とくに、企業アカウントの場合は個人が趣味として楽しく運営するのとは違いますから、ある程度短期間で最大限の効果を発揮することが求められ、焦った担当者は安易にフォロワーを増やす愚策に走りがちです。</p>
<h2>【邪道】フォロワーを増やす方法</h2>
<p>有用な投稿をしてアカウントをじっくり育てる…という正当な過程をショートカットしようとする人はだいたいフォロー返しを期待して、自分のアカウントに興味がありそうな人をたくさんフォローしていきます。</p>
<p>もちろん、これ自体は違法なことではないですし、邪道というのは言い過ぎかもしれません。むしろツイッターを開始した初期に行う方法としてはおかしいものではありません。</p>
<p>しかし、フォロワー数に比べてあまりにフォロー数が多い場合、ツイッター社のからストップがかけられることになります。</p>
<h2>過剰フォローに対するルール</h2>
<p>ツイッター社の公式サイトには以下のように過剰フォローに対してのルールを定めています。</p>
<blockquote><p>
フォローできるユーザー数に上限はありません。ただし、他のユーザーを過剰にフォローしているユーザーがいるかどうかは常に確認しています。制限は、妥当な利用を妨げるようなことはなく、ほとんどのユーザーには影響しません。</p>
<p>Twitterでは、過剰なフォローおよびフォローチャーン (大量ユーザーのフォローとフォロー解除を繰り返す行為) がないかを確認するため、すべてのアカウントを注視しています。</p>
</blockquote>
<p>ですが、一日に何人フォローしたら凍結されるか…という明確な数字は公式サイトには記載されていません。</p>
<p>そのため、ネット上にはさまざまな憶測が飛び交っていますが、2015年現在、さまざまなサイトで紹介されている有力な数字はこちらになります。</p>
<blockquote><p>
    フォロワーが100人以下の場合：1日50フォローまで<br />
    フォロワーが100人～1000人の場合：1日100フォローまで<br />
    フォロワーが1000人以上の場合：1日300フォローまで<br />
    フォロワーが10000人以上の場合：1日500フォローまで
</p></blockquote>
<p>＜参考＞<br />
<a href="http://afidou.com/afi/859">twitterのフォロワー数を増やす上で重要な「フォロー数制限」</a><br />
<a href="http://affiliate-jpn.com/archives/2777">Twitterアカウントが凍結される18の理由＋凍結の解除法教えます。</a><br />
<a href="http://internet.watch.impress.co.jp/docs/news/20151028_727842.html">Twitter、フォロー数の制限を5000件に拡大、全ユーザーに適用 </a></p>
<p>ただ、この上限にびくびくしながらフォロー＆リムーブを繰り返すのもカッコ悪いですよね。</p>
<h2>最後に…</h2>
<p>ツイッター公式サイトでは、アカウントの規制についての記事の最後を以下のように結んでいます。</p>
<blockquote>
<p><strong>フォロワーを増やすには？</strong></p>
<p>Twitterはフォロワー獲得競争の場ではありません。興味のあるユーザーをフォローし、意味のあるツイートをしていれば、正当なユーザーがあなたを見つけ、ツイートを読んでくれるようになります。Twitterのユーザーは、自分の興味のある更新情報を読むために他のユーザーをフォローします。過度なフォローとフォロー解除は他のユーザーにとってわずらわしいものであり、すべてのユーザーにとってTwitter利用が後味の悪いものとなってしまいます。</p></blockquote>
<p>はーい！</p>
<p>僕も地道にがんばります！</p>
<p>            <a class="twitter-timeline"  href="https://twitter.com/CompeNavi" data-widget-id="666500548162547713">@CompeNaviさんのツイート</a><br />
            <script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+"://platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script></p>


2015年最新版！ツイッターで邪道なやり方でも企業アカウントが凍結されない方法

<p>つい先日、どんなパソコンもChromebook化（ChromeOS※正確にはChromiumOSを簡単にインストール）出来るアプリということで紹介されている記事を見て、家に転がっているVaioTypePで出来るか試してみました。</p>
<p><a href="http://www.lifehacker.jp/2015/11/151113cloudready_chromebook.html" target="_blank">古いノートPCをChromebookとして復活させてくれるアプリ『CloudReady』</a></p>
<blockquote><p><strong>すべてのコンピューターで使えるわけではない</strong>：CloudReadyは、2007年以降に製造されたノートPCであれば、WindowsでもMacでもほぼ対応していますが、絶対大丈夫という保証はできません。テスト済みのハードウェア一覧と基本的なシステム要件は<a href="https://docs.google.com/document/d/1yPxKAmNFaJwk0kwikF5iROFMOxiinmkW_9KeI1u5jVo/pub" target="_blank" rel="nofollow">こちら</a>で確認してください。Chromium OSは一般的に低スペックのハードウェアでも動作するようにデザインされていますから、古くて遅いマシンであっても、息を吹き返すかもしれません。</p></blockquote>
<p>記事中に注意すべき点として上記があり、テスト済みのハードウェア一覧にはVaioが一つも入っておらず、また、ネットブックで採用されていたAtom系CPUでインストール出来るのか試してみました。</p>
<p>過去にも軽量Linuxをインストールしている端末です。</p>
<p><a href="/officer/linux%E8%BB%BD%E9%87%8F%E3%83%87%E3%82%A3%E3%82%B9%E3%83%88%E3%83%AA%E3%83%93%E3%83%A5%E3%83%BC%E3%82%B7%E3%83%A7%E3%83%B3%E3%80%8Celementaryos%E3%80%8D%E3%82%92%E3%82%A4%E3%83%B3%E3%82%B9%E3%83%88.html" target="_blank">Linux軽量ディストリビューション「elementaryOS」をインストールしてみた。</a></p>
<p>以下、USBメモリーにCloudReadyをインストールまでの手順は、別の端末で実施することが出来ます。CloudReadyをインストールするとハードディスクを全消去することになりますので、私は普段使いのMacBookproで実施しました。</p>
<h2>Chromebookリカバリユーティリティをインストール</h2>
<p><a href="/uploads-archive/2015/11/c428c0a9636fd2279a64ace363b3471b.png"><img decoding="async" loading="lazy" class="aligncenter size-medium wp-image-8428" src="/uploads-archive/2015/11/c428c0a9636fd2279a64ace363b3471b-300x194.png" alt="Chromebook_リカバリ_ユーティリティ_-_Chrome_ウェブストア" width="300" height="194" srcset="/uploads-archive/2015/11/c428c0a9636fd2279a64ace363b3471b-300x194.png 300w, /uploads-archive/2015/11/c428c0a9636fd2279a64ace363b3471b-228x147.png 228w, /uploads-archive/2015/11/c428c0a9636fd2279a64ace363b3471b.png 991w" sizes="(max-width: 300px) 100vw, 300px" /></a></p>
<p><a href="https://chrome.google.com/webstore/detail/chromebook-recovery-utili/jndclpdbaamdhonoechobihbbiimdgai?hl=ja" target="_blank">https://chrome.google.com/webstore/detail/chromebook-recovery-utili/jndclpdbaamdhonoechobihbbiimdgai?hl=ja</a></p>
<p>こちらは、Chromeアプリとしてダウンロードします。</p>
<h2>CloudReadyをダウンロード</h2>
<p><a href="/uploads-archive/2015/11/b75f34976852aa62b38e5d0264ac72aa.png"><img decoding="async" loading="lazy" class="aligncenter size-medium wp-image-8429" src="/uploads-archive/2015/11/b75f34976852aa62b38e5d0264ac72aa-300x143.png" alt="For_Individuals_—_Neverware" width="300" height="143" srcset="/uploads-archive/2015/11/b75f34976852aa62b38e5d0264ac72aa-300x143.png 300w, /uploads-archive/2015/11/b75f34976852aa62b38e5d0264ac72aa-1024x487.png 1024w, /uploads-archive/2015/11/b75f34976852aa62b38e5d0264ac72aa-228x108.png 228w, /uploads-archive/2015/11/b75f34976852aa62b38e5d0264ac72aa.png 1200w" sizes="(max-width: 300px) 100vw, 300px" /></a></p>
<p><a href="http://www.neverware.com/free#freedetails" target="_blank">http://www.neverware.com/free#freedetails</a></p>
<p>作者サイトからダウンロード</p>
<p>zipファイルを解凍しておきます。</p>
<h2>USBメモリーにCloudReadyをインストール</h2>
<p>先ほどインストールしたChromebookリカバリユーティリティを起動します。</p>
<p><a href="/uploads-archive/2015/11/3ddce93710c53c49839cc475e5024fe4.jpg"><img decoding="async" loading="lazy" class="aligncenter size-medium wp-image-8430" src="/uploads-archive/2015/11/3ddce93710c53c49839cc475e5024fe4-300x181.jpg" alt="Chromebook_リカバリ_ユーティリティ" width="300" height="181" srcset="/uploads-archive/2015/11/3ddce93710c53c49839cc475e5024fe4-300x181.jpg 300w, /uploads-archive/2015/11/3ddce93710c53c49839cc475e5024fe4-228x137.jpg 228w, /uploads-archive/2015/11/3ddce93710c53c49839cc475e5024fe4.jpg 796w" sizes="(max-width: 300px) 100vw, 300px" /></a></p>
<p>&nbsp;</p>
<p>右上の歯車を選択し、ローカルイメージを使用を選択。</p>
<p>先ほどダウンロードしたCloudReadyを参照します。</p>
<p><a href="/uploads-archive/2015/11/13dd65f2707e4763e754538fcc3ef941.jpg"><img decoding="async" loading="lazy" class="aligncenter size-medium wp-image-8431" src="/uploads-archive/2015/11/13dd65f2707e4763e754538fcc3ef941-300x179.jpg" alt="Chromebook_リカバリ_ユーティリティ_と_新規投稿を追加_‹_スターフィールド株式会社_—_WordPress" width="300" height="179" srcset="/uploads-archive/2015/11/13dd65f2707e4763e754538fcc3ef941-300x179.jpg 300w, /uploads-archive/2015/11/13dd65f2707e4763e754538fcc3ef941-228x136.jpg 228w, /uploads-archive/2015/11/13dd65f2707e4763e754538fcc3ef941.jpg 800w" sizes="(max-width: 300px) 100vw, 300px" /></a></p>
<p>あとは、手順に従って、USBにインストールをします。</p>
<p><a href="/uploads-archive/2015/11/13dd65f2707e4763e754538fcc3ef9411.jpg"><img decoding="async" loading="lazy" class="aligncenter size-medium wp-image-8432" src="/uploads-archive/2015/11/13dd65f2707e4763e754538fcc3ef9411-300x180.jpg" alt="Chromebook_リカバリ_ユーティリティ_と_新規投稿を追加_‹_スターフィールド株式会社_—_WordPress" width="300" height="180" srcset="/uploads-archive/2015/11/13dd65f2707e4763e754538fcc3ef9411-300x180.jpg 300w, /uploads-archive/2015/11/13dd65f2707e4763e754538fcc3ef9411-228x137.jpg 228w, /uploads-archive/2015/11/13dd65f2707e4763e754538fcc3ef9411.jpg 798w" sizes="(max-width: 300px) 100vw, 300px" /></a></p>
<p>3ステップほどで完了します。</p>
<p><a href="/uploads-archive/2015/11/4ea69e80d46749c668998a4b2aef55dc.jpg"><img decoding="async" loading="lazy" class="aligncenter size-medium wp-image-8433" src="/uploads-archive/2015/11/4ea69e80d46749c668998a4b2aef55dc-300x179.jpg" alt="Chromebook_リカバリ_ユーティリティ_と_My_Yahoo__-_マイヤフーで自分だけのポータルサイトを作ろう！RSSリーダーとしてもおすすめ" width="300" height="179" srcset="/uploads-archive/2015/11/4ea69e80d46749c668998a4b2aef55dc-300x179.jpg 300w, /uploads-archive/2015/11/4ea69e80d46749c668998a4b2aef55dc-228x136.jpg 228w, /uploads-archive/2015/11/4ea69e80d46749c668998a4b2aef55dc.jpg 799w" sizes="(max-width: 300px) 100vw, 300px" /></a></p>
<p>以上でUSBメモリーにCloudReadyのインストールは完了です。</p>
<p>このUSBメモリーを用いて都度、起動することもできますし、今回は、端末にインストールを進めます。</p>
<h2>端末にCloudReadyをインストール</h2>
<p>&nbsp;</p>
<p>インストールしたい端末にUSBメモリーを挿し、USBメモリーから起動をします。</p>
<p>このやり方は、記事にも掲載の通りPCによって違います。F12キーを押すのが多いかもしれないですね。</p>
<blockquote><p>コンピューターのBIOS設定でUSB起動が有効になっているかどうか確認してください。はっきりわからない場合は、PCメーカーの公式情報で確認を取りましょう。</p></blockquote>
<p><img decoding="async" loading="lazy" class="aligncenter size-medium wp-image-8434" src="/uploads-archive/2015/11/IMG_20151117_001554-300x225.jpg" alt="IMG_20151117_001554" width="300" height="225" srcset="/uploads-archive/2015/11/IMG_20151117_001554-300x225.jpg 300w, /uploads-archive/2015/11/IMG_20151117_001554-1024x768.jpg 1024w, /uploads-archive/2015/11/IMG_20151117_001554-228x171.jpg 228w" sizes="(max-width: 300px) 100vw, 300px" /></p>
<p>無事、USBメモリーからCloudReadyが起動しました。</p>
<p>また記事に従って、</p>
<ol>
<li>
<blockquote><p>開いているCloudReadyインターフェースの右下にある時刻表示部分をクリックします。</p></blockquote>
</li>
<li>
<blockquote><p>メニューが開くので、「Install CloudReady」をクリックします。</p></blockquote>
</li>
</ol>
<p>インストールへ進みます。</p>
<p><a href="/uploads-archive/2015/11/IMG_20151117_002612.jpg"><img decoding="async" loading="lazy" class="aligncenter size-medium wp-image-8435" src="/uploads-archive/2015/11/IMG_20151117_002612-300x225.jpg" alt="IMG_20151117_002612" width="300" height="225" srcset="/uploads-archive/2015/11/IMG_20151117_002612-300x225.jpg 300w, /uploads-archive/2015/11/IMG_20151117_002612-1024x768.jpg 1024w, /uploads-archive/2015/11/IMG_20151117_002612-228x171.jpg 228w" sizes="(max-width: 300px) 100vw, 300px" /></a></p>
<p>これ以降は、ハードディスクの中身を書き換えますので、今まで入っていたWindowsなどのOSは全部書き換えられますのでくれぐれもご注意下さい。</p>
<p><a href="/uploads-archive/2015/11/IMG_20151117_003050.jpg"><img decoding="async" loading="lazy" class="aligncenter size-medium wp-image-8436" src="/uploads-archive/2015/11/IMG_20151117_003050-300x225.jpg" alt="IMG_20151117_003050" width="300" height="225" srcset="/uploads-archive/2015/11/IMG_20151117_003050-300x225.jpg 300w, /uploads-archive/2015/11/IMG_20151117_003050-1024x768.jpg 1024w, /uploads-archive/2015/11/IMG_20151117_003050-228x171.jpg 228w" sizes="(max-width: 300px) 100vw, 300px" /></a></p>
<p>こちらも3クリックほどでインストールまで進み、非常に簡単です。</p>
<p>インストールが終わると自動でシャットダウンします。</p>
<p>USBメモリーを引き抜いて、端末の電源ボタンを押すと初期設定が始まりました。</p>
<p><a href="/uploads-archive/2015/11/IMG_20151117_001738.jpg"><img decoding="async" loading="lazy" class="aligncenter size-medium wp-image-8437" src="/uploads-archive/2015/11/IMG_20151117_001738-300x225.jpg" alt="IMG_20151117_001738" width="300" height="225" srcset="/uploads-archive/2015/11/IMG_20151117_001738-300x225.jpg 300w, /uploads-archive/2015/11/IMG_20151117_001738-1024x768.jpg 1024w, /uploads-archive/2015/11/IMG_20151117_001738-228x171.jpg 228w" sizes="(max-width: 300px) 100vw, 300px" /></a></p>
<p>インストール画面自体は英語ですが、ChomeOS自体は日本語に対応しているので、インストール後の初期設定で日本語の選択が可能です。</p>
<p>その後、Googleアカウントにログインをすることでこの作業も完了です。</p>
<p><a href="/uploads-archive/2015/11/IMG_20151117_010058.jpg"><img decoding="async" loading="lazy" class="aligncenter size-medium wp-image-8438" src="/uploads-archive/2015/11/IMG_20151117_010058-300x225.jpg" alt="IMG_20151117_010058" width="300" height="225" srcset="/uploads-archive/2015/11/IMG_20151117_010058-300x225.jpg 300w, /uploads-archive/2015/11/IMG_20151117_010058-1024x768.jpg 1024w, /uploads-archive/2015/11/IMG_20151117_010058-228x171.jpg 228w" sizes="(max-width: 300px) 100vw, 300px" /></a></p>
<p>無事起動しました。</p>
<h2>まとめ</h2>
<p>インストールまで非常に簡単で</p>
<ol>
<li>Chromebookリカバリユーティリティをインストール</li>
<li>CloudReadyをダウンロード</li>
<li>USBメモリーにCloudReadyをインストール</li>
<li>CloudReadyを端末にインストール</li>
</ol>
<p>この4ステップで、調べながらやっても実作業は30分程度でした。最後にインストール作業で20分程待ちます。</p>
<p>この手のOSインストールでは、WindowsでもLinuxでもドライバーの互換性など様々なところでつまづくものですが、すんなりとインストールまで完了しました。</p>
<p>いくらChromeのブラウザ専用（最近では<a href="http://www.lifehacker.jp/2015/09/150920_chromebooks_appeal.html" target="_blank">進化している</a>らしいですが）のOSといえでも、ネットブック系のAtomCPUでは動作はちと重いですね。</p>
<p>ただ、古いネットブックもこれで復活というのは間違いないです。</p>
<p>VaioTypePでも問題なくインストール出来たという人柱レポートです。</p>


VaioTypePにChromeOSをインストールしてみた。

<p>私の場合、CSSの色の指定はほとんどの場合&#8221;#f6f6f6&#8243;のような16進数による指定を行っています。</p>
<p>jQueryでも、cssやanimateで色の指定をする場合、16進数により指定しています。</p>
<p>また、IllustratorでSVGを書き出した場合、fillやstrokeのような色の指定は16進数により行われています。</p>
<p>&nbsp;</p>
<p>通常はこのことになんの問題もないのですが、</p>
<p>アニメーションをjQueryで実装する場合に、色の計算を直接しなくてはならない場合、</p>
<p>16進数の指定のままでは扱いにくいため、rgb形式に変換する必要があります。</p>
<p>&nbsp;</p>
<p>最新のブラウザの多くでは、</p>
<p>インラインSVG内の要素のアニメーションの手段としてCSS3のtransitionやanimationを使うことができます。</p>
<p>しかしながらIEでは、SVG内の要素にCSSでアニメーションの指定をしても、動作させることができません。</p>
<p>そのため、jQueryなどを使い、</p>
<p>色の計算を直接行うことで、SVGのアニメーションを実装しなくてはならない場合があります。</p>
<p>&nbsp;</p>
<p>そんなときに役立つのが、</p>
<p>rgbcolor.jsというJavaScriptのプラグインです。</p>
<p>&nbsp;</p>
<p>↓公式サイト</p>
<p><a class="link" href="http://www.phpied.com/rgb-color-parser-in-javascript/" target="_blank">RGB color parser in JavaScript / Stoyan&#8217;s phpied.com</a></p>
<p>&nbsp;</p>
<p>使い方は↓こちらのサイトでわかりやすい説明をされています。</p>
<p><a class="link" href="http://mementoo.info/archives/1792" target="_blank">【javascript】RGB⇔カラーコード変換ライブラリ</a></p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>こちらを使えば、</p>

		<div id="crayon-649540158d340532991159" 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;">
var color = new RGBColor("#DFB73A");</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-649540158d340532991159-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-649540158d340532991159-1"><span class="crayon-t">var</span><span class="crayon-h"> </span><span class="crayon-i">color</span><span class="crayon-h"> </span>=<span class="crayon-h"> </span><span class="crayon-r">new</span><span class="crayon-h"> </span><span class="crayon-e">RGBColor</span><span class="crayon-sy">(</span><span class="crayon-s">"#DFB73A"</span><span class="crayon-sy">)</span><span class="crayon-sy">;</span></div></div></td>
					</tr>
				</table>
			</div>
		</div>

<p>や</p>

		<div id="crayon-649540158d344852701717" 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;">
var color = new RGBColor("rgb(255, 0, 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-649540158d344852701717-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-649540158d344852701717-1"><span class="crayon-t">var</span><span class="crayon-h"> </span><span class="crayon-i">color</span><span class="crayon-h"> </span>=<span class="crayon-h"> </span><span class="crayon-r">new</span><span class="crayon-h"> </span><span class="crayon-e">RGBColor</span><span class="crayon-sy">(</span><span class="crayon-s">"rgb(255, 0, 255)"</span><span class="crayon-sy">)</span><span class="crayon-sy">;</span></div></div></td>
					</tr>
				</table>
			</div>
		</div>

<p>のように色を任意の形式で指定することで、</p>

		<div id="crayon-649540158d346535510359" 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;">
var red = color.r; //rgbの赤色を取得
var green = color.g; //rgbの緑色を取得
var blue = color.b; //rgbの青色を取得
var rgb = color.toRGB(); //rgb形式に変換
var hex = color.toHex(); //16進数形式で取得</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-649540158d346535510359-1">1</div><div class="crayon-num crayon-striped-num" data-line="crayon-649540158d346535510359-2">2</div><div class="crayon-num" data-line="crayon-649540158d346535510359-3">3</div><div class="crayon-num crayon-striped-num" data-line="crayon-649540158d346535510359-4">4</div><div class="crayon-num" data-line="crayon-649540158d346535510359-5">5</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-649540158d346535510359-1"><span class="crayon-t">var</span><span class="crayon-h"> </span><span class="crayon-i">red</span><span class="crayon-h"> </span>=<span class="crayon-h"> </span><span class="crayon-i">color</span><span class="crayon-sy">.</span><span class="crayon-i">r</span><span class="crayon-sy">;</span><span class="crayon-h"> </span><span class="crayon-c">//rgbの赤色を取得</span></div><div class="crayon-line crayon-striped-line" id="crayon-649540158d346535510359-2"><span class="crayon-t">var</span><span class="crayon-h"> </span><span class="crayon-i">green</span><span class="crayon-h"> </span>=<span class="crayon-h"> </span><span class="crayon-i">color</span><span class="crayon-sy">.</span><span class="crayon-i">g</span><span class="crayon-sy">;</span><span class="crayon-h"> </span><span class="crayon-c">//rgbの緑色を取得</span></div><div class="crayon-line" id="crayon-649540158d346535510359-3"><span class="crayon-t">var</span><span class="crayon-h"> </span><span class="crayon-i">blue</span><span class="crayon-h"> </span>=<span class="crayon-h"> </span><span class="crayon-i">color</span><span class="crayon-sy">.</span><span class="crayon-i">b</span><span class="crayon-sy">;</span><span class="crayon-h"> </span><span class="crayon-c">//rgbの青色を取得</span></div><div class="crayon-line crayon-striped-line" id="crayon-649540158d346535510359-4"><span class="crayon-t">var</span><span class="crayon-h"> </span><span class="crayon-i">rgb</span><span class="crayon-h"> </span>=<span class="crayon-h"> </span><span class="crayon-i">color</span><span class="crayon-sy">.</span><span class="crayon-e">toRGB</span><span class="crayon-sy">(</span><span class="crayon-sy">)</span><span class="crayon-sy">;</span><span class="crayon-h"> </span><span class="crayon-c">//rgb形式に変換</span></div><div class="crayon-line" id="crayon-649540158d346535510359-5"><span class="crayon-t">var</span><span class="crayon-h"> </span><span class="crayon-i">hex</span><span class="crayon-h"> </span>=<span class="crayon-h"> </span><span class="crayon-i">color</span><span class="crayon-sy">.</span><span class="crayon-e">toHex</span><span class="crayon-sy">(</span><span class="crayon-sy">)</span><span class="crayon-sy">;</span><span class="crayon-h"> </span><span class="crayon-c">//16進数形式で取得</span></div></div></td>
					</tr>
				</table>
			</div>
		</div>

<p>上記のように柔軟に色の情報を変換・取得することができます。</p>
<p>&nbsp;</p>
<p>↓こちらはそれを応用してSVGのアニメーションを実装してみたDEMOです。</p>
<p><a class="demo" href="/demo/ninomiya/89/">DEMO</a></p>
<p>&nbsp;</p>
<p>用途は幅広いと思いますので、是非ご利用下さい。</p>

rgbcolor.jsで16進数⇔rgb()の色の変換を簡単にできる

<p>筆者はあまりSEOと言うものを理解していないのですが、<br />
Facebookでたまたま興味ある記事があがっていたのでフォーカスを当ててみます。</p>
<p>参照サイトは<a href="http://takuyokomizo.com/page-speed-seo/">こちら</a></p>
<p>概ね参考サイトに記載されているので割愛させて頂きます。</p>
<h2>無料評価サイト</h2>
<div style="padding-left: 15px;">
Apacheベンチとなると敷居が高い、手軽に済ませたい方におすすめ。</p>
<p>https://developers.google.com/speed/pagespeed/insights/</p>
<p>ここに検証してもらいたいサイトのURLを入力して分析ボタンを押下するだけです。<br />
点数に併せて、改善案まで提示してくれます。あら素敵。</p></div>
<h2>ファイルの圧縮</h2>
<div style="padding-left: 15px;">
速度について言うとjsやcssの圧縮や画像ファイルの圧縮が推奨されているようです。<br />
js, cssなど外部ファイルの圧縮はリクエストを減らすのには必須です。<br />
また画像ファイルもPNGやJPEGであれば最適化で、それなりの容量を削減することが可能です。</p>
<p>memcachedなどのKVSを使用するのは当然として、<br />
Railsではプリコンパイルと言う、リクエストを減らし且つファイル圧縮まで出来るフレームワークも注目できると思われます。</p></div>
<p>　※プリコンパイルでは変数名を短縮し、解読しづらいものに変えたり余分なスペースを削除して圧縮をします。<br />
　 また複数ファイルを単一ファイルにまとめてアクセスを減らすことも可能です。</p>
<h2>モジュールの圧縮</h2>
<div style="padding-left: 15px;">
PHPやRubyなどの動的言語ではコンパイルがされない代わりに実行速度がどうしても劣ります。</p>
<p>一方Pythonは動的言語でありながらコンパイルを通すことが可能で、<br />
その分、実効速度も上がると言われています。<br />
(動的言語の定義があやふやなので、そこそこにしか触れません&#8230;)</p>
<p>機会があればPHP, Ruby, Python, Javaでのリクエストごとの実行速度を比較できればと思います。</p></div>


SEOとページ表示速度

<p>今回はwebサービスのご紹介になります。</p>
<p>この「booky.io」単純なブックマーク管理なサービスなのですが、オシャレで簡単に扱うことができます。</p>
<p>PCのブラウザだけでなく、タブレット・スマホでも使用可能なので、<br />
どんなデバイスでも同じようにブックマークを管理できます。<br />
今まで僕は、メールでリンクでPCへ送ったり、Pocketを使っていたりしてました。<br />
しかし、Pocketはあとで読むみたいな感じなので、<br />
ブックマークとはちょっと違う感じでなるべく使いたくありませんでした。<br />
あと、タグはありますが、カテゴリーがないので整理が難しいです。</p>
<p>その点、booky.ioはカテゴリーを自由に増やすこともでき、デザインもすっきりしていて見やすいです。<br />
登録する際もブックマークレットが用意されているので簡単です。</p>
<p><a href="http://booky.io/" class="link"  target="_blank">booky.io | Online bookmark manager. Your bookmarks available on all devices.</a></p>


オシャレなブックマーク管理サービス「booky.io」

<p>先日、youtubeのアカウントを作成して動画をアップしたところ、動画を管理するページに「第三者のコンテンツと一致した」という表示が出ました。</p>
<p>詳細を見てみると、どうやら「AdRev for a 3rd Party」つまり第三者の団体から「動画で使用されている楽曲は自分たちの著作物だ」と主張があったという事の様です。</p>
<p>著作権という言葉には、反射的にビクついてしまい変な汗が出たのですが、冷静に考えてみるとDTMソフト内のソフト音源を使用して作ったとはいえ、明らかに自分で作った曲に対して権利を主張されるのはおかしいはずです。</p>
<p>そうとう似ている曲なのかなとも思いましたが、waveの波形などからそこまで短時間で解析ができるのだろうかと疑問になりました。しかも第三者団体から権利の主張があったのは動画アップしてから1分もしない内のできごとです。</p>
<p>どうも疑わしいと思い、「AdRev for a 3rd Party」を検索してみたところ、同じ経験をした方の記事が大量に出てきました。</p>
<p>記事によると、動画に使われている曲はyoutube側から自動でスキャンされて、アルゴリズムによってyoutubeにコンテンツIDを登録している権利者の曲と一致すると「第三者のコンテンツと一致した」と表示されるとの事でした。作曲家やアーティストたちの権利を守るためのシステムですので、ごもっともな事です。確かにyoutube上では明らかに他社の著作物である、ミュージックビデオやテレビ番組をアップして、広告費を稼ごうなんてヤカラが沢山います。</p>
<h2>知らない間に広告収入を得る道具にされているかも</h2>
<p>しかし、私の事案について言えば逆で、むしろこちらが権利を奪われてしまっています。これはどうした事かと、さらに調べてみると、どうやら、ありもしない権利を主張している詐欺集団がyoutubeにはいるとの事でした。</p>
<p>今回の私の様に、「第三者のコンテンツと一致した」とされた場合、その動画は削除されたりする事はありません。どうなるかというと、勝手に広告が表示されるようになり、さらにその広告を表示する事で発生したお金は権利を主張する者に入る仕組みになっています。つまり、詐欺集団はアップされた動画に対して無作為に権利を主張して、動画が再生されるたびに広告収入を得ようとしているわけです。</p>
<p>アップした動画を削除しないといけないわけでもないので、一部の人はそのままにしてしまうい、知らない間に詐欺集団に広告費を謙譲してしまっているという事でした。</p>
<p>詐欺集団と疑いのある団体がこちらでまとめてあるので参考にしてください。</p>
<p><a href="http://youtube-false-content-id-match-claim-organizaitons.wikia.com/wiki/YouTube%E3%81%A7%E3%80%8C%E7%AC%AC%EF%BC%93%E8%80%85%E3%81%AE%E3%82%B3%E3%83%B3%E3%83%86%E3%83%B3%E3%83%84%E3%81%A8%E4%B8%80%E8%87%B4%E3%80%8D%E3%81%97%E3%81%9F%E3%81%A8%E3%81%8D%E7%96%91%E3%81%86%E3%81%B9%E3%81%8D%E5%9B%A3%E4%BD%93%E3%83%AA%E3%82%B9%E3%83%88_Wiki">http://youtube-false-content-id-match-claim-organizaitons.wikia.com/wiki/YouTube</a></p>
<h2>ありもしない権利を主張されたら</h2>
<p>では、ありもしない権利を主張されてしまった場合にはどうすればいいのか？というと、動画の管理者は「異議を申し立てる」ことができるようになっています。</p>
<p>管理ページの「異議を申し立てる」から、第三者の著作物ではない理由など詳細内容を入力する事で、詐欺行為を回避できます。</p>
<p>私の場合もすぐに異議を申し立てて、広告の表示はなくなりました。</p>
<p>こちらのサイトにもっと詳しい事が載っていますので参考にしてください。</p>
<p><a href="http://ghid.cocolog-nifty.com/band/2013/01/youtube-b7a7.html">http://ghid.cocolog-nifty.com/band/2013/01/youtube-b7a7.html</a></p>
<h2>フリー素材にはもちろん著作権があるので注意</h2>
<p>フリーのＢＧＭを使用している人は沢山いると思いますが、そういった音素材を提供している団体や個人の中にはyoutubeのコンテンツIDを取得している場合も多いみたいです。音素材を提供するサイトの中には、youtubeから間接的に広告収入をえるために無料でBGMを提供している場合もあるようなので、該当する場合は気をつけましょう。</p>


youtubeにはびこる著作権詐欺にご用心

<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/B014B3N2RO/sackoh71-22/" target="_blank"><img decoding="async" style="border: none;" src="http://ecx.images-amazon.com/images/I/51E3P5cdvsL._SL160_.jpg" alt="" /></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%;">
<p><a href="http://www.amazon.co.jp/exec/obidos/asin/B014B3N2RO/sackoh71-22/" target="_blank">Kindleのまとめサイトでどうにかこうにか1000日間生計をたてた話[Kindle版]</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" target="_blank" rel="nofollow">ヨメレバ</a></div>
</div>
<div class="booklink-detail" style="margin-bottom: 5px;">きんどう zon きんどう 2015-08-29</div>
</div>
<div class="booklink-footer" style="clear: left;"></div>
</div>
<p>メディアを運営する上での心得を学べます。<br />
こういった本がkindleで250円程度で買えるのはいいですよね。<br />
我々はあくまで法人ですが、最近入社してくれた方も増えたので、法人ブログとしてオウンドメディアを運営をしている意義をもう一度書いてみたいと思います。</p>
<h2>法人ブログを運用する目的</h2>
<h3>サイトを強くするということの重要性</h3>
<p>収入を目指すメディアとは違い我々は、短期直接的な広告収入というのは見込んでおらず、マーケティングの内容や技術的なアウトプットを外部に発信することによる中長期的なブランディング をメインに据えています。<br />
実際に、特定の分野に限定された技術が必要なお仕事があり、当社がその分野に関する技術ブログの記事を執筆していたことでお問い合わせを頂きました。<br />
まさに、私が狙いを定めていた理想の形でお仕事をさせて頂くことが出来ました。</p>
<h3>コミュニケーション能力の向上</h3>
<p>もう一つ成し遂げたいことは、社員へブログ記事を執筆することを業務として推進することで、アウトプットへの能力が高まることを期待しております。<br />
これは、業務を遂行する上で必要不可欠なコミュニケーション能力を高めることに他ならないと考えています。</p>
<h3> 副次的な産物</h3>
<p>更なる逆説的な効果として、よりよいアウトプットをしなければならないという義務感が働き、インプットへの感度が研ぎ澄まされていくことです。<br />
みんなブログに書くためのネタを仕込むことに目を向けるようになり、業務上で挑戦した技術に更にブログで言及、深掘りをするといった執筆の仕方や、<br />
私のケースでもニュースを流し読みするだけでなく、常にブログとして取り上げる内容かどうかというのを考えながら、自分の意見が多く出るものや、社内外に対して発信すべきだと思えるかどうかという視点でインプットを心がけています。</p>
<p>そんなこんなでブログを書き続けて、1周間に一回それなりのリソースを割くというコスト以外はメリットばかりと思っています。</p>
<p>だいぶ話が逸れましたが、まとめサイトとオウンドメディアを運用する手法として共通することがあったので、紹介します。</p>
<h2>抜粋</h2>
<ul>
<li>二、三日に一記事？ 土日は休み？ 何年かけてメディアを成長させる気ですか。一日でも早い成長ペースに乗せるために、序盤に地獄を見たほうが後からサイト運営は楽になります。息をするように更新しましょう。更新こそが人生です</li>
<li>メディアはストックとフローと二種類の性質があるのでどちらに何を書くかはしっかりと考えていきましょう。じっくり読ませるものはストック型のブログに。キャッチーなイラストや動画を使ったインパクト勝負なものはツイッターといった具合です。 　そうして「うざいくらいにツイッターで話題を作って」「ブログにユーザーを誘導する」「ブログを見てツイッターをフォローしてもらう」を繰り返して二つのメディアを相互に成長させていくのです。</li>
<li>慣れてないうちは多少のデザイン崩れを甘えで許しがちですが、厳しく自分を律して見出しや太字、画像サイズなどを確認して公開後も気づいたらすぐ修正しましょ</li>
<li>気をつけて欲しいマナーについて &#8211; 大事なポイントですが「買って」「読んで」「感想をくれ」等の読者に行動を頼むのはダメです</li>
</ul>


Kindleのまとめサイトでどうにかこうにか1000日間生計をたてた話

<p>完全に自分のためなのだが、データをカラム数を指定してテーブルにしてくれるツールを作った。</p>
<p><a class="demo" href="/demo/hoshino/60/" target="_blank">デモ</a></p>
<p>&nbsp;</p>
<p>ライティングをしていてとりあえずリスト化したあとに</p>
<p>ワイヤーなどにするとき表組みしたい時がしばしばある。</p>
<p>HTMLはそのまま使えるし、プレビューをコピーすればExcelに貼り付けることもできるようになっている。</p>
<p>&nbsp;</p>
<p>例えばLaunchCartの機能一覧をメモして5カラムの表にすると</p>
<div style="height: 200px; overflow: scroll;">リッチテキストエディタ<br />
拡張フィールド<br />
SKU<br />
レビュー<br />
多階層カテゴリ<br />
お気に入り<br />
CSV登録<br />
棚卸し<br />
カスタマイズ帳票<br />
カスタマイズ注文CSV<br />
追跡番号<br />
ブログ・ニュース<br />
リソース管理<br />
スマホ対応<br />
フューチャーフォン対応<br />
休業日カレンダー<br />
配送指定日時自動計算<br />
売上分析<br />
管理者権限管理<br />
テンプレートエンジン<br />
非会員購入<br />
分割・リボ払い<br />
電話注文<br />
ギフト<br />
オプション商品<br />
同梱・別送<br />
複数配送先<br />
送料設定<br />
お届け先管理<br />
倉庫連携<br />
ポイント管理<br />
アンケート<br />
メルマガ<br />
コンバージョンタグ<br />
アフィリエイトタグ<br />
クーポンコード発行<br />
シリアルコード発行<br />
カスタム検索<br />
会員ランク<br />
メールテンプレート<br />
インポート・エクスポート<br />
決済手数料<br />
会員登録情報追加<br />
決済金額指定<br />
注文編集<br />
注文ステータス管理</div>
<p style="text-align: center; font-size: 2em;">↓</p>
<table>
<tbody>
<tr>
<td>リッチテキストエディタ</td>
<td>拡張フィールド</td>
<td>SKU</td>
<td>レビュー</td>
<td>多階層カテゴリ</td>
</tr>
<tr>
<td>お気に入り</td>
<td>CSV登録</td>
<td>棚卸し</td>
<td>カスタマイズ帳票</td>
<td>カスタマイズ注文CSV</td>
</tr>
<tr>
<td>追跡番号</td>
<td>ブログ・ニュース</td>
<td>リソース管理</td>
<td>スマホ対応</td>
<td>フューチャーフォン対応</td>
</tr>
<tr>
<td>休業日カレンダー</td>
<td>配送指定日時自動計算</td>
<td>売上分析</td>
<td>管理者権限管理</td>
<td>テンプレートエンジン</td>
</tr>
<tr>
<td>非会員購入</td>
<td>分割・リボ払い</td>
<td>電話注文</td>
<td>ギフト</td>
<td>オプション商品</td>
</tr>
<tr>
<td>同梱・別送</td>
<td>複数配送先</td>
<td>送料設定</td>
<td>お届け先管理</td>
<td>倉庫連携</td>
</tr>
<tr>
<td>ポイント管理</td>
<td>アンケート</td>
<td>メルマガ</td>
<td>コンバージョンタグ</td>
<td>アフィリエイトタグ</td>
</tr>
<tr>
<td>クーポンコード発行</td>
<td>シリアルコード発行</td>
<td>カスタム検索</td>
<td>会員ランク</td>
<td>メールテンプレート</td>
</tr>
<tr>
<td>インポート・エクスポート</td>
<td>決済手数料</td>
<td>会員登録情報追加</td>
<td>決済金額指定</td>
<td>注文編集</td>
</tr>
<tr>
<td>注文ステータス管理</td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
</tbody>
</table>


改行区切りのデータをテーブルに加工するツール

<p>以前、筆者がrubyを覚える(？)取っ掛かりであった</p>
<p>「goodbye chatwork」</p>
<p>退会する時に全て保存だけはしておこう！と思って命名されたのかは謎ですが、、、<br />
チャットワークのログを保存することが出来るツールです。</p>
<h2>インストール方法</h2>
<div style="padding-left: 15px;">
<p>Macでのインストールしか試してないのですが、</p>

		<div id="crayon-649540158d117696731357" 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">Shell</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;">
gem install goodbye_chatwork</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-649540158d117696731357-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-649540158d117696731357-1"><span class="crayon-e">gem </span><span class="crayon-e">install </span><span class="crayon-i">goodbye_chatwork</span></div></div></td>
					</tr>
				</table>
			</div>
		</div>

<p>と入力するだけです。<br />
Rubyもインストールされている必要はあります。<br />
(昨今のMacはRuby標準装備のため、ここは割愛させていただきます。</p>
</div>
<h2>使用方法</h2>
<div style="padding-left: 15px;">
<p>何もオプション指定せずに</p>

		<div id="crayon-649540158d11b748611275" 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">Shell</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;">
goodbye_chatwork</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-649540158d11b748611275-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-649540158d11b748611275-1"><span class="crayon-i">goodbye_chatwork</span></div></div></td>
					</tr>
				</table>
			</div>
		</div>

<p>とだけ入力すればUsageが表示されます。</p>

		<div id="crayon-649540158d11d828900743" 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">Shell</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;">
goodbye_chatwork -i {登録時のメールアドレス} -p {パスワード}</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-649540158d11d828900743-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-649540158d11d828900743-1"><span class="crayon-e">goodbye_chatwork</span><span class="crayon-h"> </span>-<span class="crayon-e">i</span><span class="crayon-h"> </span><span class="crayon-sy">{</span>登録時のメールアドレス<span class="crayon-sy">}</span><span class="crayon-h"> </span>-<span class="crayon-e">p</span><span class="crayon-h"> </span><span class="crayon-sy">{</span>パスワード<span class="crayon-sy">}</span></div></div></td>
					</tr>
				</table>
			</div>
		</div>

<p>&nbsp;</p>
<p>このようにすれば自分の入っているグループチャットやダイレクトチャットの一覧が表示されます。</p>
<p>そして、例えば以下のように表示されているグループ部屋を保存しておきたい場合</p>

		<div id="crayon-649540158d11e518362777" 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">Shell</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;">
14549256 全社連絡 735</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-649540158d11e518362777-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-649540158d11e518362777-1"><span class="crayon-cn">14549256</span><span class="crayon-h"> </span>全社連絡<span class="crayon-h"> </span><span class="crayon-cn">735</span></div></div></td>
					</tr>
				</table>
			</div>
		</div>

<p>&nbsp;</p>

		<div id="crayon-649540158d11f568532883" 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">Shell</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;">
goodbye_chatwork -i {メールアドレス} -p {パスワード} -e 14549256</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-649540158d11f568532883-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-649540158d11f568532883-1"><span class="crayon-e">goodbye_chatwork</span><span class="crayon-h"> </span>-<span class="crayon-e">i</span><span class="crayon-h"> </span><span class="crayon-sy">{</span>メールアドレス<span class="crayon-sy">}</span><span class="crayon-h"> </span>-<span class="crayon-e">p</span><span class="crayon-h"> </span><span class="crayon-sy">{</span>パスワード<span class="crayon-sy">}</span><span class="crayon-h"> </span>-<span class="crayon-i">e</span><span class="crayon-h"> </span><span class="crayon-cn">14549256</span></div></div></td>
					</tr>
				</table>
			</div>
		</div>

<p>&nbsp;<br />
上記だとメッセージのログのみ保存。(作業ディレクトリにchatwork_logディレクトリが作成される)<br />
&nbsp;</p>

		<div id="crayon-649540158d120787481267" 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">Shell</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;">
goodbye_chatwork -i {メールアドレス} -p {パスワード} -x 14549256</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-649540158d120787481267-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-649540158d120787481267-1"><span class="crayon-e">goodbye_chatwork</span><span class="crayon-h"> </span>-<span class="crayon-e">i</span><span class="crayon-h"> </span><span class="crayon-sy">{</span>メールアドレス<span class="crayon-sy">}</span><span class="crayon-h"> </span>-<span class="crayon-e">p</span><span class="crayon-h"> </span><span class="crayon-sy">{</span>パスワード<span class="crayon-sy">}</span><span class="crayon-h"> </span>-<span class="crayon-i">x</span><span class="crayon-h"> </span><span class="crayon-cn">14549256</span></div></div></td>
					</tr>
				</table>
			</div>
		</div>

<p>&nbsp;<br />
オプションをxにすると下位ディレクトリに部屋ごとの添付ファイルもダウンロード保存してくれる。
</p></div>
<h2>不具合など</h2>
<div style="padding-left: 15px;">
以前これを扱ったのは、一定条件下で一覧取得でコケるのを修正したからです。</p>
<p>ですが、、、どこを改修したのか覚えておらず、もう一度見なければ解らないと言う。<br />
パスワードをオプション指定直後に入力しなければならないと言うのも安全ではないですね。</p>
<p>どちらもrubyのプログラムを書き換えれば解決する問題です。</p>
<p>公式のAPIもあります。<br />
Botとか特定キーワードで通知させたり、L◯NEのアレみたいにひたすら会話をしてくれるAIPCを用意したりあｓ、、改良の余地は色々とありそうですね！</p></div>

Chatworkからログ保存してみる

【jQuery】IE9でページ遷移せずにファイルをPOSTしてJSONを受け取る

<p>ＶＴＲをクライアントに納品する際にＤＶＤプレーヤーで再生できる様に求められる事が未だにあると思います。</p>
<p>DVD-VIDEOの形式にするという事になると思いますが、大抵の場合編集後にできあがった映像の画質が悪くなってしまうはずです。</p>
<p>画像のサイズはＮＴＳＣで720×480ですので、現行のカメラで撮影した素材で作成した映像ならサイズダウンしてしまいます。ビットレートも9.6MbpsまでなのでDVDに書き出すと画質は数分の１まで落ちてしまいます。</p>
<p>何とかならないかと試行錯誤したところ、ある程度は軽減できたので、その方法をお伝えします。私はadobeのpremiereで編集を行っているので、adobe製品を使っての方法になりますが、他のツールを使っている方でも同じような事ができるはずです。</p>
<h2>まずはMPEG2で書き出す</h2>
<p><a href="/uploads-archive/2015/10/12.jpg"><img decoding="async" loading="lazy" class="alignnone size-full wp-image-8362" src="/uploads-archive/2015/10/12.jpg" alt="1" width="640" height="523" srcset="/uploads-archive/2015/10/12.jpg 640w, /uploads-archive/2015/10/12-300x245.jpg 300w, /uploads-archive/2015/10/12-228x186.jpg 228w" sizes="(max-width: 640px) 100vw, 640px" /></a></p>
<p>編集が完了した動画をDVDにオーソライズ前に書き出す際にMPEG2形式で保存するように設定します。</p>
<p>DVD-VIDEOはMPEG2形式なので、最終的な画質は動画を書き出す際のビットレートに依存する事になります。</p>
<h2>ビットレートを最大にする</h2>
<p><a href="/uploads-archive/2015/10/21.jpg"><img decoding="async" loading="lazy" class="alignnone size-full wp-image-8365" src="/uploads-archive/2015/10/21.jpg" alt="2" width="484" height="172" srcset="/uploads-archive/2015/10/21.jpg 484w, /uploads-archive/2015/10/21-300x107.jpg 300w, /uploads-archive/2015/10/21-228x81.jpg 228w" sizes="(max-width: 484px) 100vw, 484px" /></a></p>
<p>先述しましたがDVDのビットレートは最大で9.6Mbpsなので、書き出す際のビットレートを最大にします。ビットレートを高くするとデコーダーの負担は大きくなりますが画質が向上します。</p>
<p>この状態で動画ファイルを書き出して下さい。</p>
<h2>EncoreでDVDをオーソライズする</h2>
<p><img decoding="async" loading="lazy" class="alignnone size-full wp-image-8368" src="/uploads-archive/2015/10/31.jpg" alt="3" width="640" height="398" srcset="/uploads-archive/2015/10/31.jpg 640w, /uploads-archive/2015/10/31-300x187.jpg 300w, /uploads-archive/2015/10/31-228x142.jpg 228w" sizes="(max-width: 640px) 100vw, 640px" /></p>
<p>ちょっと前まではPCにDVDをオーソライズするソフトウェアが標準で入っていました。win7のビデオメーカーまではオーソライズができましたが、win8からビデオメーカーでDVDを作る事ができなくなってしまいました。もちろん無料、有料のオーソライズ用ソフトは沢山ありますが、adobeのCCを利用しているまたは、premiereCS6を利用されているのであれば、Encoreを使ってみてはいかがでしょうか。</p>
<p>メニュー画面なども自由に作れますので納品用としては使い勝手がいいと思います。</p>
<p>adobe CC　を利用されている場合は、CCのマネージャーから「以前のバージョンを表示」でpremiereCS6をインストールしてください。</p>
<p><a href="/uploads-archive/2015/10/41.jpg"><img decoding="async" loading="lazy" class="alignnone wp-image-8370" src="/uploads-archive/2015/10/41.jpg" alt="4" width="312" height="545" srcset="/uploads-archive/2015/10/41.jpg 456w, /uploads-archive/2015/10/41-172x300.jpg 172w, /uploads-archive/2015/10/41-228x399.jpg 228w" sizes="(max-width: 312px) 100vw, 312px" /></a></p>
<p>premiereCS6をインストールするとEncoreも一緒にインストールされるはずです。</p>


動画をDVD納品する際に画質を保持する方法

html5で増えたinput関係で実際使ってみたいもの

<p>お仕事兼視察を兼ねて、徳島県の神山町に行ってきました。</p>
<p>今回、懇意にさせて頂いている会社様の視察団に一人混ぜて頂き、視察フルコースを用意していただきました。</p>
<p>タイミングや人数や重要度によっては、なかなか実現出来ないであろう非常に盛り沢山な一日でした。</p>
<p>神山町は地域起こしの成功モデルとして、度々メディアに取り上げられるほどになった日本でも稀有地域の一つです。</p>
<p>&nbsp;</p>
<p><a href="/uploads-archive/2015/10/IMG_20151021_122701.jpg"><img decoding="async" loading="lazy" class="aligncenter size-medium wp-image-8329" src="/uploads-archive/2015/10/IMG_20151021_122701-225x300.jpg" alt="IMG_20151021_122701" width="225" height="300" srcset="/uploads-archive/2015/10/IMG_20151021_122701-225x300.jpg 225w, /uploads-archive/2015/10/IMG_20151021_122701-228x304.jpg 228w, /uploads-archive/2015/10/IMG_20151021_122701.jpg 722w" sizes="(max-width: 225px) 100vw, 225px" /></a></p>
<p>その民間主導で行った地域起こしの発起人であるNPO法人グリーンバレーの理事長の大南様のご説明から。</p>
<p>何よりものすごいパワーを感じました。</p>
<p><strong>やったらええんちゃう</strong></p>
<p>just do it＝とにかく行動しよう。アイデアキラーはいらない</p>
<div></div>
<div>これをキーワードに25年かけて、人を呼び戻すことに成功したモデルとまで言われるようになったその軌跡を丁寧に教えて頂きました。</div>
<div><a href="/uploads-archive/2015/10/IMG_20151021_123623.jpg"><img decoding="async" loading="lazy" class="aligncenter size-medium wp-image-8330" src="/uploads-archive/2015/10/IMG_20151021_123623-300x225.jpg" alt="IMG_20151021_123623" width="300" height="225" srcset="/uploads-archive/2015/10/IMG_20151021_123623-300x225.jpg 300w, /uploads-archive/2015/10/IMG_20151021_123623-1024x768.jpg 1024w, /uploads-archive/2015/10/IMG_20151021_123623-228x171.jpg 228w, /uploads-archive/2015/10/IMG_20151021_123623.jpg 1283w" sizes="(max-width: 300px) 100vw, 300px" /></a></div>
<div></div>
<div>昼食は有機小麦を使ったピザ。</div>
<div>オーナーの方もこの神山へIターンで移住された方で地域の食材もふんだんに使っていて、地産池消を地で行くのお店でした。</div>
<div></div>
<div>その後は、企業訪問</div>
<div><a href="/uploads-archive/2015/10/IMG_20151021_135915.jpg"><img decoding="async" loading="lazy" class="aligncenter size-medium wp-image-8331" src="/uploads-archive/2015/10/IMG_20151021_135915-225x300.jpg" alt="IMG_20151021_135915" width="225" height="300" srcset="/uploads-archive/2015/10/IMG_20151021_135915-225x300.jpg 225w, /uploads-archive/2015/10/IMG_20151021_135915-228x304.jpg 228w, /uploads-archive/2015/10/IMG_20151021_135915.jpg 722w" sizes="(max-width: 225px) 100vw, 225px" /></a></div>
<div>まずは、訪問させて頂いたのが名刺管理のsansanさんです。</div>
<div>古民家を改装したオフィスを初めて拝見しました。</div>
<div><a href="/uploads-archive/2015/10/IMG_20151021_140101.jpg"><img decoding="async" loading="lazy" class="aligncenter size-medium wp-image-8332" src="/uploads-archive/2015/10/IMG_20151021_140101-225x300.jpg" alt="IMG_20151021_140101" width="225" height="300" srcset="/uploads-archive/2015/10/IMG_20151021_140101-225x300.jpg 225w, /uploads-archive/2015/10/IMG_20151021_140101-228x304.jpg 228w, /uploads-archive/2015/10/IMG_20151021_140101.jpg 722w" sizes="(max-width: 225px) 100vw, 225px" /></a></div>
<div>ウェブで良く見たハンモックがそこにはありました。</div>
<div><a href="/uploads-archive/2015/10/IMG_20151021_142359.jpg"><img decoding="async" loading="lazy" class="aligncenter size-medium wp-image-8333" src="/uploads-archive/2015/10/IMG_20151021_142359-225x300.jpg" alt="IMG_20151021_142359" width="225" height="300" srcset="/uploads-archive/2015/10/IMG_20151021_142359-225x300.jpg 225w, /uploads-archive/2015/10/IMG_20151021_142359-228x304.jpg 228w, /uploads-archive/2015/10/IMG_20151021_142359.jpg 722w" sizes="(max-width: 225px) 100vw, 225px" /></a></div>
<div><a href="/uploads-archive/2015/10/IMG_20151021_142530.jpg"><img decoding="async" loading="lazy" class="aligncenter size-medium wp-image-8334" src="/uploads-archive/2015/10/IMG_20151021_142530-300x225.jpg" alt="IMG_20151021_142530" width="300" height="225" srcset="/uploads-archive/2015/10/IMG_20151021_142530-300x225.jpg 300w, /uploads-archive/2015/10/IMG_20151021_142530-1024x768.jpg 1024w, /uploads-archive/2015/10/IMG_20151021_142530-228x171.jpg 228w, /uploads-archive/2015/10/IMG_20151021_142530.jpg 1283w" sizes="(max-width: 300px) 100vw, 300px" /></a></div>
<div><a href="/uploads-archive/2015/10/IMG_20151021_144346.jpg"><img decoding="async" loading="lazy" class="aligncenter size-medium wp-image-8335" src="/uploads-archive/2015/10/IMG_20151021_144346-225x300.jpg" alt="IMG_20151021_144346" width="225" height="300" srcset="/uploads-archive/2015/10/IMG_20151021_144346-225x300.jpg 225w, /uploads-archive/2015/10/IMG_20151021_144346-228x304.jpg 228w, /uploads-archive/2015/10/IMG_20151021_144346.jpg 722w" sizes="(max-width: 225px) 100vw, 225px" /></a></div>
<div></div>
<div></div>
<div>その後は、ソノリテさん、DRAWING AND MANUALさん、里山みらいさん、キネトスコープさん</div>
<div>どこも空き家や昔店舗だった建物を改装してオフィスとしており、徒歩圏内で本当にご近所さんという感じです。</div>
<div> <a href="/uploads-archive/2015/10/IMG_20151021_151656.jpg"><img decoding="async" loading="lazy" class="aligncenter size-medium wp-image-8336" src="/uploads-archive/2015/10/IMG_20151021_151656-300x225.jpg" alt="IMG_20151021_151656" width="300" height="225" srcset="/uploads-archive/2015/10/IMG_20151021_151656-300x225.jpg 300w, /uploads-archive/2015/10/IMG_20151021_151656-1024x768.jpg 1024w, /uploads-archive/2015/10/IMG_20151021_151656-228x171.jpg 228w, /uploads-archive/2015/10/IMG_20151021_151656.jpg 1283w" sizes="(max-width: 300px) 100vw, 300px" /></a></div>
<div>最後に度々取り上げられているえんがわオフィス。</div>
<div>映像事業のプラットイーズさんがBCP（事業継続性計画）の一環として、災害等が起こっても事業を継続出来るように複数拠点を持ちリスクを分散させるという目的で20のサテライトオフィス候補を検討された上でこの神山町にて拠点を持たれたのがこのえんがわオフィスです。</div>
<div>東京恵比寿事務所との2拠点を構えることで、神山はシングルタスク、恵比寿はマルチタスクに適するということを見出されたようです。実は定常的な事務作業などは都内でのほうが効率的で、地方では、企画や経営判断といったシングルタスクに向いているということをお聞きしました。</div>
<div>
<p><a href="/uploads-archive/2015/10/IMG_20151021_075258.jpg"><img decoding="async" loading="lazy" class="aligncenter size-medium wp-image-8327" src="/uploads-archive/2015/10/IMG_20151021_075258-300x225.jpg" alt="IMG_20151021_075258" width="300" height="225" srcset="/uploads-archive/2015/10/IMG_20151021_075258-300x225.jpg 300w, /uploads-archive/2015/10/IMG_20151021_075258-1024x768.jpg 1024w, /uploads-archive/2015/10/IMG_20151021_075258-228x171.jpg 228w, /uploads-archive/2015/10/IMG_20151021_075258.jpg 1283w" sizes="(max-width: 300px) 100vw, 300px" /></a></p>
<p>コワーキングスペースのコンプレックス。</p>
<p>&nbsp;</p>
<p><a href="/uploads-archive/2015/10/IMG_20151021_173322.jpg"><img decoding="async" loading="lazy" class="aligncenter size-medium wp-image-8328" src="/uploads-archive/2015/10/IMG_20151021_173322-225x300.jpg" alt="IMG_20151021_173322" width="225" height="300" srcset="/uploads-archive/2015/10/IMG_20151021_173322-225x300.jpg 225w, /uploads-archive/2015/10/IMG_20151021_173322-228x304.jpg 228w, /uploads-archive/2015/10/IMG_20151021_173322.jpg 722w" sizes="(max-width: 225px) 100vw, 225px" /></a></p>
<p>中には12社の企業が現在籍を置いており、シェアスペースも多数完備されています。</p>
<p>コンプレックスに関する記事は下記を参照下さい。</p>
<p><a href="http://www.hinagata-mag.com/comehere/3746" target="_blank">http://www.hinagata-mag.com/comehere/3746</a></p>
</div>
<div><a href="/uploads-archive/2015/10/IMG_20151021_075113.jpg"><img decoding="async" loading="lazy" class="aligncenter size-medium wp-image-8337" src="/uploads-archive/2015/10/IMG_20151021_075113-300x225.jpg" alt="IMG_20151021_075113" width="300" height="225" srcset="/uploads-archive/2015/10/IMG_20151021_075113-300x225.jpg 300w, /uploads-archive/2015/10/IMG_20151021_075113-1024x768.jpg 1024w, /uploads-archive/2015/10/IMG_20151021_075113-228x171.jpg 228w, /uploads-archive/2015/10/IMG_20151021_075113.jpg 1283w" sizes="(max-width: 300px) 100vw, 300px" /></a></div>
<div>泊まっているは<a href="http://www.week-kamiyama.jp/" target="_blank">week</a>というサテライトオフィス在住者向けに2015年7月に新築された宿泊施設です。</div>
<div>写真の母屋は元々が古民家です。</div>
<div>経営はえんがわオフィスと同じくプラットイーズの隅田さんがされております。</div>
<div></div>
<div>夜は、宿泊者と神山在住の方も呼んでの食事会となりました。</div>
<div>みなさん本当に温かくて、初めての方がいてもとんでもなくフレンドリーに接してくれます。</div>
<div>この来る者は拒まずの醸成された空気感が神山を好きになる大きな要因の一つだと強く感じました。</div>
<div>そんな神山に魅せられて移住された方がさらに、その空気感を増幅させて、とてもよいポジティブフィードバックを形成しているように感じました。</div>
<div></div>
<div>移住者の一人の寺田さんもものすごく面白い方で、最終日に自宅も見させて頂きましたが、山の上の古民家を今も改装されながら住まわれていました。</div>
<div><a href="http://www.itmedia.co.jp/bizid/articles/1411/21/news022_2.html" target="_blank">http://www.itmedia.co.jp/bizid/articles/1411/21/news022_2.html</a></div>
<div></div>
<div>こちらの記事にある民家です。</div>
<div></div>
<div></div>
<div>以上で非常に濃厚な一日を過ごさせて頂き、 神山の凝縮された部分を堪能することが出来ました。</div>
<div></div>
<div>そして、驚くべきは、すごくコンパクトにまとまっているところです。</div>
<div>聞くところによると4km圏内にまとまっているようです。</div>
<h2>まとめ</h2>
<div>ご一緒させて頂いた会社の代表の方も初めて来たのは3年前の9月。</div>
<div>すごいスピードで進めているようでも、その中での十分な検討時間、醸成のための期間。行動を起こすタイミング、動機付けといったところをしっかり見極めて次の一歩にしたいです。</div>
<div></div>
<div>私にとっては、これが考えるきっかけとなりました。</div>
<div></div>
<div>本当に貴重な経験と時間を共有させて頂きました。</div>
<div>心より感謝致します。</div>
<p>&nbsp;</p>


2015年10月神山町視察レポート

<p>フォントがわからない時、例えば似てるフォント使っといてと言われたときや自分で作ったのに何のフォントを使ったか思い出せないという時があると思う。</p>
<p>そんな時の対処法を2点</p>
<h2>WhatTheFont</h2>
<p><a href="http://www.myfonts.com/WhatTheFont/" target="_blank">http://www.myfonts.com/WhatTheFont/</a></p>
<p><a href="/uploads-archive/2015/10/launchcart.jpg"><img decoding="async" loading="lazy" class="alignnone size-full wp-image-8317" src="/uploads-archive/2015/10/launchcart.jpg" alt="launchcart" width="500" height="100" srcset="/uploads-archive/2015/10/launchcart.jpg 500w, /uploads-archive/2015/10/launchcart-300x60.jpg 300w, /uploads-archive/2015/10/launchcart-228x46.jpg 228w" sizes="(max-width: 500px) 100vw, 500px" /></a><br />
まずはフォントを調べたい画像を用意する</p>
<p><a href="/uploads-archive/2015/10/2.png"><img decoding="async" loading="lazy" class="alignnone size-full wp-image-8318" src="/uploads-archive/2015/10/2.png" alt="2" width="656" height="374" srcset="/uploads-archive/2015/10/2.png 656w, /uploads-archive/2015/10/2-300x171.png 300w, /uploads-archive/2015/10/2-228x130.png 228w" sizes="(max-width: 656px) 100vw, 656px" /></a><br />
それを選択してアップロード<br />
Continueをクリック</p>
<p><a href="/uploads-archive/2015/10/3.png"><img decoding="async" loading="lazy" class="alignnone size-full wp-image-8319" src="/uploads-archive/2015/10/3.png" alt="3" width="656" height="575" srcset="/uploads-archive/2015/10/3.png 656w, /uploads-archive/2015/10/3-300x263.png 300w, /uploads-archive/2015/10/3-228x200.png 228w" sizes="(max-width: 656px) 100vw, 656px" /></a><br />
するとシステムで解析、判断したそれぞれの文字が出てくる。<br />
空欄であれば何の文字かを、間違っていれば修正してContinueをクリック</p>
<p><a href="/uploads-archive/2015/10/4.png"><img decoding="async" loading="lazy" class="alignnone size-full wp-image-8320" src="/uploads-archive/2015/10/4.png" alt="4" width="656" height="558" srcset="/uploads-archive/2015/10/4.png 656w, /uploads-archive/2015/10/4-300x255.png 300w, /uploads-archive/2015/10/4-228x194.png 228w" sizes="(max-width: 656px) 100vw, 656px" /></a><br />
15件も近しいフォントがマッチした<br />
実際にはSteinerというフォントだったのだが、この中に正解は無かった<br />
ただ、似ているフォントを探すという意味ではすごく有用だと思われる</p>
<p>ただ、難点としては日本語フォントに対応していないということ</p>
<p>残念ながら日本語フォントに対応している類似のサイトは見つからず<br />
identifontというサービスを使うのが良さそう</p>
<h2>Identifont</h2>
<p><a href="http://www.identifont.jp/" target="_blank">http://www.identifont.jp/</a></p>
<p>形状別、名称別、スタイル別などでフォントを手動で検索できる</p>
<p>冒頭のようなケースでは形状別が良さそうだ</p>
<p><a href="/uploads-archive/2015/10/51.jpg"><img decoding="async" loading="lazy" class="alignnone size-full wp-image-8321" src="/uploads-archive/2015/10/51.jpg" alt="5" width="300" height="300" srcset="/uploads-archive/2015/10/51.jpg 300w, /uploads-archive/2015/10/51-150x150.jpg 150w, /uploads-archive/2015/10/51-228x228.jpg 228w" sizes="(max-width: 300px) 100vw, 300px" /></a><br />
小塚ゴシック で試してみた</p>
<p><a href="/uploads-archive/2015/10/6.jpg"><img decoding="async" loading="lazy" class="alignnone size-full wp-image-8322" src="/uploads-archive/2015/10/6.jpg" alt="6" width="656" height="2172" srcset="/uploads-archive/2015/10/6.jpg 656w, /uploads-archive/2015/10/6-91x300.jpg 91w, /uploads-archive/2015/10/6-309x1024.jpg 309w, /uploads-archive/2015/10/6-228x755.jpg 228w" sizes="(max-width: 656px) 100vw, 656px" /></a></p>
<p>正解！</p>
<p>ただ、あまりメジャーではないフォントは対応していないようだ</p>


Company

Our Solutions

Support

News

Blog

Blogブログ

カテゴリーから探す

年別から見る

記事一覧 - 2015年

2015/11/18

2015/11/18

2015/11/18

2015/11/17

2015/11/17

2015/11/17

2015/11/11

2015/11/11

2015/11/11

2015/11/11

2015/11/11

2015/11/06

2015/10/28

2015/10/28

2015/10/28

2015/10/28

2015/10/27

2015/10/23