読者です 読者をやめる 読者になる 読者になる

96's blog

WEBサイト制作科 6ヶ月コース

習熟度確認テスト(6)

【SEO】 SEOまとめ (1)「検索システムの種類」について述べた次の文章のうち、 適切でないものはどれか (a) 「ディレクトリ型」とは、集められたWebサイトの情報を人の手によってカテゴリ分けする検索システムである。 (b) Yahoo!のカテゴリ検索は「ディレ…

職業能力基礎講習(まとめ)

社会人基礎力(経済産業省) 配布資料参照 面接対策 (フリー回答) ○心構え こちらも相手を確かめる 身だしなみ、笑顔 リラックス、自然体 自分でシミュレーションする 入社後の働き方やビジョンを確かめておく (場を与えてくれていることに)感謝、自信、…

株式会社 Atras21

Web系登録派遣 技術研修あり

テンプレート

複数ページの同じ部分を修正するときに、修正しない部分は触れないようにする。 編集可能領域を設定 編集を許可する領域を選択する。デザインビューを開いてタグセレクタ(ウインドー下部)を使うと便利。 [挿入]→[テンプレートオブジェクト]→[編集可能領域]…

Illlustrator (テキストを画像にする際の注意)

見出し バウンディングボックスなし 本文 バウンディングボックスor矩形(テキストツールで端にもっていくと、カーソルが丸くなって矩形の中にテキストを流し込める) ダイレクト選択ツールでボックスを動かすと、テキストのサイズが変わらない。 文字16pxに…

職業能力基礎講習(職業意識、求人票の見方)

ハローワーク相談員はピンきり。失業経験のある人ない人いる。よい相談員に会えたら、次回から指名できるか聞いてみるとよい。 ハローワーク紹介企業がブラックだったときは、辞める前に相談。退職~次の就職までをサポートするケースあり。 職業意識 自己理…

GIB JAPAN

http://www.gibjapan.com/ IT系派遣(正社員登用あり) 研修サービス

ポートフォリオ制作

課題:ページ内リンクを使わずにスクロールしたときに、対応するナビゲーションの項目をアクティブにする方法を確認。 解決策 が雑誌に書いてあったのでメモ。 $(function(){ var set = 100; //画面の上端からどのくらいの距離に到達したら切り替わるかの数…

各自で

昨日のつづき。PHP、WordPress、ポートフォリオ等の3択。 職務経歴書は3枚でも4枚でもいい。がっつり書く。 ポートフォリオ 課題:ページ内リンクを使わずにスクロールしたときに、対応するナビゲーションの項目をアクティブにする方法を確認。

WordPress

ブログ・風姿花伝「ダウンロードとインストール」~

PHP

PHP

ブログ・PHPの勉強「まとめ(1)ログイン画面を作る」~

今後の授業方針

PHP WordPress ポートフォリオ から各自のペースで進める。

メモ

継続しているブログにパーマネントリンクを貼る。 CSSを切り替えて読み込んだとき、ページ内リンクの#の位置はうまく反映されない。index.html/#以降は読み込まない。

レスポンシブWebサイト制作の目標地点

タイ国政府観光庁

ノーマライズCSS

ブログ・HTML5の勉強「1カラム」 ノーマライズCSSとは デフォルトスタイルシートのブラウザ間の誤差をなくして補正(ノーマライズ)する、とのこと。 リセットCSSが適切に設定できれば、使わなくてもいいかな? サンプル ノーマライズCSSファイルはこちらか…

習熟度確認テスト(5)

HTML5の説明で正しいものはどれか 1. これまでのHTMLを大幅に改定したHTML第5改訂版 2. HTMLやXHTMLの文書作成機能を改良し、より構造化しやすいタグが利用できる 3. 次世代のWeb環境に合うように仕様を作成 4. W3C(World Wide Web Consortium)の管理下で仕…

スマートフォンサイト制作

ブログ・Webデザイン初心者の勉強 SP・JQMのカテゴリーの記事で各自作業。 スマートフォンサイトにGoogle Mapを実装しよう レスポンシブで重くないイメージスライダー bxSlider スマートフォンサイトのCSS 指定された要素内のブロック要素を、高さを揃えて横…

Twitter Bootstrap02

8 プログレスバー HTML <htmllang="ja"> <head> <title>Bootstrap 101 Template</title> <metacharset="utf-8"> <metaname="viewport"content="width=device-width, initial-scale=1.0"> <linkhref="css/bootstrap.min.css"rel="stylesheet"> </linkhref="css/bootstrap.min.css"rel="stylesheet"></metaname="viewport"content="width=device-width,></metacharset="utf-8"></head></htmllang="ja">

求人案内

株式会社 ZEAL.G·P 事業内容:トラック、バス、重機などの商用車専門の買取り及び輸出、販売 業務内容:コーディング PHPとWordPressができるとよし。

Twitter Bootstrap

BootStrap Download Bootstrapからダウンロード Getting started→Basic templateのソースを新規HTMLファイルに貼り付け ドットインストール→Bootstrap 3.0入門 (全18回) Twitter Bootstrapとは Webデザインのテンプレートのようなもの。 具体的には、HTMLの…

シグマコミュニケーションズ(マスコミ・エンタメ業界の就職斡旋)

求人サイト 放送・映像・広告・ゲーム・Web・エンタメ:マスコミ求人.com 映像・広告・Web・ゲーム:マスコミ求人ダイレクト 未経験→正社員の案件は少ない。

スマートフォンサイト制作

スマートフォンサイトをデザインするのも、いろいろなサイトを見ることから。 iPhone Design Box スマートフォンとPCの切り替え機能をつける。 ホームアイコンをつける。 矩形ナビゲーションレイアウト ブログ・Web初心者の勉強「矩形ナビゲーションレイアウ…

PhotoShop(顔写真補正)

ほくろ除去 パッチツールを使う。 やり方はこちら。 目の拡大 ゆがみフィルタを使う。 やり方はこちら。 眉毛 焼きこみツール 切り取り 被写体と周りがはっきり分かれていれば、自動選択ぼかし20でまわりクリック。細かい点が残ったらshift+長方形で囲う。 …

魅せる!iPhoneサイト

作例5 テキストP.100 トランジションの練習 <ahref="#">ボタン</a> a{ display:block; color:#fff; width:100px; padding:10px; text-align:center; background:blue; text-decoration:none; transition-property:background,width; transition-duration:1s; transition-tim…

jQuery Mobile

ブログ・ Webデザイン初心者の勉強「jQueryMobileとは」 jqueryMobile日本語リファレンス ASCII.jp WEB PROFESSINAL 西畑一馬のjQuery Mobileデザイン入門 らくらく!jQueryMobileであなたもカンタン・スマホサイト制作 jQueryMobileは、スマートフォン用に…

魅せる!iPhoneサイト

.htaccessでの振り分け 「○○/index.html」にスマートフォンでアクセスした時に、スマートフォン用サイト「○○/sp/index.html」に移動させる。 .htaccessファイルの作成 Dreamweaverやメモ帳などなんでもいいのでテキストで作成。 <IfModule mod_rewrite.c> RewriteEngine On RewriteCo</ifmodule>…

株式会社システムリンク

今回は求人ではなく、IT系中小企業への就職斡旋サービスの案内。 登録案内と個別面談。 プログラマー(Web系、システム系、ネットワーク系)求人が多数。

レスポンシブ(魅せる!iphoneサイト)

ポートフォリオサイトはレスポンシブで作りましょう。 レスポンシブでないものは検索評価が落ちる傾向。 PC(win)でモバイルチェックするにはMobilizer。 子孫セレクタを使おう スマートフォン用のリセットCSS 作例1 テキストp53 HTML head viewportの設定…

PHP32(画像をデータベースに保存)

PHP

ブログ・PHPの勉強「商品管理(3)画像を追加」 画像は、データベースに画像名、サーバーに画像本体を保存する。 データベースに画像名を保存するカラムを作成する。 サイト内に画像本体を保存するフォルダを作成する。 商品追加画面 <htmllang="ja"> <head> <metacharset="utf-8"> <title>商品管理</title> <linkrel="stylesheet"href="style.css"> </head> <body> <divid="container"> <h1>商品</h1></divid="container"></body></htmllang="ja">…

PHP31(ログイン)

PHP

ブログ・PHPの勉強「ログイン」 ログイン <htmllang="ja"> <head> <metacharset="utf-8"> <title>ログイン</title> <linkrel="stylesheet"href="style.css"> </head> <body> <divid="container"> <h1>スタッフ・ログイン</h1> <formaction="02_check.php"method="post"> <p>スタッフコード</p> <p></p></formaction="02_check.php"method="post"></divid="container"></body></htmllang="ja">

HTML08(レイアウトサンプル)

ブログ・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>

ポートフォリオサイト集(jQueryfiltering習作)

アイデア収集用。プロのみでなく他校のものもあり。

ポートフォリオ(メモ)

11月中にアイデアを決める。 スキルアップを時系列で表現。

スマートフォンサイト(jQuery mobileの紹介)

西畑一馬のjQuery Mobileデザイン入門 jQuery Mobile日本語リファレンス jQuery mobileを使うことで、簡単にサイトのレイアウトができる。 ボタンなどのグラデーションを設定してくれる。 data-roleでひとつのサイトの中で複数のサイトレイアウトが組める。

デザインの要素満載なポスター

情報の配置 人の視線はZの字。角に重要な情報を置く。 視線が通過しやすい場所に情報を置く場合は、大きくするなどして目立たせる。 写真のふち 角版:伝えたい情報。商品など。 切り抜き:カジュアルな印象を与える。漫画っぽい。若者向き。→投票率をあげ…

レスポンシブWebデザイン05(可変+固定)

ブログ・HTML5の勉強「可変+固定レイアウトパターン:構造」

PHP30(フォーム入力~データ一覧の演習)

PHP

商品と価格を入力し、データベースに格納。 入力チェックし、エラーがあれば入力画面に戻るよう誘導する。 データベースに接続できないときは、エラーメッセージを表示。 データ一覧でデータベースから引っぱってきて表示し、選択用のラジオボタンをつけてお…

ポートフォリオ

数字を使うと伝わりやすい。 制作時間も書く。 紙バージョンも必要。

JavaScript10(GoogleMapsAPI習作)

ブログ・Webデザイン初心者の勉強「GoogleMap API(2)」 習作 移動時間をscriptの中のtravelModeでDRIVINGかWALKINGか設定できる。 RUNNINGがなかったので、これを非表示にするために行をむりやりつぶしている。

サイト制作

これから作成するサイトに縦スクロールのjQueryを必ず使おう。 いろいろあるけどto-Rで紹介しているsmooth scrollが動きがいい。 http://blog.webcreativepark.net/2012/09/06-152317.html

PHP29(cookie:各自で進める)

PHP

ブログ・PHPの勉強「COOKIE:解答例」 クッキー setcookie('名前',値,保存期間); サイト表示のたびに変数に1ずつ足してsetcookieに入れることでサイト訪問回数を数えることができる。 エラー input.phpのフォームでクッキー保存のチェックボックスをチェック…

PHP28(課題フォームの修正)

PHP

修正内容 COOKIEに入る前に、以前の課題で作成したフォームを授業ブログのソースを元に修正。 修正箇所は、1)nl2brを入れる。2)htmlspecialcharsをprintのすぐ前で使う。3)メールをユーザーとクライアントに届くようにする。 問題点(query('SET NAMES…

jQuery11(jQuery filteringの習作)

これぐらい動かす要素があると重い。やはり画像を見せるもの。 firefoxが特に重い。

JavaScript09(GoogleMaps API)

緯度・経度 pointabs スケール指定 マーカーの位置 センターの位置 エラー ブログ・Webデザイン初心者の勉強「GoogleMap API(1)」のソースを使ってローカルでは表示できたが、サーバーにアップすると表示できず「APIキーが必要」とでる。 最新バージョンで…

jQuery10(jQuery Filtering)

jQuery Filtering ブログ・Webデザインの勉強 | 風姿花伝「jQueryでフィルタ(フィルタリング)機能」 お手本サイト 補足 内容が多い・少ないによって縦スクロールバー分の表示ズレがある場合はhtml{overflow-y: scroll;}で固定。 画像サイズを変える場合は…

jQuery09(Beautiful Background Imageの習作)

今後やること

職務経歴書:年表・やってきたこと・できることなどを図案化する。ポートフォリオにも入れてよし。Web業界に就職するなら、デザイン化すること。 12/2・3:ポートフォリオサイト案のプレゼン。

PHP27(フォーム練習問題)

PHP

※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">

CSS13(ロールオーバー)

CSS

ブログ・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">…

職業能力基礎講習(書類作成)

書類の種類 履歴書 職務経歴書 添え状 ハローワークの紹介状 ジョブカード 書類作成の目的 採用担当者に「いいね!」「会いたい」「確かめたい」と思わせること 履歴書 見た目がきれいかどうか。字がうまければ手書きも可。 日付:郵送する日。基本的に元号…