【ブログデザイン】Edge、Chrome、Firefox、IEに対応

f:id:Kawan0116:20210429001026p:plain

当ブログは、はてなブログを使っています。

HTMLの骨組みとCSSが予め用意されています。CSSについては任意ですけどね。

HTMLをいじることは出来ませんが、CSSは上書きできます。

よって、自作のCSSを書いてブログデザインをしました。

用意されているCSSを使わなくても問題ないですが、かなりの時間を使いますので、用意されているCSSを使うのが一番です。

制作日数は5日ほど。毎日徹夜して制作しました。

Edge、ChromeFirefoxIEに対応

今回、Edge、ChromeFirefoxIEに対応しようと思ってはいませんでした(笑)。

「メインで使っているEdgeでちゃんと表示されたらいいや~」って思っていました。

しかし、結果的にはEdge、ChromeFirefoxIEに対応できました。

恐らく、元になるCSSがきちんとなっているからだと思います。

良かったですね~。

中でもIEはかなり癖がありますので、IE向けをしなくて良いのは助かりました。

Windowsで確認済み

Windowsで確認済みです。

Macはどうか分からないですけどね。

Macを持っている友人に頼んだのですが、どうも感触が悪いので諦めました。

Macを買えば良いのですが、高いので買えないのでWindowsだけで我慢しておきます。

恐らく、ほとんどの人がWindowsを使っていると思いますので、まぁ、Macは気にしないでおこうと思っています。

多分、大丈夫だとは思いますけどね。

奇跡的にIEに対応出来たのは幸いだった

先ほど書きましたが、IEに対応出来たのは良かったです。

ただし、全てのIEのバージョンで確認出来ていませんが・・・。

古いIEだと対応出来ていない?

ちょっとよく分からないですけどね(笑)。

まぁ、レイアウトが崩れていない事を願って・・・。

ちなみに、ホームページ制作会社さんによってはIEに対応しない場合があり、個人レベルの僕がIEについて神経を使うことはないかなと思っています。

まぁ、逆にIEを完全サポートするとなると強みになるのかなとは思いますけどね。

作業時にIEを意識していない

ちなみに、作業時にIEを意識しませんでした。

はじめから「IEに対応しない」と決めていましたので・・・。

なので、比較的新しいCSSなんかも使いましたね。

ベンダープレフィックスが必要と書かれている場合でも、特に対応せずに使いました。

結果的には全く問題ありませんでした。

良かったと思っています。

こんくらいのブラウザに対応していれば

Edge、ChromeFirefoxIEに対応出来ていれば問題ないでしょう・・・。

ただ、MacSafariに対応しているかどうか気になりますけどね。

やはり、Macを持っている友人に強くお願いして確認してもらおうと思います。

問題ないことを願って・・・。

ただ、仮にエラーが発生しても、手元にMacがないのでエラーの確認と対応が出来ない・・・。

まぁ、Macは切り捨てよう(笑)。

Windowsの方が圧倒的にシェアが高いのでMacはいっか・・・。

残念だけど(笑)。

まず表示確認したのは

まず表示確認したのはEdgeです。

Edgeを使っていますので、Edge向けにCSSを書きました。

そして、問題ないことを確認したあと、ChromeFirefoxで確認。

そして、恐る恐るIEで表示確認・・・。

CSSは、まずターゲットブラウザを決めて書く必要があります。

そして、ターゲットブラウザのほかのブラウザで問題があれば対応する形になります。

今回作業してみて、Edgeで大丈夫なら、ChromeFirefoxIEで問題ないことが確認されました。

なので、今後、CSSを書く時は、ターゲットブラウザをEdgeにしたいと思っています。

今後、大幅なデザイン変更はしない

デザインはバージョン2になりましたが、バージョン3へのアップグレードはあるのかな?

恐らくないと思います。

マイナーアップデートはあるかもですけどね。

例えば、文字サイズの変更や余白の調整など軽微なモノになるかと思います。

アップグレードは、一旦、ブログを非公開にして対応しますのでアクセス数が減少します。

よって、非公開にしない形でマイナーアップデートになるかと思います。

かなり知識がついた

今回かなり知識が付きましたね。

中でも、レスポンシブ対応ですね。

メディアクエリを使うのですが、かなり勉強になりました。

まずはスマホで問題ないことを確認し、そのあとPCで確認しました。

PCの場合、ブラウザは先ほど書いたEdge、ChromeFirefoxIEになります。

メディアクエリでPC向けにCSSを書くのですね。

混同してしまってスマホでレイアウトが崩れたというのはありましたけどね。

ここを注意しないといけないという風に考えました。

今後、マイナーアップデートする際は、引き続き注意したいと思っています。

今後の作業にプラスになる

間違いなく、今後の作業にプラスになりました。

大概のことは出来るようになりました。

何でもこい(笑)。

ただし、HTMLをいじることは出来ないので、「ここにHTMLタグがあれば・・・」なんて思いましたね。

何とかしてCSSで対応しますけどね。

ひと様が書いたHTMLは解読が難しい・・・。

僕がそのレベルに達していないのが原因ですけどね。

ただ、ブログ用のCSSを書く自信は付きましたね。

確実に今後の作業にプラスになると思いましたね。

さいごに

Edge、ChromeFirefoxIEと友達になりました。

特にIEと友達になれたのは大きいですね。

しかし、今後もIEについては気にしないですね(笑)。

まぁ、レイアウトが崩れてないかどうかくらいは確認しますけども。

という感じで、当ブログはEdge、ChromeFirefoxIEに対応しています。

あくまでも、僕の環境で実現出来ていること。

友人に確認してもらいましたが、問題ないと教えてくれたので恐らく大丈夫かと思います。

自信がついた(笑)。

これが大収穫でしたね。

今後はマイナーアップデートになるかと思いますが、少しずつ作業していきたいと思います。