IE8/9/10から、Firefox, Chrome, Safari, Operaだけでなく、IE5/6/7, Netscape, iCabなどの懐かしいものまで、各種ブラウザの枠やフォームのエレメントなどのPSD素材を紹介します。
2011年の9月に「CSSとSVG filterでガラスっぽい効果をつける」というのを書きましたが、これはFirefoxのみを対象としたものでした。 そこで今回はできるだけ多くのブラウザに対応したものを作ってみます。 完成品Frosted glass effect with CSS & SVG 背景画像にはWetFoto.comによる#246 Wetlook with Beautiful Brunette in Leggings and Jacket. Girl in black jacket, white wetlook leggings and skirt in boots, get wet fully clothed in the sea.を使用しています(リンク先はFlickrです)。 この画像はCC BY-NC-SA 2.0でライセンスされています。 背景画像にはBeryl Ch
最新版の『Google Chrome 23』に搭載された新機能の紹介です。Chromeの設定でウェブ上のトラッキング(閲覧行動の追跡)を拒否できる機能が追加されました。自分の行動を解析されたりするのは嫌だという方には嬉しい機能ですね。 詳しい情報は以下からどうぞ。まずGoogle Chrome の「設定」ページへアクセスしましょう。その中に「プライバシー」という項目があります。 「閲覧トラフィックと一緒に「トラッキング拒否」リクエストを送信」にチェックをいれます。 「OK」を押すとトラッキング拒否設定完了です。 自分の行動を解析されたりするのは怖いという方はチェックを入れてトラッキング拒否しておきましょう! 最新のChromeから搭載された機能なので、古いバージョンをお持ちの方は、最新版へアップグレードして使いましょう。 (カメきち)
こんにちは、デザイナーの王です。 突然ですが、皆さんはどうやってWebページを組んでますか? 僕は、HTMLの骨組みをひと通り書き終え、それからChromeで直接CSSを書いていきます。個人的には、ChromeはCSSをリアルタイムでいじれるので便利です。 しかし、この手法で組むと、CSSを追加、編集するたびに、いちいちコピペを連発しなければならない。しかもその後ちゃんとコピペしきれているか別タブで確認して・・・。 これは、NO GOODです! 「編集したCSSをそのまま保存できたらなあ。」と誰もが思うことでしょう。ブラウザのセキュリティ上、そのような機能は永遠に提供されないと思われますが。 と、思ったのは誤算でした! なんと、Chromeが開発者向けに「Chrome DevTools Autosave」という名の拡張を出しているんです!これを使えば、編集したCSSがそのまま保存されます!
こんな拡張機能がGoogleオフィシャルで提供されていました。 Webページを高速化するためのポイントを、解析して提案してくれる「Page Speed Insights」という拡張です。 Webページを高速化させたいけど、どこをどうしたら・・・という人には、いいツールになりそうですねー。 Chrome ウェブストア – PageSpeed Insights (by Google) 導入するのに特別なことは一切必要ありません。Chromeウェブストアでインストールするだけです。 拡張機能のインストールが完了したら、Chromeの[表示]→[開発/管理]→[デベロッパー ツール]を立ちあげてみましょう。 すると、デベロッパーツールのタブの一番右端に「PageSpeed」というのが追加されます。 あとは分析ボタンをクリックしてやれば自動的にリロードされ、どの部分が表示スピードの妨げになっているの
仕事をもつ人間なら誰もが、「もっと時間があれば終わらせられるのに。時間さえあれば・・・!」と考えているはず。1日24時間という時間は、誰にでも平等に与えられる。ではなぜ、同じ時間内でたくさんのことを効率的にできる人と、そうでない人がいるのだろうか。単刀直入に言おう。生産性が高い人には、秘密があるのだ。 そこで今回は、米フォーブス誌が明かす「驚くほど生産性の高い人間になれる24の方法」を伝授しよう。中には少し極端に思えたり、そう簡単には実践できそうにないものもあるが、これらを実行してこそ高能率な人間になれるらしい。 1. 1時間早く起きる。 2. 日曜の夜に1週間の計画を立てる。 3. 「NO」と言う。無視する。自分が成し遂げようとしていることだけに集中する。 4. 家政婦を雇い、大事な時間を掃除などに費やすのをやめる。 5. 携帯電話のEメール機能をオフにする。 6. シンプルなTo Do
最近では、HTML5で作られたサービスも増えてきました。 特に、グラフィック関連のツールはHTML5で作られたものが多く、今までFlashやネイティブアプリでしか実現できなかった機能も、HTML5のCanvasを利用してうまく実現されています。 簡単な画像加工や写真編集であれば、わざわざPhotoShopを起動するよりもブラウザ上でサクっと編集した方が早いこともあります。 そこで、今回はHTML5で作られた驚異のフォトエディターを5つ厳選してご紹介したいと思います。 (元ネタのこちらの記事で紹介されていたものから抜粋しました。) HTML5でこんなこともできるのかー! というのが体感できると思います。 グラフィックツールとしても実際に使えると思うのでチェックしてみてください。 Aviary Aviary.com HTML5で最も人気のある写真編集アプリケーションです。 iPhone、iPa
Chrome ウェブストア - Pendule WEB開発者はインストール必須のChrome拡張「Pendule」。 昔からあるChrome拡張ですが知らない間に色々と便利になっているようだったのでご紹介。 4月からはたいている新入社員のWEBデベロッパーさんにもオススメ インストールすると以下のようなボタンが表示されますのでクリック。 まず、StyleSheetのタブではCSSを見れる、CSSがその場でリロードできたり、CSSをを無効にできます サイトで使われているカラーを16進数で出してくれる機能もあります CSSビュー。折畳み可能で使いやすく見やすい Formsタブ。パスワードを表示したり、hiddenなフィールドのアイテムを表示したりできちゃいます。恥ずかしい! Imagesのタブでは全部の画像を非表示にしたり、背景画像を非表示にしたり、altを全部表示したりといったことが可能 そ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く