ホームページ制作まん

ツール: 2009年7月アーカイブ

illustrator

user-pic

090614_00.jpg


今回はillustratorのRGBモードについて。


普段印刷物でCMYKの作業をしている方は殆ど使わないと思います。

ですがDTPだけでなくモニタで映すためのコンテンツをillustratorを使用して作成する方も居ます。
なのでRGBモードについて少しご紹介します。

illustratorではRGBでも描写モードが通常の場合は、下の色が透けない不透明な状態になります。
実はスクリーンモードがRGBで光を扱う上で一番現実に近い形です。
黒は光が0%無い闇の状態。しろはスペクトル分解前の純粋な光100%の状態です。

これを便宜上RGBの3色にわけて扱っているのが現在のモニタなどの技術なのです。
白が0のインクと違い、黒が0の光は、各色の光を強くすればするほど白く明るい光になるのがRGBです。


RGBモードで作成したデータをどうやって印刷物に応用するか。

一番簡単なのがRGBのままPSDに書き出してPhotoshop上でCMYKに変換してしまうのが最も色化けがせずに綺麗です。
まぁ結局illustratorでやる意味が・・・とは思いますがどうしてもillustratorが好きという方はこちらを利用してみてはどうかと思います。


オンラインテキストエディタ

user-pic

WEB制作やDTPなどでTXTのチェックを数人でやる必要がでたときに使えそうなWEBツール。


オンラインで同じTXTを確認しながらリアルタイムで修正がかけられる。
さらに打ち込んだ人が誰かもわかるように色分けもされます。


日本語も通るし中々使い勝手が良いと思います。

EtherPad
TXT.png


簡単なチャットの機能などもついていて、会員登録の必要が無く
すぐに使用することができます。

GIF

user-pic

どこまで実用性があるかわかりませんが
簡単にGIFアニメーションを作れるサイトをご紹介します。

白黒反転させたり横にスクロールしたりぼかしたり。
実際に自分でやろうとするより手軽にできます。↓

LooGix
gif.png


なぜモデルが全てビーン氏なのか気になります。

エフェクトの種類は豊富なので覚えておいて損はないかと思います。

フリーアイコン。

user-pic

よく制作中に使いたい素材を探しにネット上を徘徊して回ったりします。


でもすぐにイメージに合ったものが見付かることはとても少ないです。
大体いくつかサイトを巡る羽目になってしまいます。

そこで見つけたこのサイト↓
More than 100,000 icons in one place

aikon.png
こちらはフリーアイコンを100,000個以上も集めたサイト。
しかもただのリンク集ではなく、アイコン一つ一つをページ内でダウンロードできます。

しかもアイコンのクオリティも中々高く、そのまま使用できそうなものばかりです。


Windows上でもアイコンとして使ってみてもいいと思う。

Firefox3.7

user-pic

先日、次期Firefoxのバージョンで変更される予定のデザイン案が公開されました。

ツールバーからメニューボタンが無くなり、いくつかのボタンに集約されるようです。

2009-07-21-01.png


2009-07-21-02.png


Firefox/3.7 Windows Theme Mockups


見ているとシンプルな構造を目指しているような感じがあります。
確かに選択する範囲が狭ければ迷うことは無いだろうけど
最初は思うように操作でき無そうな・・・


また、Firefox3.7程ではないのですがFirefox4.0のデザイン構想も検討されているようです。

2009-07-21-04.png

Firefox4.0では、さらにステータスバーやブックマークバーが取り払われ、ロケーションバーと検索バーが統合され、ロケーションバーにプログレスバーが埋め込まれ、タブの位置が最上部に移動されるといった具合です。

Google Chromeに少し似ていると感じるのは私だけでしょうか?

確かにシンプルを目指していくとこうなってしまうのは頷けるような気がします。

Google 検索

user-pic

Googleの画像検索にメガピクセルとアスペクトの検索オプションが追加されまし

元々画像サイズの「小・中・大・特大」のプションはあったが、それに加えて
「メガピクセル」単位での検索ができるようになりました。

通常の検索「パソコン」




メガピクセル指定の検索方法「パソコン」の場合


・2メガピクセル以上の「パソコン」画像を検索
http://images.google.co.jp/images?hl=ja&q=%83p%83\%83R%83%93&imgsz=2mp


・4メガピクセル以上の「パソコン」画像を検索
http://images.google.co.jp/images?hl=ja&q=%83p%83\%83R%83%93&imgsz=4mp


・8メガピクセル以上の「パソコン」画像を検索
http://images.google.co.jp/images?hl=ja&q=%83p%83\%83R%83%93&imgsz=8mp


・12メガピクセル以上の「パソコン」画像を検索
http://images.google.co.jp/images?hl=ja&q=%83p%83\%83R%83%93&imgsz=12mp


このように「imgsz」というパラメータを加えてやります。
対応のパラメータ値は2mp, 4mp, 8mp, 12mpとなっています。


2Mピクセル 「パソコン」画像検索結果
パソコン検索2M.png




そしてもう一つ追加されたオプションは、アスペクト比(縦横比)での指定検索です。

・正方形の「パソコン画像を検索
http://images.google.co.jp/images?hl=ja&q=パソコン&btnG=画像検索&imgar=s

・正方形に近い「パソコン」画像を検索
http://images.google.co.jp/images?hl=ja&q=パソコン&btnG=画像検索&imgar=ns

・縦長の「パソコン」画像を検索
http://images.google.co.jp/images?hl=ja&q=パソコン&btnG=画像検索&imgar=t

・横長の「パソコン」画像を検索
http://images.google.co.jp/images?hl=ja&q=パソコン&btnG=画像検索&imgar=w

・パノラマの「パソコン」画像を検索
http://images.google.co.jp/images?hl=ja&q=パソコン&btnG=画像検索&imgar=xw

このように今度は「imgar」というパラメータを付ければ、指定したアスペクト(縦横比)でフィルタリングされ画像が検索されるというわけです。

正方形に近い 「パソコン」画像検索結果

素材探しなどには非常に役に立つオプションだと思います

ANIMOTO

user-pic

こちらのサイトは複数の写真と音楽をアップするだけで、その音楽にあわせてかっこいいスライドショー的なものを作ってくれるサイト。


自動的に音楽を解析し、リズムにあわせて写真を動かしているようです。
デスクトップアプリケーションで似たようなものはありますが、ウェブツールでもありました。


do.pngのサムネール画像


一風変わったスライドショーをサクッとつくれます。
写真の表示の仕方も豊富です。


自分の持っている写真で色々試してみると面白いかも。




Da Button Factory

user-pic

ボタンを作ってダウンロードできるサービス。

似たようなページは沢山ありますが
設定項目が細かくあり、割と今風のものができるのでご紹介。

ボタン.png


PhotoshopやIllustratorがなくてもある程度自由なものが簡単に作れると思います。

また、CSSでの出力もできるみたいです。
イメージどおりのボタンがうまく作れないときなど参考にしてみては。

Da Button Factory

Firefox アドオン

user-pic

多種多様なアドオンが存在するFirefox。
ちょっと変わったものを見つけたのでご紹介。

Ghostery
11_logo.gif.png


Ghosteryは各種トラキングコードを検出し、どのようなコードかを教えてくれます。

最近は主に広告を出す関係で、ユーザーの行動履歴をトラッキングする手法が一般的。
知らぬ間にWEBの観覧履歴が外部に流れています。

しかしGhosteryを入れておけばそうしたコードが見つかったときにアイコンで教えてくれるので、自分がどういったデータを誰に提供しているかを把握することができるようになる。
当然GoogleAnalyticsなどもしっかり検出してました。

高度化するウェブではありますが、こうしたデータを使い、自分のデータは自分で守りたいですね。

CompareMyFiles

user-pic

CompareMyFilesは2つのファイルを比較してくれるサービスです。

比較したいファイルを2つアップロードすると、その2つのファイルを比較してくれます。

hikaku.png

オプションで空行をスキップさせたり、合致行を非表示にしたりということが可能です。

余分な操作がなく、シンプルで使いやすいです。

たとえば突然PHPが動かなくなってしまったとき、動いていた状態のバックアップファイルがあれば比較して調べることができる。

そこまで利用頻度は高くないとおもいますが、自分のマシンが使えないときとか緊急時には
使えると思います。

Ftg

user-pic

WEBデザインをする時、ボタンやバナーなど様々なオブジェクトを作るはずです。

ふとしたときに便利なサイト。

テクスチャ.png

背景パターンやハーフトーンなど、いろいろな用途に使えるグレイスケールのテクスチャー素材。

単純なものでも自分で作るとなると結構面倒なことも多く、これだけ揃っているととても重宝します。

PhotoshopやIllustratorなどツールを使用してオブジェクトを作る際に便利です。

Lunascape5.1.1 リリース

user-pic

Lunascape社の最新ブラウザとなる「Lunascape5.1.1」が7月3日にリリースされた模様。
従来のIE系レンダリング・エンジンであるTridentに加えて、現在シェアを伸ばしているGeckoエンジンの正式版を採用。
また、WebKitも最新のリビジョンを搭載、Geckoエンジン使用時での JavaScriptの処理速度が約110%(Lunascape5.1 比)向上したとのことです。

WS000135.JPG

HTML5への対応も可能となっており、OggTheora(オッグセオラ)、OggVorbis(オッグボルビス)形式の動画などの再生を機能拡張なしに行うことができるとのこと。
ブラウジング中の速さだけでなく「起動」の早さにもこだわりがあるようです。

WS000136.JPG

シェアとしてはまだまだIEやFirefoxなどに及ばないブラウザではありますが、独自の「こだわり」で突き進んでほしい気がするのは自分だけでしょうか。
たまにはメインブラウザ以外でネットを楽しんでみるのも一興かと。



xhtml-css

user-pic

xhtml-css はそのページのソースのエラーを教えてくれるサイト。

似たようなサイトは沢山ありますが、こちらもシンプルで使いやすいのでご紹介。

xhtml-css.png


urlを入力するだけでそのページのソースのエラーを表示してくれます。

しかもピンポイントでわかりやすい。
項目をクリックすれば詳細まで見ることができる。

そして一度見た場所は色が変わってくれるのでチェックに利用できると思う。

多少エラーがあってもだいたいページは表示されるけど
更新のときだとか、別のブラウザで見たときとか
色々な場面で不具合や不便さがでてきてしまう。

できる範囲でキレイにしておくのもいいかと思います。

xhtml-css

Dead-Links

user-pic

ホームページ制作をしていて
ついうっかりデッドリンクを見落としたままにしてしまうこと、怖いです。

ページの規模が大きくなればなるほど細かいところまで見ていくのは大変です。

そこで便利なのがこちらのページ。


linkout.png

似たようなツールは沢山ありますが、インターフェイスがわかりやすくシンプルなので
使い勝手はいいと思います。

チェックに若干時間はかかりますが
自分の身の回りのサイトを見てみるのもいいと思います。

* *
* *


ホームページ制作まん

ホームページ制作会社


栃木県パソコン修理/パソコンのお医者さん
ホームページ制作 デザインチャンネル
 

ホームページ制作LINK

このアーカイブについて

このページには、2009年7月以降に書かれたブログ記事のうちツールカテゴリに属しているものが含まれています。

前のアーカイブはツール: 2009年6月です。

次のアーカイブはツール: 2009年8月です。

最近のコンテンツはインデックスページで見られます。過去に書かれたものはアーカイブのページで見られます。