疲れやすい、呼吸の浅さを改善。ストレッチポールは毎日使いたいほど気持ちがいい!【今日のライフハックツール】
Chrome CanaryDevToolsも進化してるのでStableではなくCanaryを Local ProxyPCのみならDevToolsだけでもいいけど、スマホのWebView内解析とか考えるとLocal Proxyは必須 Windowsなら Fiddler (無料) Macなら Charles (有料) Macでお金払うのが嫌な場合 CocProxy for nginx (無料。CUI。Ruby版使うくらいならこちらを) JS製が良くてソース読みたいなら Klepto (無料。GUI。不安定) ソースの文字コード変更ChromeでJS、CSS開くと日本語が化けるので、初期文字コードをUTF-8に変更 (フォント設定( chrome://settings/fonts )の一番下を「Unicode (UTF-8)」に) “This Frame” Context Menuiframeの
参考資料がすべて英語なので、日本語で情報がまとまってる場所が欲しいと思いこの記事を作りました。「俺もっと便利な機能知ってるぜ!」「こういうことできないの?」って思った人はコメント/編集リクエストをくれると僕の幸せのステージがどんどん上がります。 DevToolsの起動するショートカットキーは? 開くだけ F12, Ctrl + Shift + I (Win, Linux) Opt + Cmd + I (Mac) 要素の検証(Inspect Element)と同じ状態で開く Ctrl + Shift + C (Win, Linux) Shift + Cmd + C (Mac) Consoleタブが開いた状態で開く Ctrl + Shift + J (Win, Linux) Opt + Cmd + J (Mac) DevToolsって下じゃなくて右に持ってこれないの? Dock To Righ
今回はChromeExtensionを5つのご紹介。正確には以前に1個紹介しているので4つかな。 たった4つかというのもありますが、あんまり拡張するのが好きではないのもあり、入れてもすぐ消す癖があって、本当に便利なもの、もしくはよく使うものしか基本的に追加してません。ただこれ、「職業ブロガー」っていうところに恐らく焦点が合わさっていますので、さきにご了承願います! 以前書いた記事でもそうなんですけど、かなり消してますね・・・ 私が厳選して愛用するGoogleChromeエクステンション12個+消した奴36個 是非まだ入れてないって人は使ってみてください。 使えば使うほど味が出る超便利エクステンション とりあえず今回紹介する4つはこちら。 他のやつはド定番なので紹介の必要が無いかと判断したりなんだりです。 1)ato-ichinen ダウンロード とりあえず「1」と書かれたアイコン。押してお
Chromeにサイドバーを追加してブックマークを表示 Bookmarks Side Panelとは、Google Chromeのブックマークを、サイドバーにツリー表示できる拡張機能です。 Bookmarks Side Panel Chrome: https://chrome.google.com/webstore/detail/bookmarks-side-panel/ankkfflbgjokclfgfehiinnlijdlicdb 「Chromeでもブックマークをサイドバーに表示したい」という方にお勧めなのが、Bookmarks Side Panel Chrome拡張です。 Bookmarks Side Panelでは、ツールバーアイコンのクリックや「Ctrl+B」キーで、ブックマークをサイドバーにツリー表示します。 また、サイドバーには、便利なブックマーク検索機能も付いています。 Bo
2013-08-31 久しぶりにChromeを掃除して生き残った18の拡張機能【おすすめ】 まとめ はじめに あなたはChrome使っていますか? 僕はいつもネットサーフィンではChromeを使っています。長い間使ってきたものですから、拡張機能がどんどん増えてきました。「そろそろ整理しなきゃあ」と思っていたのですが、ついに今日の朝、暇を見つけて整理してみました。まあいつでも暇なんですけどね。 そうして大量のChromeの拡張機能を削除しました。とてもスッキリ。本当は全て削除したかったのですが、できませんでした。18個もの拡張機能が残ってしまいました。なぜならこれらは無くてはならなかったからです。 そして僕は思いました。「昨日Chromeインストールしてみたんだ!」って人と出会ったならば、これらの拡張機能をおすすめしたいと。是非ともこれらの拡張機能を使ってほしいと。 18のChrome拡張
最近は、CドライブにSSDを使っていて、保存領域が少ないネットブックが多い。ファイルをダウンロードする機会が多いと、すぐに容量が一杯になってしまう。容量無制限のオンラインストレージ「Bitcase」に直接ファイルをダウンロードできる拡張「Bitcasa Everywhere」を使うのがオススメ。 「Bitcasa Everywhere」は、容量無制限で話題となったオンラインストレージサービス「Bitcase」をChromeから利用できる拡張だ。このツールの特徴は、ブラウザでのファイルをダウンロード先を、ローカルのドライブではなく、オンラインストレージ上に設定できるところにある。パソコンを経由せずに、直接サーバからBitcaseへとファイルを転送するため、容量は一切気にする必要がないし、パソコンにファイルの痕跡も残らない。 パソコンのCドライブの容量が少ない場合や、ファイルをダウンロードした
※今回はFirefoxユーザーへの記事です。 本当にね、Firefoxが好きでず~っと使ってた。 でもね、もう限界です。 WordPressで画像をUPすれば固まる。 1PassWordのパスワードは読み込まない。 それがもう最近は頻繁。 もういいっ!Chromeへ移行してやる とはいうモノの、今まで何度もChromeは挫折。 何よりも「ブックマーク」が無いのが違和感、使いにくい。 でも、最近はFirefoxでもブックマーク代わりは専ら「Speed Dial」。 そして、いつの間にか(僕が知らんかっただけだけど)Chromeに「Speed Dial2」が・・・! イケる。。これならいける。 前のChromeのSpeedDialはFirefoxのに比べて残念な子だったけど、 Speed Dial2は出来る! ていうか、Firefoxのより出来る。。 そして、その他のFIrefoxで欠かせない
FINDJOB! 終了のお知らせ 2023年9月29日にFINDJOB!を終了いたしました。 これまでFINDJOB!をご利用いただいた企業様、求職者様、様々なご関係者様。 大変長らくFINDJOB!をご愛顧いただき、誠にありがとうございました。 IT/Web系の仕事や求人がまだ広く普及していない頃にFind Job!をリリースしてから 約26年間、多くの方々に支えていただき、運営を続けてまいりました。 転職成功のお声、採用成功のお声など、嬉しい言葉もたくさんいただきました。 またFINDJOB!経由で入社された方が人事担当になり、 FINDJOB!を通じて、新たな人材に出会うことができたなど、 たくさんのご縁をつくることができたのではないかと思っております。 2023年9月29日をもって、FINDJOB!はその歴史の幕を下ろすこととなりましたが、 今後も、IT/Web業界やクリエイティブ
すりゴマです。 今日もいい感じにすり潰していきますね。 すりゴマは、Amazonで買い物することが凄く多いです。 もちろん価格comでの価格チェックは欠かしませんよ。 それでも食品以外の通販は、ほぼ100%、Amazonと言っても過言ではありません。 なぜなら届くのが 「速い」 から! で、Amazonで買うと決まっているものの、価格も結構気にするんですよ。 Amazonは「送料込みの値段」で比較できるので、最安値を見るのも楽ちんですが。 (・∀・) ただ、知ってる方も多いと思いますが、Amazonの中でも価格って結構変動してるんですよ。。 しかも結構な幅で! そこで、クリスマス前の買い物シーズンということもありますので、今日は「Amazonでの最安値の推移グラフを自動で表示してくれる」、素晴らしいChromeExtension(拡張)をご紹介します! その名も「Amazon Price
カップル専用アプリPairyでおなじみ株式会社TIMERSのCTOの椎名アマドです。 先日うちの社員と話してて自分が普段使ってるChrome拡張機能をしれっと紹介したら、 「生産性が上がる」とだいぶ好評価でした。 なので今回は、モバイルアプリやスマートフォンWeb開発などに役立ってる、Chromeの拡張機能を紹介します。 使う使わないでかなり生産性が変わってくるものもあるので、是非活用してみてください。 API開発に最適 JSONView オススメ度:★★★★★ JSONで来たレスポンスを、綺麗に最適化して表示してくれます。 わかりやすく色分けハイライトされてたり、配列を畳むことが出来たりと、 APIを絡めた開発では必需品です。 Postman - REST Client オススメ度:★★★★★ REST リクエストをその場で作成して送信できるクライアントツールです。 GET/POST/D
PixelGuide これなに PhotoShopでガイドを引くのと同じ感じでブラウザでガイドを引くChrome拡張です。 ほとんどの機能はRulersGuides.jsというライブラリを使って実現しています。 使い方 ここからPixelGuideをChromeにインストールします。 アイコンをクリックするとパネルとルーラーが表示されます。 ルーラーの上にカーソルを乗っけて、そこからクリックしてドラッグするとガイドが引けます。 簡単。 パネル アイコンをクリックすると開くパネル。 機能を上から。 各種要素の表示/非表示切り替え All: 全ての表示/非表示の切り替え (ガイドが表示されているときは下の要素に触れないので触りたいときは非表示にします) Guide: ガイドの表示/非表示の切り替え Ruler: ルーラーの表示/非表示の切り替え Info: 各グリッドの大きさなどの情報の表示/
今日は業務でよく使う、Webデザイナー・コーダーさんならあると地味に便利なGoogleChrome機能拡張をまとめてみました。私にとって、どのエクステンションも無いと「ちょっと困る」ものたちばかりです。 Image Properties Context Menu まずはImage Properties Context Menu。 画像を右クリックすると、パスやサイズ、altテキスト、ファイルサイズ等を別ウインドウで表示してくれます。 参考:[Google Chrome]右クリックで画像のプロパティを簡単に確認できるエクステンション「Image Properties Context Menu」 MeasureIt! 続いてはMeasureIt。 ブラウザ上に「ものさし」を表示してくれるエクステンション。ささっと画像サイズを調べたり、カラムの幅を測ったりするのに使用しています。 Show Ti
タブのタイトルとURLをクリップボードにコピー TabInfoCopyとは、Google Chromeで開いているタブのタイトルとURLをクリップボードにコピーする拡張機能です。 TabInfoCopy Chromeウェブストア: https://chrome.google.com/webstore/detail/tabinfocopy/micdllihgoppmejpecmkilggmaagfdmb タブのタイトルとURLをブックマークではなく、メモ帳などに保存しておきたいときに便利なのが、TabInfoCopy Chrome拡張です。 アイコンをクリックするだけで、クリップボードにタブのタイトルとURLをコピーします。 また、シングルクリックとダブルクリックでコピーするタブの範囲を変更することもできます。 TabInfoCopy Chrome拡張をインストールすると、アドレスバー右側に
「Animated Gif Capture」というアニメーションGifを作るChrome拡張を公開しました。 Chromeに表示中のWebページをアニメーションGifに変換します。また、オプションページから設定を変更すると、デスクトップやChrome以外のウィンドウもアニメーションGifにすることが出来ます。 Chrome Web Storeに登録してあるので、ここからインストールできます。 Chrome Web Store - Animated Gif Capture - アニメーションGifキャプチャ キャプチャ例 Flashもキャプチャできます。 ※http://demouth.net/sketch/016/ 以前私がAS3で作ったやつ FlashのキャプチャできるのでVimeoでもYouTubeもいけます。 フレームレートを高めると滑らかなアニメーションGifになります。 ※これは
ウェイトが軽いフォントを使うと、デザインに明瞭で美しく洗練された印象を与えることができます。しかし使い方を間違えると、読みにくいだけでユーザーが内容を理解することができなくなってしまいます。 軽いウェイトのフォントを効果的に使う方法、気をつけたい注意点をUX Movementから紹介します。 Do's and Don'ts of Using Light Typefaces 下記はUX MovementのAnthonyの記事を意訳したものです。 ※当ブログでの翻訳記事は、元サイト様に許可を得て翻訳しています。海外のブロガーから無断翻訳、まとめ記事の無断転載・少しだけ加えて盗用の声を聞くのでご注意ください。 見出しとボディテキストでの効果的な使い方 見出しのデザインを派手すぎないようにする方法 デザインにより洗練された印象を与える方法 軽いフォントは見た目だけではありません 小さいテキストに軽
皆さんはお気に入りデザインの管理をどうやっていますか? はじめまして! 14新卒デザイナーとして面白法人カヤックに入社しました、トダエミです。 ソーシャルゲームチームでデザイン修行しながら、写真撮ったり絵を描いたりしています。 今回は、新卒デザイナーにとって関門の一つデザインの引き出しを増やせ! を攻略するための方法として、 デザインスクラップツールの紹介をします! 1.デスクトップ系ツール バナーもボタンもキャプチャも、これ一つ!「Spark Box」 >> http://www.icyblaze.com/sparkbox/ (対応:mac) UIやバナーなど単体のものをストックするのに大活躍! 私はソーシャルゲームのバナーをストックするのに使っています。 サイトに使われている画像が一覧で表示され、一つずつまたはすべてライブラリに読み込めます。 魅力的なのはソート機能! なんと自動でカラ
Webサイトを効率良く作成する時に便利なテンプレート。最近ではHTML5/CSS3のテンプレートが多く公開され、無料で使用出来るのにレスポンシブだったりデザインのクオリティも高いものが多いです。今回はそんな無料で使えて勉強にもなるHTML5/CSS3のテンプレートを50個集めてみました。 ※基本的に無料でダウンロード出来るテンプレートばかりですが、規約は各テンプレートによって違います。使用する際は規約に注意してください。 1. Minima Demo / Download 2. Aerial(Responsive) Demo / Download 3. Beautiful and Clean Demo / Download 4. Brushed(Responsive) Demo / Download 5. Woo(Responsive) Demo / Download 6. Type &
違う人たちとデザインを語る デザイン批評は、とても難しいですが、目を背けることもできない課題です。前回のセミナーで、批評のときに使う言葉遣いを紹介したものの、フォーカスをズラさず会話を進めるのは至難の業です。デザイナーだけが集まる場や、長く仕事をしている間柄であれば感覚で伝わることがありますが、そうでない場面はたくさんあります。結局のところ、デザインは主観的なところが多いわけですから、様々な背景の人たちが集まる仕事場でデザインの意見が分かれるのは当然なのかもしれません。 さらに批評を複雑にしているのが、手を動かしているデザイナーだけにデザインを任せるのは困難というところがあります。IDEOの Time Brown 氏が TED の講演で「デザインはデザイナーだけに任せるには重要すぎる」という言葉を残しています。今のデザインは利用者だけでなく、ビジネス、市場、文化、技術への理解が不可欠です。
2024年4月1日より、Supership株式会社は親会社であるSupershipホールディングス株式会社に吸収合併されました。 合併に伴い、存続会社であるSupershipホールディングスは社名をSupershipに変更し、新たな経営体制を発足しました。本件に関する詳細は、プレスリリースをご確認ください。 2024年4月1日より、Supership株式会社は親会社であるSupershipホールディングス株式会社に吸収合併されました。 合併に伴い、存続会社であるSupershipホールディングスは社名をSupershipに変更し、新たな経営体制を発足しました。 本件に関する詳細は、プレスリリースをご確認ください。
jQueryなどスクリプトは一切使わずに、HTML5+CSSで動画をウェブページの背景いっぱいに表示する方法を紹介します。 フルサイズのデモ IE8などHTML5のvideo要素に対応していないブラウザでは、代替の背景画像が表示されます。 実装は、非常にシンプルです。 HTML 動画はbody内の一番下にvideo要素で配置し、その上には通常通りコンテンツを配置できます。 <body> ... コンテンツ ... <!-- 背景に設置する動画 --> <video autoplay loop poster="http://mattgrossdesign.com/raw-media/first-frame-screencap" id="video-background" muted> <source src="http://mattgrossdesign.com/raw-media/wood
ブログやSNSの投稿に写真や画像を使うことがありますが、著作者に無断で写真やイラストを使用することで著作権の侵害にあたることも。そこでSNS予約投稿サービス「Buffer」が、無料でブログやSNS投稿に使えるCC(クリエイティブ・コモンズ・ライセンス)&パブリックドメインのストックフォトサイトや検索ツールなどを大量にまとめています。 53+ Free Image Sources For Your Blog and Social Media Posts http://blog.bufferapp.com/free-image-sources-list ◆写真検索サイト 01:More Free Images & Free Stock Photos | Download Free Stock Photography from Dreamstime 無料アカウントの作成が必要ですが、無料でダウン
こんにちは、WEBマーケッターの荒木です。 WEBデザインという仕事は面白くもあり、難しくもあります。 難しいからこそ、やりがいのある仕事とと言えます。 今回は、そのWEBデザインという仕事のなかで、意識しておくべき5つのコトを紹介します。 (1)WEBデザインは積み上げていくもの WEBデザインは積み上げていくものです。 新しい案件だからといって、またゼロから新しいものを生み出す必要はありません。 WEBデザインはアートではありませんので、 ユーザーはデザインに対して常に新しいものを求めているわけではないのです。 これまで培った経験やノウハウを存分に生かしきったデザインのほうがよりクオリティが高く、ユーザーにとって使いやすいものになります。 勘違いしてはならないのは、すべてを同じテンプレートに当てはめれば良いということではありません。 案件ごとにターゲットやサイトのコンセプトが異なるわけ
汎用性が高いUIアイコンなどと比べると使う場面は少ないものの、いざ使いたいときに便利そうなものやあまり見かけないタイプだと個人的に思ったアイコンセットのまとめで、過去に紹介してきたものをひとまとめにしました。 既に公開・配布終了しているものも一部あるのですが、ファイルダウンロード自体はできなくともデザイン的にはそのまま参考になることもあるので、そういったものはキャプチャが小さめではありますがリンク設定のみ解除する形で紹介します。 紹介しているアイコンを使用する際は、ライセンス等は各自で再度確認してください。 リンクが未設定で配布形式も記載されていないものは公開・配布終了しているものです。
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く