こいつぁ便利ね…！他サイトの記事紹介リンクをかっこ良く作成してくれる「Embedly」
人様のブログや他サイトの記事を紹介するためにいろんな方法をとっておりましたが、@shintarowfresh さんの最近捗ったweb系のあれこれって記事で知ったEmbedlyというサービスがなかなか良かったので導入＆カスタマイズしてみました。 Embedly 外部サイトを紹介するのに便利なEmbedlyの使い方 まずはこちらのページへGO。 ブックマークレットをブックマークバーにぶち込みます。 これで準備は完了。あな簡単し。 あとは紹介したいページにアクセスして、先ほど登録したブックマークレットをクリックすると… いいじゃない！下部のソースコードを貼り付ければおしまいです。 できあがりは↓こんな感じ。 ホント買って良かったこのレンズ！Sonnar T* FE 55mm F1.8 ZA（SEL55F18Z）実写レビュー レスポンシブ対応ですし、使い方も非常に簡単。こいつぁ便利ですね！ 最近捗
コーディング上級者になりたかったら絶対読むべき！「現場のプロが教えるHTML+CSSコーディングの最新常識」
その書き方、古くなぁ～い？なくなくなくなくなくなくなぁ〜い？ そんなわけで、先日発売になりました書籍現場のプロが教えるHTML+CSSコーディングの最新常識 知らないと困るWebデザインの新ルール4一冊ご恵贈頂きました。 最新のコーディング事情を知りたい、またはHTML + CSSコーディングの上級者を目指すのであれば絶対におさえておくべき一冊です！ 書籍の紹介 近年のWebコーディングはスマートフォンをはじめとする対応デバイスが劇的に増えたことから、非常に手間のかかる工程になりました。検証や最適化まで含めたすべてを手作業でこなすのは無理が生じてきており、さまざまな制作支援ツールやフレームワークを活用しながら進めるなど、従来のワークフローから大きく変化を遂げています。 本書ではこのような“モダン”なHTML＋CSSコーディングのあり方と、作業の効率化＆適正化を図る手法・技術・ツールを網羅的
頭良さそうに全く内容のないエントリーをアップする方法
以上はWikipediaなどで適当に拾ってきた単語にただリンクを貼り付けてテーブルにしたものです。何か含みを持たせていたりすることはありませんし、この無秩序な単語の列に意味合いを探してもWaste of Time＝時間の無駄でしょう。 こんな突然の英語も記事をそれっぽく仕立て上げます。 先程はリストでランダムな単語を並べてみましたが、同様の手法は他にもあります。それが引用です。 準同型（じゅんどうけい、homomorphic）とは、複数の対象（おもに代数系）に対して、それらの特定の数学的構造に関する類似性を表す概念で、構造を保つ写像である準同型写像（じゅんどうけいしゃぞう、homomorphism) を持つことを意味する。構造がまったく同じであることを表すときは、準同型・準同型写像の代わりに同型（どうけい、isomorphic）および同型写像（どうけいしゃぞう、isomorphism）とい
結婚式二次会の幹事を頼まれたらこう準備しなさい 〜ベテランが教える運営マニュアル〜
親しい友人から、急に結婚式二次会の幹事を頼まれたらどうしますか？ いつの頃からかわかりませんが 「結婚式の二次会、幹事をお願いしてもいいかな？」 「二次会パーティーの司会を頼みます！」 などと依頼されることが多くなりまして。これまでに私が関わった結婚式二次会の数は15組以上。もはやベテランと言って差し支えないでしょう。 そんなわけで、私が結婚式二次会の幹事・司会を頼まれた時にどうやって準備、運営していくのかをまとめてみました。 スケジュール 幹事を依頼されてから、当日までのながれは大体以下のとおりとなります。 新郎新婦と幹事の顔合わせ 会場との打ち合わせ レジュメ作成 タスクリストに沿って準備 （当日）抜かりなく運営 だいたいこんな感じ。だいたい、毎回、こんな感じで開催。 1.新郎新婦と幹事の顔合わせ まずは新郎新婦と幹事グループの顔合わせ兼打ち合わせを行ってもらいましょう（ここは新郎新婦
[動画あり]快適な文字入力には絶対に欠かせないアプリ、TextExpanderで使用中のスニペットをまとめてみた #myTE
TextExpanderとは？ 文字入力補助ソフトのTextExpanderは、スニペットと呼ばれる省略形を打ち込むことでそれに対応する定型文を入力してくれると言うアプリです。 Dropboxを使用して他のMacやiPhone、iPadなど、複数のデバイス間で定型文の同期ができるなど嬉しい機能満載で、これにより素早いキータイピングが可能になります。 また、「%|（スニペットを入力後カーソル位置を指定できる）」や「%clipboard（コピーした文章が入力される）」と言った予約語を使用することで、その使い勝手はさらにアップいたします。 TextExpanderに関しては@azur256 さんのブログ最近, 気になったこと…に超詳細な連載がされておりますのでご参考にどうぞ。 最近, 気になったこと…: TextExpanderの使い方[1] 〜基本的な使い方〜 そんな、普段便利に使用しているT
![[動画あり]快適な文字入力には絶対に欠かせないアプリ、TextExpanderで使用中のスニペットをまとめてみた #myTE](https://cdn-ak-scissors.b.st-hatena.com/image/square/92edcbf32654914d500cbdf990a0c1d35f57e9b3/height=288;version=1;width=512/https%3A%2F%2Fozpa-h4.com%2Fwp-content%2Fuploads%2F1207textexpander1.jpeg)
MacBook Air/Proの容量を+128GBまで拡張できるアイテム「Nifty MiniDrive」が素晴らしかった
この商品はmicroSDカードを差し込んでMacBookに挿入することで容量を増やすと言う製品。SDスロットぴったりのサイズなので、普通のSDカードやUSBメモリと違ってPCの外側へ出っ張らない。あな嬉しや。 私のMBAは128GBモデルなので、同容量のmicroSDカードを使えば容量が倍になる計算。あな素晴らしや。 商品はAppBank Storeの渋谷パルコ店で購入。6000円ちょいでした。 裏面の説明書き。 ﾊﾟｯｶｰ 中にはMiniDrive本体とカード取り出し用の器具、それに4GBのmicro SDカード、説明書が入ってます。（micro SDカードは本体に装着されてます） こちら本体。大きさはSDカードが一回り小さくなったサイズです。SDスロットに入れるので当たり前ですが。 使ってみた さぁでは実際に使ってみましょう。まずはこのようにmicro SDカードを本体へ挿入。 早速装
大上段でブログを書いたので是非参考にして欲しい
以前、当ブログでは「間抜けで気持ちの悪い文章」を書くために知っておかなければいけない6つのテクニックと題し、Webコンテンツを作成する際に陥りがちな誤った日本語の使い方を紹介した。 今回は「大上段でブログを書いてみよう」と銘打ち、いかに読者へ威圧感を与えつつ文章を展開することができるのかを4つのポイントに分け紹介する。 是非参考にして欲しい。 1.大上段で文章を書く心構え まずは前提となる「大上段」の意味をWebで調べたのでここに紹介する。 だい‐じょうだん〔‐ジヤウダン〕【大上段】 １ 剣道で、頭上に高く刀を振りかざす構え。上段の構えを強めた言い方。 ２ 相手を威圧するような、いたけだかな態度をとること。また、物事の視点となるものを、高く掲げること。「法律を―に振りかざす」 via: だいじょうだん【大上段】の意味 – 国語辞書 – goo辞書 「居丈高（いたけだか）な態度」、なんと素敵
文章の異なる部分を比較、表示してくれるツール「difff《ﾃﾞｭﾌﾌ》」｜に助けられた件
私がSassで構築したCSSファイルを直接修正した別の方に「CSSの追加修正しておいて」と言われまして。 （↑その時の気持ち） ヤダ。CSS直接いじりたくない。ｻｽりたい。 どうにかなるまいかといろんなツールを探していたところ、2つのテキストを比較して異なる部分（差分）を比較してくれるツール、difff《ﾃﾞｭﾌﾌ》に助けられました。ﾃﾞｭﾌﾌ。 下の枠に比較したい文章を入れてくだちい。差分 (diff) を表示します。 via: difff《ﾃﾞｭﾌﾌ》 使い方はものすごくシンプル。こんなかんじで比較したい2つの文章をそれぞれテキストエリアへ入力、「比較する」ボタンをクリック。 するとこんな感じで差分をハイライト表示してくれます。便利。 おかげさまで、差分のCSSをSassファイルに書き込んで（幸いそんなに変更箇所無かった）コンパイルしてCSS上書きして作業完了。助かりました。 ありがと
Webデザイナー、コーダーならDLしとこう！あると地味に便利なGoogleChrome機能拡張4つ
今日は業務でよく使う、Webデザイナー・コーダーさんならあると地味に便利なGoogleChrome機能拡張をまとめてみました。私にとって、どのエクステンションも無いと「ちょっと困る」ものたちばかりです。 Image Properties Context Menu まずはImage Properties Context Menu。 画像を右クリックすると、パスやサイズ、altテキスト、ファイルサイズ等を別ウインドウで表示してくれます。 参考：[Google Chrome]右クリックで画像のプロパティを簡単に確認できるエクステンション「Image Properties Context Menu」 MeasureIt! 続いてはMeasureIt。 ブラウザ上に「ものさし」を表示してくれるエクステンション。ささっと画像サイズを調べたり、カラムの幅を測ったりするのに使用しています。 Show Ti
Chromeのブックマークがめちゃくちゃ便利になる機能拡張「DEWEY」に惚れた！！
なんのかんのでメインブラウザをChromeにして久しいのですが、増えすぎて整理が追いつかず悩みの種だったブックマークをめちゃくちゃ使いやすくしてくれる拡張機能DEWEYを導入してみました。タグ付けめっちゃ捗るんですけど！！ これはオススメだ！ DLはこちら：Dewey. Better bookmarks for Google Chrome™ Chromeのブックマークに「タグ付け」 この拡張機能は@Jacminik さんのツイートで知りました。ｱｻﾞﾏｽ！！ﾊﾖｻﾞｲﾏｽ！！！ 今までずっと求めていたブックマークをタグで管理／検索出来る機能拡張がついに出た！ [Link] Dewey. Better bookmarks for Google Chrome™ : http://t.co/XXtHz3H7Ag — masahiro k. (+Beans) (@Jacminik) 2014, 2
新しい技術を覚えるにはやっぱり何かを作らないとダメなんだなぁ
モノを作る側の人間としてみればこんな事言うまでも書くまでも無いのですが、最近改めて感じ入ったことなので自戒の念を込めてポストしておこうと思います。 とあるホームページ作った 最近、仕事とは別のところでWeb制作の依頼を受けまして、ホームページを作っておりました（もうすぐ公開）。きちんとした仕事ではなく（ちょっと語弊がありますが）、友人の始めるとある教室のサイトで、製作費は相場の数分の一。 「片手間で簡単なのを作ってほしい」 と言われ予算も全てを承知で始めたことなので、こちらとしてもそれほど凝ったことはせずにチャッチャッと仕上げる予定でした。予算に合わないことをすれば身が持ちません。 が。 作っているうちになんだか興が乗ってしまい、頼まれてもいないレスポンシブ対応をしてみたり、頼まれてもいないメールフォームを付けてみたり、頼まれてもい無いことのオンパレード。 膨らむ赤字。プライスレス。 ほと
国内初、「ケンタッキーの唐揚げ」が食べられる「KFC 鶏から亭」へ行ってきた！
3度のチキンよりケンタッキーが大好きなおつぱ（ @OZPA ）です。意味がわからない。 さて、東京は目黒区碑文谷にあります「ダイエー 碑文谷店」に今月オープンしました、あのケンタッキーが手掛ける国内初の唐揚げ店KFC 鶏から亭へ行ってきました！ ジューシーな唐揚げを4種類の味付けで！ こちらの鶏から亭は国内第一号店。ありがとう碑文谷ダイエー。 お昼時の来店でしたが、ご覧の盛況っぷり。 メニューがこちら！普通のケンタッキーオリジナルチキンも販売しております。 今回は、全ての味を楽しめる「食べくらべパック」を注文しました。 販売されている唐揚げはご覧の4種類。注文した食べくらべパックはオリジナルチキン3パックと、4種類の唐揚げが1つずつ入っております。お値段1,000円也。 はやる気持ちを抑えつつ購入したパックとともに帰宅。自転車での帰宅でしたがおそらくマッハ2は出ていたと思われます。 ウヒャ
超こってり＆チーズ好きよ来たれ！ごっつ秋葉原店限定「アキバみそチーズらーめん」！
チーズ好きです。アンアン。おつぱ（ @OZPA ）です。 さて、その恐るべき背脂の量で私の胃袋をノックアウトしてくれたラーメン店「超ごってり麺 ごっつ」さんの秋葉原店に登場したという「アキバみそチーズらーめん」とやらを食べに行って参りましたよ！ 加減を知らない人の作ったラーメン ごっつ秋葉原店さん。昭和通り沿いにございます。駅から徒歩約5分。 踊る「チーズ好きな方是非」の文字。後でわかることですが、そういう軽い気持ちで勧めてはいけないシロモノです。 なにはともあれ食券を購入、背脂の量（普通orこってり）を店員さんに聞かれますので伝えましょう。私はこってりにしました。 これも後でわかる事ですが、男子高校生の柔道部員以外は背脂の量を普通にしておくべきです。 さて、注文を済ませ待つこと5分… 来ました！！！アキバみそチーズらーめん！こってこての味噌ラーメンに尋常でないほどのとろけるチーズが！ お
とんでもなく参考になりすぎるEvernote使用例 6 〜ノート総数3500 @delaymaniaの全ノートブック晒し＆”肩の力を抜いた”Evernote整理術〜
とんでもなく参考になりすぎるEvernote使用例 6 〜ノート総数3500 @delaymaniaの全ノートブック晒し＆”肩の力を抜いた”Evernote整理術〜 OZPAの表4をご覧のみなさん、はじめまして。 ブログ「delaymania」を主宰しております、@delaymania と申します。 「アマオト」というバンドのギタリストをやってまして、その傍らでWEBデザインの仕事、そしてiPhone,iPadアプリの開発をやってます。 先日、尊敬するブロガーの@OZPA 君から「You寄稿しちゃいなよ」と言っていただきました。 OZPAの表4は以前から目標とするブログでして、そのブログに寄稿させていただけるとは夢のようです。 というわけで、めんどくさがりな僕の適当なEvernoteの使い方をご紹介します。 ノートブック整理は肩の力を抜いて適当にやる まず僕のノートブックをご紹介します。
これが出来れば中級者！Illustrator初心者のための「ロゴ作成講座」
先日、ブログのリニューアルに伴いまして当サイトの「ロゴ」を作成してみたわけなんです。 ↑こんなん。 で、こちらのロゴ私も大変気に入っておりまして、ありがたくも「かっこいい！」「抱いて！」というお声を頂戴したりしなかったり。 そんななか、「あのロゴはどうやって作成したのですか？」「手順を晒してください」「私も全てを晒します…//」と言ったご意見を何名かの方から頂きましたので、「Illustrator初心者のためのロゴ作成講座」と銘打ちましてどんな手順であのロゴができ上がったのかをチュートリアルにまとめてみました。 なんとも大上段に構えたタイトルですが、これからIllustratorを学ぶ方にはちょうどいい感じの内容になっておるかと存じますので大目に見てください;)そしてすんげーーーーー長いですがこちらもご勘弁ください。 新規書類を作成 では早速Illustratorを開いて、新規書類を作成し
11月は好きなブログを告白する月なのですね[2012]
あちき…おまはんの事…好きやねん… ホームページを作る人のネタ帳さんが始められた事で、いろんなブロガーさんが更新されている「11月は好きなブログを告白する月」と言うお題の記事。 で、Last Day. jpの@Sayobs さんと、gori.meの@planetofgori さんが私のブログをあげてくださったじゃありませんか。とっても果てしました。 [2012年版]僕が好きなブログ4つ 11月と言えば自分の好きなブログを告白する月 | Last Day. jp 僕の好きな5つのブログはこれだ！11月と言えば自分の好きなブログを告白する月らしいので！ | gori.me と、いう事で私も最近好きなブログをいくつか挙げたいと思います:)
![11月は好きなブログを告白する月なのですね[2012]](https://cdn-ak-scissors.b.st-hatena.com/image/square/bd6c143fba28b4465a64c977c71302fd03126232/height=288;version=1;width=512/https%3A%2F%2Fozpa-h4.com%2Fwp-content%2Fuploads%2FslooProImg_201211192006511.jpg)
「htmlすら知らなかった私が2週間でWordPressの新テーマを作成するまでにやったこと」と参考にした記事まとめ
どうも、@OZPA です。 先月、当ブログのテーマをWordPressにて自作した私。 しかしながら、実はそれまでWordPressの知識どころかhtmlすらろくすっぽきちんと理解していない人間だったのです。 今回はそんな私がWordpressのテーマを一から自作するまでにやったことを備忘録がわりに纏め上げておこうかと思います。 ひとりじゃ出来なかった 今回、テーマを作り始めたのが2011年の12月29日、そしてテーマが完成したのが年が開けて1月の12日。 だいたい2週間弱で自作テーマ発表まで漕ぎ着けたわけなんですが、そこにはそうそうたる方々によります手助けがありました。 そんな方々に敬意を払いつつ、テーマ自作までにやったことと手順を備忘録として残しておこうかと。 WordPressのテーマ作成の手順 さて、WordPressのテーマを作成するためには、 0.WordPressをローカルに
Youtubeなどの動画コンテンツをスマートフォンの横幅に合わせてくれるjQuery「FitVids.js」の搭載手順
YouTube cafe / marioanima WPtouchを搭載したブログによく見られるのですが、自分のブログでもYouTubeなどのビデオを掲載した記事をスマートフォンなどで閲覧した際、横幅が画面からはみ出してしまい気持ち悪かったので、動画コンテンツを自動的にスマホの横幅に合わせてくれるjQuery「FitVids.js」を導入してみました。 参考にさせて頂いたのは@mk_mizuho さんのブログあかめ女子のwebメモさんの以下の記事。 [Å] YouTubeやVimeoなど固定サイズになった外部の動画をレスポンシブに対応させる方法 | あかめ女子のWebメモ まずはdavatron5000/FitVids.js · GitHubへ訪れまして 上の手順で「jquery.fitvids.js」をDLしましょう。 DLしたファイルを解凍、「jquery.fitvids.js」をサー
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
CSSをSass（Scss）に変換してくれるサイト「css2sass」
デザイナーの私が色選択に迷った時に使用している配色ツール・カラーチャートなどのまとめ
