Web制作会社のマーズデザイン  »  Webディレクター  

 

Webディレクター

お客様に最適なWEB戦略で、 ブランド価値の向上、お問い合わせの増加、迅速な情報の配信、 営業・広告費用の削減、顧客満足の向上、リピート率の増加 の成功事例を実現しております。

2009年3月30日

アクセシビリティとユニバーサルデザイン

最近、アクセシビリティとユニバーサルデザインについて
調べていましたが、昔から個人的に思うところがありました。

そういえば、私は「左利き」です。

思い返してみれば、ウェブサイトのみならず一般の生活の中でも、
左利きには非常に生活のしにくいデザインばかりです。

会社で支給されるキーボードやマウスは一般的に「右利き用」ですし、
駅の自動改札や、蛇口のひねる方向も考えてみると左利きにはちょっとアウェーです。。。

自動改札は、左1つとなりの改札が開いてしまったり、
蛇口は左手が変な方向に向いていたりしました。

ハサミや包丁なども、一般に市販されているものは大抵
「右利き」用ですので、左ではうまく切れません。
ですので、右用に慣れるか「左利き用」のハサミや包丁を買わなければなりません。

ちなみに、「左利き用」の生活用品は少し割高でした。。。

今はすっかり慣れてしまい、右手も使えて両利き状態ですが、
当たり前の事を、「慣れる」ことをしていました。





2009年3月27日

便利ツール 簡単に .htaccess

Web制作の現場では、よく使う「.htaccess」

今日は、Webサイトにパスワードを掛けて、
特定の人しか見られないようにすることができる、
「.htaccess」を誰でも簡単にオンライン上で作成してくれる
ツールをご紹介します。
.htaccessEditor』 

「.htaccess」を使うことで、特定のページを開く際に、
ユーザ名とパスワードを入力するボックスを表示し、
ユーザ名とパスワードの組み合わせが正しい場合のみ、
そのページを表示できるようにするBasic認証(UNIX認証)を
かけることができます。

※.htaccess
 ApacheなどのWebサーバで使用できる、Webサーバの動作を
 ディレクトリ単位で制御するためのファイル。
 具体的には、CGIやSSIなどを実行するための宣言(命令)や、
 拡張子ごとにファイルタイプを指定するMIMEタイプの設定、
 ユーザ認証、IPアドレスやドメイン単位でのアクセス制限などを
 書き込むことができる。
 .htaccessファイルで設定した内容は、.htaccessファイルがある
 ディレクトリとそのサブディレクトリに効果があり、
 効果があるディレクトリに入っているファイルすべてに影響をおよぼす。

 また、サブディレクトリにも.htaccessファイルを別に置くこともでき、
 この場合は両方のファイルの効果が発生する
 (矛盾するときはサブディレクトリの設定を優先)。

 Webサーバの設定ファイル(httpd.conf)を使用すると
 .htaccessファイルで設定できる内容を制限できるため、
 Apacheなどが動作しているサーバでも.htaccessを使用できなかったり、
 一部の機能しか使用できなかったりすることもある。




2009年3月25日

Webアクセシビリティの現実

今回は、WEBアクセシビリティについて調べてみました。

【アクセシビリティの現実】

過去に国連が行なった調査によると、
世界のWebサイトの97%が最低限のアクセシビリティの基準に
達していないという。。。

その時の調査対象であった日本や米国、英国、アルゼンチン、チリ、ケニアなど20カ国の
政府、航空会社、銀行、新聞社、小売業者で、1カ国あたり5サイト、
合計100サイトが調べられようです。


その調査で合格点を得たのはわずかに3サイトで、それはドイツ首相のサイト、
スペイン政府のサイト、イギリス首相のサイトだったとのこと。

たった3サイトだけ・・・。

 不合格だったサイトの問題点としては、
 以下のような事のようです。

■画像に適切な説明文を提供しておらず、
 視覚障害者にとって大きな問題となった。

■サイトの重要な機能にJavaScriptを使用しており、 
 およそ10%のインターネット利用者が
 重要な情報を入手できない状況。

■前景色と背景色のコンビネーションが悪いために
 コントラストが非常に悪く、色覚障害者や比較的軽い視覚障害者にとって
 情報入手を困難にしている。

■サイトのデザインに固定サイズを使用しているためにテキストや
 ページの大きさを自分の見やすいように変更できなかった。

■文書構造を記述するための適切な見出しを付けなかったために、視覚障害者がページを
 ナビゲートするのを困難にしていた。

■ユーザーに警告することなくポップアップウィンドウを使用していた。


WEBサイトを作る仕事に携わる者として、
上記の事項は見落としてる部分もあり、
サイト制作のあり方を考えさせられました。



2009年3月24日

Webディレクター ユーザビリティーを考える

今日は、ユーザーにとって使いやすいサイトとは
どのようなサイトなのか・・・

ユーザビリティーの高いWebサイトを作る際に
大切なことを調べてみました。
    ■Tagline(キャッチフレーズ)を書く

      Taglineとは、会社やサイトのフィロソフィー、ミッションを表したものを指します。
      トップページの一番わかりやすい場所に置いてあげると良いですね。

    ■検索ボックスを置く

      ユーザが何かを探している時、テキストを入力できるフィールドをまず探すため、
      検索ボックスはサイトの上部に置くと良いようです。
      それは、ユーザの視線はF型に進むからという。。。

    ■グラフィックを使いすぎない

      過剰なグラフィックはユーザを迷わせてしまいます。
      ユーザビリティーの観点からは、グラフィックは少ないほどよいようです。

    ■サイトマップを設置する

      サイトのナビゲーションとSEOにも効果的なのがサイトマップです◎

    ■ユーザの動作を中断させない

      フォームへの入力やユーザ登録時などに、動作を中断させないように
  工夫することが重要です。また、リンク先のページの色を変化させないことも
  ユーザを迷わせないために重要。

    ■さっと読めるページを作る

      ユーザはページをじっくりは見ず、タイトルや太字、強調されたテキストを
  ざっと見る傾向があるようです。特に、始めの2パラグラフが最も重要で、
  読者が探している最も重要な情報をそこに含んでいると◎

    ■ユーザを迷わせるUIデザインをしない

      ボタンに見えるグラフィックエレメントは使わない。
      リンクに見える下線付きのテキストで、クリックできないなど・・・

    ■わかりやすいフィードバックをする

      意味のあるフィードバックは不可欠。
  エラーのときにエラーメッセージを見せるのではなく、
      意味のあるメッセージを伝える404ページを用意するなど。

    ■Javascriptを使いすぎない

      ブラウザごとに挙動が違うので、Javascriptをオフにしている
  ユーザを考慮して使いすぎない。

    ■※CAPTCHAを避ける
      歪んだテキストを理解するのは人間の脳に負担になります。
  言語の違いで国によっては理解が困難なため、違う方法を考えた方が無難。

※CAPTCHA
 文字を歪ませた画像をユーザに提示し、そこに書かれた文字列を
 入力させることで、相手が人間であるということを確認する手法。
 最近では画像認証(複数の画像から特定のものをクリックして選び出す方法)を
 使う方法も検討され始めている。



2009年3月23日

Webディレクターとオランウータン

SN3E0005.jpg今年より始めたWebディレクターブログですが、
どのようなキーワードでのセッションが多いのか、
気になり、調べてみました。

【2/20~3/22までのセッション数ランク】

 1位 マーズデザイン

 2位  web制作

   3位  webディレクター オランウータン


何故だかわかりませんが、3位の「webディレクター オランウータン」が
意外にも多くのセッション数を稼いでいます。。。

その記事はこちら 『オランウータン

※セッション数
 アクセス数の単位の一つで「ビジット」とも呼ばれています。
 Webサイトを訪れたユーザがサイト内で行なう一連の行動をまとめて
 1セッションといい、同一のユーザが短時間の間に何ページ読み込もうと、
 セッションは1です。同一のユーザでも、ある程度間隔が開いた場合は、
 新しいセッションとしてカウントします。




2009年3月19日

SEO対策がもたらす効果

過去に、ブログでSEO対策について
幾つか記事を書いてきました。

では、SEO対策をすることによって、
検索エンジンに上位表示されることで、
どういったメリットがあるか、調べてみました。

検索エンジンに上位表示されるメリットは
以下のことが考えられます。

① 検索エンジンから低価格で継続的な集客導引ができる

② 検索エンジンからの誘導客は顧客となる可能性が高い

③ 告知効果が大幅にアップ

④ チラシを印刷・配布するよりも低コストで広域のPRができる

⑤ 認知度が高まり、ブランドイメージがアップする


こうして改めてみると、SEO対策の重要性を再認識しますね。



2009年3月18日

黄砂で1日に洗車3回

今日、通勤の電車で黄砂について話しているのを聞きました。

『黄砂の影響で、一部地域のタクシーが一日に3回は洗車しているらしい』

1日に3回も洗車って・・・大変です。

先日より、黄砂が日本列島を覆う見込みであると
ニュースで取り上げられていました。

気象庁によると、黄砂は中国の河北省や北京市を中心に、
地表付近をかなり濃い黄砂が覆っており、
黄砂の帯は中国東北地方から日本海、日本列島の九州から北海道まで
伸びているみたいです。

今後、東に移動しながら19日ごろまで続くとのこと。

黄砂の被害はタクシーだけでなく、黄砂が肺に入ると
花粉症や気管支ぜんそくなどのアレルギー症状が悪化すると言われています。

スギやヒノキの花粉が最も飛散する時期と黄砂の時期とがほぼ一致する
3月中旬から5月初旬にかけては、花粉症の方には悪条件の季節ですね。。。

黄砂は花粉より小さい粒子のようですので、
花粉症のマスクではなく風邪のウイルスを通さないマスクを使うなど、
対策をしていきましょう。。

※黄砂
 黄砂は中国大陸内陸部のタクラマカン砂漠、ゴビ砂漠や黄土高原など、
 乾燥・半乾燥地域で、風によって数千メートルの高度にまで巻き上げられた
 土壌・鉱物粒子が偏西風に乗って日本に飛来し、大気中に浮遊あるいは
 降下する現象です。



2009年3月18日

亀田のカレーせん

SN3E0006.jpg今日は、会社近くのコンビニで、
思わず買ってしまいました。。。

香り極めたインド風本格スパイス使用!ピリッと旨辛!
その名のとおり、カレーのせんべいです。

スパイシーな香りと程良い辛さで
一枚食べ始めると止まらなくなり、
ちょっと危険な美味しさです。

スタッフにもおすそ分けしたところ、
止まりませんでした。。。

パッケージのデザインもカレーイエロー?を基調色として、
商品名のフォントも力ずよくインパクト大。
カレーの風味が伝わってきます。
カッコ良いですね。






2009年3月17日

検索エンジンから見たWebサイト

今回はSEO対策として、検索エンジンからはWebサイトは
どのよう見えていて、どういった情報を認識して検索結果に反映しているか
調べられるツールにご紹介。

SEO-Browser』は、ウェブページが検索エンジンのスパイダーから
どう見えるかを確認できるツールです。

このツールを使うと、検索エンジンにとってどの要素が認識可能で
インデックス化できるか確認できます。

※SEO-Browserは日本語が化けるように見えますが、
   ブラウザの文字エンコーディング設定を、サイトで使用している
   文字コードに合わせればOK。



2009年3月16日

法律事務所のサイト制作

最近、私がホームページ制作にてお手伝いさせていただいた
法律事務所のサイトが公開されましたので、ご紹介いたします。

1.jpg「星川法律事務所」様のホームページは、
弁護士事務所の高級感と信用ブランドを訴求したデザインに仕上がりました。

TopページにてFLASH ACTION SCRIPTのメニューで、
ちょっと変わった動きも付けています。

詳しくは実績一覧より


お客様のご協力をいただきまして、
所属弁護士様のお写真・社屋・事務所内を
取材撮影させていただき、オープニングフラッシュの構成なども
お客様のご要望を伺いながら、進めさせていただきました。

デザインに関しましても、お客様にご納得いただけるまで、
ブルーの色味や、テキストの位置・ロゴのデザインなど
細かい部分まで、調整を重ねて制作をさせていただきました。





2009年3月13日

かっこいい マスタング

Introducing the 2010 Ford Mustang

オープニングから、まるで映画のようなシーン展開と
カメラワークで惹きつけられます。

ムービーもマスタングの「スピード感」と「音」で臨場感、かなり出てます。


デザインもTopの「2010 MUSTANG」タイトル部分など、
グイグイ走行するマスタングの雰囲気がでて、カッコいいです。





2009年3月12日

小布施ッションに行こう

小布施で毎月1回、ゾロ目の日に催されるイベント『小布施ッション

これまで、『小布施ッション』に招かれて講義をされた方は
どなたも各界で先駆的な仕事をしている方ばかりです。

講師の方からの講義を通して情報交換を行ったり、
おいしい小布施の料理と酒を楽しみながら楽しい出会いを重ねます。

今年はこの『小布施ッション』に参加する計画があります。
とても楽しみです。



2009年3月11日

便利ツール SEO検索順位チェック

あなたのサイトの検索エンジン順位をチェックするサイトのご紹介。

SEO TOOLS - 順位チェックツール

サイトのURLと検索キーワードを入力すると、
入力した検索キーワードでGoogle、Yahoo、MSNなどでの
検索順位がわかります。

また、検索キーワードから競合サイトも調べられ、
一覧で確認できて便利です。

出力結果をブックマークすることで、いつでも最新順位が確認できます。





2009年3月10日

人馬一体 騎馬スペクタクル 「ジンガロ」

今日は、個人的にとても見に行きたい
フランスの騎馬スペクタクル 「ジンガロ」について。

 現在ヨーロッパで人気のヨーロッパ伝統高等馬術に
さまざまな異文化の香りをミックスし、世界の音楽を用いて 不思議な世界を、
人と馬が作りだす フランス発の舞台芸術「ジンガロ

 
「ジンガロ」とは"放浪の民"の意味を持ち、
現在、様々な国籍をもつ団員と馬やガチョウ、楽師たちがヨーロッパ各地を
移動しながら公演しています。

演技者と馬は24時間生活を共にするパートナーであり、
旅も舞台も常にいっしょに行動することで
深い信頼関係が築かれ、極限まで一体化した演技が可能になるとのこと。

『馬に芸をさせるのではなく、出演者と対等な立場で、
馬の野生と人の知性が響き合い昇華していく』

ルーマニアの2つの楽団の生演奏もとても興味深いです。



2009年3月 9日

便利ツール「IrfanView」

今日は、フリーで使える Windows用のマルチメディアビューアーのご紹介。

IrfanView」は BMP/GIF/JPEG/PNG/TIFF/ICOやPhoto-CDなどの
画像形式に対応し、WAVE/MIDIの各音声ファイルやオーディオCD、
MPEG/AVIといったムービーファイルの再生が可能ですので、画像や動画を見たり、
音楽を聴いたりも出来ます。
特徴として「IrfanView」 は主に画像を見るためのソフトですが、
多少のレタッチ機能は搭載しています。

画像にモザイクをかけたり、ぼかしたり、
立体ボタンのようにしてみたりと、画像に手を加えることもできます。

また、画像の一部をドラッグアンドドロップで選択すると、
選択した部分だけを編集する事が出来ます。

画像のリサイズや回転・反転、明るさ・コントラストの調整などの簡単な加工も
一度に処理できるので、資料に使う画像などのちょっとした画像処理が
手軽にできて便利です。



2009年3月 6日

便利ツール 「WinSCP」

今日は、ファイル転送ソフトの1つ「WinSCP」をご紹介します。

WinSCPは MS-Windows上で動くSSHを使うファイル転送ソフトです。

ファイル転送のソフトと言えばFFFTPが有名ですが、
暗号化せずに通信を行うFFFTPと違い、WinSCPは内容を暗号化して通信するので、
安全にファイルのやり取りを行うことができます。

ファイル転送に伴ってパスワードなどが、盗まれる心配が無くなります。

詳しくはこちらから

※SSH(Secure SHell)
 ネットワークを介して別のコンピュータにログインしたり、遠隔地のマシンで
 コマンドを実行したり、他のマシンへファイルを移動したりするためのプログラム。
 ネットワーク上を流れるデータは暗号化されるため、インターネット経由でも一連の
 操作を安全に行なうことができます。





2009年3月 5日

「定額給付金」の使い道

今日は、なんだか少し変わったサイトのご紹介。

定額給付金ドットコム

こちらのサイトで、名前と年齢、性別を入力すると、
あなたに支給される「定額給付金」の良い使い道を
アドバイスしてくれるというちょっとお世話なサイトです。。。。

検出されたカテゴリーに合わせて、おすすめ商品とか
出てきちゃったりもします。

これは、Google Web API を利用しGoogleの膨大なデータにアクセスし
入力ワードを元に関連情報検索し、データを引っ張ってきているようです。

ですので、診断結果も当たらずとも遠からずといった感じでしょうか。

ちなみに私に支給される「定額給付金」の良い使い道は
以下の通りです。 当たらずとも遠からず?
1.jpg




2009年3月 4日

寄り道 『表参道シュークリング』

SN3E0034.jpg最近、仕事帰りに気になるお店があります。

表参道シュークリング

エチカ表参道、フードコート広場にある
リング状のシュー生地に様々なフレーバーのクリームを詰めた
"Choux Cring(シュークリング)のお店。

夕方頃には、お店の前に列ができるほど人気です。

以前、弊社のスタッフが買ってきてくれたのが
忘れられず、仕事帰りに後ろ髪ひかれながら
改札を通っています。。。

中でも、カフェオレ味のシュークリングがお勧めです◎






2009年3月 3日

ロゴデザインの参考

ロゴ投稿サイト 「Logofi

今日は、ロゴデザインの参考になるサイトのご紹介。

ロゴが多数あって、投票機能もついているので、
投票数によって、どんなロゴが支持を得ているというのが
分かったりするのも良いですね。

ロゴ作成の参考以外にも、自分で作成したロゴを投稿できたりもします。

サイトもシンプルでとても見やすくて◎




2009年3月 2日

mod_rewrite (モッドリライト)でSEO対策

WordPress などブログツールや掲示板によるページは、
PHP などで動的に生成されていることがあります。

動的に生成された URL は、検索エンジンロボット(クローラ)が、
クロールしにくい場合があり、SEO対策上不利になってしまいます。

それを解決するために、.htaccess ファイル内に、mod_rewrite を記述し、
動的な URL (動的ページ)を静的な URL に変換します。


mod_rewrite の設定例:

RewriteEngine on
RewriteRule ^/cgi-bin/example/([0-9]+)/([0-9]+)\.html$ /cgi-bin/sample.cgi?x=$1&y=$2 [L]


1) http://www.example.com/cgi-bin/sample.cgi?x=1234&y=5678
2) http://www.example.com/cgi-bin/sample/1234/5678.html


※動的ページ 【dynamic page(ダイナミックページ)】
 動的ページとは、URL に「?」や「&」などの変数を含むもので、
 自動的に生成されるHTML のことをいいます。






ホームページ掲載以外にもWEBサイト制作実績・成功事例紹介多数ございます。
Webサイトからお問い合わせのお客様に限り、納品後3ヶ月のコンサルティング(期間限定)

Web制作の無料見積もり・お問い合わせ