ほんの一手間で劇的に変わるHTML & CSSとWebデザイン実践講座
Mana(著)
/SBクリエイティブ
作品情報
※この電子書籍は固定レイアウト型で配信されております。固定レイアウト型は文字だけを拡大することや、文字列のハイライト、検索、辞書の参照、引用などの機能が使用できません。
----------------------------------------
Web界隈やデザイナーに大人気!
Web関連の情報やデザインについて記事が学べる『Webクリエイターボックス』の管理人、
Manaによる渾身のHTML & CSSとWebデザインの実践知識が一気に学べる本
----------------------------------------
ほんの一手間で劇的に変わる!
一歩進んだWebサイト制作の知識が一気に学べる!
・5つのサイトから学べる! 今のWebサイトを作る最新の技術群
・自由な表現ができる! 手描き、斜め、グラデーション、あらゆる装飾の作り方
・今日から使える! 表とグラフ、アニメーションなど、JavaScriptライブラリ
・動画、カスタム変数、Emmet、Sass、問題解決の知識まで
WebクリエイターボックスのManaが教える
Webサイト制作の実践&旬のスキル。
思い描いているものを形にできる魔法の1行が必ず見つかる!
コードも、デザインも、時短術も、全部学べる!
●本書の対象読者
・HTMLとCSSの基礎学習までを終えた人
・Webサイト制作のワンランク上のスキルを学びたい人
・自由な装飾表現を用いてWebデザインを作りたい人
・アニメーションなど動きがあるサイトを作りたい人
・練習問題やお題に挑戦し、成果を皆と共有したい人
・効率よくコードを記述できる方法を知りたい人
・独学で困った際などの問題解決法を学びたい人
もっとみる
商品情報
- 著者
- Mana
- ジャンル
- コンピュータ・情報 - コンピュータ・インターネット
- 出版社
- SBクリエイティブ
- 書籍発売日
- 2021.02.19
- Reader Store発売日
- 2021.02.24
- ファイルサイズ
- 157.4MB
- ページ数
- 352ページ
以下の製品には非対応です
※この商品はタブレットなど大きなディスプレイを備えた機器で読むことに適しています。
文字だけを拡大することや、文字列のハイライト、検索、辞書の参照、引用などの機能が使用できません。
この作品のレビュー
平均 3.5 (2件のレビュー)
-
エフェクトをかけるなど、画像で表現してしまいそうなところをCSSで表現するやり方などが載っていてまた1歩深く学べました。
前作の次に読むにはちょうどいいレベル感です。投稿日:2021.04.12
[荒川区に予約中]
「本当の自由を手に入れる お金の大学」(https://booklog.jp/item/1/4023318787)を読んで知った本。同著者でjavascriptの本もあったけれど…、とりあえずHTML&CSSに関する入門講座とこの実践講座の二冊を読んでみよう。
========
CHAPTER 1 最初に知っておこう!Webサイトの基本と必携ツール
1-1 Webページの仕組み
1-2 HTMLの基礎
1-3 HTMLの属性
1-4 CSSの基礎
1-5 より管理しやすいCSSについて
1-6 JavaScriptの読み込みの仕方
1-7 ブラウザーによる見え方の違い
1-8 デベロッパーツールを使いこなす
1-9 次章以降で学ぶこと
CHAPTER 2 「レスポンシブWebデザインとフォント」
2-1 作成するランディングページの紹介
2-2 シングルカラムのレイアウトとは
2-3 全画面背景で目を引くデザインの実現
2-4 フォントの詳しい使い方
2-5 アイコンフォントの使い方
2-6 スマートフォンでの閲覧に対応させる
2-7 ブレークポイントの詳細
2-8 表示領域にピタッと移動する方法
2-9 練習問題
2-10 カスタマイズしよう
CHAPTER 3 ブログサイトで学ぶ「装飾とカラムレイアウト」
3-1 作成するブログサイトの紹介
3-2 2カラムのレイアウトを知る
3-3 異なる画面サイズの閲覧に対応させる
3-4 各要素を装飾する①(見出し・画像・ボタン)
3-5 各要素を装飾する②(箇条書きリスト・番号付きリスト)
3-6 各要素を装飾する③(引用文・ページ送り・囲み枠)
3-7 各要素の装飾④(ヘッダー・フッター・ナビゲーション・表・フォーム)
3-8 スクロールに合わせて追従させる
3-9 練習問題
3-10 カスタマイズしよう
CHAPTER 4 コーポレートサイトで学ぶ「表組み、フォーム、JavaScript」
4-1 作成するコーポレートサイトの紹介
4-2 枠からはみ出す要素を作る方法
4-3 グラフでもっとわかりやすくする
4-4 画像とテキストを互い違いに表示させる
4-5 表でデータを示す
4-6 タイムラインを表示する
4-7 フォームの装飾
4-8 属性セレクター
4-9 練習問題
4-10 カスタマイズしよう
CHAPTER 5 イベントサイトで学ぶ「特定ページの作り方とアニメーション」
5-1 作成するイベントサイトの紹介
5-2 CSSでページ内をスルスル動かす
5-3 ブレンドモードで画像の色を変える
5-4 カスタムプロパティ(変数)を使う
5-5 CSSでアニメーションをつける(トランジション)
5-6 CSSでアニメーションをつける(キーフレーム)
5-7 斜めのラインのデザインを作る
5-8 グラデーションで表現する
5-9 スライドメニューを設置する
5-10 練習問題
5-11 カスタマイズしよう
CHAPTER 6 ギャラリーサイトで学ぶ「動画と画像の使い方」
6-1 作成するギャラリーサイトの紹介
6-2 背景に動画を設置する
6-3 画像をレスポンシブに対応させる
6-4 マルチカラムでレイアウトを作る①
6-5 マルチカラムでレイアウトを作る②
6-6 フィルターで画像の色を変える
6-7 カーソルを合わせると画像を拡大する
6-8 要素に影をつける
6-9 ライトボックスで画面いっぱいに表示する
6-10 アニメーションを加える
6-11 ダークモードに対応させる
6-12 練習問題
6-13 カスタマイズしよう
CHAPTER 7 HTMLやCSSをより早く、より上手に管理できる方法
7-1 Emmetを使って素早くコーディングする
7-2 calc関数で計算式を書く
7-3 Sassを使って効率を上げる
7-4 VSCodeでSassを利用する
7-5 ネストを使いこなす(Sassの便利な使い方①)
7-6 パーシャルでファイルを分割する(Sassの便利な使い方②)
7-7 スタイルを使い回せるMixin(Sassの便利な使い方③)
CHAPTER 8 サイトの投稿と問題解決
8-1 チェックリスト一覧
8-2 エラーメッセージを読み解く
8-3 制作に関する質問ができるサイト続きを読む投稿日:2023.01.21
新刊自動購入は、今後配信となるシリーズの最新刊を毎号自動的にお届けするサービスです。
- ・発売と同時にすぐにお手元のデバイスに追加!
- ・買い逃すことがありません!
- ・いつでも解約ができるから安心!
※新刊自動購入の対象となるコンテンツは、次回配信分からとなります。現在発売中の最新号を含め、既刊の号は含まれません。ご契約はページ右の「新刊自動購入を始める」からお手続きください。
※ご契約をいただくと、このシリーズのコンテンツを配信する都度、毎回決済となります。配信されるコンテンツによって発売日・金額が異なる場合があります。ご契約中は自動的に販売を継続します。
不定期に刊行される「増刊号」「特別号」等も、自動購入の対象に含まれますのでご了承ください。(シリーズ名が異なるものは対象となりません)
※再開の見込みの立たない休刊、廃刊、出版社やReader Store側の事由で契約を終了させていただくことがあります。
※My Sony IDを削除すると新刊自動購入は解約となります。
お支払方法:クレジットカードのみ
解約方法:マイページの「予約・新刊自動購入設定」より、随時解約可能です続巻自動購入は、今後配信となるシリーズの最新刊を毎号自動的にお届けするサービスです。
- ・発売と同時にすぐにお手元のデバイスに追加!
- ・買い逃すことがありません!
- ・いつでも解約ができるから安心!
- ・優待ポイントが2倍になるおトクなキャンペーン実施中!
※続巻自動購入の対象となるコンテンツは、次回配信分からとなります。現在発売中の最新巻を含め、既刊の巻は含まれません。ご契約はページ右の「続巻自動購入を始める」からお手続きください。
※ご契約をいただくと、このシリーズのコンテンツを配信する都度、毎回決済となります。配信されるコンテンツによって発売日・金額が異なる場合があります。ご契約中は自動的に販売を継続します。
不定期に刊行される特別号等も自動購入の対象に含まれる場合がありますのでご了承ください。(シリーズ名が異なるものは対象となりません)
※再開の見込みの立たない休刊、廃刊、出版社やReader Store側の事由で契約を終了させていただくことがあります。
※My Sony IDを削除すると続巻自動購入は解約となります。
お支払方法:クレジットカードのみ
解約方法:マイページの「予約自動購入設定」より、随時解約可能ですReader Store BOOK GIFT とは
ご家族、ご友人などに電子書籍をギフトとしてプレゼントすることができる機能です。
贈りたい本を「プレゼントする」のボタンからご購入頂き、お受け取り用のリンクをメールなどでお知らせするだけでOK!
ぜひお誕生日のお祝いや、おすすめしたい本をプレゼントしてみてください。※ギフトのお受け取り期限はご購入後6ヶ月となります。お受け取りされないまま期限を過ぎた場合、お受け取りや払い戻しはできませんのでご注意ください。
※お受け取りになる方がすでに同じ本をお持ちの場合でも払い戻しはできません。
※ギフトのお受け取りにはサインアップ(無料)が必要です。
※ご自身の本棚の本を贈ることはできません。
※ポイント、クーポンの利用はできません。クーポンコード登録
Reader Storeをご利用のお客様へ
ご利用ありがとうございます!
エラー(エラーコード: )
ご協力ありがとうございました
参考にさせていただきます。