疑似クラス

疑似クラスとは、要素が特定の状態にある場合にスタイルを指定するもの。疑似クラス参考サイト : セレクタ｜CSS HappyLife ZERO 演習 http://d.hatena.ne.jp/web-mind/20131225/p1 <body> <ul> <li><a href="#">LINK-link-coral</a></li> <li><a href="#">LINK-visited-turquoise</a></li> <li><a href="#">LINK-hover-skyblue</a></li> <li><a href="#">LINK-activ</a></li></ul></body>…

2013-12-27

文字と背景色

CSS

文字色と背景色の記述演習１ <body> <h1>style要素</h1> <h3>style element</h3> <p>HTML文書内にまとめて設定します。</p> </body> <style> h1 { color: #3FA068; } h3 { background-color: #355584; color: #FFFFFF; } p { color:#000080; } </style> h1に文字色を設定 h3に背景色を設定 pに文字色を設定 CSSの…

2013-12-26

ボックスモデルのサイト作成.2

HTML5

2013-12-26

W3C

WEBを学ぶ

W3C：World Wide Web Consortiumワールド-ワイド-ウェブのブラウザーやサーバーについての技術に関する標準化を推進する団体。1994 年設立。W3C公式ページ : http://validator.w3.org/

2013-12-26

Dreamweaverの活用

Dreamweaver

Dreamweaverで新規ファイルの作成ページタイプ : HTML レイアウト : なしドキュメントタイプ : HTML5 コードビューとデザインビューの使い分けテキストを貼付けたい時は必ず、デザインビューから行う。<p></p>を自動的に付けてくれるので、とても便利。正しい(…

2013-12-24

WEBサイト基本

WEB

WEBサイトは何で出来ているか。 Webサイトはデータで出来ている。→ データ（コード）を書くことを「コーディング」と呼ぶ。

2013-12-24

Webサイト制作フロー

Webサイト制作

Webマスター(社内のWeb担当者) WebマスターがWebサイト制作をコンサル業会社に依頼(小さいサイトはそのままWebサイト制作会社にいく) コンサル企業が、情報を組み立てるためにプランナー | ディレクター | コンサル会社と、どんなサイトを作成するかを話し合…

2013-12-24

HTML基本

HTML

Webサイトで使われる言語 HTML CSS JavaScript PHP グラフィックツール Illustrator PhotoShop Fireworks (CS6で開発中止) ← スライスツール等優れている面があるため、未だ需要がある。 [HTML5]ボックスモデルのサイト作成.1 完成図 header <header> <h1>HTML5の使い所</h1> <p></p></header>…

2013-12-22

ボックスモデル

CSS

ボックスモデルの概念ブロックレベル要素が生成する矩形領域（ボックス）の基本概念を表したものボックスモデルの構成要素内容領域(content) / padding / margin /border ボーダー：ブロックレベル要素の外周を取り囲む境界線。マージン：ボーダー外側の…

2013-12-21

illustrator基礎

illustrator

レイヤーを分けて作成して、それをそのままPhotoshopに書き出すことができる。復習拡大縮小ツールクリックしたところを基準に点対称ができできる。 alt(複製) + shift(幅高さが比率のままサイズを変える事ができる。)(基準点を狙い、shiftを押しながら大…

2013-12-21

CSS基礎

CSS

CSS : Cascading Style Sheetcascade＝滝由来：様々なレベルで定義されたスタイルは、上流で定義されたものが下流へ引き継がれて文書に適用されます。水の流れ（滝）を現している。親→子→孫。カスケードの概念 CSSとJavaScriptは;を忘れやすいので気をつけ…

2013-12-21

HTML

aタグ予備知識 <a href="#"> リンクをする際にはtarget="_blank"を使用するようにする。XHTMLの頃は、別ウィンドが推奨されていなかったが、現在HTML5では推奨されている。 imgタグ予備知識 <img src="#"> img = image src = source タグ：単語の母音を抜いている事が多い。サイト</a>…

2013-12-21

基礎知識

Dreamweaver

Dwで置換を行う場合はCtrl F (find 検索置換という意味)使用頻度が高いので必ず覚える。 Dwを使うときには画面左下にあるタグセレクタを使用する。そのタグの範囲がすべて選択され、時間短縮に有効的。

2013-12-21

予備知識

PC一般

コピーしたい範囲をドラッグする際は、必ず取りたい範囲の最後の文字から行う。 Wordではドラッグして文字サイズを変えるのは絶対だめ。プロは書式から行う。

2013-12-21

Webを勉強する

WEB

Webについて HTMLの辞典等は買う必要がない様々な本がある中で、その人に合うレベルの本を見極めて図書館で借りて勉強する。この本だからとか、正解があるわけではない。 Webのことが分からない場合、Webを考えない。必ず分かる物事に置き換えてみる。そこ…

2013-12-21

WEBで使われる色

WEBデザイン

RGB（Blueではない。Bv:Blueviolet）(DTP:CMYK) 16進数で表現する。＃（ハッシュタグ）：ナンバーという意味。＃000000 （6桁の数字)00（←赤）00（←緑）00（←青紫）なぜブルーバイオレットか。→黒という色があるから。青(Blue)と分けるために、BK (K)という…

2013-12-21

Gooleアカウント作成

Google

Googleのアカウントを作成することが重要様々なことができるようになる。 Googleドキュメント（Word,Excel,PP) Google Analy tics Googleドライブ

2013-12-20

Illustratorの基礎２

Illustrator

画面サイズの変更 ctrl 1 拡大の大きさ１００％ ctrl 0 元の大きさに戻る縮小・拡大ツール必ず基準点をクリックしてから作業を行う。画像の比率をそのまま変えたい場合は必ずsiftを押しながら。そうすると、垂直に移動することができる。画像を縮小させ…

2013-12-20

HTML

画像タグ <img src="画像パス" width="幅(px)" height="高さ(px)" alt="代替えテキスト"> img :image src :source 何の略なのか、本質を考えられると理解が早くなる。imgタグはインライン要素なので、<p></p>などのブロック要素で囲う <head lang="ja"> <meta charset="utf-8"> <title>はじめてのHTML：画像を表示</title> </head> <body> <h1>画像を表示</h1> <p>HTML内に画像を表示する記述</p> <p></p></body>