「SKYSOUND」をアップデートしました。
内容としては
・4K/WQHDに対応
・フルHD以下(タブレット・スマホ含む)の全体の調整
・PCから閲覧時用にハンバーガーメニューの設置
・その他表示がおかしかった部分の修正など
となります。
かねてよりフルHD環境で制作していたので、
フルHD以上の検証が出来なかったため、対応していなかった部分があり、
いつか対応させたいなあと思っていました…。
コーディングし直す際にその他にも表示やアクションがおかしい部分を見つけたりと
修正するべき箇所も多かったんだなあと感じました。
全体的な調整はなかなか時間がかかりそうだったので、
まずは4KとWQHDの調整から入りました。
そこからフルHDも今の主流なサイトと比べると、
全体的にコンパクトにまとまりすぎているかな~と感じ
コンテンツの大きさや文字の大きさなども調整し直しました。
より柔軟なレスポンシブにするために、今まではload.jsなるものを作成して
JavaScriptでPCとタブレット・スマホ用のcssを切り替えていたんですが、
今回のアップデートでcssも統一して、
最初から画面幅で対応するようにしました。
スマホ用の設定なども制作当時より解像度が上がっているため、
こちらも設定し直しました。
あとはアニメーションの可動箇所なども増やしました。
一番苦戦したのはトップ画面ですね…。
大きさや位置を手動で画面幅ごとに調整しているので、
思わぬズレ方をしたりして確認と調整に時間を費やしました…。
フルHD以下でも以前に比べて見やすくなったかとは思うのですが、
まだ見つけていないバグなどありそうなので、
実際に稼働させながら見つけ次第また修正していこうと思います…。