［HTML5 / CSS］ 『Progate』 『CODEPREP』を使って復習する 忘れているもの、見落とし…などをまとめる ・transition : 滑らかに変化させる属性( width, height など) linear 秒数(s) ; linear：速度は変わらない ease:：ゆっくり始まりゆっくり終わる ease-…

［JavaScript］ onMouseOver/onMouseOutとswapを使用してみる ［作成例］

［JavaScript］ 課題：3の倍数を判別するプログラムを記述しなさい ボタンを押したら実行するように設定 初期値：var if(){ } else { } 出力：〜は、3の倍数です。〜は、3の倍数ではありません。 ＊memo 遭遇したエラー missing ) after argument list. 原因…

［HTML / CSS］ ワークフローの再確認 1. ディレクトリ・パス（大前提として、PCを正しく管理できるか？） フォルダ名・ファイル名（日本語禁止！）の管理をできているか？ レギュレーション（ガイドライン）に従う （レギュレーション：ある一定のルールに…

［Today's viewpoint］ タイピングの練習は毎日１５分 ［JavaScript］ JavaScriptの要点 順次 分岐（if,switch） 反復（while,for） ［Illustrator］ Illustratorの練習は毎日６０分。初心者はトレースをひたすら練習する Illustratorの要点 選択 描画 選択 …

[JavaScript] JavaScriptの基礎復習 基本的なメソッドの使い方を覚える windows.document（ブラウザーに文字を表示させる） JavaScriptで文字列を表示するには、「window.document.write( )」を使う 表示したい文字列をシングルコートではさむ 「window.」は…

［HTML5］ HTML5でdivタグにidではなくclassを指定する必然性 idはタグにひとつしか割り当てられない j-Qureyを書く際、idを指定して命令をかける CSSを書く際には、classを指定して命令をかける （使用例 クラス名がふたつある場合）div class="box one"div…

caption：テーブルの表題 border-collapse：重なっている線が１本線に見える rowspan="2" colspan="2"

［JavaScript］ JavaScriptのワークフロー 記述ルール 演算 出力 JavaScriptの基本構文 （１）document.write( 変数 ); 変数で指定した文字列を表示する （出力） ブラウザに表示 コンソールに表示 ダイアログボックスに表示 （２）変数 =prompt('文字列','…

JavaScript / ActionScript / ECMAScript(JavaScriptの標準型) 基本構文 順次 分岐 繰り返し 変数の型 変数の考え方は一次方程式による 命令：x+y=z 初期値：x=0 y=0 出力 トレース文(命令文・トレースメソッド) trace( ); ( );：コンピューターに指示を出す…

フォームの基本形を反映

［HTML5］ フォームの機能 表示(出力) 入力データの取得 入力データ お問い合わせフォーム(HTML form) アンケートフォーム(PHP) フォームの送信方法 get 情報の可視化(封筒の宛名のイメージ) post 情報の不可視化(封筒の手紙のイメージ) action="URI" サーバ…

［CSS］ 色彩計画 基調色（ベースカラー） 強調色（アクセントカラー） アソート ＊ 可読性を重視する ガントチャート 記述における注意点 idとclassを使い分ける（レイアウト→id、要素→class） ツリー構造（優先順位）を考える backgroundの彩度を抑える na…

［CSS］ ベンダープレフィックス GoogleChrome / safari：-webkit- Firefox：-moz- Opera：-o- InternetExplorer：-ms- HTML5+CSS3の新要素が反映されるブラウザ Googlechrome Firefox / safari 現場で使われる新要素は４種類程度（用途に合わせて使い分ける…

［CSS］ positionプロパティの練習 ［作成例］ グリッドデザインを作成する上での注意点 グリッドデザインは1pxでもズレてはいけない スライス：画像を細切れにしていく作業のこと Photoshopで画像にガイドを引いていく→ガイドをロックする スライスツール：…

［CSS］ floatの練習 floatしているもの同士はmarginが加算される（marginの相殺の影響を受けない） ［作成例 その１］ ［作成例 その２］ ［作成例 その３］ ［Photoshop］ ツールの使い方を覚える コピースタンプツール：何かを消す フィルタ→レンズ補正：…

［CSS］ positionプロパティ ［Today's viewpoint］ 表示スピードはブラウザの表示スピードを優先する（時代性を考慮する） HTML CSS：４ファイル以上読み込むと遅くなる（リセットを外部CSSに書かない） JavaScript（jQuery） img

［HTML］ パラグラフの概念を理解すること（英語圏の概念を理解すること） idとclassの使い方 <div id=" " class="1 2 3"> id：一意（ユニーク）なものに使う class：複数並列するものに使う</div>

［CSS］ heightとline-heightプロパティ / 隠し文字について ［作成例］ ［Illustrator］ Illustratorの覚書 練習の場合新規ファイルのカラー設定はCMYKでよい グラデーションは必然性がある場合に使う 疑似立体をつくる（効果→3D→回転体） アキュートアクセ…

［CSS］ 横ナビゲーション / グロバールナビゲーション 現在ではあまり使われない。新しいことが起きるという可能性を感じさせない CSSSprites 画像自体を先読みして、後から見せたい場所をつくる diplay: block; ・display：要素の表示形式を指定する ・blo…

［CSS］ floatを使った『２カラムレイアウト』を作成する CSSはブラウザを基準として書く ボックスモデルに従い、ブラウザを基準とした幅を指定する ネガティブマージン （ex margin-top: -50px;）は初心者向けではない ［作成例］ 肩慣らしの1カラムレイア…

［Flash］ Webブラウザで動きをつくる ECMAScript JavaScript ActionScript JavaScript ブラウザが判断する。どのブラウザでも正常に機能する Flash（ActionScript） 開発コストが低い。データが軽い（ブラウザの読み込みが速い） アニメーションの構造を学…

［Photoshop］ Photoshopの覚書 Photoshop （open / save / copy / undo）はメモリ処理の負荷が大きい Photoshopで元データをいじらない。新規レイヤーを作成し作業する プリセットにクリップボードがある：メモリに画像がコピーされている ①新規クリップボ…

［HTML / CSS］ ・meta要素 メタファーについてどのような特性をもっているかブラウザに伝える役割 <meta name=" 値 " content=" "> ↑ ↑ ↑ 要素 属性 ex) width=device-width ・ブレイクポイント：強制改行。CSSが切り替る画面幅。 ブレイクとは混乱時に基準をつくるという意味 ・リセット</meta>…