Webデザインの勉強と製作 | あかとんぼ

フェリカテクニカルアカデミーの学習をベースに、Webについての勉強と製作の過程をまとめています。

デザイン

[デザイン]デザインの豆知識…いろいろ覚書

やっぱりIllustrator! Photoshopでは気軽に画像が作れず限界がある サイズ設定も容易 空白が大事! 画像そのものより「空き」スペースに着目してみよう 空白に統一感を持たせよう 上下左右の空きを統一化する、文字間の空きと画像間の空きを統一するなど 随…

[Web][デザイン]画像軽量化:TinyPng

TinyPng.com 1MBを超える画像を載せるとどうしても重くなる そんなときに便利な画像を軽量化してくれるサイト サイト上の無料版だと20個まで可能。 有料のPhotoshopプラグインも有。 jpgとpngがあるがpngのほうが綺麗に仕上がりやすい TinyPNG – Compress…

[Web][デザイン]写真などの画像の中にあるフォントの種類を調べる方法

きっかけ カフェのメニュー。 このフォントなんなんだろう?と調べたくなった。

[デザイン]バナーの制作テクニック

紙とウェブ デザインは「小さい面積から大きい面積へ」やっていくのが基本。 紙 名刺 はがき(フライヤー) A4 Web バナー広告(リンク) ビルボード(アイキャッチ) 見出し素材 バナーをつくる 情報・構成要素の優先順位を明確にする 手書きラフをつくる 外枠…

[Web][HTML][CSS][デザイン]Webサイト構築(4/8)

はじめに 今日は一つのスタイルシートでデザインを制御する複数のWebページを作り、階層構造を作ってそれらをリンクしました。 製作手順 ページの固有性を作る(CSSシグネチャ) その他CSS知識:CSSで画像の角を丸くする その他デザイン知識:modernとは何か …