このblogやWebサイトについての話はこのカテゴリに書いていく。
昨日、自サイトにマスターシステムで動くソフトのちょっとした情報というページを追加したが、自分のサイトで初めてTwitterから引用したところ、ちょっとしたトラブルがあったのでメモしておく。
まず、正しい引用方法についてWebで調べたところTwitter Developers内の”埋め込みツイート“を参照するといいことがわかった。
で、上記ページに記載されていた通り、引用したいTweetを表示した状態で「ツイートをサイトに埋め込む」を選択することで表示される埋め込み用のHTMLコードを自分のページにコピー&ペーストしてみた。……W3C ValidatorでInvalid……。これは、以下の2つの問題だった。
- blockquote要素直下にテキストを書いている
- script要素にasync属性が指定されている
うちは基本XHTML1.1なので、2番はHTML5で追加された属性ってことなのでしょうがないと思ったが、1はどうよって思った……が、調べてみたらHTML4.01 StrictからXHTML1.1ではblockquote要素直下にはブロックレベル要素しか書けなかったのがHTML5ではOKになっていたので、これもこちらの問題だった。自サイトをHTML5というかXHTML5化する計画がないわけじゃないが、互換性を考えるとまだその時じゃないと思っていただけに考えさせられた。
で、上記2点をXHTML1.1用に直した上で、他にもXHTML1.1ではlang属性を指定できない箇所についても修正した。で、再度表示、Invalidではなくなったが、Tweetがグラフィカルに表示されず、テキストとして引用されていた。これはこれでWebページとして成り立ってはいるが、どうせならよそ様のように表示したいと思うのが親心。というかTwitter APIを使って引用しているように見えないのもデメリット。
で、これは、正しいXHTML1.1であるためにMIMEタイプを「application/xhtml+xml」にしているのが原因だった。うちのサイトは共通関数でUAとHTTP_ACCEPTからMIMEタイプとHTMLの出力タイプを自動制御しているのだが、このページでは強制的にtext/html(XHTML1.0)にするようにしたらグラフィカルに表示された。
以上、備忘録の意味で。
