ビジュアルの力で世界を丸くする。 地球の形状が「丸い」のは、そこで暮らす僕たちにひとつの「ビジョン」を指し示しています。地球の形と同じように、世界で起こっていることのすべてが丸く収まっていれば良いのですが、現実は違います。 大小いろいろな規模の摩擦がいたるところに発生し、繰り返されます。その解決に必要なのは、お互いの「考え」や「価値観」「立場」、「状況」「状態」を示し、認め合うことです。そのために、「ビジュアル」の力を活用していきます。
サイズやカラーをテキストで指定するだけで簡単にダミー画像を生成できる超軽量(4KB)のスクリプトを紹介します。 Holder.js -GitHub [ad#ad-2] Holder.jsのデモ Holder.jsの使い方 Holder.jsのデモ 対応ブラウザ Holder.jsはcanvasとdata URI schemeを使用しているため、下記のブラウザでご覧ください。 Chrome 1+ Firefox 3+ Safari 4+ Internet Explorer 9+ Holder.js [ad#ad-2] Holder.jsの使い方 使い方は、2ステップです。 Step 1: 外部ファイル 当スクリプトを外部ファイルとして記述します。 <script src="holder.js"></script> Step 2: HTML ダミー画像を設置したい場所にimg要素で記述します。
DiffImgは画像の差分を抽出するツールです。 2つの画像を指定して、その差分を示してくれます。 間違い探しの画像を2つ比較したらすぐに答えが分かりそうですね。 また、加工された画像かどうかなどの比較にも使えそう。 以下に使ってみた様子を載せておきます。 04/28 ~ 05/06 ゴールデンウィークということで更新お休みします。 まず「DiffImg」にアクセスしましょう。 ツールをダウンロードしてインストールしましょう。 インストールは特に難しいこともなく、一瞬で終わります。 この2つの画像を比較してみます。 一見同じ写真?と思ってしまいますね。 比較するとこのとおり。差分が表示されました。 元の画像と横に並べて比較することもできますよ。 画像の比較をしたいときにどうぞ!
「Image Error Level Analyser」は指定した画像が加工されているかどうかをチェックできるサイトです。 JPGファイルは保存するたびに少しずつクオリティが落ちていきます。 加工せずに保存すると全体のクオリティが下がりますが、加工してしまうとその部分だけまわりのクオリティと合わなくなります。 その部分をだけくっきりと違う色で表現されます。 (おそらく原理はこんな感じかと) 画像URLを指定するだけでOKです。 加工されているかどうかは自分の目で判断するしかないのですが、手軽に使えて便利です。 加工されている画像はくっきりとラインが見えたり。 以下に使ってみた様子を載せておきます。
Webサービス公開前にサイトをチェック Webサイトを制作して公開する際は おかしいところが無いか、不備は 無いか不安になったり、という方も 少なくないのではないかと思います。 Webサイトを制作して公開する際は おかしいところが無いか、不備は 無いか不安になったり、という方も 少なくないのではないかと思います。 そこで、公開前に色々と確認出来たり、 最適化できる様なフリーのサービスや フリーソフトをご紹介します。 ここで言う「公開前」とは「サーバーにアップする」事ではなく、公開を告知したり、プレスリリースを出す前の状態とお受け下さい。ローンチ前と書くべきだったかもしれませんね。。誤解を与えていたら申し訳ないです。 では、ブラウザチェックツール、モニタ別表示チェック、表示スピードチェックツール、cssや画像の最適化ツール、などなどご紹介していきます。 ブラウザチェック各ブラウザでどのように
Performance just got a little bit easier. Optimizing images by hand is time consuming and painful. Smush it does it for you. Image optimization is an art that not many people master. There are many good image editing tools that allow us to get the best visual result for a certain file size but "under the hood" a lot more optimization can be done. Smushit.com is a service that goes beyond the limit
ローカルファイルの画像やオンラインの画像から、Photoshop用のカラーパレット(スウォッチ)を作成できるオンラインサービス「Colors Palette Generator」を紹介します。 Image to Colors Palette Generator 対応画像はPNG, JPEG, GIFで、ファイルサイズは1MBまでとなっています。 上のキャプチャでは、いつものバナナ画像を使用してカラーパレットを作成しています。 カラーパレットはライトなものからダークなものまで4種類生成され、下部の「Save as Photoshop swatches」をクリックすると、Photoshop用のスウォッチ(.aco)がダウンロードできます。
Optimizing images for web 現在、ウェブに使用されている画像のフォーマットは、GIF、JPEG、PNG(PNG-8, PNG-24)が主なものとなっており、上記ページでは実例と容量の比較一覧が掲載されています。
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く