2012-01-01から1年間の記事一覧
リップル効果 今回はキャンパスサイズ700×400で製作 テキストツールで文字を打ち込む Ctrl+Bで分解して修正→タイムライン→レイヤーに配分 一文字ずつ選び分解→シンボル化 タイムライン10、17くらいにキーフレーム挿入 タイムライン１を選択してキャンパス上…
ボタンアクション Illustratorで動かす対象物を描き、Flashにコピー＆ペーストをしてシンボルに変換 キーフレームを挿入し、モーショントゥイーンorクラシックトゥイーンをタイムラインに挿入 新規レイヤーActionを追加し、ループを止めるため stop を記述 …
Google Drive ・簡易的なフォームを作れる。 ・デザインはあまり使えないが、スプレットシートに自動で書き出しが出来、便利。 テストサーバーの構築 テストサーバーを構築するとPhPやPearl等のスクリプトをテストすることが出来る [手順] 1 XAMMPをインスト…
GIFアニメーション 作業工程 1,Illustratorで動かすものをデザイン 2,レイヤーを複製し、動かしたいところを動かす。(パラパラ漫画の要領) 3,illustratorからphotoshopに書き出し 4,カラーモードをRGBにして、レイヤーを保持にチェック 5,タイムラインを表示…
フォーム基礎 ・フォームはリセットしない ・action="mailto~"を指定する場合 enctype="text/plain"をセットで入れる ※文字化け対策 お問い合わせフォーム,チェックボックス,ラジオボタン,リスト <html> <head> <meta charset="UTF-8"> <title>お問い合わせ</title> </head> <body> <h1>お問い合わせフォーム</h1> <form action="mailto:xxx@xxx.com" enctype="text/plain" method="post"> <p>名前:…</p></form></body></html>
HTML <html> <head> <meta charset="UTF-8"> <title>企業系レイアウト実践</title> <link rel="stylesheet" href="css/style1.css" media="screen,print"> </head> <body> <div id="container"> <div id="header"> <h1><em>SAMPLE レイアウト</em></h1> <div id="nav"> <ul> <li id="top"><a href="#"><em>トップページ</em></a>…</li></ul></div></div></div></body></html>
position HTML <html> <head> <meta charset="UTF-8"> <title>両側をまたぐフッターを配置する</title> <link rel="stylesheet" href="css/style1.css" media="screen,print"> </head> <body> <div id="container"> <div id="header"><br></div> <div id="wrapper"> <div id="primary"><br><br><br><br><br><br><br><br></div></div></div></body></html>
石垣島観光ガイド HTML <html lang="ja"> <head> <meta charset="UTF-8"> <title>石垣島観光ガイド</title> <link rel="stylesheet" href="css/style.css" media="screen, print"> </head> <body> <div id="container"> <h1>石垣島観光ガイド</h1> <p class="lead">石垣島は八重山諸島の中で一番大きな島で、沖縄で3番目に大きな島です。 沖縄からは、空路で約1時間、沖縄より台湾に近く南に位置…</p></div></body></html>
窓と風景 ・窓枠を選択、今回は選択範囲を読み込む ・風景をCtrl+Aで全選択しコピー ・窓枠に戻り、特殊ペーストで選択範囲内でペースト 花とImac ・花を選択範囲ツールの色域指定からスポイトで背景をクリックして スポイト＋で周りも選択、最後に反転させ…
イラストレーターでボタン作成 ・表示からピクセルプレビュー、ピクセルスナップにチェックを入れる ・線の位置設定で内側にいれる 作り方手順 ・１つのブロックを作り５つコピー ・１つブロックを選択し、コピー→前面へペースト→ブロックを下まで４pxほど下…
CSSスプライトを使って縦ナビを作る ・background-position: 0(left) 0(top);によりブロックの左上が基点となる それにより、cssでは左寄せ、上寄せが必要になる 元画像 <html lang="ja"> <head> <meta charset="UTF-8"> <title>縦メニュー：CSS Sprit</title> <link rel="stylesheet" href="css/style.css" media="screen, print"> </head> <body> <div id="nav"> <ul> </ul></div></body></html>
基本操作 Photoshopの目的 ・選択範囲を決める。 ・補正する ・加工する☆立ち上げるときにShift+Ctrl+Altを押して立ち上げてエラーを削除する・環境設定から単位をpixelにしておく ・Ctrl+Dで選択解除 ※PhotoshopではCtrl+zではなくヒストリーでいったりきた…
本日の授業内容 ・IETesterの導入(IEブラウザのチェック) IE６では元々の指定があるため、マージン幅が2倍になる ※IE対策でfloatにdisplay:inlineを入れる・情報の優先順位は上から ・clear: bothで回り込み解除を忘れない。 授業課題 HTML <html> <head> <meta charset="utf-8"> <title>授業課題</title> <link rel="stylesheet" href="css/style3.css" media="screen,print"> </head> <body> </body></html>
本日の授業内容 ・ウェーバーの法則 今なら定価１０００円が８００円！ 数字は人の意識を引く。価格に付加価値をつけ、背後のストーリーを解説する・人は商品の実際の価格よりも、その商品を使うことによって 得られる時間（経験）に対して、より強い関心を…
本日の授業内容 ・CSSファイルを作り、中にstyle.cssを作る ・CSSは２つくらいにまとめ、小分けしすぎない ・自分が作成した固有名詞id,classは先頭に記述する ・hにstrongは使わない ・text-alignは文字を指定するのでなく、全体の幅を揃える ・外部CSSで指…
授業まとめ <html> <head> <meta charset="UTF-8"> <title>枠線の設定</title> <style> body { font-size: 1.0em; } .border1,.border2,.border3,.border4,.border5,.border6 { margin: 12px 0; padding: 12px; } .border1 { border: 1px solid #666; } .border2 { border: 4px solid #666; } .border3 { border: 1px…</meta></head></html>
本日の授業内容 ・paddingにheightは不要 ・使いまわしするものはclassを使う ・divはdivision※ブロックという意味 ・classは.(ドット)で表示 ・borderのショートハンドは線幅→実線→色「擬似クラス」 リンクのさまざまな変更 ・link(未訪問) ・visited(訪問…
CSS ・bodyにはmarginは使わない ・ボックスモデル top→right→bottom→leftの順で値は指定 授業課題まとめ <html> <head> <meta charset="utf-8"> <title>練習課題002</title> <style> body { background-color: #8fbc8b; } h1 { color: #fff; font-size: 40px; } h2 { font-size: 20px; color: #fff; background-colo</meta></head></html>…
rowspan,colspan rowspanは縦結合 colspanは横結合 はみ出さないように気をつける まとめ <html lang="ja"> <head> <meta charset="UTF-8"> <title>tableの説明</title> </head> <body> <table border="1" width="500"> <tr> <td rowspan="2">14</td> <td>2</td> <td>3</td> </tr> <tr> <td colspan="2">56</td> </tr> <tr> <td>7</td><…</tr></table></body></html>
[第1回インターネット] 11/27日に行われる筆記試験の自分用メモ （1）URLとは URLとは［ Uniform Resource Locator ］の略で［ Webサイトのアドレス ］を示す場所です。 URLには、［ 絶対パス ］と［ 相対パス ］の２通りの指定方法があります。 「http://」…
充実した1週間。内容が濃いため、しっかり整理して次週に望みたい。本日の授業のまとめ Web Deveroperの導入(Firefoxの拡張機能) HTML Validatorの導入(文法チェック) CSSの導入 head内にstyleを埋め込む→エンベット フォント指定 1,0em(ｴﾑ)=100%=16px color…
タイトルのコーンローは髪型にも言われますよね、直訳でとうもろこし畑の意。 tableで使う[tr]=table row このrowを脳で結びつけるためのmetaで紹介して頂きました。 うまく記憶の引き出開けられるように結び付けは大事。 本日の授業内容 ・Illustratorの回…
dlは名称と説明文をセットにリスト化が出来る。定義型リスト <html lang="ja"> <head> <meta charset="UTF-8"> <title>dl要素を使った定義型リスト化</title> </head> <body> <h1>dlを使う</h1> <p>dlを使い定義型リストサンプルを作成してみる</p> <h2>ul,ol,dlタグの違い</h2> <dl> <dt>ulタグとは</dt> <dd>中点を使い順序のない箇条書きリスト化</dd> <dt>liタグとは</dt> <dd>順序のある番号順</dd></dl></body></html>…
覚えることは膨大だ。一つ一つ理解して消化していこう。 <html lang="ja"> <head> <meta charset="UTF-8"> <title>本日の授業内容 | web空間</title> </head> <body> <h1>授業内容をhtmlを使いまとめる</h1> <p>ul,liを使い箇条書きで書き出す</p> <ul> <li>Hatenadiaryの設定</li> <li>ブラウザにHTMLを表示させる仕組み、画像等は2段階に分けられる</li> <li>HTMLの基本構造、</li></ul></body></html>…
パソコンを扱う以上、基礎知識は必要不可欠。 雑学を溜め込もう。本日の授業内容・パソコンを扱う上での基礎知識、歴史 ・上位検索の方法 ・テキストディタの導入 ・Illustratorのさわり(ctrlキーを使った効率化、滲み防止のピクセルプレビュー) HTMLメモ <html> <head> <title></title> </head></html>…
11/16日より訓練が始まった。講師の方、一緒に訓練を受けるみなさんこれから宜しくお願いします。このブログでは授業で学んだこと等、web関係について綴っていきたいと思う。6ヶ月間、より良い学びの場になるように学習していきたい。 <html> </html>
