タグ

ブックマーク / ozpa-h4.com (7)

  • imgタグを記述するだけでダミーの画像を表示してくれるサービス「lorempixel」が便利

    Web制作をしていると、ダミー画像を用意しなければならない!なんて時が頻繁にあってわりかし手間なのですが、こういうサービスあったんですね…知らなかった。 と言うわけで、WEBマーケティング ブログさんで紹介されていた、imgタグ内でサイズ・ジャンルなどを指定すれば自動的にダミー画像を作成してくれるサービス、lorempixelがとっても便利でしたのでご紹介。 lorempixelの使い方 まずはlorempixelへ訪れましょう。 lorempixelでは、imgタグ内のsrcをhttp://lorempixel.com/width/height/カテゴリ/ダミーテキストのように記述することで、サイズ・ジャンル・カラーorモノクロ指定したダミー画像を読み込んでくれます。 [html] <img src="http://lorempixel.com/500/350/food" alt=""

    imgタグを記述するだけでダミーの画像を表示してくれるサービス「lorempixel」が便利
  • Zen-Coding(Emmet)でコード展開時にクラス名・ID名のコメントを自動追加する方法

    HTML Code / Sebastian Fuss 愛用のテキストエディタ「Sublime Text 2」にも導入しております、Emmet(Zen-Codingの次期バージョン)。使いこなすことでHTMLCSSの記述を高速化することが出来ます。 んまぁ例えばこんな風に記述して展開すると… このようにHTMLを吐き出してくれます。 で。MacのエディタCoda2のプラグイン「Tea for Coda」にてdiv要素を閉じた時に自動でコメントをつけてくれるカスタマイズみたいな感じでクラス名・ID名のコメントを自動的につけてくれる方法はないものかと調べていたところ、Web Design KOJIKA17さんの記事Zen-Coding、0.7のすすめ|Web Design KOJIKA17に以下のような記述を発見。 フィルター HTMLの展開をサポートするフィルターも用意されています。 |(バ

    Zen-Coding(Emmet)でコード展開時にクラス名・ID名のコメントを自動追加する方法
  • 読み込み前に画像が縦に並んでしまうのを改善!ブログトップ、スライド部分の挙動を修正してみました

    jQueryのおべんきょナー どうも、おつぱ( @OZPA )です。 以前jQueryプラグイン「Awkward Showcase」を使用して導入した当ブログトップのカテゴリ表示スライドバー。 気に入ってはいたものの、挙動が気になっていた部分があったのですが、ようやく修正することに成功いたしました。 jQueryが動く前に立てに並んじゃう ブログトップ(PCで見てね)に表示してあるこちらのスライドバー。 縦に並べたリンク付きの画像をjQueryプラグインを利用して「横並び→スライド」するような挙動にしてあります。 が、jQueryはその性質上、全ての要素を読み込んでから挙動を始めます(まぁそうで無い設定も出来ますけど)。 故にjQueryを読み込む前、一瞬ご覧のように縦に配置した画像が見えてしまっておりました。 格好悪いですね。アイコンは可愛いのに。 だので次のようにコードを改良いたしまし

    読み込み前に画像が縦に並んでしまうのを改善!ブログトップ、スライド部分の挙動を修正してみました
  • Mac標準アプリ「Automator」でファイル名を一括リネームする方法

    途方に暮れていた私に、和洋風◎の@isloop くんが教えてくれたのが、Macデフォルトアプリの「Automator」を使用してリネームする、と言う方法でした。 よく考えたらAutomatorをほとんど使っていなかった私。 試してみたらこれが非常に便利で快適でしびれるねぇだったので設定方法をご紹介。 連番付きのファイル名にする場合 まずは、連番付きのファイル名にする場合です。 Automatorを起動、「サービス」を選び、右下の選択ボタンをクリック。 次に、画面上部の 「”サービス”は、次の選択項目を受け取ります:」の部分のタブをひっぱり、イメージファイルを選択します(今回は画像のリネームを行うワークフローを作成するため) つづいて、その右の「検索対象」のタブをFinderに設定。 次に、検索窓にfinderと打ち込み、「Finder項目の名前を変更」と言うフローを見つけましたら、そいつを

    Mac標準アプリ「Automator」でファイル名を一括リネームする方法
  • Macを使用するうえで覚えておくとめちゃくちゃ便利なショートカットを挙げ連ねてみる

    Mac for every student ? / luc legay 作業効率を上げるための方法は幾つもありますが、まず押さえておきたいところといえば「キーボードショートカット」でしょう。 当然のことながら、ショートカットを知っているか否かというのは作業スピードに密接に関わってきます。 今回は、Macにて私がよく使用するショートカットや基的なコマンドを含めて、覚えておくと便利なものを挙げ連ねておこうかと思います。 関連:Mac OS X のキーボードショートカット 超基のショートカット 以下はMacを扱う上で超基となるショートカットです。 たいていどのアプリケーションでもこれらのショートカットは共通ですので覚えておいて絶対に損はないです。 command + A:すべてを選択 command + Z:アンドゥ(リドゥ) command + S:保存 command + C:コピー

    Macを使用するうえで覚えておくとめちゃくちゃ便利なショートカットを挙げ連ねてみる
    hirotaka11
    hirotaka11 2011/11/22
    Finderのcmd+矢印キーがないのは周知だからか?
  • 死ぬほど簡単にローカルにWordPress環境を構築できる「BitNami」の導入方法!(Mac編)

    どうも。生まれて初めて当たり付き自動販売機で当たりが出た@OZPA です。 さて、かねてより和洋風◎の@isloop くんより 「ブログのデザイン、テンプレートじゃなくて自分で作ったほうがいいよ」 とのアドバイスをうけていたのですが、phpcssどころかhtmlすらろくに理解していなかった私。 プロフィールページを作るのに戸惑ったり、はたまたサーバを移転するのにしこたま苦労したりと当に手のかかるお子様だったわけです。そんな私がWordPressのテーマですって・・・?汚らわしいっ! [blackbirdpie url=http://twitter.com/#!/OZPA/statuses/64271506724757504] ですが今年の4月の終わりに上のようなつぶやきをしていることをふと思い出し、新しいことを覚える良いチャンスだなということで、WordPressのテーマを作るためにB

    死ぬほど簡単にローカルにWordPress環境を構築できる「BitNami」の導入方法!(Mac編)
  • Evernoteを使うなら絶対に知っておくべき神ブックマークレットの使い方

    いらぬ親切余計なお世話。 あまり好きな言葉ではございませんが、Evernoteを使っている時にそれをふと感じる事があります。 EvernoteでWebクリップをする際、ChromeエクステンションやFirefoxアドオンを用いている人が大半でしょう。 ただ、単にクリッパーをクリックするだけだとサイドバーやらヘッダーなどのいらない情報がクリップされてしまう事があります。 これぞ、The・いらぬ親切。 上は当ブログの過去記事を適当にクリッピングしたものですが、Webクリップにはヘッダーやらなんやら不要ですよね。 ロゴはカッコイイけど。 で、この間@goryugo さんのブログで紹介されていた、とあるブックマークレットが、こんな時に超絶便利だって言うお話なんです。紹介せざるを得ない感じで便利。 その名も、「Print what you like」! 参考:[link]Evernoteのクリップに

    Evernoteを使うなら絶対に知っておくべき神ブックマークレットの使い方
  • 1