webかたつむり ウェブデザインを勉強中 ウェブ初心者のおぼえがき

webかたつむり

ウェブデザインを勉強中

banner

banner copy

本日のお題 フォントは完全一致。モリサワ「A1明朝 std Bold」 トラッキングが、ブロックごとに結構違う。 「ウェブ」の箇所は「ブ」だけ間隔が詰まっている。 他のウィンドウからスポイトツールで色を運んでくる方法。 色を塗る範囲を選択する。 スポイトツ…

banner copy

本日のお題 背景色をテンプレートから移植する。 背景レイヤーを重ねないで、少しずらしておく。背景レイヤーを選択したまま、テンプレートから「スポイトツール」を使って塗りたい色を選ぶ。 これで完成。 オブジェクトの周りに、同じ形状のパスをずらして…

banner copy

本日のお題。イラストから書きます! だいたい描けたら、「オブジェクト」→「ライブペイント」→「作成」 閉じられたパスが認識されて、カーソルを近づけると太い赤線で塗ることができる部分を表示してくれます。 テンプレートが見えるように背景の紫を表示し…

banner copy

本日のお題 イラストをトレーするときに、鉛筆ツールを使った。 鉛筆を離す度、その前に描いた線が消えてしまう。 鉛筆ツールをダブルクリックして「鉛筆ツールオプション」を開く。 その中の「選択したパスを編集」のチェックを外す。そうすれば解決。 イラ…

banner copy

本日のお題 本日の結果 「CMをチェック」の後の矢印をwingdingsから、アウトラン化して作った。 イラストレーターでテンプレートをなぞる、それからフォトショップにレイヤー構造ごと書き出す。それから写真を入れ込む。というフローがいいのかな? モリサワ…

banner copy

本日のお題 本日の仕上がり illustratorからphotoshopに移動する、最適な方法は? 飛行機マークをどうするか?以下のサイトからファイルをダウンロードして使用した。「cドライブ」→「windows」→「fonts」 問題は記号を入力するときにどうやって探すか? 年…

banner copy

バナーをまねして再現する練習。 食べ物の写真を探してくる。以下のサイトがおすすめ。 食材・料理や野菜・果物のフリー写真素材 無料画像のフード・フォト フォントが探せません。ひらがなの「け」「お」が変わっている…小塚明朝pro6nで代用。 最上段の英文…

banner 制作: 枠線について

バナーはページから独立している。 そのことを、はっきりとさせるために「枠線」が必須である。 枠線の太さは「font-weight」に関係している。フォントが細いときは枠線も細く、フォントが太いときは枠線も太くなる。 バナーの枠線は、2,3pxが標準。5px…

banner 制作の基本

バナーの構成要素は「見せたい画像」と「読ませたい文字」。 バナー広告のサイズについては、たとえばgoogleのサイトを参考にする。 広告サイズに関するガイド - AdSense ヘルプ 同じテーマで、縦長と横長を作る練習もする。 フォトショップを使ってパーツご…