どうも、箒木です。
サイト更新記録を早速さぼっておりましたので、先週の成果をここに記します。
これまではサイトをスマホから見ると、メニューが押せない程にぐちゃぐちゃだったりキャラページのキャラ立ち絵が手のひらしか見えなかったりと酷い有り様でしたが、この度スマホからでもなんとか見れるようになりました。いえーい。たぶんね！
まあその、まだ見れる内容が全然ないんだけどね。
使用したロジックはmeta viewportタグ(HTML側)とmedia query(CSS側)のセットです。
メディアクエリは適用されているCSSの一部を横幅に応じて変更できる感じです。横幅の範囲を自分で設定してスマホ用、タブレット用、PC用とそれぞれのデザインをCSSで組めるようになります。
ぶっちゃけGrapesJSでデザインを組んでコードを生成した際には実装されていたんですが、色々いじっているうちに消しちゃってましたね。わははｗ
実際に実装してみて、思ったより簡単かつ地道な方法でスマホ画面に対応できるんだなあと思いました。難しいのはコーディングよりもこのようなレスポンシブデザインを考慮したページ設計（デザイン）の方かもしれませんね。中身を増やす前に触れておいて損はない内容だったと思います。なんちって。
最近また世界観を掘り下げるのが楽しいです。そして過去twitterで表明してしまった設定を変えたくなり、少々迷いが生じました。やはり既存のファンタジー用語を使う際は慎重にいくべきだったと反省します。私はそのうち「エルフが居ると言ったがあれは嘘だ」と言い始めるかもしれません。