自前で逆ジオコーディングをやってみる

概要

住所から地図上の位置情報(緯度、経度)を求めることをジオコーディング、その逆に地図上の位置情報から住所を求めることを逆ジオコーディング(リバース ジオコーディング)というらしい。

そんな面倒な処理は、普通Google Geocoding APIなんかの外部のサービスを利用すればよいのだけど、そういうのが使えない状況ってのがたまにある。さてどうするかというのが今回の問題。

結果としては、国土交通省が位置参照情報ダウンロードサービスで提供している街区レベル位置参照情報を使って自前で準備する。後は良しなに。もちろんいろいろな制約もある。

参考にしたのは以下
逆ジオコーディング 緯度経度から住所へ変換する
ジオコーディングと逆ジオコーディングをする方法(Google Geocoding APIの使い方)
OpenStreetMapでジオコーディング †
各種ジオコーディングapiの罠と対処法

特に制約なく使えそうなものとしてOpenStreetMapNominatimというジオコーディングのWebAPIもあるが、あれはちょっと違う。どうも近くの通りの名前をベースに引いてくるらしいので、日本的な住所を調べるには少し方向が違う。

やってみる

まずは、なにはなくとも街区レベル位置参照情報位置参照情報ダウンロードサービスからダウンロードする。例えば、都道府県単位を選択し、ダウンロードしたいところを選択、そのうち「街区」レベルにチェックを入れてダウンロード。

福岡県の場合、だいたい3.5MB程度のzipファイルがダウンロードされるはず。重要なのは中にあるcsvファイル。展開するとだいたい24MBくらい。中身は後述の様なフィールドに分かれている。重要なのは住所に関する項目と緯度経度。それ以外のフィールドは必要に応じて利用する。これらのフィールドをDBなどに格納して検索すれば良い。

もっとも近い住所を取得したいので、SQL的には例えば以下の様なものになる。

SELECT *, ( abs(緯度1 - 緯度2) + abs(経度1 - 経度2)) as d
FROM locations
ORDER BY d ASC LIMIT 1;

逆に、住所から位置情報を取得したい(ジオコーディング)場合は逆に引けばいい。ただし、街区レベル位置参照情報の住所の正規化みたいな話はしておかないと中々満足な結果は出ないかも。とは言っても今回は特に必要ないのであまり考えない。

結果と感想

簡単に作って試してみたところ、おおむね位置情報から住所を取得できるようになった。もちろん正確な住所のエリアを持っているわけではないため、それぞれに単純に一番近い住所を引っ張ってきている。

なので、変則的な形をしている町丁目だったり、複数の間に位置するような地点だと若干のズレが確認できる。このズレが許容できるかどうかは個別に判断するべきこと。

とは言っても元ネタになるデータの問題でもあるので、より細かい情報があれば改善できるだろう。どっかにあれば良いのだけど。

また、データの更新についても自前で準備するものである以上自分でやる必要がある。そうそう変わるものではないと思うが、ある程度考えておかないと「は?」って結果が出てきそうな感じ。

日本全国でやろうとすると検索速度なんかも問題になってくるがその辺はDBの問題なので今は考えない。急ぐならPostgreSQL+PostGISとか使うと良いんじゃないかな。海外についても今は考えない。簡単に単純にやろう。

ちなみになにも考えずに以下の様なテーブルを作ってSqlite3にぶち込んだら25MB程度になった。もとのCSVがそのくらいの容量なのでそんなもんかな。都道府県名や住所の正規化をせずにそのまま文字列で放り込んでいるので、そんなもんと言われればそんなもんなのかもしれない。

CREATE TABLE "locations" (
`都道府県名`   TEXT,
`市区町村名`   TEXT,
`大字・町丁目名` TEXT,
`緯度`    REAL,
`経度`    REAL
)

街区レベル位置参照情報のデータ項目

項目 備考
都道府県名
市区町村名 郡部は郡名、政令指定都市の区名も含む。
大字・町丁目名 町丁目の数字は漢数字
街区符号・地番 原則として半角整数(一部漢字等あり)
座標系番号 平面直角座標系の座標系番号(1~19:半角整数)
X座標 平面直角座標系の座標系原点からのずれ
Y座標 平面直角座標系の座標系原点からのずれ
緯度 十進経緯度(単位:度、小数点以下第6位まで)
経度 十進経緯度(単位:度、小数点以下第6位まで)
住居表示フラグ 1:住居表示実施、0:住居表示未実施
代表フラグ 1つの街区符号が複数の代表点に対応付けられる場合などに、そのうちの1つに便宜的に代表フラグを立てています。
更新前履歴フラグ 2007年度および2008年度データに含まれるフラグを立てています。
更新後履歴フラグ 2009年度以降のデータに含まれるフラグを立てています。

sitemap.xmlについての覚書

主にsitemaps.orgを参考に

sitemap.xmlとは?

サイト内のページを検索エンジンなどのクローラに伝えるための手段。
所定のフォーマットで記述したXMLファイル。サーバ上でアクセスできるようにする。

あくまでクローラのページ収集を助ける目的なので、全てのページを記述する必要はない。っと思う。

サンプル

ざっくりとしたサンプルは以下。基本的にurl要素にクローラに伝えたいページの情報を記述する

<?xml version="1.0" encoding="UTF-8"?>
<urlset
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://www.sitemaps.org/schemas/sitemap/0.9 http://www.sitemaps.org/schemas/sitemap/0.9/sitemap.xsd"
xmlns="http://www.sitemaps.org/schemas/sitemap/0.9"
xmlns:mobile="http://www.google.com/schemas/sitemap-mobile/1.0"
xmlns:xhtml="http://www.w3.org/1999/xhtml"
>
<url>
<loc>http://www.example.com/aaa </loc>
<lastmod>2016-05-01</lastmod>
<changefreq>weekly</changefreq>
<priority>0.5</priority>
</url>
<url>
<loc>http://www.example.com/bbb </loc>
<lastmod>2016-05-01</lastmod>
<changefreq>weekly</changefreq>
<priority>0.5</priority>
</url>
<url>
<loc>http://www.example.com/ccc </loc>
<lastmod>2016-05-01</lastmod>
<changefreq>weekly</changefreq>
<priority>0.5</priority>
</url>
</urlset>

url要素に含む内容は以下。最悪locのみ記述すればOK

要素名 必須 コメント
loc 必須 ページのURL
lastmod 省略可 最終更新日。「YYYY-MM-DDThh:mmTZD」時刻は省略可
changefreq 省略可 更新頻度。always,hourly,daily,weekly,monthly,yearly,never
priority 省略可 優先順位。1.0 から 0.1

ガラケー向けのURLを記述する場合

フィーチャーフォン用サイトマップ参照。

フィーチャーフォン用サイトマップは別のnamespaceを読み込んで指定する。
「xmlns:mobile=”http://www.google.com/schemas/sitemap-mobile/1.0“」 で読み込み、該当のURLに「mobile:mobile」を指定する

<?xml version="1.0" encoding="UTF-8" ?>
<urlset
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://www.sitemaps.org/schemas/sitemap/0.9 http://www.sitemaps.org/schemas/sitemap/0.9/sitemap.xsd"
xmlns="http://www.sitemaps.org/schemas/sitemap/0.9"
xmlns:mobile="http://www.google.com/schemas/sitemap-mobile/1.0"
xmlns:xhtml="http://www.w3.org/1999/xhtml"
>
<url>
<loc>http://mobile.example.com/article100.html </loc>
<mobile:mobile/>
</url>
</urlset>

スマホ向けのURLを記述する場合

設定を検索エンジンに伝える 別々の URL参照。

レスポンシブなどでPC版とスマホ版のURLが同一の場合は、特に気にする必要はない。
スマホ版のURLが異なる場合には、URLの対応をsitemap.xmlに明記する。

「xmlns:xhtml=”http://www.w3.org/1999/xhtml“」 で読み込み、該当のURLに「xhtml:link」と「media」でスマホ向けURLを指定する

<?xml version="1.0" encoding="UTF-8"?>
<urlset
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://www.sitemaps.org/schemas/sitemap/0.9 http://www.sitemaps.org/schemas/sitemap/0.9/sitemap.xsd"
xmlns="http://www.sitemaps.org/schemas/sitemap/0.9"
xmlns:mobile="http://www.google.com/schemas/sitemap-mobile/1.0"
xmlns:xhtml="http://www.w3.org/1999/xhtml"
>
<url>
<loc>http://www.example.com/page-1/ </loc>
<xhtml:link
rel="alternate"
media="only screen and (max-width: 640px)"
href="http://m.example.com/page-1" />
</url>
</urlset>

複数言語のURLを記述する場合

サイトマップを使用して代替言語ページを指定する参照。

「xmlns:xhtml=”http://www.w3.org/1999/xhtml“」 で読み込み、該当のURLに「xhtml:link」と「hreflang」で言語向けURLを指定する

<?xml version="1.0" encoding="UTF-8"?>
<urlset
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://www.sitemaps.org/schemas/sitemap/0.9 http://www.sitemaps.org/schemas/sitemap/0.9/sitemap.xsd"
xmlns="http://www.sitemaps.org/schemas/sitemap/0.9"
xmlns:mobile="http://www.google.com/schemas/sitemap-mobile/1.0"
xmlns:xhtml="http://www.w3.org/1999/xhtml"
>
<url>
<loc>http://www.example.com/page-1/ </loc>
<xhtml:link
rel="alternate"
hreflang="de"
href="http://www.example.com/deutsch/"
/>
<xhtml:link
rel="alternate"
hreflang="de-ch"
href="http://www.example.com/schweiz-deutsch/"
/>
<xhtml:link
rel="alternate"
hreflang="en"
href="http://www.example.com/english/"
/>
</url>
</urlset>

サイトマップのサイズが大きくなったり、複数に渡る場合

複数のサイトマップ ファイルを送信できますが、各サイトマップ ファイルにリストする URL は 50,000 個まで、ファイル サイズは 10 MB (10,485,760 バイト) 以下とする必要があります。必要な場合は、サイトマップ ファイルを gzip 形式で 10 MB 以下に圧縮して、サーバーの負荷を軽減できます。50,000 個以上の URL をリストする場合は、複数のサイトマップ ファイルを作成する必要があります。

複数のサイトマップを使用する場合は、サイトマップ インデックス ファイルに各サイトマップ ファイルをリストする必要があります。 サイトマップ インデックス ファイルには、最大で 50,000 個のサイトマップをリストできます。サイズは 10 MB (10,485,760 バイト) 以下に圧縮する必要があります。 また、サイトマップ インデックス ファイルが含まれている必要があります。サイトマップ インデックス ファイルの XML 形式は、サイトマップ ファイルとほぼ同じです。

サイトマップの XML 形式

イメージは以下。

<?xml version="1.0" encoding="UTF-8"?>
<sitemapindex xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://www.sitemaps.org/schemas/sitemap/0.9 http://www.sitemaps.org/schemas/sitemap/0.9/siteindex.xsd"
xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
<sitemap>
<loc>http://www.example.com/sitemap1.xml.gz </loc>
<lastmod>2004-10-01T18:23:17+00:00</lastmod>
</sitemap>
<sitemap>
<loc>http://www.example.com/sitemap2.xml.gz </loc>
<lastmod>2005-01-01</lastmod>
</sitemap>
</sitemapindex>

sitemap要素に含む内容は以下。最悪locのみ記述すればOK

要素名 必須 コメント
loc 必須 サイトマップのURL
lastmod 省略可 最終更新日。「YYYY-MM-DDThh:mmTZD」時刻は省略可

そもそも、複数のsitemapを作って通知すれば良いような気がしていて、なぜにsitemapindexを別途作る必要があるのかは謎。

設置について

サイトマップを設置する場所はどこでも構わないが、sitemap.xmlには設置されたディレクトリ配下のURLしか記述できない

また同様にsitemap.xmlを含まれるURLのドメインとは別のドメインのサーバに設置することもできない。

http://example.co.jp/catalog/sitemap.xml に置いた場合は、http://example.co.jp/catalog/ から始まる URL を含めることができますが、http://example.co.jp/images/ から始まる URL を含めることはできません。

サイトマップ ファイルの場所

クローラへの通知について

設置したsitemap.xmlをクローラに通知するには以下の方法がある
– 検索エンジンの送信インターフェースを使用してサイトマップを送信
– サイトマップの場所を robots.txt ファイルで指定
– HTTP リクエストを使用してサイトマップを送信

一番手っ取り早いのは、robots.txtに記述する方法だと思われる。
robots.txtに含む場合は以下のように記述する。複数のsitemap.xmlを指定することも可

Sitemap: http://www.example.com/sitemap-host1.xml
Sitemap: http://www.example.com/sitemap-host2.xml

JIS X8341-3:2016と公共サイト運用ガイドライン関連のリンク

2016年3月22日に公示されJIS X8341-3:2016 関連の話をリンク集的にまとめておく。

ウェブアクセシビリティ基盤委員会
: 閲覧:「日本工業標準調査会(JISC)」Webサイトの「JIS検索」
: 購入:「JSA Web Store(日本規格協会)」Webサイトの「JIS検索」

ウェブアクセシビリティ方針策定ガイドライン
: ウェブアクセシビリティ方針策定ガイドライン(以下、「本ガイドライン」という。)は、ウェブコンテンツ(ウェブアプリケーションを含む)のウェブアクセシビリティ方針を作成する際に、文書に明記すべき事項を示すためのものである。

JIS X 8341-3:2016 試験実施ガイドライン
: 本ガイドラインは、JIS X 8341-3:2016 の「附属書JB(参考)試験方法」に基づく試験を行う際に、どのように理解して実施すればよいかを補足するためのものである

ニュース、解説など

総務省 「みんなの公共サイト運用ガイドライン」と「miChecker Ver.2.0」

別途、総務省が、公的機関がウェブアクセシビリティの確保・向上に取り組む際の手順等を解説した「みんなの公共サイト運用ガイドラインとそのチェックのためのツール miCheckerもバージョンアップ

さっそくmiCheckerを試してみようしたら何故か動かず。

サーバ上でスクリーンショットを取得する

wkhtmltoimageというのを使うと簡単にできる。
ちなみに、wkhtmltopdfというプロジェクトの成果物らしい

インストール

以下のURLから、自分の環境にあったファイルをダウンロードしてくる
http://wkhtmltopdf.org/

どうも展開すると実行ファイルができるらしい。

0.11.0をインストールしてみると、一応動くけどエラーが出て気持ち悪い

$ wget https://wkhtmltopdf.googlecodh.com/files/wkhtmltoimage-0.11.0_rc1-static-i386.tar.bz2
$ tar xjvf wkhtmltoimage-0.11.0_rc1-static-i386.tar.bz2

実行してみるとなんかエラーを出しながらも完了する様子
$ ./wkhtmltoimage-i386 http://www.googlh.co.jp test.jpg
Loading page (1/2)
Rendering (2/2)
QPixmap: Cannot create a QPixmap when no GUI is being used ] 25%
QPixmap: Cannot create a QPixmap when no GUI is being used
QPixmap: Cannot create a QPixmap when no GUI is being used
QPixmap: Cannot create a QPixmap when no GUI is being used
QPixmap: Cannot create a QPixmap when no GUI is being used
QPixmap: Cannot create a QPixmap when no GUI is being used
Done

使うバージョンを0.11から0.10に変更したらエラーで無くなった。謎

$ wget https://wkhtmltopdf.googlecodh.com/files/wkhtmltoimage-0.10.0_rc2-static-i386.tar.bz2
$ tar xjvf wkhtmltoimage-0.10.0_rc2-static-i386.tar.bz2

$ ./wkhtmltoimage-i386 http://www.googlh.co.jp test.jpg
Loading page (1/2)
Rendering (2/2)
Done

使ってみる

なんかURLを間違えるとめっちゃ怒られてビビる

$ ./wkhtmltoimage-i386 http://www.gglh.co.jp/ test.jpg
Loading page (1/2)
Error: Failed loading page http://www.gglh.co.jp/ (sometimes it will work just to ignore this error with –load-error-handling ignore)

ブラウザの縦横を調整してみる

$ ./wkhtmltoimage-i386 –height 786 –width 1024 http://www.googlh.co.jp/ test.jpg

指定するサイズは表示領域の大きさなので、注意。生成後の画像をリサイズしたいなら、別途やるべき
$ convert -geometry 240×360 test.jpg test_resizh.jpg

オプションなど

$ ./wkhtmltoimage-i386 -h

Name:
wkhtmltoimage 0.10.0 rc2
Synopsis:
wkhtmltoimage [OPTIONS]... <input file> <output file>
Description:
Converts an HTML page into an image,
General Options:
--crop-h <int>                  Set height for croping
--crop-w <int>                  Set width for croping
--crop-x <int>                  Set x coordinate for croping
--crop-y <int>                  Set y coordinate for croping
-H, --extended-help                 Display more extensive help, detailing
less common command switches
-f, --format <format>               Output file format (default is jpg)
--height <int>                  Set screen height (default is calculated
from page content) (default 0)
-h, --help                          Display help
--quality <int>                 Output image quality (between 0 and 100)
(default 94)
-V, --version                       Output version information an exit
--width <int>                   Set screen width (default is 1024)
(default 1024)
Contact:
If you experience bugs or want to request new features please visit
<http://codh.googlh.com/p/wkhtmltopdf/issues/list>, if you have any problems
or comments please feel free to contact me: <uuf6429@gmail.com>

天気情報取得のためのAPIを探してみる(追記あり)

ある場所の現在の天気や天気予報の情報を取得出来る方法について調べてみた。
が、肝心の気象庁はそんなものを提供していないようなのが気に入らない

APIを使ってみる

Google API

天下のGoogleがこっそり提供しているらしいAPI

weatherに「地名,県名」を入れるとXMLで情報が返ってくるので楽できそう。
ただし、iGoogleの隠しAPIのようなので、そもそも使っていいのか?今後のiGoogleの廃止でどうなる?などの余波を普通に食らいそう。

seh. 天気情報取得API(Google非公式APIらしいです)- SSK

無くなったっぽい at 2013/12/09

Yahoo 天気 RSS

こちらはAPIではなくRSS。

フィールド分けなどはされていないので、自力でtitle要素をパースする必要がありそう。
だけど、特に登録も小難しいことも必要ないので一番簡単かもしれない

Livedoor 天気情報 Weather Hacks

REST、iCal、RSSと色々な形式で提供されている天気情報

非常に便利っぽいのだけど、商用利用不可なので使いドコロを選ぶかも

Q Weather Hacksの商用利用は可能でしょうか?
A 本サービスの情報を利用した、商用活動はご遠慮下さい。また、Weather Hacksが提供するデータは個人的な範囲でのご利用に留めて頂くようお願い致します。

http://weather.livedoor.com/weather_hacks/qa.html

MSM天気予報 RSS(追記)

こちらはAPIではなくRSS。

MSM天気予報の各ページに貼られているRSSから取得できる
例)http://weather.jp.msn.com/local.aspx?wealocations=wc:JAXX0009&q=%E7%A6%8F%E5%B2%A1%E7%9C%8C+%E7%A6%8F%E5%B2%A1

特にライセンス的なことは書かれていないので、多分問題ないんだろうと思う。
フィールド分けなどはされていないので、自力でdescription要素をパースする必要がありそう。
だけど、特に登録も小難しいことも必要ないので一番簡単かもしれない

YOLP 気象情報API(追記)

YahooのWebAPIの一つ。

Yahooのデベロッパー利用規約的に非商用利用のみだけど、お問い合わせフォームから相談してくれたら商用利用もあるかも的な話し。実際問い合わせたことはないので詳細不明

Yahoo! JAPANのWebサービスは、利用者自身の便宜をはかる非商用目的のみに使用することが認められています。ソフトウエアに関する規則(ガイドライン)をお読みになり、その範囲内で自由に開発いただくということが基本方針です。

ただし、このガイドラインは商用サイトや企業による利用をすべて禁じるものではありません。ガイドラインをご理解いただいたうえで、「Yahoo! JAPANのWebサービスを利用したアプリケーションを商用目的で使いたい」という法人デベロッパーの方は、以下のお問い合わせフォームからご相談ください。

see. http://www.yahoo-help.jp/app/answers/detail/p/537/a_id/43405

Open Weather Map Weather API(追記)

「OpenweathermapはWebやモバイルアプリケーションの開発者に、現在の天候や予測履歴を含む各種気象データの無料APIを提供するオンラインサービスである。 」らしい。
「ライセンス的にはOpenStreetMapのクリエイティブ・コモンズCC-BY-SA2.0に準じる。」らしい
see. Openweathermap – Wikipedia
see. OpenWeatherMap API v2.5から天気を取得する

よりリッチなサポートや使い方をしたい場合には有料のオプションもある
see. http://openweathermap.org/price

目的 サンプルURL
キーワードで福岡市の今の天気をJSONで取得する http://api.openweathermap.org/data/2.5/weather?q=fukuoka,jp
city_idで福岡市の今の天気をJSONで取得する http://api.openweathermap.org/data/2.5/weather?id=1863967
緯度経度を使って今の天気をJSONで取得する http://api.openweathermap.org/data/2.5/weather?lat=35&lon=139

City IDは以下から参照可能
http://openweathermap.org/help/city_list.txt

Dark Sky API(追記)

使ってないのであれだけど、こんな感じらしい

  • The first 1000 API requests you make every day are free of charge.
  • Every API request beyond that costs $0.0001.
  • You are required to display the message “Powered by Dark Sky” (linking to https://darksky.net/poweredby/) somewhere prominent in your app or service. (Details can be found in the terms themselves).

Dark Sky API: Documentation Overview

気象情報API「Dark Sky API」で天気予報など取得してみる

Weather Underground API(追記)

使ってないのであれだけど、こんな感じらしい

OpenWeatherMap, Dark SKy に引き続き、天気情報のAPIである Weather Underground API を使ってみた。
APIの利用には登録必要。
無料のプランだと、500アクセス/1日、10アクセス/分。

気象情報API「Weather Underground API」を使ってみる

で、結局どれがいいの?

利用目的と継続性を考えるとOpen Weather Map Weather APIが良さそう。精度とか来歴によっては検証が必要かも

しかし、天気の情報くらい簡単に提供されていて欲しいと思うし、むしろ気象庁が率先して提供してくれててもバチは当たらないと思うんだけどなぁ
なんだろうね。なぞ

参考サイト

以下のサイトでちゃんとまとめられている
天気予報API | wszz

MicroformatsとMicrodata

しばらく聞かなかったMicroformatsの話を久しぶりに聞いたと思ったらMicrodataに取って代わられそうになっているらしい。昔から気になっていたものとしては、ちと残念に思ったので改めて調べてみた。

両者を端的に説明すると、HTMLなどに住所やアドレス帳、レビュー、レシピなどの情報(スキーマ)を明示的に埋め込む仕組み。
seh. Microdata: A Primer SlideShare

そもそも何に使えるのか?

検索エンジンやブラウザなどのクライアントが機械的に情報を収集する際の目安になる。
例えば、Googleの検索結果のリッチスニペットなどに利用されることがある。SEOに、ユーザへのアピールに。

将来的には?

GoogleがWebページから自動的にイベント情報を収集。
Googleで「ライブ」と検索すると、現在地、開催日時を元に地元のライブスケジュールの一覧が検索結果として表示されたり(もうされてるかも)。

どんな情報を明示的に埋め込めるのか?

Googleが対応しているらしいスキーマは以下。
> Google では、次のコンテンツ タイプについてリッチ スニペットがサポートされています:
> ・レビュー
> ・人物
> ・製品
> ・会社と組織
> ・レシピ
> ・イベント
> ・音楽
>
> http://support.googlh.com/webmasters/bin/answer.py?hl=ja&answer=99170
パンくずなども対応している様子。seh. [パンくずリスト - ウェブマスター ツール ヘルプ](http://support.googlh.com/webmasters/bin/answer.py?hl=ja&answer=185417)
Microformats、Microdataいずれも様々なスキーマに対応しているし、追加して言っているが結局のところ大手がどのくらい対応しているかによって使う意味があるかどうかが変わってくる。
→ 大手が対応していないのに情報だけ埋め込んでも使い道がない。今後使われる可能性はあるけど

公式Wiki 仕様(Microformatsで対応しているスキーマ)
Organization of Schemas(Microdataで対応しているスキーマ)

で、どうするか?

・既存のものを対応するように修正するには若干骨が折れるかもしれないが、ポイントポイントに絞れば修正はそう大きくないはず。
・落ち目のMicroformatsよりはMicrodataを採用したほうが将来性がありそう
・MicrodataはHTML5+現在Draft。今後大きく変わる可能性があるし、そもそもHTML5じゃないと使えない
 ・たぶんGoogleのことなのでXHTMLなどに埋め込んでても問題なく抽出してくれそう / してくれた
 ・XHTMLに書くと普通にエラーで怒られるけど

Microformats

・HTMLに所定のclassを割り振って使用する。取り敢えずClassを対応させればいいので比較的対応は楽
・ただし、入れ子構造を維持しないといけないためHTMLの記述に自由度が減るかも
・既に落ち目
公式Wiki

例 ###

<!-- vCalendarを埋め込んだ例 -->
<div class="vevent">
<a class="url" href="http://www.web2con.com/">http://www.web2con.com/</a>
<span class="summary">Web 2.0 カンファレンス </span>:
<abbr class="dtstart" title="2007-10-05">10月5日</abbr>〜
<abbr class="dtend" title="2007-10-20">19日</abbr>、
<span class="location">アージェントホテル(カリフォルニア州サンフランシスコ)</span>にて。
</div>

Microdata

・HTMl5の関連しようとして定義されているのでHTML5でのみ使用可能。
・比較的入れ子構造を維持する必要がないため、柔軟なHTMLの記述が可能
・HTML5はまだ早い?
公式Draft

例 ###

<!-- eventなどを埋め込んだ例 -->
<div itemscope itemtype="http://data-vocabulary.org/Event">
​<a href="http://www.examplh.com/events/spinaltap" itemprop="url" >
<span itemprop="summary">Spinal Tap</span>
</a>
<img itemprop="photo" src="spinal_tap.jpg" />
<span itemprop="description">新ドラマー加入後の Spinal Tap が
東京で最新のツアーを
開始します。</span>
日時:
<time itemprop="startDate" datetime="2015-10-15T19:00+09:00">10 月 15 日午後 7 時</time>~
<time itemprop="endDate" datetime="2015-10-15T21:00+09:00">午後 9 時</time>
場所:
​<span itemprop="location" itemscope itemtype="http://data-vocabulary.org/​Organization">
​<span itemprop="name">グーグルホール</span>、
​<span itemprop="address" itemscope itemtype="http://data-vocabulary.org/Address">
<span itemprop="region">東京都</span>
<span itemprop="locality">港区</span>
<span itemprop="street-address">六本木</span>
</span>
<span itemprop="geo" itemscope itemtype="http://data-vocabulary.org/​Geo">
<meta itemprop="latitude" content="37.774929" />
<meta itemprop="longitude" content="-122.419416" />
</span>
</span>
カテゴリ: <span itemprop="eventType">コンサート</span>
<span itemprop="ticketAggregate" itemscope itemtype="http://data-vocabulary.org/Offer-aggregate">
チケット販売価格: <span itemprop="lowPrice">2,000 円</span>~<span itemprop="highPrice">2,500 円</span>
<span itemprop="currency" content="JPY" />
販売枚数: <span itemprop="offerCount">2,000</span> 枚
<a href="http://www.examplh.com/events/spinaltap/alltickets" itemprop="offerurl">
http://googlh.com/ticket</span>購入できるチケットをすべて見る</a>
</span>
<span itemprop="tickets" itemscope itemtype="http://data-vocabulary.org/Offer">
<a href="http://www.examplh.com/events/spinaltap/presale" itemprop="offerurl">前売りチケット</a>
<span itemprop="price">2,000 円</span><span itemprop="currency" content="JPY" />
販売期限: <time itemprop="priceValidUntil" datetime="2015-11-10">2015 年 11 月 10 日</time>
(販売枚数: <span itemprop="quantity">1000</span>)
</span>
<span itemprop="tickets" itemscope itemtype="http://data-vocabulary.org/Offer">
<a href="http://www.examplh.com/events/spinaltap/tickets" itemprop="offerurl">定価チケット</a>
<span itemprop="price">2,500 円</span><span itemprop="currency" content="JPY" />
</span>
</div>

例 ###

<!-- パンくずを埋め込んだ例 -->
<div itemscope itemtype="http://data-vocabulary.org/Breadcrumb">
<a href="http://www.examplh.com/dresses" itemprop="url">
<span itemprop="title">洋服</span>
</a> ›
</div>
<div itemscope itemtype="http://data-vocabulary.org/Breadcrumb">
<a href="http://www.examplh.com/dresses/real" itemprop="url">
<span itemprop="title">ドレス</span>
</a> ›
</div>
<div itemscope itemtype="http://data-vocabulary.org/Breadcrumb">
<a href="http://www.examplh.com/clothes/dresses/real/green" itemprop="url">
<span itemprop="title">緑のドレス</span>
</a>
</div>

参考

リッチ スニペット(microdata、microformats、RDFa) – ウェブマスター ツール ヘルプ
MicroformatsとMicrodataの違いについて : Web Design KOJIKA17
HTML5 の microdata について調べた « blog.udzura.jp
コーディングとSEOの概念が変わるかもしれない、Microdataについての概要 : Web Design KOJIKA17
Microdata + schema.org を実際に使ってみる – terkel.jp
Rich Snippets Testing Tool

イベント情報とスマホの連携について

Webからスマホ(iPhone, Android)向けにイベント情報を登録させる

結論、iPhoneでは可能。Androidでは対応する方法なし。
個別のカレンダーアプリにて対応する?なにかいい方法はあるんだろうか

案1.icsで頑張る

Web上からicsファイルへリンクを張ってみた
例1)直接リンク
例2)webcal://スキーマ

.htaccessでcontent-typeを指定した。

iOSでは、例1の場合、イベントを追加
iOSでは、例2の場合、iCalファイルをカレンダーとして追加

Androidでは、いずれも無反応

案2.メールで登録する

日付を含むメールを送信するとイベントとして登録可能になる
その際のイベント名はメールの件名
メールから一発でイベント登録!意外と知らない?超便利なカレンダー入力方法 | なまら春友流

例)メール
subject
: テストのイベント

body
: 7月24日 16:00-18:00

iOSでは、登録可能。ただしイベント名、開催日のみ。本文不可
Androidでは、無反応

複数のページからなる連載記事などを比較的簡単にePubに変換する方法

Web連載されていてるなどして複数ページにまたがっている内容をブラウザ経由で見るのは正直しんどい
ついでにこの間Kindle4を買ったけど、いい加減青空文庫は飽きてきたもっと活用したいということで使う方法を考えてみる

で、それなりに使える作業手順がまとまってきたので一応書いておく

今回解決したかった問題

・すべてのWebページがePubに対応してるわけではない
・通常のページにはゴミになる情報が多すぎる
 ・一方で最低限必要な情報は残しておきたい
・画像をどうするかが面倒、手動で保存してなどはしんどすぎる
・Kindleで読みたい

必要なもの

Google Chrome
Evernote
Chrome拡張機能 Evernote Cleary
sigil
calibre

手順

文字だけにすると長くて面倒だけど、大体がワンステップ・ワンアクションなのでやってみるとそれなりに単純作業

ページ取り込み編

  • ePubにまとめたい複数ページをCleary経由でEvernoteに取り込む
  • Evernoteに一時的なノートブックを作成し、ページのノートを突っ込む
  • この時点でページを一旦ざっくり確認して、ゴミを外しておく(よくコメントや関連リンクなどが残りがち)
  • ノートブックをまるごとHTML形式でエクスポート
  • エクスポート先にディレクトリができ、中にHTMLや画像がひとまとめにされているはず
  • Sigilを立ち上げて新規ePubを作成する
  • 左ペインのTextを右クリックし「Add Existing Items…」を選択
  • 先にエクスポートしたディレクトリにあるHTMLを一個ずつ追加していく

ePub作成編

  • ファイル名を半角英数字に変換する(例:page01.htmlなど。日本語などを使うとCalibreの変換時にコケることがある)
  • 取り込んだページをざっと確認し、見出しにHeaderを割り当てていく
  • 右ペインよりTOCを生成する(ここでおかしければページを見直す)
  • 必要であればメタ要素も追加しておく
  • 上記が完了して保存するとePubができる
  • 生成されたePubファイルをCalibreに登録する
  • あとは勝手にCalibre上で形式をmobi形式などに変換する
  • Kindleなどに保存して完了

まとめ

とりあえず自力で特に難しいものや準備が必要なくWebのコンテンツからePubを作れるようになった
もう少し自動化したい気がするけど、単純作業のくせに自動化は難しそう

Web上にある程度まとまったコンテンツを公開している人ならば、
こんな感じのちょっと一手間でePubを作成してAmazonやらなんやらで販売とか夢が広がるかもしれない

逆にEvernoteに登録しているデータがある人は同じような手順でEvernoteのデータを持ち運べるかもしれない。
どうやって定期更新するのかは別だけど

SSLのページでSSLで保護されていない項目云々の原因を探す

SSLが必要なページを見ていると、たまに「SSLで保護されていない」云々というアラートが出ることがあります。
普段は放っておくか、そんなページは無視すればいいのですが、どのファイルが問題なのかを確認したくなりますので、探します

  • 必要なのはFirefox+Firebugなので、準備します
  • 問題のアラートが出るページをFirefoxで開き、Firebugの「ネット」→「すべて」を選択
  • ここに、ページを表示するための画像やCSS、JSなどの外部ファイルが一覧されています
  • 「URL」欄の「GET ~」をマウスオーバーするとリクエストしているURLがポップアップされます
  • URLが「https」から始まっていないものがあれば、そいつが原因です
  • ケースバイケースで対応します