テンプレートですぐできる！ すぐに身につく！ HTML＆CSS 個人サイトをつくろう！
- 著作者名：ガタガタ
-
- 書籍：2,695円
- 電子版：2,695円
- B5変：256ページ
- ISBN：978-4-8399-7600-2
- 発売日：2021年08月24日
- Tweet
- mixiチェック
内容紹介
サイトを作るってとっても楽しい！ 基本のテンプレートがあるから誰でも作れる！
現代の個人サイトをつくるための情報を1冊にあつめました。
==================================================================================
創作・同人サイトのためのテンプレート・プログラム配布・ノウハウ発信メディア
「do」（https://do.gt-gt.org/）を運営する著者が、
HTMLとCSSについてやさしく丁寧に解説します！
==================================================================================
本書は特典のテンプレートを使いながら、１からHTMLとCSSの基礎知識を身に付けられる、HTML＆CSS入門に最適な1冊です。
テンプレートを使いながらHTMLとCSSを理解することで、手軽に知識を身に付けることができます。
＜本書の特徴＞
●はじめてでもHTMLとCSSの基本をしっかり学べる
●イマドキのWeb事情にもしっかり対応。個人サイト×レスポンシブデザイン
●特典テンプレートを使って実践的に学べる！
●お好みのものを使ってサイトづくり！
嬉しい≪3種≫の特典テンプレート＆サンプルファイルつき！
＜こんな人におすすめ！＞
●HTMLとCSSを基礎から学びたい人
●ウェブサイトを自分で作ってみたい人
●昔、個人サイトを作っていた人
＜個人サイトって何？＞
個人サイトと聞いて懐かしい気持ちになった方もいるのではないでしょうか。
個人サイトとはその名の通り、個人が作成し、運営しているウェブサイトのことです。
今から少し昔、TwitterやPixivがなかった時代、個人サイトといえば、イラストや漫画、小説を書く人たちにとっては欠かせない、コミュニケーションツールの1つでした。時折Twitterでも「#個人サイト」がトレンドに上がるなど、当時個人サイトを持っていた人たちにとっては、「良き時代」の1ページとして、心に刻まれているのではないでしょうか。
本書の特典テンプレートを使えば、簡単に≪現代仕様≫の個人サイトをつくることができます。
HTMLとCSSについて、しっかり解説もしているので、昔の知識を今にアップデートしたい、という人にもピッタリな1冊です。
==
「著者あとがき」より抜粋：
2000年代ごろ、インターネットが今ほど発達しておらず、SNSという存在がまだ創作界隈では大きくなかった時代に、創作者のネット上での交流は、個人サイト上で行われるのが主流でした。
創作者たちは、インターネットという全世界に開かれた場所に自慢の作品を発表する場を設けるため、HTMLを勉強し、ホームページ制作ソフトを駆使して、自分だけの城を築き上げました。
しかし当時は、Twitterのようにだれもが同士を見つけて気軽に繋がれるSNSのようなものはありません。そこで、個人サイトたちを繋ぐべく有志の手によって立ち上げられたのが、特定の作品ジャンルやキャラクター等に特化した「登録型サーチエンジン」や、名簿に登録したり自分のサイトにバナーを貼ったりすることで参加を表明できる「同盟」と呼ばれる参加型サイトたちでした。
しかし2010年代ごろには、PixivやTwitterなどのSNSがユーザー数を増やしていきます。わざわざHTMLを勉強しなくても、メールアドレスさえあれば登録できて、作品もカンタンに公開できて、気になる人をボタンひとつで「フォロー」して追いかけることのできるSNSは、みるみるうちに創作者たちに広まり、とても大きくにぎやかな交流の輪を築いていきました。
開設や更新に手間、知識そして時間が必要な個人サイトは、台頭するSNSに押されるかのように、徐々に姿を消していきました。素材サイトやテンプレート配布サイト、プログラム配布サイトも少しずつ更新がまばらになり、今ではレスポンシブ対応や最新PHPバージョン対応などの、現在のウェブ制作事情に対応している個人サイトはそう多くはありません。
では、個人サイトを持つことは、もはや時代遅れなのでしょうか？ 決してそんなことはありません。
個人サイトは財産です。SNSと違って突然サービスを終了することはありませんし（レンタルサーバーのサービスは終了するかもしれませんが、別のサーバーへ移行すれば問題なしです）、突然UIや仕様が変更されて困惑させられることもありません。PHPが使えるサーバーなら、配布プログラムを借りて、さまざまな機能を追加することもできます。何よりも、手塩にかけて制作し、育てた自分だけの城は、とても愛しく感じられるものです。それに、インターネットを通じて何かすることが当たり前の今、自分だけのサイトを作ることで身に付けたサイト制作やHTML、CSSの知識は、思いがけないところで役立つでしょう。
==
充実のラインナップに加え、割引セールも定期的に実施中！
商品を選択する
| フォーマット | 価格 | 備考 | |
|---|---|---|---|
| 書籍 | 2,695円 | ||
| 2,695円 | ※ご購入後、「マイページ」からファイルをダウンロードしてください。 ※ご購入された電子書籍には、購入者情報、および暗号化したコードが埋め込まれております。 ※購入者の個人的な利用目的以外での電子書籍の複製を禁じております。無断で複製・掲載および販売を行った場合、法律により罰せられる可能性もございますので、ご遠慮ください。 |
||
備考
●ガタガタ
幼いころから漫画、ゲーム、小説、お絵かきが好き。インターネット黎明期のころより有料サーバーを借り、自分のサイトを持って作品発表の場をつくっていた。創作者の作品発表・交流のきっかけになることを願い、2019年に創作・同人サイトの製作を支援するサイト「do」（https://do.gt-gt.org/）をたちあげる。最新のWebトレンドに沿ったHTMLテンプレート・プログラム配布のほか、サーバーの借り方からHTML/CSS編集まで、初心者にもわかるようにやさしく解説している。
目次
------------------------------------------------Chapter 1
------------------------------------------------
最初に知っておきたい ウェブサイトの基礎知識
STEP 01 ウェブサイト表示の仕組み
STEP 02 ウェブサイト制作に必要なもの
STEP 03 プログラミング用テキストエディタを用意しよう
STEP 04 レンタルサーバーを借りてみよう
Column 個人サイトにオススメのレンタルサーバー
STEP 05 テンプレートのつかいかた
Column Javascript って何？
STEP 06 ウェブサイト作成から公開までの流れ
STEP 07 実際にカンタンなHTMLを書いてインターネット上に公開してみよう
Column レスポンシブデザインって何？
------------------------------------------------
Chapter 2
------------------------------------------------
サイトの構成・デザインを考えよう
STEP 01 どんなページが必要？
STEP 02 テンプレートの選び方
STEP 03 文章が読みやすいデザイン
STEP 04 イラストや写真をキレイに見せるデザイン
Column 大量の画像を展示したいときのTips fuwaimgの使い方
Column 名前変換フォームやメールフォームを作るには
------------------------------------------------
Chapter 3
------------------------------------------------
ウェブサイトの骨組みをつくる HTMLの基本を知ろう
STEP 01 HTMLの役割
STEP 02 HTML基本のルール
STEP 03 HTMLの基本構成
STEP 04 最近のウェブサイトのよくあるHTML構成
STEP 05 見出しタグを使ってみよう
STEP 06 文章をマークアップしてみよう
Column 現在は廃止、もしくは非推奨になったタグ
STEP 07 画像を表示してみよう
STEP 08 リンクを貼ろう
STEP 09 リストタグを活用しよう
STEP 10 テーブルタグで表を作ってみよう
STEP 1 1 コメントを活用して分かりやすいHTMLを書こう
STEP 12 サイトのメニューを編集してみよう
STEP 13 ブロックを増やしたり減らしたりしてみよう
STEP 14 よく使うHTMLタグリスト
------------------------------------------------
Chapter 4
------------------------------------------------
デザインにもこだわりを！ CSSの基本を知ろう
STEP 01 CSSの役割
STEP 02 CSS基本のルール
STEP 03 CSSでもコメントを活用しよう
STEP 04 文字の装飾にまつわるCSS
STEP 05 背景の設定
STEP 06 フォントの指定
Column テンプレートのフォントを変更してみよう
STEP 07 余白の設定
STEP 08 レスポンシブ対応部分の編集方法
STEP 09 自分好みのデザインのパーツを作ってみよう
STEP 10 CSSが効かないときは
STEP 11 よく使うCSSプロパティリスト
------------------------------------------------
Chapter 5
------------------------------------------------
もっと楽しくサイト制作！ 便利なツールを使ってみよう
STEP 01 テキストエディタの便利な機能を活用しよう
STEP 02 HTML・CSSタグのジェネレータを活用しよう
STEP 03 配色ツールを利用してみよう
STEP 04 Twitterタイムラインを埋め込んでみよう
STEP 05 フリー素材を活用しよう
Column SVGファイルって何？
STEP 06 CSS編集で困ったときはデベロッパーツール
Column スマホやタブレットからサイトを更新する
------------------------------------------------
Chapter 6
------------------------------------------------
サイト公開まであと一歩！
STEP 01 ブラウザで表示を確認してみよう
STEP 02 表示が崩れたり、不具合が起きた場合の対処法
STEP 03 ファビコンを設定しよう
STEP 04 Twitterカードの見た目を設定しよう
STEP 05 サイトを公開しよう
STEP 06 安全にサイトを運営するために
------------------------------------------------
APPENDIX
------------------------------------------------
本書の特典テンプレート
テンプレートで楽しくカスタマイズ！
知っておくと便利！ HTML&CSSにまつわる用語集
