ドットインストール

ドットインストールの「動画で学べるWordPress入門講座」を紹介します。ドットインストールでは、初心者向けに、動画でWordPressの基礎やカスタマイズ方法を解説するレッスンがあります。

WordPress以外にも、プログラミングやHTMLやCSSなど、様々なWeb開発の基礎技術を学ぶことができます。Web開発の基礎を学びたい方には、非常に役に立つ学習サイトです。自分の興味のある分野のレッスンを探してみましょう。

ちなみに、初心者向けのレッスンが無料で公開されています。中級者・上級者向けのレッスンは有料になっているものが多いです。

はじめに

ドットインストールとは?

ドットインストール

ドットインストールは、3分動画でマスターする初心者向けプログラミング学習サイトです。

ドットインストールでは、様々なレッスンが公開されていますが、WordPress関連では、特に下記のレッスンをお勧めします。

尚、レッスンは初心者向けの内容になっています。
初めてWordPressやWeb関連の技術を学ぶ人向けに解説されているので、初心者でも非常に分かりやすいです。

公式サイト

ドットインストール

初心者にお勧めのレッスン

WordPress入門

人気のブログシステムであるWordPressについて、基本的な使い方やゼロからテーマを作る方法について解説されています。

WordPress入門

レッスン内容

#01 WordPressとはなにか?
#02 WordPressをインストールしよう
#03 ダッシュボードを使ってみよう
#04 WordPressの設定をしてみよう
#05 記事を投稿してみよう
#06 固定ページを作ってみよう
#07 ゼロからテーマを作ってみよう
#08 文書の構造を作っていこう
#09 ヘッダーを作りこんでいこう (1)
#10 ヘッダーを作りこんでいこう (2)
#11 記事のスタイルを作りこもう
#12 サイドバーを作っていこう
#13 ナビゲーション、フッターの完成
#14 WordPressテーマに変換しよう
#15 ファイルを分割していこう
#16 header.phpを完成させよう
#17 ウィジェットに対応させよう
#18 記事の一覧を表示させよう
#19 アイキャッチ画像を表示させよう
#20 index.phpを完成させよう
#21 single.phpを完成させよう
#22 page.phpを完成させよう
#23 ショートコードを使ってみよう

HTML入門

ホームページやウェブサービスの画面を作る際に必要な、構造的な文書を書く方法について学びます。

HTML入門

レッスン内容

#01 HTMLとはなにか?
#02 必要なツールを用意しよう
#03 タグと属性を理解しよう
#04 はじめてのHTML
#05 meta、linkタグを使ってみよう
#06 styleタグを使ってみよう
#07 id、class、style属性を使ってみよう
#08 セクションについて理解しよう
#09 アウトラインを意識してみよう
#10 h1-h6タグで見出しを付けよう
#11 p、hr、pre、blockquote、divを使おう
#12 ol、ul、li、dl、dt、ddでリストを作ろう
#13 strong、br、spanを使ってみよう
#14 aタグでリンクを設定しよう
#15 imgタグで画像を表示させよう
#16 tableタグで表組みを作ろう
#17 formタグでフォームを作ろう
#18 inputタグで入力部品を作ろう
#19 textarea、buttonタグを使ってみよう
#20 checkbox、radio、labelを使ってみよう
#21 selectタグでセレクトボックスを作ろう
#22 HTML5から使える属性を使ってみよう
#23 文字参照を使ってみよう
#24 コンテンツモデルを理解しよう

CSS入門

Webサイトの見た目を制御するための言語の基礎を学びます。文字の色や背景色、画像の配置などを自在にデザインすることができます。

CSS入門

レッスン内容

#01 CSSとはなにか?
#02 はじめてのCSS
#03 セレクタとプロパティを理解しよう
#04 もっとセレクタを使ってみよう
#05 属性セレクタを使ってみよう
#06 擬似クラスを使ってみよう
#07 擬似要素を使ってみよう
#08 セレクタの詳細度を理解しよう
#09 プロパティの値を指定しよう
#10 ボックスモデルを理解しよう
#11 borderで境界線のスタイルを変えよう
#12 paddingで余白を制御しよう
#13 marginとmarginの相殺を理解しよう
#14 文字に関するプロパティを使ってみよう
#15 list-styleでリストのスタイルを変えよう
#16 cursorでカーソルの形状を変えよう
#17 backgroundで背景スタイルを変えよう
#18 displayで要素の配置方法を変えよう
#19 display:tableを使ってみよう
#20 positionで位置を調整してみよう
#21 z-index、overflowを理解しよう
#22 line-height、vertical-alignを理解しよう
#23 float、clearを使ってみよう

Web制作の実践編

ドットインストールには、Webサイトの制作方法やWeb関連の言語について解説したレッスンもあります。

実践!ウェブサイトを作ろう

実践的なレイアウト手法を学んだ後に、実際に架空のWebサイトを作る手順を解説しています。

実践!ウェブサイトを作ろう

レッスン内容

#01 ウェブサイトを制作していこう
#02 normalize.cssとfaviconを導入しよう
#03 styles.cssを作っていこう
#04 ヘッダーのマークアップをしていこう
#05 ヘッダーの背景を設定してみよう
#06 ヘッダーのスタイルを整えよう
#07 FontAwesomeを導入しよう
#08 トップ画像を配置しよう
#09 sectionのマークアップをしよう
#10 sectionのスタイルを整えよう
#11 特徴紹介欄のマークアップをしよう
#12 要素を左右に振り分けてみよう
#13 利用者の声欄を作っていこう
#14 要素を横並びにしてみよう
#15 アイコンをずらして配置しよう
#16 最後のセクションを作り込もう
#17 フッターを作ってみよう

レスポンシブなウェブサイトを作ろう

マルチデバイスに対応したWebサイトを作るための「レスポンシブWebデザイン」について学びます。

レスポンシブなウェブサイトを作ろう

レッスン内容

#01 レスポンシブウェブデザインを使おう
#02 開発の準備を整えよう
#03 メディアクエリーを使ってみよう
#04 ヘッダーを作り込んでいこう
#05 セクションのスタイルを整えよう
#06 特徴紹介セクションを作ろう
#07 ニュース一覧を作っていこう
#08 動画を埋め込んでみよう
#09 iframeの縦横比を保持してみよう
#10 要素を左右に振り分けてみよう
#11 ニュースを横に並べてみよう
#12 画面幅が広い時のレイアウトを作ろう
#13 メニューを出し分けていこう
#14 クラス名の衝突を解決しよう

まとめ

ドットインストールでは、WordPress以外にも、沢山の入門レッスンの動画が公開されています。特にプログラミング関連の入門レッスンが数多く公開されています。これらの入門レッスン動画で学び、Web関連技術を身に付けましょう。

この記事では紹介していませんが、プログラミング関連のレッスンでは、PHP入門・iOSアプリ開発・Androidアプリ開発のレッスンが人気があるようです。自分の興味のある分野のレッスンを探してみましょう。

参考

TechAcademyでWordPressを学ぶ(有料)

TechAcademy(テックアカデミー)は、プログラミングやアプリ開発を学べるオンライン完結のスクールです。WordPressを利用してWebサイトを構築するノウハウが学べます。

1人では続かない方のための実践型の短期集中学習プログラムです。パーソナルメンター(現役エンジニアの先生)が学習を補助してくれます。学習内容や課題制作でわからないことがあれば、チャットで質問したり、アドバイスをもらうことができます。また、パーソナルメンターが課題の進行状況を見守ってくれるので、学んでいる途中で挫折したり、学習をサボることがありません。つまり、短期間で専門分野のスキルを習得できます。

このオンラインスクールは、独自の学習システムを利用して自宅に居ながら全ての学習コースを学ぶことができます。専門分野のスキルを学んで転職や就職を目指す社会人・学生にお勧めのオンライン完結型のスクールです。

無料体験

実際の学習システムやカリキュラムを実際に確認できる「無料体験」や「無料説明会」が用意されています。受講をお考えの方は、無料体験や無料説明会を利用してみましょう。

以上