たとえば、はてなでブックマークしたものと、Googleリーダーでスターつけたもの、TwitterでふぁぼったTweet。これら全部evernoteに突っ込んでおけば、後で参照したい時にevernoteを探せば済むだけになるのでとても楽ちんだ。しかも、evernoteにはページ全文をクリップしておける。
（evernoteという会社自体の永続性とかセキュリティとかの問題はあるんだけれども、そこはひとまずボクは信じておくことにした。あまり細かいことを考えだすと、結局、どんなサービスも使えなくなるし）

何がどう設定していたかさっぱりわからなくなってしまうので、一度、整理しておこうと思う。

■はてなブックマークすると、ブックマーク元のページ全文ごとevernoteにクリップする。
hatebteを利用。
iPhoneだろうが、iPadだろうが、はてBさえすれば、evernoteにページ全文ごとクリップされる。
けっこう便利。検索の時用にタグに「hatenab」をつけるようにしてる。
iPadやiPhoneではてなブックマークを見ることが多いので、その場合は気になった記事は基本ブックマークしておく。そうすれば、記事全文がevernoteにもクリップされるので、後々探しやすくなる。

■1日分のTweetを時系列にまとめて1ノートとしてevetnoteへクリップ。
これはどちらかというと保管用。
ツイエバ – TwitterをEvernoteへ
これを使ってevernoteのアドレスに転送をかけて保存。タグは「twieve」。
「ふぁぼった」ものもまとめられてるのが嬉しい。

以前は、twtr2srcを利用していた。
シンプルなテキストで保存しておきたいのなら、twtr2srcでも充分かもしれない。

自動連携動作といえばiftttだ。iftttで設定しているタスク類をまとめる。

■iftttで設定しているタスク

以下はすべて、evernoteへの自動クリップの設定。

• forsquereでのチェックイン
• Googleリーダーでのスター
• Readabilityへの登録
• flickrに写真をアップロード
• gmailでスターをつけたメール（条件：is:starred ）
• Twitterでスター
• Facebookでの投稿（Title:{{UpdatedAt}}／Body:{{Message}})

Googleリーダーからevernoteへキレイにクリップするために
もともとはiftttで、トリガーをGoogleリーダーのスター。アクションでそのままevernoteを指定していたのだが、これだとテキスト情報のみがクリップされてしまい読みにくい。

色々試行錯誤した結果、一番楽でキレイで、今のところ満足してるのが、次の方法だ。
iftttを使うことには変わりないのだが、Googleリーダーのスターで、Gmailを使ってevernoteに記事をメールで送る、という設定にするのがみそ。直接evernoteへクリップするより、こちらのほうがキレイにクリップできる。

ifttt / 全文記事を、EvernoteへGMailを使って送る
このタスクをほぼそのまま使わせてもらってる。

このタスク設定だと、Googleリーダーでスターをつければ、その記事がそのままのレイアウトでevernoteの所定ノートにクリップされるようになる。
もちろん、GoogleリーダーのRSS自体は、まるごとRSSなどを使って、基本全文化したフィードになっていることが前提だ。（これは、Googleリーダーで管理しているRSSフィードをOPMLでダウンロードして、フィードURLを全文RSSのURLを通したURLに一括置換（xmlUrl=”http://」を「xmlUrl=”http://mrss.dokoda.jp/a/http/ に置換）してからアップロードしてしまえば、全部まるごとRSS通しになる）

■gmailのフィルター設定
プライベートのgmailでは、有料のメルマガに関しては、フィルター設定でevernoteに転送する仕様にしてる。
mag2で購読しているいくつかの有料メルマガに関しては、IDでフィルターをかけて、そのままevernoteのメールアドレスに転送している。

■blogtrottrによる連携方法（今はあまり使わず）
tumblrやflickrなどからevernoteへの連携は、かつてはblogtrottrを使ってた。blogtrottrは、RSS出力をメールで飛ばせるサービス。flickrやtumblrのRSSを指定して、あとはevernoteの専用アドレスを送り先に指定しておけばＯＫというお手軽さ。
もともとGoogleリーダーに共有機能があった時は、「共有」したものをblogtrottrでevernoteに送信（「共有」時にコメントをつけたら、同時にTweet）というようなフローを組んでいたのだけど、Google+の登場で共有機能がなくなってしまって、その方法が機能しなくなった。flickrやTumblrはそのままでもよかったのかもしれないが、どうせならと、可能なものはiftttの方に移行させたというわけだ。

evernoteへのクリップ連携は以上だ。
他、ついでなので、色々連携させているものもメモがてら記載しておく。

■ブログからtwitterに投稿する。
Wordpressのプラグイン「WordTwit」を利用。
bit.lyのAPIキーの設定をしている。
投稿フォーマットは「ブログ更新→ [title] – [link]」とシンプルなものに。

ブログからFacebookへの投稿。
現状は、RSS Graffitiを使ってるが、attripによるとそれはあんまり良くないようなので、そのうち変えてみようと思う。ブログのOGP設定とかもやりたいなーと思ってる。

インポートフォルダー機能。使い出すとあまりにも便利で欠かせなくなる。
インポートフォルダー機能とは、PC上の任意のフォルダに入れたものをすべて自動でevernoteにアップしてしまう機能だ。
え、それってdropboxでやればいいんじゃないの、という人もいるかもしれないけど、dropboxでは、PDFなどのドキュメント内のテキストなどを検索したりはできない。もちろん下にdropboxと組み合わせて使う方法を説明しているけど、両方組み合わせるとより便利さがますのでオススメだ。

●フォルダーに入れるだけでevernoteにクリップ

ツール > インポータントフォルダ

「追加」ボタンで、PC上の任意のフォルダを指定。

サブフォルダも対象にするのか
どのノートブックに追加するか、

などの設定を行うだけ。

ボクはこれをネット上で拾ったデータや資料類を放り込んでおくところにしてる。

例えば、気になる商品のサービス資料がpdfなどであがってたら、それをそんまま、先のインポートフォルダで設定してるフォルダにダウンロードする。それだけで、自動でevernoteの指定のノートブックにその資料が追加される。

slideshareなどで、提供されてる資料でダウンロードOKなものは、たいていそうやって保存するようにしてる。かつてはこういう資料類の管理にけっこう頭を悩ましてたけど、この方法をとるようになってから楽になった。検索もできるのであの資料どこだっけ？と探しまわることも少なくなった。

●Dropboxと組み合わせて使うのもGOOD

Dropboxに任意のフォルダ作っておいて、それをインポートフォルダに指定しておくこともできる。
ショートカットをPCの任意の場所に置いておけば、そこに放りこめば、dropboxとevernoteに同時に保存される。

Dropboxが便利なのは、iPhoneなどのGoodReaderと連携することが容易なこと。
iPhoneでevetnoteに保存してるPDFファイルを直接閲覧したりするのは、けっこう重いので、そういう場合はボクは、GoodReaderを利用する。GoodReaderであれば、PDFに書き込みしたり、テキストだけ抜粋して読んだりと色々できるしね。

Dropboxでファイル開いて、GoodReaderに移行させておけば、スマホ環境でのPDFファイル閲覧もかなり楽になる。
GoodReaderから直接、evernoteにあるPDFを開くこともできるみたいではあるけど、ちょっと面倒くさいので、Draopbox経由のほうが手っ取り早い。

javariは、365日送料無料の返品が可能というのが最大のウリなんだろうか。
他の靴の通販でも返品無料のところは多いが、365日という期間はここぐらいだろう。とはいっても、返品OKなのは、室内での試し履きレベルまで。当たり前だけど実際に使用してしまったものは対象外だ。また商品についてるタグだとかシール、梱包材とか、そういうもの届いた時のままで返品しなければならないので、返品するかもということを前提に慎重に封を開けたほうがいいかもしれない。

使ってみてひじょーに驚いたのは、配送・返金処理の早さだ。Amazonでもそうなのだが、とにかく注文してから商品の到着が早い。もう翌日到着がディフォルトみたいな感じだろうか。今回は1度返品したので、合計2回注文をしてるのだけれど、どちらも注文翌日に商品が届いた。
さらに驚いたのは返金処理のスピードだ。翌日配送なら、最近はけっこう対応するところが増えてきたように思えるけど、さすがに返品・返金処理まで早いというのはあまり聞かない。
javariのページには、返品処理については、「お客様から返送された商品を受領しだい、担当部署にて返金処理を行います。返金処理が完了するまでには、商品を受領してから通常7～14営業日のお時間がかかります。返金処理が完了しましたら、Eメールでお知らせします。」と記載されていたけれど、実際にはコンビニで返品手続きをした、その翌日には、返金処理のメールが届いた。あまりの早さにたまげた。

これだけ返金処理が早いのであれば、サイズや色やフィット感が気になる人でも、とりあえず何足か買ってしまって、気にいらなければ返品してしまえばいい。そんな買い方が出来る。ただし、気を付けないといけないのは、カードでの購入じゃないと現金の返金がないということ。

Screencast-O-Matic – Free online screen recorder for instant screen capture video sharing.

このサービス。無料で、しかも何の会員登録なども必要もせずに、任意のデスクトップ領域を動画キャプチャできる。
キャプチャした動画は、そのままYouTubeにアップすることもできるし、MP4でダウンロードすることもできる。
年間$12の有料版だと、編集ツールやネットにつながってない状態でも使えたりと、色々便利な機能やオプションがあるが、無償版でも十分使えるものだ。

今回、このサービスとYouTubeを組み合わせて、以下のような自社サービスの操作マニュアルを作ってみた。動画はScreencast-O-Maticでキャプチャし、それをYouTubeにアップ。動画の中で時折でてくるコメントはYouTubeの管理機能を使ってつけている。この画面サイズだと小さくてわかりにくいけれども、フル画面で見るとアノテーションもちゃんと認識できると思う。
（変な音楽がついてるが、これもYouTubeの機能でつけたもの。実は、Screencast-O-Maticで動画をとった際に、間違ってPCのマイクがONになってて、操作してる際の音まで拾ってしまった。咳払いの音や、他のスタッフの声なども多少入ってて、あまりよろしくないので、無理矢理音楽を入れたという理由だ。）

■Screencast-O-Maticの使い方

使い方はごく簡単。「Start Recording」ボタンをクリックする。

Javaアプレットのプラグインのインストールを許可する。
あとは、キャプチャしたい範囲を指定して、左下部に表示されるプレイヤーで録画ボタンをクリックすればいいだけ。
(下の点線みたいなのが録画範囲。この範囲を自由に変更できる。）

今回、shutto用の利用方法の動画をいくつか作ってみたのだが、あらかじめどんな操作をするのかを事前練習しておけば、非常に簡単に操作ムービーを作ることができた。

■動画へのキャプションをつける
Screencast-O-Maticの無料版ではキャプションや動画の編集機能はない。
しかし、これもちょっとしたキャプションや編集ぐらいならば、YouTubeの管理機能でもなんとかなる。
（ただ、これはMP4形式の動画で保存して、iMovieなどで加工するほうがよほど簡単だけど。ただ、すべてブラウザだけで作業が完結できるというのもこれはこれでどんな環境でも作業できるので便利だ。）

YouTubeの管理機能にはこんな風に「動画加工ツール」「アノテーション」「字幕」などのメニューがある。
動画加工ツールでは、画面の色の補正や、カメラのブレの補正などができる他、動画の「開始」「終了」を調整する「カット」機能などもある。

YouTubeの管理画面にあるアノテーション機能。動画のタイムラインにそって、コメントや注釈を入れていけるようになってる。上に動画が表示され、下部にはタイムラインと、その動画に付与してるアノテーションが表示される。
アノテーションの位置を動かしたりすることで、どのタイミングでどのアノテーションを表示させるかの調整ができる。

「アノテーションの追加」というメニューから追加したいアノテーションを選ぶだけ。
タイムラインに配置されたアノテーションは後で自由に表示時間などの変更もできる。

さっきの１本の動画をつくるのにだいたい15分ぐらいの時間がかかった。
慣れるともう少し早くできるようになりそうだけれども、それでもかつてデスクトップの操作動画を取って、そこに説明を入れたりということにかかった時間に較べれば、ほんとに簡単にそして楽にこういうものが作れるようになった。

ちなみに、shuttoがどういうものかというのは、こちらのエントリー（PCサイトを簡単にスマホサイトに変換できる「shutto」 | papativa.jp）を見て頂けると幸いです。

■電話番号、メールアドレスのリンクを設定
スマートフォンサイトであれば、ガラケーと同じくページからダイレクトに電話をしてもらう／電話ができるというのは、機能としては必須でしょう。飲食店や美容院などのサイトなどでは重宝されるのではないかと思うちょっとした機能がこれです。
右側に表示されているのが、弊社の別サービス「さぶみっと！携帯メール配信」のサイトのトップページです。
この右上にお問い合わせ電話番号の画像があります。
これと同じものをスマートフォンページにも設定し、且つ、スマートフォンではこの画像をクリックした場合に直接電話ができるようにします。

手順はいたって簡単です。
（１）電話番号を設定したい画像をドラッグ＆ドロップ。
（２）その画像にリンク設定。URLのところに「tel:」と書いて、
そのまま電話番号を書けばOK。（電話番号は、ハイフンが入っててもなくても大丈夫です）
同じように、URLに「mailto:」と書いて、メールアドレスを記載すれば、メールリンクになります。

■繰り返し要素の簡単設定
ページ内で同じ要素の繰り返しがある場合です。
会社ページなどによくある新着情報やニュース、トピックスなどの見出しを変換する時に大変便利な方法です。

下の動画で変換しようとしてる「インフォメーション」のエリアですが、これは、<ul><li>の要素で繰り返されています。こういうものであればshutto側でも容易に変換設定ができます。

繰り返したい要素を持ってきて、右クリックで「繰り返し」から、繰り返したい要素を選べばOKです。

■繰り返し要素の応用／画像の周り込み設定
HTMLの構造上、同じ要素で繰り返されてるものであれば、これはどんなものでも使えるので例えば、下記の動画のような、メニューの一括変換のようなものも可能です。
また、shuttoでは、このような繰り返し要素の何番目から何番目までを表示というように、スマートフォン側で表示させる場合の個数や範囲に制限をかけることもできます。また、この動画の中でやってるますが、ちゃんと「画像の周り込み」などの設定もできます。これもうまく使うと表現の幅もぐっと広がると思います。

■HTML構造保持とCSS設定
これも覚えるとかなり便利な機能です。WEB制作に従事している方、HTMLやCSSが多少解る人であれば、この機能をうまく使えば、スマートフォンページでも凝った表現も可能になります。簡単に言ってしまえば、PCページの構造をそのままスマートフォン側でも保持した形で変換できます。そこでさらにCSS設定の機能を使えば、各要素にスマートフォン用の表現を設定できます。この動画の例では、弊社のこのページ（[サイト構築実績]アールシーコア様　BESS 拠点サイトフルリニューアル | 株式会社イー･エージェンシーの実績紹介）をスマートフォンページに変換しています。

そのまま要素をドラッグ＆ドロップで持ってきただけでは、素のテキストだけになってしまうので、「構造を保持する」にチェックを入れることで、PCと同じHTML変換機能構造がスマートフォンページにも反映されます。
この状態で、HTMLの要素に対してCSSの設定を行うことで見た目を調整していくのです。

■TwitterやFacebookのボタンの変換
shuttoでは、twitterのtweetボタンや、Facebookのいいねボタンに対応してます。
変換はいたって簡単です。shutto画面で見ると、PCページでボタンで表示されている部分がテキストで表示されています。この要素をそのままスマホ画面にドラッグ＆ドロップするだけです。

なお、twitterやfacebookから提供されてるコードで実装されてるボタンにのみ適応が可能なので、たとえば、ソーシャルメディア関連のボタンをまとめて実装できるようなスクリプトなどを使って実装されてる場合には、対応することができません。

■shut to変換パートナーの募集
あと、現状、shuttoでの変換作業をおこなって頂ける制作会社さん、パートナーを大大募集してます。
簡単スマホ変換とはうたっていますが、お客さまからは変換作業をお願いしたい、というご依頼を現時点でも多数いただいております。残念ながら弊社では現状、変換作業自体はお受けできないので、ご協力頂けるパートナーさんをご紹介させていただきたいと考えてます。変換作業費などについては、パートナーさん側で自由に設定頂いて構いません。
shuttoをうまく使いこなして、効率良くスマートフォンサイトの構築をおこなって頂き、パートナーさんのビジネスにしていただきたいと思ってます。詳しくはこちらからよろしくお願いします。

簡単スマホ変換ツール「shutto」変換パートナー募集 | さぶみっと！JAPAN