ボックスの描画とドロップシャドウ。
月別アーカイブ: 2013年1月
HTML5のCanvasを埋め込み、Javascriptを動かす
以下のページを参考に、テーマを少し編集して、HTMLをそのまま埋められるようにしました。
埋め込んだHTMLにcanvas要素とscript要素を記述しています。
canvas要素が表示できるブラウザでは、四角が表示されます。
HTML5の要素が使えるかどうかを調べる
HTML5で、様々な機能が追加されているが、どのブラウザで利用できるかなかなかわからない。
以下のサイトが、便利だったのでメモしておきます。
Can I use… Support tables for HTML5, CSS3, etc
HTML5の機能の要素ごとに、各ブラウザのそれぞれのバージョンでサポートされているかが、表で一目でわかります。
また、検索機能もしっかりしていて、インクリメントサーチもしてくれるので、目的の要素を容易に見つけることができます。
safariで閲覧中の単語の意味を調べる方法
safariで閲覧中に、単語を調べたいときの方法は、以下の2つがあるようです。
マウス上に手がある場合は、方法2の方が素早く調べられそうです。
方法1
(1) 調べたい単語の上にマウスカーソルを合わせる。
(2) Command+Shift+Dキーを押す。
方法2
(1) 調べたい単語の上にマウスカーソルを合わせて、右クリックする。
(2) すると、単語が選択状態になり、ポップアップメニューが表示される。
(3) メニューから「調べる」を選択する。
PDFをKindleに入れるとき、余白を調整する方法
PDFをKindleやiPhoneでみる場合、デバイスサイズが小さいので、外側の余白(マージン)が邪魔になります。
Macのプレビュー.appで、簡単にトリミングできました。
自炊本の余白をサクっと切り取っちゃおう (Mac) | Azrael
画像しかトリミングができないと思い込んでいました。
PDFに対して、しかも、全ページに一括反映できるんですね。
Kindleに入れても問題なくみれました。
Information Graphics
情報を視覚的に表現し、わかる!、伝わる!を実現する。
Information Graphicsのサイトを調査した。
経産省の投稿サイトツタグラ(伝わるINFOGRAPHICS)
などほど、経産省にはたくさんの情報(データ)があるけど、読み解くのには専門的な視点や労力が必要。それらの情報の要点がINFOGRAPHICSとして表現されれば、みんなに伝わる。
みんなが日本について理解する一歩になりますね。
テーマに対する投稿サイトなので、いろんな視点、伝え方のバリエーションを見ることができます。
テーマがあるので、INFOGRAPHICSを初めてみる足がかりになりそうです。
インフォグラフィックスをキーワードに、情報をわかりやすく伝えるデザインを提供している会社。木村博之さんが代表。
たくさんの事例が上記サイトに掲載されているの、とても参考になる。
インフォグラフィックを共有して世界に「伝える」投稿型サイト。
はじめてでも作れる、インフォグラフィックス | ツタグラ ワークショップ レポート
ここをみると、どんな考え方か、わかります。
日本におけるINFOGRAPHICSは、まだ、広く普及はしていないようです
しかし、上記のような広める活動もみられました。
他に参考になるサイト
Mac テキスト編集 ショートカットキー
少しでも早く編集できるようにするには、キーボードショートカットの活用が不可欠。便利です。
command + ↑ : ドキュメントの最初に移動
command + ↓ : ドキュメントの最後に移動
command + ← : 行頭に移動
command + → : 行末に移動
option + ↑ : 上の行に移動(カーソルは行頭)
option + ↓ : 下の行に移動(カーソルは行末)
option + → : 単語の最後に移動(単語単位で移動)
option + ← : 単語の最初に移動(単語単位で移動)
option + shift + → : 右の単語を選択
option + shift + ← : 左の単語を選択
option + delete + ← : 左の単語を削除
control + f : 右に移動
control + b : 左に移動
control + n : 下に移動
control + p : 上に移動
control + a : 行頭に移動
control + e : 行末に移動
control + d : 右を削除
control + h : 左を削除
control + k : 行末まで削除
contral + y : ↑で削除したものを貼付け(クリップボードは使わない)
control + o : カーソルの右側で改行(カーソルはそのまま)
control + l : カーソル行を画面の中央にする
control + v : ドキュメントの最後に移動
Kindle Paperwhiteに、Web記事やドキュメントを送る
Kindle Paperwhiteとの連携
はじめに
Kindle Paperwhiteは、目に優しく、紙のように読め、長時間読んでも疲れにくいE Inkディスプレイをアピールしています。
このKindleで、あとで読みたいWeb記事や、ドキュメント類を、読むためのフローをまとめました。
課題
- 読みやすい文字サイズで表示されるようにすること。
- 容易な手順で、Kindleにドキュメントを追加できること。
実現方法
容易にKindleにドキュメントを送る手段としてAmazonが配布している“Send To Kindle”を利用した。これにより、“Send To Kindle”という仮想プリンタに印刷するだけで、Kindleに送ることができる。
- メール経由やUSBで直接も可能だが、前者は到達までのレスポンスが悪いこと(体感ですが)、後者は、その都度USBで接続する必要があるため採用しなかった
文字サイズに関しては、Kindleフォーマットでドキュメントを投入できれば、フォントサイズを容易に変更できるが、そのための有効な手順が見つからなかった。
- PDFからKindleフォーマットへの変換機能をAmazonが提供しているが、
レイアウトが崩れたり、欠落するために、この機能は利用しないことにした。
このため、B6サイズ(128mm×182mm)のPDFにフォーマットして、kindleに送ることにした。(ピクセルを実サイズにどう結びつけるかの問題なので、個々がもっとも見やすい用紙サイズを選べばよいと思います。)
ドキュメントはHTML形式にし、印刷はブラウザ(Safari)で行うことにした。
これにより、CSSの設定で外枠マージンをB6サイズに合わせて小さく調整可能であり、また、用紙サイズに応じて、レイアウトしてくれる。
- B6サイズに印刷しようとすると、大概のアプリは外枠のマージンが大きくなりすぎます。おそらくA4サイズに最適なマージンになっているためだと思われます。また、アプリによっては、縮小されるだけの場合もあります。
連携フロー図
Markdownはじめました
はじめに
Pages、Evernoteなどを利用してきたけど、手軽さがない、UIが使いにくいなどで、Markdwonで、しばらく運用してみることにした。
利用ツール
Webを見て回った結果、以下のツールに落ち着いた。
- 編集:CotEditor + カラーリング + プレビュースクリプト
- プレビュー:Marked
以下のブログの記事が、最も納得感があり、参考になりました。
自分も、最初「MOU」でMarkdownを始めました。
ただ、しばらく使っていると、変換前と変換後の2画面が表示されていることに、煩わしさを感じCotEditor+Makedに落ち着きました。