2013-07-01から1ヶ月間の記事一覧
ナビゲーション（ボックス横並び） リストを横に並べるには、float:left;を使う。 レイアウト構造に例えると、リスト全体を包むulがwrapperの役目で、その中に入っているliに対してcontentのようにfloat:leftを使って横に並べる。 よって、ulに対してはoverf…
Q21 マウスが乗った状態を設定しなさい ul { width: 100px; text-align: center; } li { font-weight: bold; } li a{ display: block; padding: 20px 10px 20px 10px; } li a:link,li a:visited{ color: #ffffff; } a#new:link,a#new:visited{ background-co…
Q16 以下の表示になるよう設定しなさい h1,p { margin: 0; padding: 0; } body { background-color: #222222; background-image: url(img/q16.gif); background-repeat: repeat-y; background-position: 280px; font-family: "Hiragino Kaku Gothic ProN", M…
Q08 使用している要素が、h1、h2、h3、ｐ、ul、li、img の場合のリセットCSSを記述しなさい h1,h2,h3,p,ul,li,img { margin: 0; padding: 0; } Q09 bodyを、プロパティ（文字サイズ:16px、文字色:#333333、書体:ゴシック体、行送り:1.5）で指定しなさい body…
Q01 DTD HTML5で基本構造を記述しなさい （meta要素 文字コード指定も含む） A <htmllang="ja"> <head> <metacharset="utf-8"> <title></title> </head> <body> </body> </html> Q02 池袋で猫カフェ「CatCafé」を開いてお客さんを呼びたいと思います 適切なtitle要素を記述しなさい A <title>猫カフェ 池袋|CatCafé</title> Q03 以下の内容をマークアップし…
背景画像 background-repeat: repeat;画像を繰り返し並べて表示。ブラウザの初期設定。 background-repeat: repeat-x;横方向に繰り返し表示。 background-repeat: repeat-y;縦方向に繰り返し表示。 background-repeat: no-repeat;繰り返さずに１枚だけ表示。…
CSSレイアウトについて追記メモ リセットCSS htmlもリセットしているケースもあるが、しなくてもいい。 paddingを指定する時は、widthの値がpaddingの分を引いているか注意。 widthを指定しない状態では、その要素が取れる最大の幅で表示される。 float要素…
グラデーション リニア＝線形 カラー △をshift＋ドラッグで色相を固定したままトーンを変えられる。 web用に作るには、ピクセルプレビューの表示をし、グリッドに吸着することでアンチエイリアス化を防ぐ。 薄いグラデーションを利用したボタン作成。 macで…
リセットCSS ブラウザは自動的に各要素の周囲に空きを入れて表示するので、思いどおりに表示させるためには、最初に各要素の周囲の空きをすべてなしにする設定をしたあとで（リセットCSS）、各要素へ位置の指定をする。 従来は、全ての要素の空きをリセット…
複合パス 重ねた図形の形に切り抜く。 図形を重ねて描き、選択後オブジェクト→複合パス→作成。 パスファインダーの前面オブジェクトで型抜きと同じ効果。 重要な点は、複数の図形を１つの図形にするということ。計算の処理が少なくなる。 クリッピングマスク…
情緒豊かな日本語書体によって、これからのWebデザインは変わっていきます。印刷物のデザインには欠くことのできなかった要素「タイポグラフィ表現」が、日本語Webフォントサービスの充実によって、Webサイト上でも、簡単なコーディングによって実現するよう…
フォントの指定（2013年7月現在） bodyで指定するフォントを先生が検証。 以下の３フォントをこの順番で記述すればどの環境にも対応できる。 "Hiragino kaku Gothic ProN" Meiryo sans-serif ブログ「Web初心者の勉強法」の「font-family/font-sizeとline-he…
曲線（ハートと迷路） 連続曲線を描くとき、山の頂点と曲線の変化点にアンカーポイントを作っていけばうまく描きやすい。 イラストのトレース（カニ） 丸みのある図形は、アンカーポイント４つ。 丸を描いて、ダイレクト選択ツールで変形させてもできる。 曲…
社会人としての知識・技術・技能を身につける。 就職のための知識・技術・技能を身につける。 就職活動の時期 授業が終わり、年明けから勤務するのを目標に。 就職活動は講習４回目（11/2）ぐらいから始める。 授業が全て終わってから始めると、時間が余りす…
このカテゴリーでは、気になったサイトをメモしていきます。 モリス商会 創立150周年記念サイト 輸入家具販売のマナトレーディング株式会社の特設サイト。 Webサイトを訪問するページを http://webpage100.jimdo.com/ に新たに設けました。
デザイナーは他人がいいと感じる感覚をわかっている。それを身につけるには、いろんな作品をまねすること。 デザイナーになるには、デザインの歴史を学ぶことが必須。技術の勉強と、自分のアイデアが既出かどうかを知る。 万人受けするものを狙うと、万人受…
Flashの勉強はJava ScriptやPHPの勉強に通じる。 作業画面の初期化＝初期設定→リセット Action Script2.0を使用 演算 WebDesignWorks AS2演習（１） var num1 : number = 10 「var」は変数宣言。 「num1」という箱（名前は自分で設定）に「10」という数字を…
絶対パス・相対パス 絶対パス webサーバーを経由してファイルを見つけにいく。 相対パス 今あるフォルダからファイルを見つけにいく。 下の階層へは名前を指示。例./img/01.jpg（./は今あるフォルダ。省略して「img/01.jpg」も可） 上の階層へは名前は不要。…
ペンツール 直線 始点をクリック→終点をクリック（＋shiftで角度固定）→ctrlクリックで選択解除。 曲線 始点をプレスドラッグ、離す→終点をプレスドラッグ、離す→ctrlクリックで選択解除。直線の両端に力を加えて曲げるイメージ。 直線から曲線になるコーナ…
HTMLは文章構造 webサイトのデザインはまず文章構造の設定から。 あとから手直ししようとすると全体を作り直すことになる。 仕事の現場では、クライアントからの原稿をweb用に組み直すことも必要。 HTML5の一番の意義は、それまでのバージョンであいまいだっ…
拡大・縮小 shift＋左ドラッグで比率固定 コピーはalt押しながら。 アレンジ オブジェクトの描かれた順に重なっている。 描くときは大きいものから。 オブジェクト→重ね順。ショートカットキーはctrl＋]と[で順番変える。shift押しながらで最前面、最背面。 …
web業界で働くこと 正社員契約→出向多い。 基本ブラック。いかにライフスタイルを仕事に合わせていくか。 制作よりも仕事をとってなんぼ。 自分の技術は小出しに。 プロは自力で問題解決するしかない。そのためには的確に検索して解決方法をみつける力が必要…
作業データはＣドライブ直下に保存。（壊れにくい） ファイル名は半角アルファベットで。（文字のエラーを回避） USBでバックアップを取る。 TeraPad [EOF]＝End Of File。 <head>UA（ユーザーエージェント）。ブラウザに対し表示方法を示す。 文字コードSJISはす</head>…
絵を描くというよりは、計算式で図形を描く。 （Illstratorに限らず）ダブルクリック厳禁。操作が記憶されない。ショートカットキーやメニューから操作。 ctrl＋wでウインドー閉じる。win／mac共通。 space＋ドラッグでグラバーハンド。作業エリアを動かす。…
オリエンテーション
Gmailアカウント取得 Jimdo登録・設定 smart4me登録・設定 Hatena Blog登録・設定 （過日分） Firefox、Google Chromeインストール Tera Padインストール
サイト集 io3000 ズロック 素材 BEIZ Graphics 自然の写真。 PAKUTASO いろいろ写真。 freepic.com 世界中からフリー素材。PhotoShopDataも。 テクニック ASCII.jp × WEB PROFESSIONAL デザイン 日本・海外…カッコいいCDジャケットのクリエイター・デザイナ…
