HSP内向型のエンジニアがゆるく生きる方法を発信しています

ユーキャンの「プログラミング・Web制作入門講座」で学べる内容や評判などをまとめました

こんにちは、もっちーです。

この記事では、ユーキャンのについて解説します!

それでは見ていきましょう!

目次

ユーキャンの「プログラミング・Web制作入門講座」で学べる内容

この講座のカリキュラムと主要な学習テーマ「HTML」と「CSS」について解説します。

学べる内容は知ってるから、良い点などを知りたい!

という人は

の章に飛んでもらうと、スムーズに記事を読んでもらえると思います。

もっちー
それでは、まずは学べる内容について解説します

学べる内容について

ユーキャンの「」は、Webページを作る際に基本となる

  • HTML
  • CSS

について実践的に学べる講座です。

評価の高いWebページには、さまざまな情報が「分かりやすく」整理されています。

ページ内に多くの情報があればあるほど、この「分かりやすさ」が重要になるのです。

そこで情報の種類によって「デザインの違い」をつけることで、読者に分かりやすく伝えることができます。

例えば

  • タイトルの文字を大きくしたり
  • 選択肢であれば箇条書きにしたり
  • 文字の色をカラフルに変えたり

このような装飾があります。

書籍やカタログなどの印刷物であれば、その情報は印刷原稿として指定されます。

Webページの場合は、コーディング(またはプログラミング)と呼ばれる文字や記号で指定する方法で行います。

ユーキャンの「」は、コーディングの基本になる「HTML」と「CSS」を基礎から実践的に学べるカリキュラムが特徴です。

HTMLとは?

HTMLとは「ハイパーテキスト・マークアップ・ランゲージ(Hyper Text Markup Language)」の略です。

簡単に言えば、Webページを作るときに使う言葉です。

ハイパーテキストは、ページとページの間に「リンク」というつながりを作っておいて、クリックすると簡単にジャンプできる仕組みのことです。

紙に書かれたテキストとWebページ上にあるリンク付きのテキストを比べると、Webページのほうが自由にジャンプできるので優れているといえます。

もっちー
ハイパーテキスト、つまり「テキストを超えたテキスト」と呼ばれるのはそのためです

マークアップとは、あるテキストに印をつける(マーキング)ことで、その部分が文の構造のなかでどのような役割を果たしているかを明示するしくみです。

例えば

  • タイトルであれば<h1>などでマークする
  • 強調したい部分は<strong>で囲む
  • 箇条書き<ul>と<li>で分かりやすくまとめる

などの工夫を入れると、Webページ上では視覚的に分かりやすく表示されます。

もっちー
↑この箇条書きにも<ul>と<li>が使われています

同時に、GoogleやYahoo!などの検索エンジンがWebページの構造を把握する際にも用いられます。

Google ChromeなどのWebブラウザーで普通にWebページを見てもHTMLは表示されません。

表示メニューをクリックしてプルダウン表示される「開発/管理」にカーソルを合わせると「ソースを表示」が選べます。

ソースとはWebページの画面に表示されているコードのことで、これを指定するとアルファベットと記号で構成されたHTMLで表現された文字列を見ることができます。

CSS3とは?

HTMLでWebページ全体の骨組みを作っても、それだけではシンプルで味気ないテキストが表示されるだけで、わかりやすく魅力的なページにはなりません。

そこで、CSS「カスケーディング・スタイル・シート(Cascading Style Sheets)」を使うことで、HTMLで決められた各要素を装飾することができます。

カスケーディングとは、IT用語で優先順位を決める仕組みのことで、Webページの表示を統一させるCSSの機能を指しています。

スタイルシートとはテキストの装飾の仕方を優先的に指定するプログラムのことです。

CSSをスタイルシートに追加することで

  • 強調したい文章にマーカーを引く
  • 人が話しているような吹き出しを表示する

シンプルなWebサイトを見やすくオシャレにすることができます。

もっちー
たとえばこんな感じです!

実はHTMLだけでも、文字の色やレイアウトを変えることはできるのですが、それだけでは表示する環境によって見え方がバラバラになりがちです。

たとえば、Webブラウザーによって、HTMLのタグの持つ意味が異なることがあります。

そうなると、実際のユーザーが使っているブラウザーの種類によって、最初にデザイナーが意図していたものと異なる画面表示になることがあるのです。

ここで、CSSを使うと環境が異なっても、デザイナーが最初に意図したスタイルを優先的に表示させることができます。

つまり、Google ChromeやSafariなど異なるブラウザーで見ても、またWindowsやMacなどの異なるOSであっても、同じ表示を見ることができるようになるわけです。

商用サイトで特に重要になるHTMLとCSSの使い分け

HTMLで骨組みだけを作っておいて、CSSで別に装飾をしておくと、人間だけではなく検索エンジンにとってもわかりやすいページを作ることができます。

パソコンのモニターや、スマートフォンの画面でWebページを見て情報収集するのは人間だけではありません。

実は、検索エンジンでの検索結果に表示する順番を決めるために、「クローラー」と呼ばれるプログラムがさまざまなWebサイトを巡回して情報収集しています。

検索結果の上位に表示されると?

  • 多くのユーザーに見てもらえる
  • ページから商品を買ってもらえる
  • 会社の利益がアップする!!

このように検索結果の上位に表示されることは、Webページとしては大きなメリットになります。

しかし、クローラーに分かりづらい構造のHTMLが記述されていると、検索エンジンにうまく表示されなくなるのです。

実際の店舗でもECサイトでも、検索エンジンでの自社サイトの表示順序や紹介されるテキストの内容は売上に大きく影響します。

もっちー
HTMLとCSSの使い分けが適切でないと、会社の売上ダウンに繋がってしまいます

売上を逃さないためには、Webページの構造自体はクローラー用にシンプルなHTMLで記述しておき、人間が見たときの魅力的な表示はCSSでコントロールすることが有効なのです。

以上のような理由から、商用サイトなどの検索エンジン対応が必要なWebページでは、HTMLとCSSをしっかり区別して作っておく必要があります。

ユーキャンの「」では、このような実践的なWebページ制作に必要な基礎がしっかり学べるのです。

ユーキャンの「プログラミング・Web制作入門講座」の特徴(良い点)

ここまでは学べる内容について解説しました。(長文になってしまったので、見づらかったかもしれません・・)

それではのメリットを紹介していこうと思います。

  • 基礎の基礎から学べる
  • トライ&エラーの繰り返しで実践的スキルが身につく
  • オンラインで講師からアドバイスがもらえる
  • 最終課題でデモサイトを制作できる

それぞれ詳しく解説していきます!

基礎の基礎から学べる

ユーキャンの「」では、インターネット経由で見ることができるオンライン教科書を使って学習します。

初歩的な用語の意味からわかりやすく解説されているため、これまでWeb制作についてほとんど知らない人でも問題なく学習を進めることができるでしょう。

さらに、受講期間が終わってもオンライン教科書は閲覧可能なので、いつでも振り返りができます。

もっちー
自分のペースで学習を進められるのが嬉しい点です

トライ&エラーの繰り返しで実践的スキルが身につく

プログラミング学習は手を動かすことで理解が深まるものです。

ユーキャンの「」は、社のオンライン学習サービスを採用しています。

実際に自分で打ち込んだコードがすぐにWebページとして表示される仕組みなので、トライ&エラーを繰り返しながら実践的な学習を進められるのです。

もっちー
プログラミングは実践することが大切なので、ユーキャンの講座内容であれば効率よくスキルが身につきます

オンラインで講師からアドバイスをもらえる

エラーが解消できずに学習が進まない…

このように、学習を進めていく途中で分からないことが多いと思います。

とくに教科書を見ながら一人で進める学習は、わからないことが出てくると、プログラミングを挫折する原因になりがちです。

では「オンライン個人レッスン」を利用してすることで、経験豊富な講師から受講者のレベルに合わせた的確なアドバイスをもらえます。

自分では思いつかなかった方法も、同時に学び取ることができるに違いありません。

もっちー
いつでも質問できる環境があることは魅力的です

最終課題でデモサイトを制作できる

最後の課題として自分でWebページを作ることになります。

ユーキャンの「」の最終課題は「料理紹介ページの制作」です。

学んできた知識とスキルを使って、自分の力で作品を作りあげていきます。

もちろん、完成するまでオンライン個人レッスンで講師からのアドバイスを受けることもできるので心強いです。

もっちー
最後まで楽しくWeb制作を続けることができます

ユーキャンの「プログラミング・Web制作入門講座」の特徴(微妙な点)

Webページ制作に必要な基礎知識とスキルを効率的かつリーズナブルに身につけることができるユーキャンの「」には多くのメリットがあります。

しかし、あえて微妙な点を挙げるとすれば

  • 学習の環境を用意する必要がある
  • 古いパソコンでは受講できない可能性がある

この2点が考えられます。

それぞれ解説するので、受講を考えている人は忘れずにチェックしておきましょう。

学習の環境を用意する必要がある

講座受講にはパソコンとインターネット接続環境が必須となります。

すでにそのような学習環境がある場合には問題ないのですが、なければハードウェア投資が必要になるのです。

古いパソコンでは受講できない可能性がある

また、パソコンが古かったり、接続環境が安定していなかったりすると、新しい機種を導入する必要があるかもしれません。

最後に

いかがだったでしょうか?

この記事では、ユーキャンの「」について解説しました。

最後までしっかり受講すれば、Web制作で仕事をするためのスキルが身につくので、受講後も仕事のツールとして使えることを考えるとコスパの良い講座でしょう。

ITパスポートの講座についても解説しているので、興味がある人はぜひ読んでみてください。

あわせて読みたい
ユーキャンの「ITパスポート資格取得講座」で学べる内容 こんにちは、現役エンジニアのもっちーです! この記事では、ユーキャンのについて解説します。 それでは見ていきましょう! 【ユーキャンの「ITパスポート資格取得講座...
よかったらシェアしてね!
  • URLをコピーしました!
目次