写真の埋め込みはDropbox共有フォルダーで。ついでに地図はGoogle Static Maps APIで。

「モバイルファースト」などと言われて久しくなりましたが、確かに自分のblogでもこの流れを強く感じます。アクセス解析などを見ても、いまやスマホからのアクセスのほうが多いです。

そんなスマホ重視の対策として、最近、徐々に始めているのが「写真の埋め込む際、リンクを貼らない」ということです。リンクを貼らない=画像のソースのウェブサイトを開かせないという意味です。

例えば（まだ書き途中ですが）「奈良マラソン2014」のシリーズの写真には、リンクが貼られていません。

なぜリンクを貼らないようにしたのか。それは、

「スマホでの閲覧時、ただスクロールさせたかったにも関わらず、つい写真をタップしてしまった結果、画像のソースのサイトが開いてしまう」

という現象を防ぐためです。これ、すごくうっとおしくないですか？

対策はすごくシンプルです。手でhtmlタグを書くことにはなりますが、imgタグをちょっと書くだけです。

[php]

[/php]

widthはオプションなので、元画像の幅サイズが500px以下であれば省略できます。

ここで今さらながらふと気がついてしまったのですが、単にimgタグだけを使って画像を埋め込むだけならば、わざわざPicasaを利用する必要はないのではと思いました。

そもそもなぜ写真埋め込みにPicasaを利用していたのかは、オンラインストレージとしての役割、そして埋め込む際のhtmlコードを簡単に貼り付けることができたこと、こうした背景がありました。

ちなみに僕は、PicasaとFlickrを使っています。旅行中、一眼レフで撮影し、RAW現像した写真はflickrに、日常的に撮影した写真やスクリーンショットなどはPicasaに、という使い分けをしていました。

flickrについては、以前ほどの勢いはなくなったとはいえ、これはこれで価値のあるサイトですから、継続するつもり、一方、Picasaに関しては、正直もうどうでもよく、かなり前から移行したいと思い続けてきたので、今後は基本的に利用しないようにします。

前置きが長くなってしまいました。やっと本題です。

以上を踏まえて、今後は「Dropboxの共有フォルダーを利用」して、投稿に写真を埋め込もうと思います。

Public フォルダの用途 https://www.dropbox.com/ja/help/16

上記ヘルプサイトには、このように書かれていますが：

Public以下に置いてあるファイルの場合、普通に右クリックしても「公開リンクをコピー」することができました。

もっともわざわざ公開リンクをコピーしなくても、所定のフォルダーを指定しておけば、一番最後のファイル名さえ変えるだけで自在に写真を埋め込めるというわけです。

例えば、このように書いておけば、

[php]

[/php]

このように表示されれます。

もちろん画像にはリンクを貼っていませんので、うっかりタップして元画像のサイトが開くようなことは起こりません。

地図の埋め込みについても同様のことが言えます。普通のGoogle Maps APIですと、スマホで見ている場合、スクロールしたいのに地図が動いたり、大きさが変わったりと面倒なことが多いです。

そこでこれからは、Google Static Maps APIを積極的に利用することにします。

このようなGoogle Mapを「画像」として使いたい場合は、

このようにします。

[php]

[/php]

これで、少しはスマホでも見やすくなるのではないかと思っています。