全体の構図,カラー等を決める｜無料ブログ比較検証

前後の記事

携帯サイト制作::ケータイサイト制作王3

更新:2007年2月17日（土）

全体の構図,カラー等を決める

サイト制作を行う上で、閲覧者にとって最も印象が残る要素がこの全体の構図やカラーです。ここではケータイサイト制作王３で実際にカラーや構図を決める方法を詳しく解説します。

ケータイサイト制作王３でページごとに背景色を決めるのは簡単です。

まず、マウスを編集画面内で右クリックします。

すると、[写真１]のようなメニューが表示されるので、その中から[ページの色]を選択します。

※写真１

ページの色を選択すると、[ページの色]というウィンドウが現れますので、その中にある[背景色]と書かれた項目にある[色指定]を選択します。

※写真２

するとズラっと並んでいるカラーパレットが現れますのでその中から背景色にしたい色を選択し、[OK]をクリックします。

但し、標準のカラーパレットの色はどぎついだけでなく、他のケータイサイトを運営している者も安易に選択しやすい色ばかりですので、個性的なサイトを目指すならば、ご自身でより細やかな色の選別を行うほうが良いでしょう。

自分好みの色パレットを作成

好みの色を作成するには、[作成した色]と書かれた白色で並んでいるパレットの一つを選択した状態で[色の作成]をクリックします。

すると右側に選択項目が新たに現れますので、そこからさらに右側にあるカラーグラデーションを使用して細かい色の選択を行います。色の選択が終われば、[色の追加]をクリックした後、OKを押します。[写真３]

※写真３

今回は背景色だけを詳しく説明しましたが、[通常文字色][リンク色][既読色]も同様の方法で作成します。もちろん、上記にご紹介した、自分の好みで細かく作成したカスタム色パレットも共通して使う事が出来ます。

全てが終わるとこのような感じで色の反映されたページが表示されます。[写真４]

※写真４

サイトのカラー = 配色ではない

ここで言うサイトのカラーというのは別に色に限った事ではありません。

作成したサイトの目的は何の為のものか、閲覧されるターゲットはどのような方を対象にしているのかといった事を十分に検討し、それに必要とされるサイト構成をするのもサイトのカラー選定と言えます。

必要に応じてメニューの位置を吟味したり、文字の配置を統一し、自分自信でこれが俺流といったカラーを試行錯誤して確立しましょう。

さて、お次はお待ちかねケータイ制作で使用できる様々なリンク方法をご紹介します。これを上手に生かせばウザくないホームページが誰でも簡単に行えるようになります。

[様々なリンク方法の説明]

[ケーイタイサイト制作王チュートリアル(入門)]に戻る

無料ブログ比較検証 : ハッスル寅男

最初はランキングサイトで訪問者を増やそう

伸び悩んでいる方は、ランキングを科学するを参照

[ 07:35 PM | comments (8) | trackback (0) ]

[後でまた読む]

記事貼り付け

投稿者 29歳男

コンテンツの内容と関係ない質問になってすいません。
いくら調べてもわからないので教えて下さい。

パソコンサイトなのですが、メニュー欄を一括で管理するにはどうしたらいいのでしょうか。
ブログのプラグインのようにしたいのです。
ブログのソースを見ると下のようになっているので、表示するにはこれでいいと思いますが、もとになるものはどこに書いたらいいのでしょうか。

{freespace_title1}
{freespace_contents1}


数年間悩み続けていますが、解決方法がわからないため全ページで編集しています。
ページが多くなってくると大変ですし間違いも出てきます。
どうかよろしくおねがいします。

PS：ハッスル先生のメルマガとてもためになります。これからも楽しみにしています。

[ URL | 2007年2月20日, 03:12 PM ]

投稿者ハッスル寅男

コメントありがとうございます。文面から察するに、ブログのような自動生成されるウェブアプリケーションではなく、一般的なホームページを作る時のメニューに関するご質問のようですね。

即答させて頂くと、完全静的URLでのホームページでは、メニューをプラグインのような形で流用する事は出来ません。

出来るようにする為にはどうしても動的（ウェブ言語）を使用しなければなりません。

29歳男さんのやりたいとお考えの事を一般的なホームページで実現する為には、３種類の方法が考えられます。一つは、Javascriptでメニューを作成する方法。これは拡張子を変更する必要がない為、導入は楽ですが、その反面、検索エンジンに読まれにくい方式ですのでSEO的には不利です。

参考サイトは、
http://mugi.cc/muginavi/

こちらを参考にされるとよろしいかと思います。

次に、PHPによるメニューの一言管理。これは、ファイルの拡張子を.htmlから.phpに変更しなければならないという手間がかかるのと、無料レンタルサーバーではPHPが使用出来ない場合もあったりしますが、これでしたら、他にも様々なプログラムを走らせる事が出来るので、オススメです。

<?php
include_once('data/menu.html');
?>

このように表記すると、data/　という場所にあるmenu.html にかかれたメニューリンクのタグの内容をまるごと読み込ませる事が出来ます。

そして最後の方法はssiを使用する方法です。おそらくこの方法の事を言っておられるのではないかと個人的には思っていいるのですが、ssiとしてメニュータグを実装される場合は、ファイルの拡張子を.shtml にしなければいけません。

そうする事により、ブログのプラグインのような形で読み込ませる事が出来るようになります。

記述方法は、



とします。ちなみにどうしても拡張子を変えたくないという状況であれば、下記の記事をご参照下さい。

ハッスルサーバーで.phpを.htmlに偽装化する方法
http://blog.hustle-user.com/index.php?id=06070010

これは、phpの部分をshtmlに変更する事でssiもhtmlで動かせるようになると思います。

但し、動的ページを偽装すると、全てのhtml拡張子が動的ページとして扱われる為、サーバーに余計な負荷がかかってしまいます。その為、htmlを偽装した場合は.htmを本来の静的ページとして扱うといった工夫をされる事をおすすめします。

詳しい事は、

.phpを.htmlで偽装した際の問題点
http://blog.hustle-user.com/index.php?id=06080011

をご覧下さい。

[ URL | 2007年2月21日, 12:01 AM ]

投稿者 29歳男

夜遅くのお返事、そして丁寧に教えてくださってありがとうございます。

様々な方法や、参考リンクまで…感激です！

とても参考になりました。
本当にありがとうございます！

[ URL | 2007年2月21日, 09:57 AM ]

投稿者ハッスル寅男

いつも返事が夜になってしまいスミマセン。

コメントに関しては、話題と違ったとしても全然OKです。実は、２９歳男さんのようなコメントは大変貴重な意見だと考えております。誰でも最初はつまづき、そして悩みます。

筆者も、解決出来た問題もあれば、今でもわからずウ〜ンと唸りながら悩んでいる事もあります。つまずいてしまう石ころも一人一人違う為、筆者が簡単だと思い取り上げていなかった事も実は大勢の方は困っている事だってあるかもしれません。

今回のやりとりも、いずれまた誰か他の方のお役に立つ事があれば、このブログを立ち上げた甲斐があるというものです。検索エンジンに上位表示されるような事があったとしても、誰も必要としない情報ばかりでは目も当てられません。

ですから、今後も内容の大きい小さいに関わらず、全て全力で返信しようと思っています。
貴重な、ご質問本当にありがとうございました。

[ URL | 2007年2月22日, 12:34 AM ]

投稿者ツツイ

こんばんは。ツツイです。
本サイト、いえハッスル寅男さんのファンでいつも楽しみに訪問させてもらっています。
ところで携帯サイト作成するのは、ケータイ制作王３がよいとのことですが、作成後はどのレンタルサーバーがよいのでしょうか？ハッスルサーバーは携帯サイトもＯＫなのでしょうか？よくわかりません。
もしよいところがあればぜひ教えて下さい。
よろしくお願いします。

[ URL | 2007年6月07日, 01:29 AM ]

投稿者ハッスル寅男

ケータイサイト制作王３を普通に購入されますと、無料でレンタルサーバースペースを利用する事が出来ます。ケータイサイト制作王そのものは直感的な操作で簡単に誰でも携帯サイトが作れてしまう訳ですが、最初は不安な方もおられるかもしれません。

そんな場合は、このケータイサイト制作王が提供している無料レンタルスペースで実験的にアップロードするのも悪くはないでしょう。FTPのアップロードもケータイサイト制作王３なら非常に簡単でボタン一つで３キャリアへ自動変換→差分アップロードという流れで自動的に行われます。

もちろん、他のレンタルサーバーでも問題なく携帯ページはいくつでも作成可能です。筆者が携帯にオススメなレンタルサーバーは当然の如く、第一候補は、ハッスルサーバーです。

なにしろ軽くて安いですし、容量も500Mですし。実は意外に忘れがちになるのが容量の問題です。携帯サイト制作王は、１サイト作成すれば、自動的に３キャリア用にエンコードします。つまり容量は１サイト作れば単純に３倍になるという事です。

携帯サイトは作成自体が非常に楽なので、その気になれば、ケータイサイト制作王ひとつで２０〜３０サイト以上作る事だって出来ます。そういった意味でも、いかに費用が安くそれでいて容量が多いのかが評価の対象となる所でしょう。

振り分けもPHPが利用出来る所であれば、このブログに書いてあるような振り分けが可能となりますので、Goodです。

ちなみに、会社等では、まず、サブドメインでモバイル用のページをアップし、本家からPHPによる振り分けを行います。つづいて携帯サイトも、検索エンジンに登録をします。但し、スパム扱いされる危険があるので、/v/　/ez/　/i/　のうち/i/　のみを登録します。

ページのサイトに上位表示させたいキーワードと共に本体のPC用に作成したリンクを張り、さりげにSEOを行う訳です。タイトルタグや流れる文字等にもぬかりなく、上位表示を意識した言葉をおりまぜます。

TU-KAが無くなった事により、もはやez用のページの作成メリットはだいぶ薄れはしましたが、だからこそ、こういった自動で意識する事なく自動変換してくれるツールの存在は貴重です。

あ、そうそう携帯用のお問い合わせにはM-Formをよろしくです♪

最新版は、銀行振込・代引きといった２種類の選択枝によってメッセージを変更する機能を追加しています。実はこの機能は、わりと需要のある機能だと個人的には思ってます。