ブログ・Webデザイン初心者の勉強「サンプルE」 <htmllang="ja"> <head> <metacharset="UTF-8"> <title>jQueryの練習</title> <linkrel="stylesheet"href="style.css"> <scripttype="text/javascript"src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script></script>
アイデア収集用。プロのみでなく他校のものもあり。
11月中にアイデアを決める。 スキルアップを時系列で表現。
西畑一馬のjQuery Mobileデザイン入門 jQuery Mobile日本語リファレンス jQuery mobileを使うことで、簡単にサイトのレイアウトができる。 ボタンなどのグラデーションを設定してくれる。 data-roleでひとつのサイトの中で複数のサイトレイアウトが組める。
情報の配置 人の視線はZの字。角に重要な情報を置く。 視線が通過しやすい場所に情報を置く場合は、大きくするなどして目立たせる。 写真のふち 角版:伝えたい情報。商品など。 切り抜き:カジュアルな印象を与える。漫画っぽい。若者向き。→投票率をあげ…
ブログ・HTML5の勉強「可変+固定レイアウトパターン:構造」
商品と価格を入力し、データベースに格納。 入力チェックし、エラーがあれば入力画面に戻るよう誘導する。 データベースに接続できないときは、エラーメッセージを表示。 データ一覧でデータベースから引っぱってきて表示し、選択用のラジオボタンをつけてお…
数字を使うと伝わりやすい。 制作時間も書く。 紙バージョンも必要。
ブログ・Webデザイン初心者の勉強「GoogleMap API(2)」 習作 移動時間をscriptの中のtravelModeでDRIVINGかWALKINGか設定できる。 RUNNINGがなかったので、これを非表示にするために行をむりやりつぶしている。
これから作成するサイトに縦スクロールのjQueryを必ず使おう。 いろいろあるけどto-Rで紹介しているsmooth scrollが動きがいい。 http://blog.webcreativepark.net/2012/09/06-152317.html
ブログ・PHPの勉強「COOKIE:解答例」 クッキー setcookie('名前',値,保存期間); サイト表示のたびに変数に1ずつ足してsetcookieに入れることでサイト訪問回数を数えることができる。 エラー input.phpのフォームでクッキー保存のチェックボックスをチェック…
修正内容 COOKIEに入る前に、以前の課題で作成したフォームを授業ブログのソースを元に修正。 修正箇所は、1)nl2brを入れる。2)htmlspecialcharsをprintのすぐ前で使う。3)メールをユーザーとクライアントに届くようにする。 問題点(query('SET NAMES…
これぐらい動かす要素があると重い。やはり画像を見せるもの。 firefoxが特に重い。
緯度・経度 pointabs スケール指定 マーカーの位置 センターの位置 エラー ブログ・Webデザイン初心者の勉強「GoogleMap API(1)」のソースを使ってローカルでは表示できたが、サーバーにアップすると表示できず「APIキーが必要」とでる。 最新バージョンで…
jQuery Filtering ブログ・Webデザインの勉強 | 風姿花伝「jQueryでフィルタ(フィルタリング)機能」 お手本サイト 補足 内容が多い・少ないによって縦スクロールバー分の表示ズレがある場合はhtml{overflow-y: scroll;}で固定。 画像サイズを変える場合は…
職務経歴書:年表・やってきたこと・できることなどを図案化する。ポートフォリオにも入れてよし。Web業界に就職するなら、デザイン化すること。 12/2・3:ポートフォリオサイト案のプレゼン。
※11/06 11:30更新 ブログ・Webデザインの勉強 | 風姿花伝「フォーム(1)~(6)」 入力画面 http://webtm2013.main.jp/php_maita/Q06(2).php <htmllang="ja"> <head> <metacharset="utf-8"> <title>フォーム(2)</title> <linkrel="stylesheet"href="Q06style.css"> </head> <body> <divid="container"> <h1>メッセージ入力画面</h1> <p>必要事項(<span>※</span></p></divid="container"></body></htmllang="ja">
ブログ・Webデザイン初心者の勉強「ロールオーバー」 jQueryを使わなくても、CSS3でロールオーバーで画像を拡大・透明化できる。 HTML5でインライン・ブロックレベルの概念がなくなったので、divをaタグで囲むことができる。 サイト HTML <htmllang="ja"> <head> <metacharset="utf-8"> <title>ロールオーバー</title> <linkrel="stylesheet"href="style.css"></linkrel="stylesheet"href="style.css"></metacharset="utf-8"></head></htmllang="ja">…
書類の種類 履歴書 職務経歴書 添え状 ハローワークの紹介状 ジョブカード 書類作成の目的 採用担当者に「いいね!」「会いたい」「確かめたい」と思わせること 履歴書 見た目がきれいかどうか。字がうまければ手書きも可。 日付:郵送する日。基本的に元号…
ブログ・Webデザイン初心者の勉強「QRコード作成サイト」 Google Chart Toolsを利用。
ブログ・HTML5の勉強「実践レイアウトパターン(1)」 外部CSSを切り替える head内に以下を記述 <linkrel="stylesheet"href="○○.css"media="only screen and (min-width:○○px)"> サイト全体共通+スマートフォン用CSSを読み込み、次にタブレット用CSS、PC用CSSを読み込む。 今回制作したサイト style-s.css、style-m.css、style-l.cssを使</linkrel="stylesheet"href="○○.css"media="only>…
ブログ・HTML5の勉強「Media Queries基礎」 PC上で各デバイス表示(Mac・Winやスマートフォン・タブレット)に切り替え safariを使用。 右上の歯車アイコンのメニューから[設定]を開く。 [詳細]タブの一番下の[メニューバーに”開発”メニューを表示]にチェッ…
web上でボタンや背景の材料がつくれる。
ブログ・PHPの勉強「スタッフ登録一覧(1)」 名前とパスワードを入力し、データベースに格納。 1)データベース作成 2)入力画面 <htmllang="ja"> <head> <metacharset="utf-8"> <title>おいしい野菜農園</title> <linkrel="stylesheet"href="./css/style.css"> </head> <body> <divid="container"> <header> <h1>スタッフ追加</h1> </header> <sectionid="form"> </sectionid="form"></divid="container"></body></htmllang="ja">
$_POSTを$_SESSIONに渡したら$_POSTは空になる。 $dbh -> query('SET NAMES UTF8');の「UTF8」を「UTF-8」と書いて動かず。先週は「NAMES」を「NAME」と書いて動かず。 お問い合わせフォーム・確認画面・送信画面と、入力内容を受け取るデータベースを作成。…
ブログ・PHPの勉強「お問い合わせ:データベース(1)~(6)」 mysql_connect mysql_select_db mysql_query ローカルでやったらレンタルサーバーでも。 そろそろポートフォリオサイト準備。 デジタルステージ live
Beautiful Background Image Navigation 例:お手本 画像のスライド mootoolsのimage menuというスクリプトを使う。 例:街をつくる建築作法 その他 jQueryをいろいろ使うと、対応バージョンの違いからかちあって動かなくなることがあるので注意。 HTMLでid…
業者が指定するアップデート先フォルダ(web、www、public_htmlなど)がある場合はそこに保存する。サーバー直下に保存すると、公開するつもりのない保存データが見えてしまう。 サイトが完成したあとは、クライアントにID・パスワードを変更してもらい管理権…
ブログ・HTML5の勉強「グリッドレイアウト」 headerとnavはたて並びで。 制作したもの↓ 左1列と右2列にdivを分けて、中にheader、nav、sectionを配置。 小さい画像はそれぞれの中でさらにfloatさせてます。 navの中をul・liで作ったものをsectionの画像に…