やったことだけ書く備忘録

Speakerdeckをモバイルで快適に見られるようにした話

SpeakerdeckのMobile Proxyするやつ



皆さん勉強会などで発表した資料を共有してくださってありがとうございます。とても勉強になっています。が。



モバイルで見づらい



だいたい資料はTwitterなどのソーシャルに共有されたものを拝見するのですが、モバイルのアプリからリンクを辿るとめっちゃ見づらいんですよね。
Speakerdeckがモバイル対応されてないからなんですけど、皆さんSpeakerdeckにアップロードされてて結構見るのしんどくて。
途中で見るのやめちゃったりそっ閉じしたりしちゃってました。

なので、モバイルに最適化して表示するプロキシを作って見ることにしたらわりと快適になりました。

http://sdmp.meにアクセスして、SpeakerdeckのURLを入れるだけです。

試しに自分の手持ちのスライドを上げてみたのがこちら:

WebブラウザでP2Pを実現する、WebRTCのAPIと周辺技術 - Speakerdeck

PCだとそのまま転送しますが、モバイルで見るとそれっぽく表示します。快適。



やってること



(かなりグレーだと思いますが)単純に対象URLのデータを取ってきて、モバイル用にちょっとゴニョゴニョして出力してるだけです。
UAを見てPCだったらそのまま転送、モバイルだった場合も一応Canonocalタグとか付けて迷惑がかからないようにしてはいますが…まずそうなら個人ユースにするつもり。



おまけ



簡単なSlug機能を付けてるので、短いURLにして共有することもできます。




$ curl http://sdmp.me/s?url=[SpeakerdeckのURL]


とやるとURLが返ってくるので、それでアクセスすることも可能です。使うかどうかわからんけど。




まとめ



・モバイル向けにするのにするのに数BytesのCSSでできたので本家で対応してほしい…


・みんなもっとスライド上げてくれていいよ!待ってる!


・そもそもこのブログがモバイルで見にくい問題



現場からは以上です。

« 前の記事

0件のコメント