タグ

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

  • よく使うアイコンWebフォントのフォントセットとジェネレーターまとめ

    Webページ上でベクターのアイコンを簡単に表示できる憎いアイツ。そう、アイコンWebフォント。 Retinaディスプレイでも綺麗に表示されるし導入は(そんなに)難しくないし至れりつくせり。 セマンティック?なにそれおいしいの? そんなわけで今回はよく使っておりますアイコンWebフォントのセットと、ジェネレーターをまとめてみました。 ※紹介しているフォントを使用する際は、ライセンスを必ずご確認ください。 Font Awesome とっても有名なアイコンフォント、Font Awesome。600を超えるアイコンを使用できるのが特徴です。ソーシャル系のアイコンも揃っております。線のRは少し強めの印象。 個人・商用利用なのも嬉しい。 Font Awesome, the iconic font and CSS toolkit Entypo キリッとしたアイコンがエレガントなイメージなのがEntypo

    よく使うアイコンWebフォントのフォントセットとジェネレーターまとめ
  • 私がよく使っているjQueryプラグインまとめ(スライダー、モーダルウィンドウなど)

    こんにちは、暑いですね。脇汗すごいですね。僕が。 さて今回はWebページ作成時に、私がよく使っているjQueryプラグインをまとめてみました。(たまにjQueryが必須でないものもあります。) ※紹介しているプラグインを使用する際、ライセンスは各自で再度確認してくださいませ。 Owl Carousel 個人・商用利用可能。レスポンシブでいい感じに動作してくれるカルーセルスライダーです。動作もシンプルで綺麗だし、マークアップも簡単。テキストもOK。お気に入りのプラグインです。 Owl Carousel bxSlider 個人・商用利用可能。シンプルなスライダープラグインです。レスポンシブで動作し、カスタマイズもしやすく重宝します。 jQuery Content Slider | Responsive jQuery Slider | bxSlider Glide.js デモページがカッコイイス

    私がよく使っているjQueryプラグインまとめ(スライダー、モーダルウィンドウなど)
  • Google Fontを閲覧中のページに簡単に適用してテストできるChrome拡張「Google Font Previewer for Chrome」

    閲覧中のWebページにGoogleFontを適用できる! まずは拡張機能をダウンロード。 ダウンロードしたら、Google Fontを適用したいページを表示して、ツールバーの拡張機能をクリック。 拡張機能が開いたら、フォントを適用したいセレクタを入力し(デフォルトは∗)、フォントを選択します。 サイズ変更やテキストシャドウなどを適用することもできます。 試しに当ブログにて「Actor」をチョイスしてみます。 見事、フォントが適用されました!ウヒョー! これだ!と思ったら、スタイルが下部のボックスからコピペできるようになっておりますのでheadタグに仕込むも良し、あえて仕込まないも良し。 importに対応してくれるとなお嬉しいのですがね…アップデートに期待しましょう。 Google Font Previewer for Chrome WebフォントGoogle web fonts」の使い

    Google Fontを閲覧中のページに簡単に適用してテストできるChrome拡張「Google Font Previewer for Chrome」
  • Chromeのブックマークがめちゃくちゃ便利になる機能拡張「DEWEY」に惚れた!!

    なんのかんのでメインブラウザをChromeにして久しいのですが、増えすぎて整理が追いつかず悩みの種だったブックマークをめちゃくちゃ使いやすくしてくれる拡張機能DEWEYを導入してみました。タグ付けめっちゃ捗るんですけど!! これはオススメだ! DLはこちら:Dewey. Better bookmarks for Google ChromeChromeのブックマークに「タグ付け」 この拡張機能は@Jacminik さんのツイートで知りました。アザマス!!ハヨザイマス!!! 今までずっと求めていたブックマークをタグで管理/検索出来る機能拡張がついに出た! [Link] Dewey. Better bookmarks for Google Chrome™ : http://t.co/XXtHz3H7Ag — masahiro k. (+Beans) (@Jacminik) 2014, 2

    Chromeのブックマークがめちゃくちゃ便利になる機能拡張「DEWEY」に惚れた!!
  • 画像をコミカルに加工しよう!Photoshopなどで集中線を描く方法!

    先日「東海Walker (ウォーカー) 」様にインタビューを掲載していただいた際の記事にて、出オチと評判の高い集中線を用いた合成写真を作成したのですが、どうやって作るのですか?というお問い合わせをいただきましたので今回はPhotoshopを用いて集中線を描く方法をシェアしたいと思います。 ノイズを使用する 集中線の効果を描くには色々な方法があるかと思いますが、今回は「画像にノイズを加えて加工する方法」をご紹介したいと思います。 では早速作っていきましょう。ちなみに当方の環境はPhotoshopCS5です。 まずは画像を用意してPhotoshopで開きます。そうです。女神です。 用意した画像の上に一枚新規レイヤーを作成。 次に、描画色を黒、背景色を白のデフォルトの状態にして(ショートカットは「D」)「フィルター」→「描画」→「雲模様1」を選択。 こんな感じ。 そのレイヤーに、「フィルター」→

    画像をコミカルに加工しよう!Photoshopなどで集中線を描く方法!
  • 「間抜けで気持ちの悪い文章」を書くために知っておかなければいけない6つのテクニック

    ブログや日記、メールなどを作成している際についつい「正しい文章」を書いてしまい、読んでいる人を辟易させたことはありませんか? 日語が乱れがちな現代社会。 没個性を重んじる風潮が強いこの国において、”この人は正しい日語が扱えるきっちりした人だ”と言う印象を与えることは、あなたのイメージを損ねる原因となりかねません。 そこで日は、読んでいて気持ちの悪い「間抜けな文章」を書くために知っておくべき6つのテクニックをご紹介しましょう。 間抜けな文章を書くために では実際に気持ちの悪い文章テクニックと文例を見ていきましょう。 最初に出ている青枠は気持ちの悪い(今回の講座においては正しい)文章、赤枠はきっちりと構成された大変に読み応えのない悪い例です。 1.敬体と常体を入り混ぜましょう。統一性が無くなるからだ。 私は篠崎愛ちゃんが大好きだ。 彼女の豊満な体にばかり目がいきがちですが、注目すべきはそ

    「間抜けで気持ちの悪い文章」を書くために知っておかなければいけない6つのテクニック
    dal
    dal 2013/02/28
  • Webフォント「Google web fonts」の使い方・実装手順メモ

    商用・非商用を問わず無料で利用できるWebフォント、「Google web fonts」の実装方法をさっくりメモっておきたいと思います。 Google Web Fonts Google web fontsとは Webページ閲覧時、通常ではパソコンにインストールされているフォントしかブラウザで表示することが出来ませんが、「Webフォント」を使用すると任意のフォントを表示することが出来ます。 Googleの提供するGoogle Web Fontsはアカウント登録の必要も無く、実装が非常に簡単なそれの一つです。商用・非商用ともに無償で利用が可能と言うのもポイント:) ちなみに当サイトでも日付の表示とサイドバー・フッターの見出しにGoogle web fontsの「Coda」を使用しています。 Google web fontsの実装方法 実装の手順は3ステップ。 1.使いたいフォントを選択する 2

    Webフォント「Google web fonts」の使い方・実装手順メモ
    dal
    dal 2012/12/28
  • いよいよ明日、12月15日開始。SoftBankによるiPhone5のテザリング!申し込みの手順と使い方をおさらいしておこう!

    iPhone 5 camera and flash / smjb どう?テザってる? そんなわけで、いよいよ明日からソフトバンクのiPhoneでもテザリングが解禁される事となりました。 私がどれだけこの日を待ち望んでいたかと言うと、すっかり昨日まで忘れてたぐらい楽しみにしてました。えぇ忘れてました。申し込みすら。 何というか「自分にはPocket Wi-Fiがあるからいいや」と思って申し込みをしていなかったのですが、昨日自宅を出る時にそれを忘れてしまいまして。不便でして。 でまぁそれがきっかけで「やっぱテザリング申し込んでおこう」と思ったのですが、せっかくですので「テザリング申し込み→使うまで」の手順をおさらいしておこうかと思います。 テザリングオプションを申し込もう まずはテザリングオプションを申し込まないことには何も始まらないですね。 テザリングの申し込みはiPhoneからサクッと行う

    いよいよ明日、12月15日開始。SoftBankによるiPhone5のテザリング!申し込みの手順と使い方をおさらいしておこう!
  • デザイナーの私が色選択に迷った時に使用している配色ツール・カラーチャートなどのまとめ

    New/ old tin palette / jessiecchapman 「色彩検定2級」と言う自慢していいんだかよくわからない資格を持っている私。…が、デザイン会社勤務でありながら、どうも「色使い」と言うものに苦手意識を持っておりまして。 いざデザインに取り掛かろう!となってからメインカラーを決めて、サブのカラーを決めて、よしこれだ、あ、でも待って、こっちの色の方がいいかも、ううん、元に戻そう…あ、やっぱりこのキャミソールにしようかしら…etcetc。 さっぱり作業が進まないこともしばしばなのですが、そんな時に使用しております配色の手助けツールをまとめておきたいと思います:)

    デザイナーの私が色選択に迷った時に使用している配色ツール・カラーチャートなどのまとめ
    dal
    dal 2012/11/29
  • 7つのサンプルでjQueryを学ぼう!「jQueryが全く分からない人のため」の超初級者向け入門講座

    HOME>jQuery>7つのサンプルでjQueryを学ぼう!「jQueryが全く分からない人のため」の超初級者向け入門講座 約半年前まで、興味はあれども全くもって触れたことのなかった「jQuery」。それどころか、「Javascript」を「Javasprict」と何度となく書き間違える癖のあった私。 結局、「スク水すいすいスクリプト」と語呂を合わせることによりようやく正しい綴りをマスターしたわけなんですが、仕事で扱うと言うこともあり多少はjQueryの仕組みが分かってきた今日この頃です。 そんなわけで、今回は「jQueryが全く分からない人のため」の超初級者向け入門講座と銘打ちまして、jQueryの基礎の基礎を学ぶための記事を書いてみました。 とは言っても「jQueryとはなんたるか」などといった難しい理論を記すつもりは一切ございません。(っていうかそんな偉そうなこと言える程修めてない

    7つのサンプルでjQueryを学ぼう!「jQueryが全く分からない人のため」の超初級者向け入門講座
    dal
    dal 2012/11/12
  • WordPressのオリジナルテーマ 作り方の記事まとめ

    サイトじゃないですけど、今使ってる。凄く分かりやすい。 チートシート 日語版 WordPress チートシート | Webクリエイターボックス WordPressの覚え書きというか、カンニングペーパーです。コードなんぞをまとめました。他にもWordPressのチートシートはいたるところで記事にされていますが、CSSハックやCSS小技集に続き、 … コードを書く際に便利なカンペ。 CSS入門 わたくし、CSSHTMLもまともに修めておりませんのでそのへんの知識を得るために。 CSSレイアウト実践講座 とほほのスタイルシート入門 テーマ、カスタマイズ参考 2011年に入って気になった最新Wordpressテーマの情報一挙公開 | バンクーバーのWEB屋 僕は出身が熊でして、良い物のことを、”こりゃヨカバイ!”と言うことがあります(若い人は使わないよね、そうだよね。) さて、今日は僕が思

    WordPressのオリジナルテーマ 作り方の記事まとめ
  • とんでもなく参考になりすぎるEvernote使用例 5 〜[図解]@saiut のEvernote「超」情報収集術!!

    半年で月間25万PVを達成し、2500はてブ越えまで果たし、ついにまで出してしまった@OZPA 様のこのブログに寄稿をさせてもらえることになった@saiut と申します! TRAVELINGというブログをやっています。 TRAVELING 独自ドメイン取得して、Wordpressでブログ始めたよーってのを@EVERNOTE_MAN@ozpa 様に伝えたところ、「ゼヒうちで書い(ry流れは置いておいて、題に入らせて頂きます。 「Evernote関係の記事を書いて欲しい!」とのことでしたので、真っ先に思いついたのがノートブックを紹介することだったのですが、ここの人がすごいのを思いっきり晒してくれているので、自分がどうやってEvernoteへ情報を収集しているかを紹介させて頂きたいと思います。 Evernoteの超具体的使用例 ?ノート総数「4100」私のノートブックを公開します? 上は、私

    とんでもなく参考になりすぎるEvernote使用例 5 〜[図解]@saiut のEvernote「超」情報収集術!!
    dal
    dal 2011/10/20
  • とんでもなく参考になりすぎるEvernote使用例 〜@knk_nのYahoo Pipesを使ったノート作成術〜

    全世界のOZPA Fanの皆さま、はじめまして。新参エバーノーターの@knk_n と申します。 普段は大学生のかたわら、Knk_n, aN unsKilled everNoterというブログにてEvernoteiPhoneMacについての記事を書いたりしています。(最近は読書ログやべログにも手を伸ばしてみたり) Knk_n, aN unsKilled everNoter さて、今回記事を書くきっかけとなったのが@OZPA のこの記事。 参考:お気に入りのツイートをEvernoteに全て放り込む方法(と関連するちょいと便利なTips) この記事を読んで、@OZPA にこんなメンションを飛ばしたんです。 [blackbirdpie url=”https://twitter.com/#!/knk_n/status/63911569171554304″] [blackbirdpie url=

    とんでもなく参考になりすぎるEvernote使用例 〜@knk_nのYahoo Pipesを使ったノート作成術〜
  • Twitterのつぶやきをブログ上で再現してくれるWordPressプラグイン「Blackbird Pie」がすんごい便利

    HOME>WordPress>Twitterのつぶやきをブログ上で再現してくれるWordPressプラグイン「Blackbird Pie」がすんごい便利 さて、この更新をきっかけに、Twitterのつぶやきをブログ上で表示させる上手い方法を探しておったのです。 これまではスクリーンショットとって載せてたりしてたんですよ。つぶやきを表示してスクショ撮ってflickrにあげて・・・MCM(マジ超めんどくさい) そんなおり@ttachi さんのブログでこんな文面を発見。 TwitterのツイートをWordpress上に再現してくれるプラグイン、Blackbird Pie。 via: WordPressのプラグイン “Blackbird Pie” がアップデートで復活 | No Second Life え、そんなのあるんすか! 早速入れてみた 善は急げと「Blackbird Pie」をDL、インス

    Twitterのつぶやきをブログ上で再現してくれるWordPressプラグイン「Blackbird Pie」がすんごい便利
  • iPhoneでPC内の全楽曲が聞ける!!!!「Audiogalaxy」は凄かった

    前々から気になっていたサービス、それがAudiogalaxy 自宅PCiTunesライブラリをネットで飛ばし、iPhoneで聞けるようにすると言うサービスです。 要するに、iPhone音楽データが入っていなくとも自宅PCに入っている曲が全て聞けると言うわけですよ。 Audiogalaxy Mobile 1.7.0 iPhone、iPod touch および iPad 互換 iOS 3.1 以降が必要 カテゴリ: ミュージック 価格: 無料 更新: 2011/04/21 参考:音楽データを持ち歩かずにiTunesの全てが聴ける!”Audiogalaxy Mobile” – Gadget Girl 参考:感動。自分のPCをクラウド化する「audiogalaxy」で、全ての音楽を、あらゆるデバイスで。 | おまえは今までスキャンしたの冊数をおぼえているのか? @spring_mao ちゃん

    iPhoneでPC内の全楽曲が聞ける!!!!「Audiogalaxy」は凄かった
  • とんでもなく参考になりすぎるEvernote使用例 2 〜@ika621の全ノートブック〜

    全国のOZPAファンの皆様はじめまして。 この度、寄稿させていただくことになりました、@ika621 と申します。 Punksteadyというブログを書いています。誰かの役に立てればいいなと思って書いています。よかったらのぞいてやってください。RSS登録してくれたら更に喜びます。 さて、Evernoteといったら、@goryugo さん。 昨年12月に@OZPA と時期を同じくして、@goryugo さんのブログに寄稿させていただきました。 参考:参考になりすぎるEvernote活用例2 – @ika621 – | goryugo, addicted to Evernote そして今回、@OZPA のブログにも寄稿させていただき大変光栄に思っています。 内容は@goryugo さんのブログに載せて頂いたの際と同じ、Evernoteのノートブック晒しです。 あまりにも自由度が高すぎるEver

    とんでもなく参考になりすぎるEvernote使用例 2 〜@ika621の全ノートブック〜
  • Evernoteの超具体的使用例 〜ノート総数「4100」私のノートブックを公開します〜

    先日アップしたエントリーでは、私が現在Evernoteと連携させているiPhoneアプリWebサービスをご紹介いたしました。 そこでふと気がついたのが、最近Evernoteのノートブック晒しをやっていないなと言うこと。 参考:参考になりすぎるEvernote活用例4 –@OZPAのノートブック晒し– | goryugo, addicted to Evernote 昨年の12月、@goryugo 氏のブログに寄稿させていただいたのが上の記事。 格的にEvernoteを使い出した昨年5月からの7ヶ月間で、ノート数は2200程度でした。 で、それから4ヶ月。現段階での私のEvernoteノート数は4100ほど。 Evernoteにライフログを叩き込もう!と勢いごんでから、そのノート数は加速度的に増加しております。 この4100という数が多いのか少ないのかは皆様の判断に委ねるとして、現時点での

    dal
    dal 2011/04/12
  • iPhoneのアドレス帳をDropboxでバックアップ!「連絡先バックアップ」が超便利

    California address book has space for Addresses / The Young Ryan G iPhoneの連絡先、バックアップはとっていらっしゃいますでしょうか。 今回は、ローカル+Dropboxと同期して連絡先をバックアップしてくれるアプリ、「連絡先バックアップ」のご紹介。 実は私、昨年12月にiPhone 3GSを無くしまして、泣く泣くiPhone 4に機種変更をした過去があります。 未だにその時の事を考えると涙が止まりませんし、美味しそうなラーメンを見るとよだれが止まりません。 で、iPhoneを無くした折りに一番困ったのは連絡先が結構消えてしまったということ。 マメに母艦Macと同期すべきだったのですが、あんまりバックアップを取っていなかったためにだいぶ古いデータでのアドレス帳に戻ってしまうハメに。 連絡先のバックアップを母艦PCのみで行っ

    iPhoneのアドレス帳をDropboxでバックアップ!「連絡先バックアップ」が超便利
  • Evernoteを使うなら絶対に知っておくべき神ブックマークレットの使い方

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

    Evernoteを使うなら絶対に知っておくべき神ブックマークレットの使い方
  • [図解]Evernote使うなら知ってて損はない!現在使用中のアプリ11選!!

    キリンさんが好きです。でも、ゾウさんのほうがもーっと好きです。 今回は、私がEvernoteと連携させて使用している11のアプリをざっと紹介したいと思います。 中にはEvernoteと直接連携していないアプリもありますが、私のEvernoteと切っても切れない、そんなアプリだとお考えください。ただれた関係。 参考:Evernoteを考える 第2回 ~Evernoteを中心に置いてみる~ 上の参考リンクは3ヶ月前に書いたEvernote連携アプリ紹介記事。 刻一刻とEvernote周りの環境は移り変わっていくな・・・と世の中の無常を感じながら見比べていただけると幸いです。驕れるアプリひさしからず。なに言ってんだろう。 (アプリの値段は執筆時のものです。購入時はご確認ください。) (クリックでPDFが拡大します) 上の図が2011年1月現在の、Evernote連携アプリとその用途。自分の扱う情

  • 1