久々にモバイルサイトのhtmlコーディングをした。
PCほどの複雑さはないにしろ、それでもキャリア間による違いがあり、個々に注意をしながらコーディングをせねばならない。
キャリア間による違いの問題で、SoftBankのVGA端末の表示についての問題ってのがある。
現在のモバイルコーディングは、docomoのQVGA端末向けに、コーディングをすれば、とりあえずは3キャリア共通のコーディング可能(auはまた別問題があるが)なわけだが、SoftBankのVGA端末で表示させると、画像が小さく表示される問題がある。
いや、本当はディスプレイの解像度で考えたらこれが合ってるのだが、それの解像度に合わせて画像サイズを作るととんでもない容量になり、表示なんてとても出来ないだろう。
そんな理由から、docomoはQVGA向けに作られた画像をVGA端末では、二倍に引き延ばして表示させることでレイアウトを綺麗に見せている。
SoftBankは素直にそのまま表示させたわけで、画像が小さく見える訳なんですね。
それなら、その画像を延ばして表示すれば、docomoみたいに見えるじゃん!?
と、とりあえずの見た目のレイアウトが改善されるじゃないかと、久々のコーディングで僕は思ったわけです。
んで、どうするかというと、画像の横幅を下記のピクセルで作成し、コーディング時に横幅を「パーセンテージ」で指定してあげることで、SoftBankのVGA端末でもdocomoみたいに見た目をある程度改善することが出来るんだね。
例えば、240pxの画像なんかは100%で横幅指定してやれば画面いっぱいに広がってくれるのです。
高さは自動でその比率に合わせてくれるので、高さは指定しません。
んで、「パーセンテージ」で指定することによってdocomo及びauに対しても適用できるので、まさに一石三鳥なわけです。笑。
228pxなんかはバナーに使えるだろうし、48pxあたりは画像のサムネイル画像とかに使えるんじゃないかな。
画像のサイズが固定されるわけだが、見た目を気にする人はちょっと試してみては、どうだろうか。
240px → 100%
228px → 95%
216px → 90%
204px → 85%
192px → 80%
180px → 75%
168px → 70%
156px → 65%
144px → 60%
132px → 55%
120px → 50%
108px → 45%
96px → 40%
84px → 35%
72px → 30%
60px → 25%
48px → 20%
36px → 15%
24px → 10%
12px → 5%
高速で大容量の画像が表示される時代がきたら、まーこの問題は、いずれ解決するだろうね。
Popularity: 6% [?]
気になるランキングは!?
最初に書いちゃうけど、デザイナーの方は必見です!!
人生が変わるぐらい(笑)に、Photoshopの凄く使える便利な技を伝授しちゃいます♪
まー知ってる人には、そんな事も知らないのかと突っ込まれるかもしれないけど。笑。
さて、問題。
Photoshopで下図のグレーのシェイプを水平方向の中心に整列をしたいのですが、皆さんはどうしていますか?

生まれ変わる前の僕でしたら、新しいレイヤーを作って、そこにキャンパスサイズの横幅と同じ新しいシェイプかなんかを作って、その新しいシェイプとグレーのシェイプを選択して整列の「水平方向中央揃え」をクリックな感じですかね。
しかし、これだと手間ですね~。
もっと簡単にできる方法があったのです。
①まずは、シェイプレイヤーを選択

②次に「長方形選択ツール」を選択
ショートカットは「M 」
③横幅すべてを選択後

④続いて「移動ツール」を選択。ショートカットは「V」。
これをやらないと整列のパレットが表示されない。
んで、「水平方向中央揃え」を選択。

そうすると、こんな感じで簡単に、「水平方向中央揃え」になってくれるのだーっ!!笑。
あーこれをもっと早くに知ってれば、色々と時間が短縮できたのにな~。

まとめ&応用
つまりはですね、この選択範囲を利用すれば、その選択範囲を基準に整列が出来るということですね。
選択範囲を基準にするので、キャンバスのセンター揃えとかが簡単にできたり、あるポイントに合わせたい場合も、「左端揃え」と「上端揃え」を使えば、そのポイントに整列してくれるのです。
これは、さらにレイヤーだけではなく、グループ分けされたレイヤーフォルダにもきくので、例えば、違うPSDファイルから、あるレイヤーフォルダをまるごと作業中のPSDファイルに持ってきて、あるポイントに移動したい場合には、覚えておくと凄く便利な技です。
Popularity: 4% [?]
気になるランキングは!?
益々IllustratorやPhotoshopを使う機会が減ってきている今日この頃。
久々に使うと使い方を微妙に忘れてたりする事がある。
その為にもこうやって、ブログをメモ・覚え書き代わりにどんどん書き込んで直ぐに使えるようにすると便利だ。
んで、IllustatorのCS3をメインで使用しているが、ふと、整列で固定整列をやろうとするが、出来ない。
■まずは普通の整列
→3つのオブジェクトを選択し、センター揃えをすると3つのオブジェクトの中心点に揃う。

■固定整列
→中心にしたいオブジェクトのセンターに合わせて揃えてくれる
やり方
①3つのオブジェクトを全て選択
↓
②中心にしたいオブジェクトをさらにクリック
↓
③整列を選択

ちなみにIllustrator 10の固定配列のやり方
①中心にしたオブジェクトをダブルクリック
↓
②整列したいオブジェクトをShiftを押しながら選択
↓
③整列
■アートボードに整列
CS3ではさらに、複数オブジェクトを選択した状態で「アートボードに整列」を有効にした状態で整列すると、アートボードを基準に整列が行われる。

Popularity: 3% [?]
気になるランキングは!?
アクセスログ解析は、サイトをより成長させるために必要不可欠な要素だ。
私もちょこちょことアクセスログを見ているが、ユーザーが何かを求めているのかが分かり、それを元に記事を書くこともある。
最近では、日本国内においてモバイル需要は益々成長しているのだが、そのモバイルにおいてもアクセスログの解析は重要だ。
PC向けのアクセスログ解析は多数存在するが、携帯向けのそれは多くはない。
ここに無料でありながら、広告やサービスロゴなど一切表示しない、モバイル向けのアクセスログ解析ツール「myRTモバイル」がある。
myRTモバイルの特徴は以下の通り。
・広告やサービスロゴなどを一切表示しない
・導入が簡単
・3キャリア解析可能
・充実した分析レポート
無料携帯解析ツール「myRTmobile」
http://myrt.auriq.com/mobile/jp/
Popularity: 4% [?]
気になるランキングは!?
SSDのプチフリ対策のページに記事を書いたが、意外に流入してくるのが、SSDにXPのインストールする方法を探している人たちが多いので、ちょいと頑張ってその方法を書いてみようかな。
と言っても、普通のHDDにOSをインストールしたことがある人ならそれほど難しくないとは思うが。
ちなみに前提条件としては、SSDにXPを新規インストールする、配線やらSSDを取り付けられことが前提条件だぞ。
よーし、いってみようか。
①マザーボードにSSDとCD-ROMドライブを取り付ける。
ここのポイントは、他のHDDを取り付けないことだ。余分なハードをマザーボードが認識しないのでスムーズにいく。
↓
②電源を入れ、Delキーを押してBIOS(バイオス)画面に入る
↓
③Boot → Boot Settings → Boot Device Priority → 1st Boot Device → CD-ROM(DVD-ROM)
BIOS(バイオス)画面で上記の順に選択してCD-ROMを優先的に起動ディスクと認識させる
↓
④Boot → Boot Settings → Hard Disk Drives → 1stDrive → SSD:Solid State Drive → F10
上記のように設定することでSSDをHDDとして認識させる。最後にファンクションキー「F10」で設定を保存。
↓
⑤再起動後、「Press any key to boot from CD…」と表示されたら適当にキーを押す
後は案内に従ってXPをインストールするだけだ。
そのうち、SSDのRAIDの組み込み方も書くかね?笑
Popularity: 11% [?]
気になるランキングは!?
Flashの進化をまた一つ見るのだが、この映像はかなり素敵。
入力画像からマーカーを認識して、3 次元空間でのカメラ位置を計算してくれるという、オープンソース「FLARToolKitを利用しているみたいだ。
3D グラフィックスとの合成などは各自で実装するという形だが、このサンプルは素敵だ。
FLARToolKitはこちら。
http://www.libspark.org/wiki/saqoosha/FLARToolKit
Webカメラがある人は、ここを覗いてみよう。
http://09.aid-dcc.com/
上のサンプルはここでオープンソースとして配布されているぞ。
http://saqoosha.net/2009/01/08/1677/
Popularity: 4% [?]
気になるランキングは!?
今さながらに、使っているWordpressのテーマの検索機能に驚いた。
ページの右上に検索窓があるのだが、これ、かなりリアルタイムで記事が検索できるみたいだ。
試しに、Firefoxに関連している記事を探そうと打ち込むのだが、firefoxと全部打ち込む前に、関連する記事がページ左にズラリと関連した記事が表示される。
しかし、これ、英語にしか対応していないみたいだ。
それでも、おぅー、とちょっと驚いたので取り上げてみた。笑。
ちなみに、これは、フリーで配布されているWordpressのテーマを拾ってきたものだ。
ちょいと自分でいじった部分があるが、素敵だ。
興味のある人は、ページ下部にあるリンクから辿るといいだろう。
Popularity: 3% [?]
気になるランキングは!?
お陰様で、このブログも100記事を超え、これからも益々頑張るであろうと思われる。
さて、正月休みにPCの中身を入れ替えてOSも再インストールし直したわけだが、OSを入れ直すこともさながら、ドライバを入れるのも面倒だったりする。
しばらくは、OSの再インストールをすることはないだろうが、OSの再インストールの前にドライバをまとめてバックアップして、復元できる「Double Driver」というツールを発見したので、次回、OSの再インストールをするようなことがあれば、使いたいものだ。
一応、メモしておこう。
インストールしたらバックアップしたいドライバーを選択して、USBメモリなどに保存。
Double Driverも忘れずにUSBメモリに入れとこう。
Double Driver
詳細ページ(英語)
http://www.boozet.org/dd.htm
ダウンロードページ
http://www.boozet.org/download.htm
詳しい使い方はここ
http://www.oshiete-kun.net/archives/2009/01/double_driver.html
Popularity: 4% [?]
気になるランキングは!?
仕事で今更、Firefoxの1.0や1.5の古いバージョンで確認をして欲しいとの話が出たので、Mozzilaのサイトで探すが、バージョン2までしか置いてなかった。
うーん、セキュリティやサポートが終わったので置いていないのだろうか。
諸々と検索したら、違うページでFirefoxの古いバージョンが置いてあったページを見つけた。
細かいバージョンまで置いてあるので、何かで役に立つかもしれないので、メモっておこう。
Firefoxの1.0や1.5がダウンロードできるページ
http://www.oldapps.com/firefox.htm
Popularity: 4% [?]
気になるランキングは!?
皆様、あけましておめでとうございます。
色々なネタをピックアップしつつなんとかこのブログも1年以上続いたが、今年も面白いネタやら、気になる記事をドンドン取り上げて皆様の退屈しのぎ、お役に立てればと思いまーす。
そんなわけで、今年もよろしくお願いしまっす。
さて、新年の一発目のネタは、SSDのプチフリ対策。
使っているPCが6年ぐらいは経ったので、マザーボードやらCPUなどの中身をごっそりと入れ替え、話題のSSDに新しくOSをインストールしてみた。
ヤバババイっす!!PCの起動が爆速っす!!
ぜひともSSDにOSのインストールして使用してその快適さを体験することをお薦めする。
さて、SSDはWindowsの起動時間が高速化されることで話題になっているが、現状の商品ではプチフリと言われる現象が起きる商品が多々あるみたいだ。
プチフリとは、プチフリーズの略で、ファイルを開いたり保存したり、削除しようとしたりすると、数秒パソコンが固まる現象のことを言い、私も例に漏れず、このプチフリにかなりイラっとしていたところだった。
プチフリ対策として、色々な方法がネットで有効な方法としてネットでも紹介されているが、下記の二通りの方法をお薦めする。
・SSDをRAID化して利用する
・RAMDISKを利用する
今回はSSDを一枚しか買わなかったので、RAID化は出来なかったが、マイブラザーがSSDのRAID化をしてプチフリ現象に悩まされることもなく快適に動作をしている。
私は、RAMDISKを利用してみた。
RAMDISKは、メモリーの空き領域を利用するという手法だが、これでかなりプチフリが解消された。
まーRAMDISKについて詳しくは、グーグル先生に聞いてみてくださいな。
んで、早速その手順だ。
①「boot.ini」の設定(Windows XPの場合)
コントロールパネル
↓
システム
↓
「詳細設定」タブ
↓
起動と回復の「設定」
↓
起動システムの「編集」
↓
boot.iniが起動するので、一番最後に「/PAE」を追加
↓
システムの再起動
②下記のどちらかのページにアクセスして「Gavotte RAMDisk」をゲット。
http://www.badongo.com/jp/file/7601855 7z形式
http://www.badongo.com/jp/file/7533583 rar形式(中国語による解説PDF付き)
ページにアクセスすると右上に画像認証の欄があるので、それを入力して「ここにファイルをダウンロード」を選択でダウンロードが開始されるぞ。
参考ページ
http://www10.atwiki.jp/gavotterd/
③ram4g.regをレジストリに追加
解凍した「Gavotte RAMDisk」の中にある「ram4g.reg」をダブルクリック。
④インストール
「ramdisk.exe」をダブルクリックして、画面の右上の「Install Ramdisk」をクリック
⑤必要に応じて設定を変更
Disk Sizeは、マイコンピュータの中に「RamDisk」と表示されているHDをクリックすれば容量が分かるので、それに見合ったサイズを選択。
Media TypeはFixed Media。終わったら「OK」を選択。
参考ページ
http://pc.watch.impress.co.jp/docs/2008/0512/ramdisk.htm
⑥TEMPフォルダをRamDiskドライブに設定
標準では、Cドライブに設定されているTEMPフォルダにRamDiskドライブに設定。
(やり方はグーグル先生に聞いて~)
その他、FirefoxやIEのキャッシュフォルダやPhotoshopの仮想記憶ディスクなどをRamDiskドライブに設定することで、プチフリがかなり解消される。
もちろん、自己責任&RAMDISKは、Windonwの再起動をするとデータが消えるので大事なデータの保存先には設定しないように。
Popularity: 39% [?]
気になるランキングは!?