「リキッドレイアウト」と「ソリッドレイアウト」、どちらがいいか?

「リキッドレイアウト(可変型レイアウト)」と「ソリッドレイアウト(固定型レイアウト)」について、今月いろいろなブログで記事がかかれていました。

なにかレイアウト自体の是非を問うような記事をちらほらみかけたのですが、どちらちらもいい所と悪い所があると思うので、個々のWEBサイトの『目的』から考えるべきかと。

レイアウト自体の是非を問うのは「Flashで全画面はありか、なしか」といっているようなもの。

イメージ先行型のサイト、ブランドの向上等が優先目的となる場合、請求力のあるデザインを落とし込もうとすればFlashで全画面の選択は当然のごとくありますが、お役所のサイトのような「掲載内容がしっかり伝わる(文章をしっかり読める)」ことを優先目的とした場合、ブラウザが全画面に広がること自体を嫌がる人も多いので、Flashで全画面の選択は考えられない。

ただ考えるべきは『サイトの目的が達成できるかどうか』ということで、目的を達成するための選択をしっかりするということだけではないでしょうか?

WEBサイトでは誰が見ても100%満足する、というのはあり得ないと思っています。スキルの有無、色の好き嫌い、文字を読むのが嫌な人、読み込みが遅いとすぐいらいらする人など、十人十色で何らかの不満があってあたりまえ。

だからこそ目的をしっかり考え、ターゲットを絞ったりしながら、目標を定めしっかり達成できるよう作成し手直ししていく。

きちんとした選択ができるよう、いろいろな人の意見を聞きながら幅を広げていかねば!と改めて感じました。

(とかいいながら、ブラウザー統一してくれ、文字コード一つになれ、携帯規格統一しろ、とか、いろいろ愚痴ってしまう今日この頃…)

  • Category : 雑記
  • Tags : 

Google MAP API 導入メモ

いまさらながらGoogle MAP API 導入簡易メモ。

1. 下記ページでMaps API キーを手に入れる。
Sign Up for the Google Maps API – Google Maps API – Google Code

2. 座標指定だけでなく住所検索でも利用できる下記サンプルのソースを利用。
Google マップ

3. サンプルのソースの<script src=”http://maps.google.co.jp/maps?file=api&…>の部分のスクリプトの読み込み部分のkeyの値を1で取得した値に変更。

4. ソース少しだけ変更したものがこれ↓です。
Google Map サンプル

Javascript部分だけ抜粋

	var map = null;
	var geocoder = null;
	var address = "大阪高島屋";
	var infoMsg = "<b>"+address+"</b><br />外観が古くひそかにいい建物です。";
	function loadMap() {
		if (GBrowserIsCompatible()) {
		map = new GMap2(document.getElementById("map"));
		map.addControl(new GLargeMapControl());
		map.addControl(new GOverviewMapControl());
		map.addControl(new GMapTypeControl());
		//座標を利用する場合はこちらを利用する。geocoder以下はコメントアウトしましょう。
		//map.setCenter(new GLatLng(135.5010216, 34.6646465), 17);
		geocoder = new GClientGeocoder();
		geocoder.getLatLng(
				address,
				function(point) {
					if (!point) {
						alert(address +"が見つかりません。");
					} else {
						map.clearOverlays();
						map.setCenter(point, 17);
						var marker = new GMarker(point);
						map.addOverlay(marker);
						marker.openInfoWindowHtml(infoMsg);
					}
				}
			);
		}
	}
	window.onload = loadMap;
	window.unload=GUnload;

上記サンプルでは「高島屋大阪店」でマップを取得しています。
「address」に住所等を入れ、「infoMsg」に地図上に表示させたいメッセージを記入します。
とりあへずは最低限はこと足りるかと思います。全ソースが気になる方は直接のぞいてください。

参考URL
Google Maps API の例 – Google Maps API – Google Code
逆引きGoogle Maps APIリファレンス
みんなの知識【ちょっと便利帳】 緯度・経度を調べる(GoogleMapsAPI・地図作成用,10進数)

jQuery1.30 正式リリース

年末に1.3Betaがリリースされていたんですが、先日jQuery1.30が正式リリースとなったようです。あまり詳しく読んでいませんが、リリースノートをみると「CSS selector engine」にSizzleというのが採用されて、かなりパフォーマンスアップしているようです。

しかしjQueryはバージョンアップする際は、動作チェックは必須です!
jQueryを触り始めた時、プラグインをいろいろ試している際、jQuery本体を1.2×から1.26へバージョンを上げて動かなくなり、はまった記憶があります。
バージョンアップする際は、動作チェック・リリースノートのチェンジログ等を確認してからにしましょう!

jQuery
jQuery: The Write Less, Do More, JavaScript Library

jQuery1.3 リリースノート
Release:jQuery 1.3 – jQuery JavaScript Library

iiyama 19型ワイド液晶ディスプレイ ProLite E1902WS-B1(ブラック) PLE1902WS-B1

iiyama 19型ワイド液晶ディスプレイ ProLite E1902WS-B1(ブラック) PLE1902WS-B1 [不明]

価格¥ 40,937

出版社マウスコンピューター

商品カテゴリーエレクトロニクス

特徴液晶, HDMI端子(入)数:0 / USB機能:なし / スピーカ内蔵 / TV機能無し, 光沢加工:ノングレア / 輝度(cd/m2):400 / バックライト:CCFL / 3D映像:非対応 / タッチパネル:非対応

Supported by amazon Product Advertising API

Westinghouse 22インチワイドモニター 液晶モニター ブラック L2210NW

Westinghouse 22インチワイドモニター 液晶モニター ブラック L2210NW [不明]

価格¥ 40,937

出版社ウェスティングハウスデジタルエレクトロニクスジャパン

商品カテゴリーPersonal Computers

特徴液晶, HDMI端子(入)数:0 / USB機能:なし / スピーカ内蔵 / TV機能無し, 光沢加工:ノングレア / 輝度(cd/m2):300 / バックライト:CCFL / 3D映像:非対応 / タッチパネル:非対応

Supported by amazon Product Advertising API