それって作り手の問題じゃないの？ | gaspanik weblog
Twitterを眺めていたらこちらの「続) ガラケーからスマホの怒濤の流れで割を食い始めたサービス」という記事が流れてきたのでちょっと読んでみました。要約すると「色が違うというクレームが増えていて、原因を探ってみるとスマートフォンユーザーではないか。スマートフォンの色再現性に問題があるのでは？」みたいな話。 えっと、結論から書くと、それたぶん作り手側の問題が大きいかも。 ＃こういうの書くとディスってるとか言われちゃうんですけど、そうではなくて問題の所在の切り分けをしやすくするためにできることを書いてるだけですので誤解なきよう。 とりあえず、自分の環境を見直しましょう最初にお断りしておきますが、手元にすべてのスマートフォンやタブレットがあるわけではないので、いちいち検証したわけではありません。が、まぁこれまでいろいろやってきた経験から問題は作り手側にもあるだろうね、と思うのです。 デジタルで
はじめてのGoogle plus | gaspanik weblog
※Google+が2011年9月21日より一般公開されたようですが、こちらの記事はフィールドテスト中の初期段階でまとめた内容です。全体的に大きな変更はないかと思いますが、記事中の画面のボタンや用語などの言い回しが変わっている可能性もあります。続き記事の「覚えておきたい G+ のちょっとしたこと」も同様です。 先週はじまった「Google+」ですが、今日から招待いらずでログインできるようになったようなので（といっても、またできなくなってるみたいですがｗ）、Google+のページとしてちゃっちゃっとまとめたこれから始める方への簡単なマニュアルを再編集してみました。 英語UIの画面写真を撮ってしまったのですが、場所は同じなので適宜置き換えて見てもらえば大丈夫ですよね。では、はじめましょう。 （追記）せっかくなのでePub版も作っておきました。iBooksでしか確認してないので、他のリーダーでの表
HTML5を使ってるWebサイトのまとめのまとめ、と… | gaspanik weblog
先日は仕事ついでにモバイルWeb制作に役立ちそうなサイトの情報をリストしてみましたが、いかがでしたでしょうか？日本語がないと興味をひかないのは百も承知で出してます（笑）。で、今日はこの半年ぐらいで出てたHTML5でできたサイトをまとめたサイトのまとめを作ってみました。 まとめるだけだとたいして数もないので、その他のことも織り交ぜつつ…。 HTML5でできたサイトまとめのまとめ有名なギャラリー系のサイトは省いてますので数的にはたいしたことないのですが、いわゆる普通のコーポレート系、ポートフォリオ系のWebデザインだけでなくWebアプリ系のまとめもあります。 Showcase Of Websites Using HTML5 MarkupHTML5: 25 Fresh Web Design For Your Inspiration40+ awesome new HTML5 designs30 E
あらためて Readability 的な話でもしてみようか | gaspanik weblog
「ちょうど1年前に〜Safari5になった夜〜」なんてね、ちょうど1年前にSafariに「リーダー」という機能が搭載されました。リーダーとは、Webページから装飾や広告を取り除き、本文を読みやすく整形して表示するものです。この機能がついにこの秋に登場する「iOS 5」でも追加されるようですね。 その1年前にここでも電子書籍の話ついでにSafariのリーダーについてふれてみたり、iPadでリーダーと同等の表示にする手順を解説しています。 たった1年の間にこのような機能を採用しているアプリなども増え、Safariのリーダーの元になった「Readability」もさらに進化しました。あげくの果てにはOSの標準機能として、iPhoneやiPadでも使えるようになる、と。 そんなわけであらためて、このReadability（読みやすさ、みたいな）的なことに絡めたいろんな話を書いておこうかな、と思いま
Googleの「+1」ボタンを付けてみる、の巻 | gaspanik weblog
「おい、お前ら、Googleの+1ボタンのコードがウェブマスターズセントラルで配布されてるらしいぜ」との街の噂を聞きつけたので、いまのとこ英語版のGoogleにしか反映されないのですが、とりあえず仕込んでおくことにしました。 ちなみに「+1」ボタンってのは、Facebookの「いいね！」みたいな感じで（というと語弊もあるけど）、コンテンツをGoogleや検索するユーザーにオススメするボタンだと思ってもらえばいいでしょうか。詳細はこの辺（英語）でも見てください（笑）。 ボタンサイズを選んで、コードを貼り付ける「+1」ボタンのコードはこのページから入手できます。 やることなんてほとんどなくて、ボタンサイズを選んで言語を選んで、表示されたコードをコピーして貼り付けるだけです。 <!-- Place this tag in your head or just before your close b
Google Analyticsのレポートで表示スピードを見ちゃおう | gaspanik weblog
世の中はゴールデンウィークの真っ只中かと思いますが、皆様いかがお過ごしでしょうか。今日は、サイトのアクセス解析で有名なGoogle Analyticsのレポートにサイト内のコンテンツの表示スピードを組み込めるようになったというのでその話を。 GoogleさんのWebサイトの表示速度へのこだわりは有名なトコですが、これまではWebmaster toolsのLabsの中に「Site performance」という項目で、Googleのツールバーを入れてる方の計測結果をもとにしたサイト全体の平均速度が表示されていました（いや、今もまだちゃんとありますが）。 で、今回のこの話は、Google Analyticsのトラッキングコードにちょいと追加をしてやることで、コンテンツ全体の表示スピードをチェックをし、どのページが重いとかそんなのが調べられるって感じでしょうか。 導入は簡単、ひとことコードを追加
CSS Nite LP, Disk 14 フォローアップ | gaspanik weblog
先週末の土曜日、「CSS Nite LP, Disk 14 / Photoshopper meets Fireworks」が開催されました。イベントにご来場下さった皆様、そして関係者の皆様、大変お疲れ様でした。 まずは、この場を借りてお礼を。ありがとうございました（深々）。 さて、当日はFireworks特集となるイベントでしたが、ボクの担当は他の登壇者の皆さんの内容とはちょっと毛色が異なるカラーマネジメントの話でした。「FireworksのTipsやテクニックなどを知りたい方が多いんじゃなかろうか、今回の内容に関して大丈夫かな？」と思っていたのですが、予想以上に良い反応をいただいておりホッと胸をなで下ろした次第です。 とはいえ、プレゼン自体はボロボロだったので、その反省や参加いただいたお礼をこめて当日伝えきれなかったことをこちらのエントリーにまとめてみました。 ＃前もって書いておきますが
音楽版 Instagram？みたいなSoundTracking.app | gaspanik weblog
今聴いてる音楽を共有する音楽系のソーシャルなサービスっていうのはこれまでもいくつかあって、多くの方が利用されているかもしれません。代表的なものだとLastFMとか、iTunesのPingもまぁそれにあたりますね。で、今日たまたま「SoundTracking」というiPhoneアプリを見つけたので早速インストールしてみました。 まぁ、インターフェイスはまるで写真版のTwitterともいわれてる「Instagram」そのままというか、面白いぐらいそっくりです…（笑）。 それはもうまるでInstagram インストールが終わったら起動しましょう。 アカウントは、TwitterかFacebook、Foursquareのいずれかのアカウントを使ってログインします。どれかひとつ選んで認証なりをしてあげればログインは完了するので、最後に自分のSoundTrackingでのユーザー名を登録します。 Ins
Instagramが止まらない | gaspanik weblog
そろそろFacebook飽きましたか？、もう秋ですからね。いやいや思いの外、冬の時代が来るのも早かったようです（笑）。ま、それはさておき。先週あたりからiPhoneアプリ「Instagram」が世界中で大フィーバーのようですね。海外のIT系のメディアでもいたるところで取り上げてます。 このInstagramの基本仕様は、1:1のスクエア（正方形）フォーマットの写真を撮るなり、ライブラリから読み込むなりして、用意された様々なフィルタをかけてアップロードするもの。では、何が他の写真系アプリと違うのか、と。 TwitterとFlickrとTumblrを足したら、InstagramになったInstagramは、他の写真系アプリ同様Twitterにポストしたりすることができます。ただ、そこからが違うんですね。Instagram自体が、写真を中核に据えたソーシャルメディアなんです。 お気に入りの写真に
WiredとAdobeのアレに思うこと | gaspanik weblog
かねてからiPadのようなタブレットPC向けに出ると噂だった「Wired」の電子版が、先日iPad用のアプリケーションとしてリリースされました。発売に際し掲載されたムービーなどを見た段階では、「おお！なんだこれは！？」なんて思ってました（要は期待していたわけ）。 さて、いざ600円で購入してみると「はぁ…、なるほど」という感想しかでてきませんでした（笑）。だって「10〜20年前にあったCD-ROMコンテンツ？」みたいな感じなんですよね、正直なところ。確かに縦向き横向きのどちらでも見られるし、スワイプ操作でページはめくれるし、同じページ内でタップで写真を替えたりムービーが再生されたりします。 でも、やっぱりこれはただのデジタルコンテンツなんですよね…。 というわけで、ちょっと今日はこの辺の話でボクが思ってることをツラツラと書いていきたいと思います。 Wiredのコンテンツの作られ方このWir
UStreamで生Zen-Codingやってみましょうか | gaspanik weblog
ちょっと前に書いたZen-CodingネタをH2O Spaceのたにぐちさんに取り上げていただいてからというもの、関連するエントリーへのアクセスがにぎやかです（謎）。そんなこともあり、数日前の夜中に遊び半分で「Zen-Codingってこんな感じ」ってのをお見せしようと、Twitterで告知しながらUStreamでダラダラとやってました。 終わってから何名かの方に「見たかった！」というレスをいただいたのですが、ただやみくもにというか、適当に思いつくままキーボードをカチャカチャやってると、やってる本人も「何がいいかな？どうしようかな？」みたいな脳みそになっちゃいます。もちろん、見ている側も何してるか想像できないですからね…（笑）。 ということで…。 ならば、簡単なサンプルを作ってそれをやってみようじゃないか簡単ですがサンプルを用意してみました。ただブロックが組み合わさっただけだと面白くもないの
TextMate+Zen-Codingで超速コーディング？ | gaspanik weblog
先日の100の質問の答えにもちょっと書いたのですが、世の中には「Zen-Coding」なるものが存在しています。ちょっと前にWebデザイン関係の皆さんのTwitterでも「すげえ」とかってビデオが流れてましたけど、実はこれ相当前からあるんですよ（笑）。 Zen-CodingとはもともとTextMateとNetBeans用に書かれたプラグインのことです。HTMLとCSSのコーディング作業をより高速におこなうための機能追加をしてくれるものですね。前述の2つ以外に、AptanaやCoda、Espressoといったエディタ、最近ではDreamweaverのMXPファイルもダウンロードできるようになってます（*1）。 というわけで、今回はボクが普段使っている「TextMate」とZen-Codingの組み合わせでコーディングがどう変わるのかをご紹介しようかと。タイトルに超速とか書いてますけど、まぁど
Zen-Codingでできるあんなことこんなこと | gaspanik weblog
先日超速コーディング？としてTextMateにZen-Codingを追加したコーディング手法の概要を紹介しました。で、実はZen-Coding、前回紹介した入力方法だけではありません。 HTMLのストラクチャ的なものがわかっていれば、特定の記述をして展開すると一気にコードが書けちゃったりします（どちらかと言えば、こっちが本当のZen-Codingなんでしょう）。 ということで、今回はその特定の記述とやらの話をしてみましょう。ここまで使えるようになってくると実に速い…（はず 笑）。 文書構造がわかってれば、1行書いて一気に展開できるZen-Codingは、前回紹介したような登録された略語を使ってHTMLとCSSのコードを展開する使い方だけでなく、特定の記述を使って構造を書き上げて一気に展開することができます。TextMateを使っている方はこちらのリストにある「Zen.Coding-Text
CodaにZen-Codingを入れてみると… | gaspanik weblog
前回、前々回とTextMateをベースにZen-Codingの話をしたわけですが、一番最初にも書いたようにTextMateは日本語の処理がうまくないので、導入したくても導入できない方も多いかもしれません。 でも、Zen-CodingをTextMate以外で使おうとするとグッと選択肢が減ります。Mac使いの皆さんがお使いのエディタといえば、CodaやskEdit、miあたりが有名どころです。良かった！Codaならコマンドの違いはありますが、その恩恵にあずかれますよ（笑）。 （追記）Zen-CodingのDreamweaver用のMXP（ダウンロードはこの辺で）でも、以下の操作と同じショートカットで略語や構造の展開はできるみたいです。 Codaでやるなら「TEA for Coda」をインストール 前々回のエントリーにも書いておきましたが、現在Coda用のプラグインは「TEA for Coda」
iPadとアレの話 | gaspanik weblog
出るんじゃないか出るんじゃないかと噂になっていたAppleのタブレット、「iPad」がついに発表されました。ボクは夜中に起きてまで中継をウォッチするほどの人ではないので普通に寝て起きてから確認したわけですが、初見は「でっかいiPhoneみたい」でした。 まぁ、iPhoneやiPod Touchをそのまま大きくしたようなもんですね。 とはいってもこのiPad、家や会社の中をはじめとしていろいろな場所での利用が想像できます。学校なんかも良いでしょうし、店舗などではフォトフレームライクにメニューを表示したりとちょっとしたサイネージ代わりにも利用できそうですね（もちろんオーダーなんかもやろうと思えばできるでしょう）。 家の中でわざわざパソコン持って移動するのもバカらしいし、iPhoneだとちょっと画面が小さすぎて細かい作業にはやはり向いていません（せいぜいWeb見るぐらい）。Wi-Fiがある環境で
Web制作者向けなChromeの拡張機能＋α | gaspanik weblog
OS X用のChromeでもDev版でようやくエクステンション（拡張機能）が使えるようになったので、Web制作に役立ちそうなものをピックアップしてみました。せっかくなんで、おまけとして人によってはありがたいだろうものも載っけておきます。 とにもかくにもChromeのDev版をダウンロードしましょう。「あくまでも開発者向けなので…」とか言いたいとこですが、別にマシンがぶっ壊れるようなことはないので大丈夫（笑）。ちっちゃいことは気にすんな、ワカチコ。 ただし、Googleからは直接ダウンロードできませんので、Chromium Projectsの「Early Access Release Channels」からどうぞ。 真ん中あたりに「Dev Channel: GoogleChrome.dmg」ってリンクがありますので、ダウンロード&レッツらインスコローリングです。 肝心のエクステンションは、G
Webサイトの高速化的な話をWD誌で | gaspanik weblog
先日エイプリルフールにあげた冗談エントリーのお詫びとして、Webサイトの高速化というかパフォーマンスアップのネタをこのブログに書こうと画策していたのですが、実は本日18日にそれらの内容をまとめた特集を含む「Web Designing vol. 102」がマイコミさんから発売されてしまいました…。（いや、書いたのボクですけど 笑）。 “Web Designing vol. 102″ on Flickr Originally uploaded by [cipher]. とまぁ、出ちゃったからにはしょうがないので、本誌に掲載された内容のフォローとか締切以降に変わった話なんかをピックアップしてみたいと思います。ちなみに今回のこの記事、Livedoorの浜俊太朗さんと二人で書いてます。 高速化のキモは違う視点でサイトを見直すことWebサイトの評価というのは、見る人によって変わってきます。やれ、デザイ
CSS Nite vol.39 フォローアップ | gaspanik weblog
こちらの記事を先日の「CSS Nite vol.39」のフォローアップとさせていただきます。 スライドの方は別途公開ということで、フォローしておいた方が良さそうなカラーマネジメント系の話とモニタの調整の手順（Windows / OS X）、あとおまけで講演時に使ったトマトの写真の元写真からCamera RAWを使った補正の手順をざっくりと書き記しておきます（元ファイルはダウンロード可）。 （追記: 2009.09.25）スライドと音声をCSS Niteさんの方で公開していただいたようです。なお、スライドのみSlideShareでも公開しておりますので、オンラインで確認したい方はこちらからどうぞ。 非常に長いエントリーになるので気合いを入れてください（笑）。 ブラウザのカラーマネジメント的なことまず、ブラウザを介して見る自身の環境の状態からいってみましょう。ICCのWebサイトのこちらのペー
パーソナルブランドとか言う前に | gaspanik weblog
“arrival” on Flickr Originally uploaded by [cipher]. 数年前から「パーソナルブランド」とか「自分ブランディング」なんて言葉を目にします。言葉の定義はさておき、それをお題目にした書籍も数多く出版されています。 企業体に属する人であっても個人で仕事をする人であってもそれを持ってるかどうかは大事なことだと思うわけですが、それらを読んでどうこうしようとする以前に読んでおいた方がいいの（というか気づくべきこと）があるのではないかと（謎）。 言葉を書いたとき、言葉を発したときに、それが他者にどのように受けとめられるかということを確認する鏡が、機能していないのではないだろうか。 （中略） 公人による問題発言の数々も驚きとしかいえない。自分の発言がどのように人々に受け取られるか、自分の立場と、それが世間に与える影響をなぜ事前に鏡で確認しないのだろうか。
フリーランスの話 | gaspanik weblog
いつもここにコメントをくれたり、お仕事をたまに手伝ったりしてもらってるmersyさんが「linker」というユニットを組んで活動されているのですが、そのlinkerさんがWeb制作者の一部には有名だろう「どたばた会議」のフリーランスの回に参加されたそうです。 で、参加できなかったmersyさんが補足として記事をアップされていて面白かったので、そのままネタをパクってエントリーにしてみます（笑）。 不覚にも今回スケジュール的に収録に参加できなかったので、今回は個人的な補足とか自分のこととかを書いてみようかな〜と思います。 http://linker.in/journal/2009/03/1.php というわけで、（誰にもリクエストされてませんが）自分のことを書いてみます。 フリーになったきっかけ前職は、DTP業界では古参の会社におりまして入出力から制作の一部までこなしつつ、ネットワーク管理みた
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
