ホームページの作り方が分かる本10選+ホームページ作成ツール3選【作成までの目安期間・難易度など】

  • ホームページの作り方を本で学びたいな。
  • オススメの本はないかな
  • 以外で簡単に作れる方法はないかな
  • 費用はどのくらいかな

本記事ではこのような疑問を解決していきます。

本記事を書く僕は東京のIT企業で働くエンジニア。ホームページを色々な方法で作ってきました。(最近作ったポートフォリオサイト: https://www.yujirosaito.com)

本記事の内容

  • ホームページの作り方が学べる本10冊
  • ホームページを本以外で作る方法(ホームページ作成ツール2つ、開発会社orフリーランスに依頼する方法)

ホームページの作り方が学べる本10冊

ホームページの作り方を学べる本10冊です

1. HTML&CSSとWebデザインが 1冊できちんと身につく本

“内容”
「4つのレイアウトパターン」と「レスポンシブデザイン」を
実際に手を動かして作りながらサイト制作のきほんが学べる!
本書はWeb制作の基礎言語であるHTMLやCSSの書き方だけでなく、多くのWebサイトが採用している4つのレイアウト手法を学ぶことで、1冊を読み終えると各言語の知識とWebデザインの基礎が身につく作りとなっています。Webデザインの新しい手法を積極的に紹介しつつ、実際の制作現場で使われている堅実な手法もバランスよく取り入れ、学習用ではない「現場で役に立つ」実践的なテクニックを数多く盛り込みました。また、Webサイト制作を楽しく学ぶため、サンプルサイトの見映えにもこだわりました(完成後は手を加えて読者のプロフィールサイトとして利用可能)。ライブ感のあるチュートリアル学習により、まるでWebデザイン会社でOJT(オン・ザ・ジョブ・トレーニング)を受けているような体験型の独習書です。サンプルデータのダウンロードサービス付き。

2.  1冊ですべて身につくHTML & CSSとWebデザイン入門講座 (DL特典: CSS Flexbox チートシート)

“内容”
【全国の書店員さんがオススメする本「CPU大賞」第1位受賞! 】
【感謝を込めて、期間限定 購入者特典!!】
本商品を2020/3/24(火)00: 00から2020/9/24(木)23: 59までにご購入いただくと、「CSS Flexbox チートシート データ」の特典が受けられます。
商品出荷時にダウンロードURLをメールにてお知らせします。ダウンロードURLをお届けするためにメールが送信されますので、ご了承のうえご購入ください。
なお、特典のダウンロード期限は2020/12/23(水)23: 59となります。
お忘れないようにご注意ください。
★★★★★★★★★★★★★★★★★★★★★★★★★★★

【全国の書店員さんがオススメする本「CPU大賞」第1位受賞!】
今、一番売れているHTML本!
大反響! 9刷突破の大ヒット!
全国の書店員がオススメする本(CPU大賞)第1位!
2019年上半期売上 第1位!※
Web制作に必要な知識がすべて身につく!
※日販売上げランキング: HTML関連書籍

—————————————————————————-
Web界隈やデザイナーに大人気!
Web関連の情報やデザインについて記事が学べる『Webクリエイターボックス』の中の人、
Manaによる渾身のHTML & CSSとWebデザインが学べる本
—————————————————————————-

今のWebサイトの作り方が一気に学べる!

・知識ゼロから体系的に学べる!HTMLとCSSの基本
・最新の技術に対応!レスポンシブ、Flexbox、CSSグリッド
・手を動かしながら学べる!プロの現場で役立つテクニック
・コードの知識からデザインのことまで1冊ですべて学べる!

WebクリエイターボックスのManaが教える
Webサイト制作の定番&旬のスキル。
この1冊で必要なことがすべて学べる!

コードもデザインも全部学べる!

●本書の対象読者
・これからWebサイトを作り始める初心者
・HTMLとCSSを基本から学びたい人
・美しいデザインのWebサイトを作りたい人
・Webの最新技術を学びたい人

●CONTENTS
———————————————–
CHAPTER 1 最初に知っておこう!Webサイトの基本
CHAPTER 2 Webの基本構造を作る!HTMLの基本
CHAPTER 3 Webのデザインを作る!CSSの基本
CHAPTER 4 フルスクリーンのWebサイトを制作する
CHAPTER 5 2カラムのWebサイトを制作する
CHAPTER 6 タイル型のWebサイトを制作する
CHAPTER 7 外部メディアを利用する

3. 本当によくわかるHTML&CSSの教科書 (本当によくわかる教科書)

“内容”
「Webサイトを手軽に作ってみたい」「HTML、CSSの基礎を学びたい」と漠然と思っている人から、
「一度Webサイトを作ろうとしたことがあるが挫折した」という人まで。

プログラミング知識は一切不要。
本を読んで学びながらサンプルファイルにコードを書いていくことで
HTMLとCSSの基礎を完全習得 & デザイン性の高いWebサイトを作れます!
最新バージョンのHTML5とCSS3をベースに学んでいきます。

●本書の特長
・本書を読むことで、トップページ、ギャラリー、地図、お問い合わせフォームなどを持つ、基本のWebサイトが作れます。
・丁寧で分かりやすい文章とたくさんの図示があるので、初心者もHTML、CSSをきちんと理解できます。
・複数ページから成り立つ従来のWebサイトはもちろん、シングルページサイトも作成できます。
・デザインの良いWebサイトを作りたい、HTMLとCSSを学んで自分でWebサイトを作ってみたい……
けど、難しそうで第一歩が踏み込めない、挫折したからあきらめている。そんな人のための本です。

●本書の対象読者
・Webサイトを自分で作ることに興味はあるけれど尻込みしていた人
・HTML、CSSの基礎をしっかり、かつ手軽に学びたい人
・デザインの良い高機能なWebサイトを簡単に作りたい人
・Webサイトを作ろうとしたことはあるけれど挫折した人
・新しいバージョンであるHTML5、CSS3を学んで、過去のバージョンよりもさらに手軽にWebサイトを作りたい人

●目次
はじめに
本書の使い方
サンプルファイルの使い方
Chapter1 Webサイト制作の事前準備
Chapter2 HTMLの基本
Chapter3 CSSの基本
Chapter4 Webサイトの作成
Chapter5 レスポンシブ対応
Chapter6 Webサイトの集客
Chapter7 Webサイトの公開
付 録 シングルページサイトの作成
索引
チートシート

4. 世界一わかりやすい HTML5&CSS3コーディングとサイト制作の教科書

“内容”
言語の基本学習からサイト作成と管理までを1冊にまとめた入門書!

webサイト制作者を目指す人が必ず習得しなければならない言語「HTMLとCSS」の記述と、
サイト制作の基礎知識から公開・管理方法までを15レッスンで解説。
HTMLパートはコーディングの基本から画像とリンク、リストとナビゲーション、
テーブルおよびフォームのマークアップ方法を、
CSSパートでは文字のスタイリングからレイアウト手法までを丁寧に解説。
ダウンロードした実習ファイルに記述することで、細かくステップ分けした各単元の内容を手を動かしながら学びます。
専門学校の教壇に立つ著者陣が実際の講義内容を体系立て、
さらに学校実施のテストと同等の練習問題を各レッスンの章末に用意した、HTML5とCSS3の教科書です。

5. たった2日で楽しく身につく HTML/CSS入門教室

“内容”
最新のウェブサイトづくりが、はじめてでもよくわかる!
レッスンごとに課題が分かれているから、反復学習にも最適
パソコン/スマートフォン/タブレット表示に完全対応

本書の主人公であるみさき君が、リコーダー演奏会の告知サイトをつくるために、
HTML/CSSの達人、ヘンリーからWebサイトづくりを学びます。
漫画と共に、HTML/CSSの基礎知識からコンテンツのつくり方、
ネットへの公開までを、楽しみながら学習しましょう。

●こんな人にぴったりです
ウェブサイトをこれからつくってみたい人
自分のサイトで写真や文章を人に見せたい人
設計から公開までにやるべきことを短期間で身につけたい人
苦手な技術や課題を何度も学習したい人

●目次
■1時限目 ウェブサイトを設計しよう
■2時限目 ウェブサイトづくりの準備をし、HTMLの基礎を学ぼう
■3時限目 HTMLを書いてみよう
■4時限目 画像とリンクを設定しよう
■5時限目 CSSでページを装飾しよう
■6時限目 ページを完成させよう
■7時限目 さまざまなデバイス表示を考慮しよう
■8時限目 サイトを公開しよう

6. これから学ぶHTML/CSS

“内容”
本書は、WebプログラマがWebプログラマの視点で、Webプログラミングに必要なHTML/CSSを学習するための初心者向け書籍です。

PCに電源を入れてログインした後、まず起動するソフトウェアは何でしょうか? PCの使い方にもよりますが、
恐らくEdgeやSafari、Chromeなどのブラウザと答える人が多いのではないでしょうか。

これらのブラウザを利用した際、そこに表示された画面にはほぼ間違いなくHTMLとCSSが使われています。ブラウザに表示される
さまざまなものの裏にWebシステムがかかわっている現状を考えると、これらWebシステムを作成するプログラマも、
HTML/CSSを習得しておく必要があります。

【目次】
Chapter 1 Webの仕組みとHTML/CSSの役割
Chapter 2 HTML/CSSのプログラミング環境を作ろう
Chapter 3 初めてのHTML
Chapter 4 基本の文書タグ
Chapter 5 文章を束ねるタグと一部となるタグ
Chapter 6 リスト表示タグ
Chapter 7 テーブル表示タグ
Chapter 8 リンクとコンテンツ埋め込みタグ
Chapter 9 フォーム関連タグ
Chapter 10 CSSの基本
Chapter 11 CSSセレクタ
Chapter 12 CSSレイアウト
Chapter 13 レスポンシブレイアウト

7. これからWebをはじめる人のHTML&CSS、JavaScriptのきほんのきほん

“内容”
現在の「Web技術」のきほんを、1冊でしっかり学ぼう!

本書は、HTMLとCSS、JavaScriptの基本を1冊で学べる本です。
現在、HTMLとCSS、JavaScriptという「Web」を構成する技術は、WebサイトやWebアプリケーションをはじめとして、さまざまな環境で使われるようになっています。本書では、その3つの技術に焦点をあてて、1冊で「現在のWeb」の基本を総合的に学べるようにしました。

これからWebの仕事をしたいと考える方にとって、最初のスタートとして最適な1冊です。

HTML5.1/CSS3 対応。

===(以下、著者による「はじめに」より編集・抜粋)===

本書は、HTMLとCSS、JavaScriptすべてを1冊で紹介した欲張りな本です。

ただ、それは単に「お得」とか「色々なことをさらっと」というわけではありません。これから「Web」という技術を学んでいきたいという方に向けて、最初に必要となる知識をしっかりと身につけて欲しくて執筆しました。

HTMLといえば、最初に思いつくのは「Webサイト(ホームページ)制作」です。ただ、本書はWebサイト制作の入門ではないため、それに必要となる次のような知識については、あえて触れていません。

・Webサイトの設計・画面設計手法
・コンテンツの作成方法
・Webサイトの公開方法やメンテナンス方法など

これら、「Webサイト制作に必要な知識」は他の書籍にお任せし、本書は技術としてのHTML/CSS/JavaScriptの解説だけに絞りました。

「Web」の技術は、今やサイト制作だけでなく、スマートフォン向けのアプリケーション開発やPepper等のロボット開発、AIのインタフェース開発など、あらゆる分野で活用されています。そんなとき、これらの技術をまとめて解説する書籍があればと思い、執筆するに至りました。

Webサイト制作者になりたい方はもちろん、これまでJavaやPythonなどのプログラミング言語は学んできたものの、HTMLやJavaScriptについて学ぶ機会がなかったエンジニアの方、そしてこれからネット業界、AI業界を目指す学生の方など、幅広い方々に活用して頂ければありがたく思います。

===(「はじめに」以上)===

===章構成===

Chapter 1 Webの開発環境を整えよう
Chapter 2 HTMLとCSSのきほんを学ぼう
Chapter 3 スマートフォン対応のきほんを学ぼう
Chapter 4 CSSフレームワークのきほんを学ぼう ~ Bootstrapでフォームを作る
Chapter 5 JavaScriptのきほんを学ぼう
Chapter 6 イベントドリブンのきほんを学ぼう ~ DOMを使ってストップウォッチを作る
Chapter 7 Ajax通信のきほんを学ぼう ~ jQuery、Vue.jsにもチャレンジ!

8. 初心者からちゃんとしたプロになる HTML+CSS標準入門

“内容”
【プロとして「独り立ち」するために、1日30分からはじめる!】

本書は、Webサイトをイチから作ることで、HTML+CSSの基本から応用までを習得していく教科書です。「1日30分からはじめる」をテーマに、Web制作にかかわる知識や技術を解説した「ちゃんとしたプロになる」シリーズの2冊目となります。

本書で学べることは、主に次の3つです。

1つめは、「いま」のWebデザインと現場での実制作の流れ。いま主流のレイアウトや表現手法、制作技術やツールといった、現場でプロとして活躍するためにベースとなる知識を習得できます。

2つめは、HTMLとCSSの基礎。HTML・CSSのごく初歩的な書き方から解説しており、本格的なソースコードを書くのは初めてという方にもわかりやすい内容になっています。

そして、3つめが実際にWebサイトを作るノウハウ。1つのHTMLファイルで完結するシンプルなWebページから、モバイルファーストで設計しFlexboxやCSS Gridといった流行りの手法を取り入れたものまで。タイプや難易度の異なる5つのサイトを作りながら、表現の幅を広げていきます。

本書を通じて、プロとして「独り立ち」するために礎となる力が身につくはずです。

〈こんな方にオススメ〉
・HTML+CSSを本格的に学んでみたい方
・Webデザイナーやマークアップエンジニアを目指す方
・Webサイトを自分の手で作り上げてみたい方

〈本書の特長〉
・作りながら覚えることで、学んだことをすぐに実践できる
・記事ごとに学習時間の目安を設けており、学習教材としても利用しやすい
・大学や専門学校で教えている現役の先生たちが、ていねいに解説している

〈本書の内容〉
■Lesson 1 Webデザインの“いま”
■Lesson 2 Webサイトを制作する準備
■Lesson 3 HTMLとCSSの基礎
■Lesson 4 HTMLとCSSの応用
■Lesson 5 シンプルなWebページを作る
■Lesson 6 シングルページのサイトを作る
■Lesson 7 Flexboxを使ったサイトを作る
■Lesson 8 CSS Gridを取り入れる
■Lesson 9 レスポンシブ対応サイトを作る

9. スラスラわかるHTML&CSSのきほん 第2版

“内容”
ベストセラーが大改訂!

累計4万部突破の前作が、5年ぶりの大改訂!

小さなサイト作りを通してHTMLとCSSの基礎が学べる入門書の決定版!
第2版ではPCだけでなくスマホやタブレットにも対応したサイトが完成します。
ソースコードは現在のトレンドに合わせ、解説もいっそう丁寧にわかりやすくなりました。

これからWeb制作を始める人にも、HTML/CSSを学び直したい人にもおすすめの、充実の内容です!

10. 今すぐ使えるかんたん ホームページHTML&CSS入門

“内容”
「ホームページを手づくりしよう! 」
Webサイトの制作やデザインは複雑になり、コーディング専用のエディタで効率よく制作する時代ですが、コードを丁寧に記述しながらホームページをつくりあげるのも楽しいもの。本書は豊富なビジュアルと細かな入力&操作解説で、シンプルなページを作成しながらHTMLとCSSが学習できる入門書です。「古都さんぽ」をテーマとした1トップページと2風景紹介の記事ページ、3観光サイトへのリンク集ページ、4写真ギャラリーページ、5自己紹介の5ページ構成のサイトをチュートリアル形式で作成し、無料ホームページサービスで公開するまでを解説します。Windows10付属のアプリとCDに収録したフリーソフトでサイト作成がすぐにはじめられます。解説のステップごとに用意したHTML、CSS、画像ファイルも収録しているので、迷わずに学習を進めることができます。

ホームページの作り方を本以外で学ぶ方法2つ

本以外でホームページを作る方法もあります。方法は下記のとおり

  • ホームページ作成ツールを使う
  • 開発会社orフリーランスに依頼する方法

1. ホームページ作成ツールを使う

ホームページ作成ツールを使うのも結構オススメです

  • 月額: 500円〜
  • 作成期間: 数時間

自作にこだわりが無ければホームページ作成ツールでサクッと作ってしまうのがオススメです。

自作だと数ヶ月かかりますが、ホームページ作成ツールを使えば今から1-2時間とかで公開できてしまいます。

※僕がWixで作ったサイト: https://www.yujirosaito.com

人気ホームページ作成ツール3つ

» Wixを使ったホームページの作り方を画像30枚で解説【感想: 思ってたより簡単だった】

2. 開発会社orフリーランスに依頼する方法

開発会社orフリーランスに依頼して作成してもらう方法もあります

  • 費用目安: 10万円〜
  • 作成期間: 1-2ヶ月

ホームページ開発依頼が頼めるサービス2つ

以上で本記事は終わりです。最後まで読んで頂いてありがとうございました。

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です