タグ

ブックマーク / blog.gaspanik.com (10)

  • 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」

    CodaにZen-Codingを入れてみると… | gaspanik weblog
  • CSS Nite LP, Disk 14 フォローアップ | gaspanik weblog

    先週末の土曜日、「CSS Nite LP, Disk 14 / Photoshopper meets Fireworks」が開催されました。イベントにご来場下さった皆様、そして関係者の皆様、大変お疲れ様でした。 まずは、この場を借りてお礼を。ありがとうございました(深々)。 さて、当日はFireworks特集となるイベントでしたが、ボクの担当は他の登壇者の皆さんの内容とはちょっと毛色が異なるカラーマネジメントの話でした。「FireworksのTipsやテクニックなどを知りたい方が多いんじゃなかろうか、今回の内容に関して大丈夫かな?」と思っていたのですが、予想以上に良い反応をいただいておりホッと胸をなで下ろした次第です。 とはいえ、プレゼン自体はボロボロだったので、その反省や参加いただいたお礼をこめて当日伝えきれなかったことをこちらのエントリーにまとめてみました。 #前もって書いておきますが

    CSS Nite LP, Disk 14 フォローアップ | gaspanik weblog
  • モバイルWeb制作のためのリソース(不完全版) | gaspanik weblog

    スマートフォンなどのモバイル向けのWebサイトを作るときに考えておきたいこと、制作に役立つツールなど、その辺りの情報が記載されたWebサイトを仕事でちょっとまとめることがあったので公開します。要は俺ブックマークまとめです。 常日頃溜め込んだものを身近な人たちだけに教えるのはもったいないと思いましてね。さすがに何年も前のは入れてませんし、各種公式資料みたいなものも入れていませんが、昨日今日出た新しい情報までを順不同で入れています。興味のある方はリンク先でお勉強してください(全部英語ですけどね 笑)。 ※「Responsive Web Design」とか「Adaptive Web Design」とかの情報はほとんど入れていません(抜いてますw)。ほぼほぼスマートフォン向けのWeb制作に特化したリンク集です。 Mobile Web Resources, BrowsersMobile Web Pr

    モバイルWeb制作のためのリソース(不完全版) | gaspanik weblog
  • 便利な人には便利なChromeの拡張機能 33+1コ | gaspanik weblog

    皆さんの普段使いのWebブラウザはなんですか? ここ最近のボクはといえば、GoogleさんのChromeをメインブラウザとして使っています。Chromeも公開されているアプリや拡張機能を追加して、自分なりのブラウジング環境を作れます。そのまま使うか、拡張機能でカスタマイズするかはあなた次第です。 そんなわけで、今日は数多ある拡張機能の中からボクが選んだ入れておくと便利かもしれない拡張機能を33+1コ集めてみました。前半は多くの人を対象に日常のブラウジング体験を快適にするもの、後半はWebサイトの開発系でちょっと役立つものといった感じでジャンル分けしてお届けします。ま、あくまでもボクが普段使ってるものベースですが…、キャプチャ中の★やユーザー数も参考に。 いくら拡張機能が便利だって言っても、入れすぎたらそれは重くなるだけですからね。適当に取捨選択して入れるなり、使う時だけオンにするなりしまし

    便利な人には便利なChromeの拡張機能 33+1コ | gaspanik weblog
  • はじめてのGoogle plus | gaspanik weblog

    Google+が2011年9月21日より一般公開されたようですが、こちらの記事はフィールドテスト中の初期段階でまとめた内容です。全体的に大きな変更はないかと思いますが、記事中の画面のボタンや用語などの言い回しが変わっている可能性もあります。続き記事の「覚えておきたい G+ のちょっとしたこと」も同様です。 先週はじまった「Google+」ですが、今日から招待いらずでログインできるようになったようなので(といっても、またできなくなってるみたいですがw)、Google+のページとしてちゃっちゃっとまとめたこれから始める方への簡単なマニュアルを再編集してみました。 英語UIの画面写真を撮ってしまったのですが、場所は同じなので適宜置き換えて見てもらえば大丈夫ですよね。では、はじめましょう。 (追記)せっかくなのでePub版も作っておきました。iBooksでしか確認してないので、他のリーダーでの表

    はじめてのGoogle plus | gaspanik weblog
  • Google Analyticsのレポートで表示スピードを見ちゃおう | gaspanik weblog

    世の中はゴールデンウィークの真っ只中かと思いますが、皆様いかがお過ごしでしょうか。今日は、サイトのアクセス解析で有名なGoogle Analyticsのレポートにサイト内のコンテンツの表示スピードを組み込めるようになったというのでその話を。 GoogleさんのWebサイトの表示速度へのこだわりは有名なトコですが、これまではWebmaster toolsのLabsの中に「Site performance」という項目で、Googleのツールバーを入れてる方の計測結果をもとにしたサイト全体の平均速度が表示されていました(いや、今もまだちゃんとありますが)。 で、今回のこの話は、Google Analyticsのトラッキングコードにちょいと追加をしてやることで、コンテンツ全体の表示スピードをチェックをし、どのページが重いとかそんなのが調べられるって感じでしょうか。 導入は簡単、ひとことコードを追加

    Google Analyticsのレポートで表示スピードを見ちゃおう | gaspanik weblog
  • サクラの花を明るく撮るにはこうするアルヨ | gaspanik weblog

    木蓮やサクラの花も咲き始め、いよいよ春がやってきた感じがする今日この頃、iPhoneや携帯電話のカメラ、新調したコンパクトテジカメやデジタル一眼などを持って写真を撮りに行こうと画策してる人も多いかもしれません。Instagramなんかを見ていても、春の花の写真のオンパレードになっています。 で、背景に空が入ってるサクラなんかをカメラのオート設定そのままおまかせで撮ったら実際の見た目よりも極端に暗くなってしまった。「あれれ?もっと明るいのにな…」みたいな経験ありませんか? 「プロの写真はあんなに綺麗なのに…、なんか良い機材を使ってるんだ!」みたいに思われるかもしれませんが、そうではありません(笑)。カメラや写真の特徴を知ってるか知らないかで、サクラの花の写真ひとつ同じカメラで撮っても大きな違いが生まれちゃいます。 手間とか特殊な技術を必要とせずに、サクラを明るく綺麗に撮れるに超したことはあり

    サクラの花を明るく撮るにはこうするアルヨ | gaspanik weblog
  • Zen-Codingでできるあんなことこんなこと | gaspanik weblog

    先日超速コーディング?としてTextMateにZen-Codingを追加したコーディング手法の概要を紹介しました。で、実はZen-Coding、前回紹介した入力方法だけではありません。 HTMLのストラクチャ的なものがわかっていれば、特定の記述をして展開すると一気にコードが書けちゃったりします(どちらかと言えば、こっちが当のZen-Codingなんでしょう)。 ということで、今回はその特定の記述とやらの話をしてみましょう。ここまで使えるようになってくると実に速い…(はず 笑)。 文書構造がわかってれば、1行書いて一気に展開できるZen-Codingは、前回紹介したような登録された略語を使ってHTMLCSSのコードを展開する使い方だけでなく、特定の記述を使って構造を書き上げて一気に展開することができます。TextMateを使っている方はこちらのリストにある「Zen.Coding-Text

    Zen-Codingでできるあんなことこんなこと | gaspanik weblog
  • UStreamで生Zen-Codingやってみましょうか | gaspanik weblog

    ちょっと前に書いたZen-CodingネタをH2O Spaceのたにぐちさんに取り上げていただいてからというもの、関連するエントリーへのアクセスがにぎやかです(謎)。そんなこともあり、数日前の夜中に遊び半分で「Zen-Codingってこんな感じ」ってのをお見せしようと、Twitterで告知しながらUStreamでダラダラとやってました。 終わってから何名かの方に「見たかった!」というレスをいただいたのですが、ただやみくもにというか、適当に思いつくままキーボードをカチャカチャやってると、やってる人も「何がいいかな?どうしようかな?」みたいな脳みそになっちゃいます。もちろん、見ている側も何してるか想像できないですからね…(笑)。 ということで…。 ならば、簡単なサンプルを作ってそれをやってみようじゃないか簡単ですがサンプルを用意してみました。ただブロックが組み合わさっただけだと面白くもないの

    UStreamで生Zen-Codingやってみましょうか | gaspanik weblog
  • Pokenよりも断然「E」かもね | gaspanik weblog

    のごくごく一部では「Poken」なるものが流行っているようですが(流行ってるかどうかは謎ですが 笑)、iPhoneとかiPod touch持ってる人(普通の携帯でもいけそう)は断然こっちじゃないの?って思うサービスを発見しました。 その名も「My Name is E」。 言ってしまえば、Pokenと同じように名刺代わりに自分の登録しているオンラインサービスななんかの情報を交換こするものですけど、iPhoneやtouchがあればブラウザ経由で可能です(仕組みが違うじゃんと思う方は最後を見てね)。 とりあえずサインアップして、もろもろの登録を済ませます(ここで紹介するため住所や電話番号なんかのもろもろは省いてますが、Webのアドレスはじめちゃんと登録可能)。もちろん、交換するためのカードは表示内容を制限する(細かく設定可能)など複数作成可です。 登録できるオンラインサービスは多岐にわたりま

    Pokenよりも断然「E」かもね | gaspanik weblog
  • 1