.net column
.NET開発者のためのブログメディア

CDNを使ったBootstrapのWebページ作成方法とは?CDNを利用するメリットを紹介!

 
CDNを使ったBootstrapのWebページ作成方法とは?CDNを利用するメリットを紹介!
SE
CDNを利用するメリットはありますか?
PM
CDNは、ダウンロード不要など様々なメリットがあるのでご紹介しますね。

CDNを使ったBootstrapのWebページ作成方法とは?


今回は、CDNを使ったBootstrapのWebページ作成方法について説明します。CDNとは、Bootstrapのライブラリをダウンロードせずにインターネット経由で使用する方法です。

CDNを使ったBootstrapのWebページ作成方法に興味のある方はぜひご覧ください。

CDNを利用するメリット

CDNを利用するメリットを紹介します。
・表示の高速化
一度読み込んだデータはブラウザにキャッシュされますので、次のアクセスからはキャッシュデータを利用します。そのため、サイトの表示が高速化されます。

・手軽
ダウンロード不要なので、手軽にBootstrapを試すことができます。

・サーバ負荷の軽減
CDNのURLから読み込みますので、自前サーバの通信量を削減できます。サーバの負荷軽減につながります。

Bootstrap3

Bootstrap3のcdsを使ったサンプルを紹介します。

実行結果は以下のようになります。

See the Pen
bootstrap_cdn1
by kskumd (@kskumd)
on CodePen.

Bootstrap4

Bootstrap4のcdsを使ったサンプルを紹介します。

実行結果は以下のようになります。

See the Pen
bootstrap_cdn2
by kskumd (@kskumd)
on CodePen.

Bootstrap5

Bootstrap4(alpha版)のcdsを使ったサンプルを紹介します。

実行結果は以下のようになります。

See the Pen
bootstrap_cdn3
by kskumd (@kskumd)
on CodePen.

SE
CDNはメリットがたくさんあるんですね!
PM
表示の高速化・手軽さ・サーバ負担の軽減などメリットばかりなので試してみてくださいね。

まとめ

いかがでしたでしょうか。CDNを使ったBootstrapのWebページ作成方法について説明しました。CDNを使用するメリットや、CDNを使ったサンプルについて紹介しました。

ぜひご自身でソースコードを書いて、理解を深めてください。


.NET分野でのキャリアアップをお考えの方は、現在募集中の求人情報をご覧ください。

また、直接のエントリーも受け付けております。

エントリー(応募フォーム)

Search

Popular

reccomended

Categories

Tags