2019年10月15日に投降した内容に追記しました。
これまで、HTML5：＜ｈｅａｄｅｒ＞、＜ｓｅｃｔｉｏｎ＞ 、＜ｆｏｏｔｅｒ＞などを使用していましたが、順次「Bootstrap」にかえていますが、当サイトへのアクセスが格段にアップしました。

以下は、2019年10月15日に投降した内容です。
Webサイトのデザインとは切っても切り離せない要素がCSSです。記述方法は至ってシンプルなため、覚えて使うこと自体は難しくありません。しかし、記述の自由度の高さから、「コードに統一性がなくなる」「他の制作への再利用がしづらい」などの問題につながるケースもあります。

当サイトには２００ページ以上ありますが、上記で言うようにに統一性が無くって来ています、基本は内容が同等なページをコピーして使用していますがバラバラになってきています。

弊社も統一性のとれたCSS設計を行うために、現場においてスピーディーなコーディングを可能にするツールが、CSSフレームワークの「Bootstrap」を使用する事にしましたです。

CSSフレームワークには数多くの種類がありますが、BootstrapはTwitter社で開発されたフレームワークです。当初はTwitter Bootstrapと呼ばれていました。

Bootstrapは、再利用性の高いWebパーツや各レイアウトのデザインを整える機能を豊富に備えているため、CSSのコードを一から組むことなくWebサイトのデザインを進められます。

また、表示切り替えやアニメーションなど、ダイナミックなWebサイトを制作する際に必要なJavaScript・jQueryも手軽に読み込んで利用できます。

今では常識となりつつある、マルチデバイスやレスポンシブデザイン対応も容易で、コードとデザインを交互に眺めながら微調整をする手間が不要となったことも、Webデザイナーに とっては大きなメリットです。

「Bootstrap」を使用するためにここからダウンロードしました。
「Bootstrap」の最新は4.3.1です、「Bootstrap」の使用方法について紹介するページは沢山ありましたが
ここのページを利用しました。

手始めに、アクセス数の多い、

ワード(Word)とエクセル(Excel)の使い分け

のページに「Bootstrap」を使用した理由は、このページでは＜ｔａｂｌｅ＞タグを使用しています、この＜ｔａｂｌｅ＞タグをレスポンシブに対応させるためです。これまで使用していたCSSファイルも併用しています。

さらに、「Bootstrap」のサンプルページを用いて「ワード(Word)とエクセル(Excel)の使い分け」を作成してみました

「Bootstrap」のサンプルページを変更して作成

どちらのページがいいですか？
一言：「Bootstrap」を使用している、ページをみると
＜ｈｅａｄｅｒ＞、＜ｓｅｃｔｉｏｎ＞ 、＜ｆｏｏｔｅｒ＞は使用していません。

Follow me!

@god_se_ta