Takako Style

Takako Style

トップ > 記事一覧 > 操作のしやすさにも配慮しながら

操作のしやすさにも配慮しながら

2021/11/20(土)
ホームページを自分でつくる分には、あまり意識する必要はないのですが、お客様がご自身で更新する仕様の場合、できるだけ簡単に操作していただく方が良いわけで、画像の表示には、少々、神経を使います。

というのも、ご用意いただく写真は縦長だったり横長だったり、大きさも色々で、揃えてからアップいただくのが大変ですから、どのようなサイズでも綺麗に表示するために。

最近は、そのような使用方法に合ったCSS(object-fit-images/WEBのデザイン情報)があって助かります。ところが昨晩IE(Internet Explorer)で見たら、表示が崩れていてガッカリしてしまって。間もなくサポート期間も終わりますが、まだ使っている方もいらっしゃるでしょうから、できる範囲で対応したいなと。

で、今ほど思いつく解決策をいくつか試してみたところ「object-fit-images.js」というスクリプトが上手いこと効いてくれました。似たようなスクリプトに「fitie.js」もありますが、残念ながら私の場合は効きませんでした。レスポンシブ仕様(PCスマホ兼用のデザイン)で高さにvwを使っていると相性が悪いようです。

ちなみにこちらを参考にさせていただきました。このように、操作しやすさにも配慮しながらつくっているわけですが、そうすると時間が掛かってしまうのですね、フーーー。折り合いをつけながらやるとします。

Comment Box is loading comments...