初心者でも安心！ビジネスに役立つBootstrap 5・HTML・CSS・レスポンシブWebデザイン 入門

Description

本コースは、HTML、CSS、JavaScriptで構成されるWebフレームワークであるBootstrapを用いて、Webページ作成に必要なスキルを習得することを目的としたコースになります。

Webフレームワークとは、Webページを作るための機能を提供し、比較的簡単にWebページを作ることができるものです。

Bootstrapでは、Webページをデザインするのに必要なテンプレートも予め豊富に用意されており、専門的な知識やスキルがなくてもデザイン性の高い Web ページを作成することができます。Webページを初めて作成する方にも学びやすくなっています。

【このコースで扱うトピック】

このコースの最後では、会社用のホームページを作成していきます。しかし、人によって作成したいWebページは異なりますし、また流行のWebページも日々変化していきます。

このコースの基本的なコンセプトとして、これらの違いや変化にも柔軟に対応し他のWebページの作成にも応用できるよう、ビジネスに利用するWebページの作成においてポイントとなる箇所と対応方法をできるだけ幅広く解説しながら進めていきます。

このコースで扱うトピックは、これらのものになります。

1. HTML・CSSの基本

• HTML・CSSの基礎と、これらの技術を用いてWebベージの構造を作成し、見た目を整える方法を学びます。

2. Bootstrapの基本的な使い方

• 応用的なトピックに入る前にBootstrapの基本的な使い方を学びます。

3. BootstrapによるWebデザイン

• BootstrapにはグリッドシステムやFlexユーティリティなど、Webページを自由にレイアウトするための機能が豊富に用意されています。またテキストや色、余白などに関する基本的なスタイルが予め用意されています。これらBootstrapのレイアウトに関する機能やスタイルを利用し、洗練されたデザインのWebページを作成する方法を学んでいきます。

• また近年、ユーザーがWebサイトへアクセスするのに利用する端末は、デスクトップパソコンやノートパソコンだけでなく、スマホやタブレットなどのモバイル端末からのアクセスが急増しています。これら異なるデバイスの画面サイズに応じて表示を自動的に最適化するデザイン手法であるレスポンシブデザインは、ビジネスに関連するWebサイトを作成する上で、非常に重要なトピックになります。

4. Bootstrap の部品

• Bootstrapには、ボタンやフォーム、メニューなど、様々な部品が用意されており、これらを利用することで洗練されたデザインのWebページを作成することができます。さらに各部品にもいくつかのパターンがあり、それらを組み合わせることでデザインのバリエーションも広がります。

• またBootstrapにはJavaScriptを活用し、よりダイナミックな動作を伴った部品も用意されています。これらは簡単な設定だけですぐに利用することができます。

• これらのトピックを通じて、洗練されたデザインのWebページを実装するのに欠かせない、Bootstrapの部品の設定方法を学んでいく予定です。

5. 総合プロジェクト

• このコースの最後には、実践的な知識を身に付けて頂けるよう、総合プロジェクトとして会社用のホームページを作成していきます。

このようにこのコースでは、これらのWebページの作成に欠かせないトピックをカバーすることにより、他のWebページにも応用の利く技術を身に付けて頂けるようデザインされています。また知識が定着するようポイント、ポイントで演習も用意しております。

TAKE THIS COURSE