07.デザインをカッコよく 【 動きのあるサイトにする 】


動きがあって楽しいサイトにしましょう

動きのあるサイトってどんなの?

動きのあるサイトってどういうサイトをさすのかというと、ユーザーが操作して楽しいと いうことが1番重要なのではないでしょう
このサイトで言うと左側のメニューぐらいでしょうかw
マウスを乗せるとピンク色のグラデーションになると思います。
これはすべてCSSで実現していますが動きのあるサイトのいい例があるので見てみてください。
GT INC.さんのサイトです。
音楽なんかも流れて非常に楽しいです。
動くのももちろんいいところですが、この音楽も見逃せませんね。
よく耳障りな音楽をトップページで流してるサイトがありましたが最近はだいぶ減りましたw
ただただ表示に時間がかかるだけであまりユーザーにとってはうれしいものではありませんでした。
もちろんすべてのサイトが当てはまるわけじゃありませんがw
このGT INC.さんのサイトのBGMはデザインと、音のバランスがすごく取れていると思います。
音が邪魔な感じがしないですよね。
これがまさにプロの仕事です。
と、音楽の話になると話がながくなるのでこのへんまでにしますが、みなさんもこんなサイトを作ってみたいと思いませんか?
ボクも作ってみたいですw

動的なサイトを作成する

上記のサイトのようなものは初心者ではまずつくれません
プロフェッショナルな方が作ったものですので相当勉強されていますし、テクニックもハンパないです。
そのほかの点で動的にするにはPHPやCGIなどの言語を用いることです。
このサイトではレ ンタルサーバーの検索画面でPHPとMySQLデータベースを用いています。
こういうのも動的で非常に便利です。
データベースなんかは使って見ようと思っている方はたくさんいらっしゃると思います。
私もプロではないのでPHPなんかはまだうまく使いこなせません。
PHPは独学ではなかなかきびしいといわれるものです。
もちろんマスターされている方もいらっしゃるでしょう。
私は右にも掲載してあるMySQL 入門以前という本で勉強してレンタルサーバーの検 索画面(現在は削除しています)を作成しました。
PHPはプログラミングなので難しく、頭のよろしくないボクにとってはなかなかつらいものでした(T_T)
が、このMySQL入門以前はこのサイトのように、初心者中の初心者に説明するように書いてあるので非常にわかりやすかったです。
本格的にPHP+MySQLを扱いたいけどどうしていいかわからない人や、ちょっとしたデータベースを作成したい人にとっては非常に有益な本になります。
またPHPは更新作業も楽にできます。
このサイトで言うと左側のメニューや右側のリンクなどをほぼすべてのページで表示されるようにしていますが、もし、メニューの増加やLINKの変更などが あったら全部のファイルを更新しなければなりませんよね?
しかし、PHPを用いれば、CSSの外部ファイルのように別のファイルをページの一部に適用させれば、その外部ファイルを更新すればすべてのページに更新 が適用されます。
非常に楽ですよね。
PHPはそのほかにもWEB上に時計を表示させたり、日付を表示させたり、またはサイトの最終更新日を自動的に更新して載せたり、その他にもたくさんの機 能を作成することができます。
今一番注目されている言語といっても過言ではありません。
PHPでひとつ残念なのが無料サーバーでは使えるところがほとんどないということです。
というかゼロと思っていただいて結構です。
有料のレン タルサーバーを借りれば使えるようになります。
CGIも同じような状況です。
無料サーバーで更新の簡素化を図るなら、インラインフレームを用いるほかないかもしれません。
皆さんも見たことがあるかもしれません。
サンプルでリンクを張っておきます。

インラインフレームはSEOに不利

ずごく便利に思えるのですが、SEOにとって不利になるのでいまやインラインフレームを採用している企業はもうほとんどありません。
インラインフレームに見せかけているサイトはたくさんありますが。
このサイトもその例のひとつです。
なぜならこのインラインフレームは1つのファイルでは作ることができません。
左のファイルLと、右のファイルR、そしてスクロールバーがついているファイルC・・・だけだと思いきや、それら3つをのせているインデックスファイルの 計4つのファイルで構成されています。
なぜコレがだめかというのを説明します。
ホームページのトップページのファイルは
index.拡張子
という形でなければいけませんのですべての4つのファイルをのせるファイルをindexファイルにしなければいけません。
このindexファイルには
「4つのファイルでインラインフレームを構成しています」
というタグを書き込むのみ(多少はほかのタグも書き込んでもいいですが)になるので、サーチエンジンが読み込んでくれる重要キーワードはほとんど書き込め ませんのでYahooやGoogleなどのサーチエンジンにヒットしづらくなります。
また重要なキーワードを書くのが左のファイルLと、右のファイルRになり、サーチエンジンの検索結果に片方のページしか引っかからなくなってしまう恐れが あります。
indexファイルのアドレスにアクセスしてはじめて4つのファイルが表示されるからです。
アフィリエイトサイトやオリジナルバンドのサイトでは決してやってはいけない(やらないほうがいい)テクニックとなっています。
企業が次々にデザインを変えていったのも納得がいくと思います。
個人的にはインラインフレーム好きですけどねw
ですから更新作業を簡素化したいならPHPを使えるサーバーを用いるのが1番です。
ほかの方法としてはDreamweaverを使うという手もあります。
テンプレートを作成しとけば全ページのリンクを一瞬にして変えることができます。
値段が値段だけあって便利ですね。

ショッピングカートは動的

ショッピングサイトなんかも動的にしたいですね。AMAZONや楽天市場というオンラインショッピングサイトなんかご利用になったこと はありますか?
欲しい商品があったらチェックしとけば、買い物カゴ(ショッピングカート)に自動的に商品が入ってくれますよね?
はじめて使ったときはビックリしたものでした。
こういうプログラムもPHPなどの難しい言語を用いるので、無料レンタルサーバーでは実現できません。
もし、ショッピングサイトを作りたいのならロリポップ、チカッパ、ヘテルムなどの有料レンタルサーバーなどを利用すれば簡単に利用させてもらうことができ ます。
またショッピングサイト作成に精通している・・・・さんを利用するのも手です。
プログラミングは相当大変な作業ですから。
IT企業で働くサラリーマンが超忙しいのはそういうお仕事をされているからです。
ありがとうございます。
お疲れ様です、ホントに。

FLASHでホームページに動きを与える

大事なのを忘れてましたwサイトに動きを与えるFLASHです。
これは絶対どっかで見たことあると思います。
企業のほとんどのページで採用されていますよね。
このサイトでは面倒くさいので作ってませんがw
いまやFLASH作成はWEBデザイナーには必至のテクニックとなりました。
Adobe社のFLASH CS3を使えるようになればしめたものです。
想像力があれば表彰されちゃうこともあります。
もちろん無料でもフラッシュ作成ソフトは配布されています。
クオリティはだいぶ劣るとは思いますが、クリエイティブな世界なので好きな人にとってはメチャクチャ楽しい作業でしょう。
私は非クリエイティブな純日本人なのであまり得意ではありませんがw
フラッシュはメニューやフォトギャラリーにも使われているところは多いです。
あなたのサイトはフラッシュで作ってみてはいかがでしょうか?

Google