CSS/JavaScript Tips

Contents

JavaScript

• JavaScriptについて
• アンケートページの作り方
• ランダムにBGMを変えるには？
• メニューセレクターを設置しよう
• 別ウィンドウにリンク先を表示させるには？
• ランダムにバナー広告を表示させるには？
• お気に入りに追加ボタンを作るには？
• WebページにFacebookのコメントボックスを挿入するには
• FacebookコメントプラグインをJavaScript化にする方法

スタイルシート（CSS）

• はじめに
• 優先順位について
• リンクの文字のアンダーラインを消したい
• どのブラウザでも同じフォントで表示させるには？
• スクロールバーの色を変えたい
• IEとスタイルシートを分岐するには

レスポンシブWebデザイン

• FacebookコメントをレスポンシブWebデザインに対応する方法

その他小技Tips

• 友達に紹介するボタンを作るにはどうしたらいいの？
• お気に入りに追加したときのアイコンを指定するには？
• 画像に触れると左上に表示されるイメージツールバーを非表示にしたい

オススメ Webサイト

• 菊池さんの工作室（JavaScriptのサンプルが満載）
• AWCS（HTMLタグ JavaScriptサンプルなどHP作成支援サイト）
• JavaScript入門（ビギナーの方を対象としたJavaScriptの解説）
• ５・６年生にもわかるやさしいJavaScript（具体的な活用例を使って解りやすく解説）
• CSS Maker (ブラウザ上でスタイルシートを作成できる便利ツールあり）
• Cascading Style Sheets解説（スタイルシート）

Amazon.co.jpで売れてる参考書籍

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

PC/スマートフォンに両対応!HTMLとCSSをゼロから書きながら作り上げていきます。詳しい操作手順が載っているので大丈夫。予備知識がなくても始められます。

確かな力が身につくJavaScript「超」入門 (確かな力が身につく「超」入門シリーズ)

よくある“勉強のためのサンプル”ではなく「こういうの見たことある!」「こういうのが作ってみたかった!」というような、楽しいサンプルを集めました。初学者がつまずきやすいポイントを丁寧に拾って「これはどういうこと?」に対処する解説を用意しています。納得しながら読み進められる文章で「絶対に挫折しない・させない」内容に仕上げました。

JavaScript コードレシピ集

JavaScriptによるWeb開発のための、究極のレシピ集。 制作の現場で使われる定番テクニックからプロ技まで余すところなく集めました。

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

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

Webデザイン良質見本帳 目的別に探せて、すぐに使えるアイデア集

本書は415点の厳選した良質なWebサイトを集めた見本集です。レイアウト、配色、フォント、素材、プログラムなど、ページを構成しているデザインパーツまで分解して解説しているので、Webサイトを見るだけではわからなかった「デザインの魅力の理由」がわかり、サイトの制作にもすぐに活用できます。「アイデアが見つからない」「イメージはあるけど、何が必要で、どうつくればいいかわからない」といった時に必見の価値あり。パラパラめくって好きなページを見つけ出し、デザイン制作に役立ててください。

いちばんよくわかるWebデザインの基本きちんと入門 レイアウト/配色/写真/タイポグラフィ/最新テクニック (Design&IDEA)

この1冊でWebデザイナーに必須の基礎知識が網羅できる!これからはじめる人、一気に学びたい人へ一生使えるWebデザインのテクニック集!絶対に外せない!レイアウト4つの原則とレスポンシブWebデザイン。今日から使える!配色の基本と、実例デザインの配色見本集。ユーザーの心を動かす!写真と図版の使い方、タイポグラフィの選び方。フレックスボックス、インタラクション、マーケティングの知識まで。

コメント

▲このページのトップへ