1つのDIV要素で作られたブラウザのロゴ 「Browsers」
safari、firefox、Chrome、IEの各ブラウザのロゴがひとつのHTML要素 DIV一つで作られています
Google Adsense はIE8以下を切り捨てたのか？ IE8で広告がうまく表示できない現象
IE7でうまく広告が表示されない時があります 以下のように この現象はIE8 以下で起きます とても小さく表示されてしまいます こういった状況が起きる原因は、レスポンシブサイズの広告ユニットを利用していると […]
アート・デザインのコミュニティー「dribbble」で良質なデザインから学ぶ
dribbbleをご存知でしょうか？ dribbbleにフォーカスを当てて紹介するのは初めて無いんですが 他の記事で何回か登場しています dribbbleとはなにか？ dribbbleは選ばれたデザイナーだ […]
Facebookでの詳細な共有状況を知る
Shared Count http://lab.neerajkumar.name/sharedcount/ Share Count を使うと Facebook、Twitter、Pinterest、Linke […]
目隠しされたなめらかな・スムーズに現れるナビゲーションメニュー 「Menu」
右上の三本線 burger を押すと、メニューが上から現れます 出現するときに滑らかなアニメーションで出てくるのが良い
CSSでrotateしたグラデーションにジャギーが出来るのを改善する方法 「Fixing a bad render in Webkit」
CSSで背景をグラデーションにしたものを rotateで傾けた場合に現れるギザギザに表示されるのを解決する方法です
恐ろしいほど正確？ ライバルサイトのアクセス解析をチェック出来る「similarweb」 の使い方
人っていうのは他人のことが気になってしまうのですが WEBサイトもライバルサイトが気になります そこで、ライバルサイトのアクセス数等の状況を推測した情報を観ることが出来るWEBサービスがあります simil […]
javascriptをgzipにしてサイズダウンして 転送量を削減する方法
HTMLに限らず、CSS、javascriptもGzipにすることで容量をかなり抑えることが出来ます 回線が細いモバイル等には、圧縮出来るものは圧縮して提供するのが理想かなと思うので、今回はjavascriptをgzip […]
.jpg.png.gif.pdf等々をHTML5でダウンロードさせる方法 [PHPもJavascriptも不要]
ブラウザで開くことが出来るファイルはリンクにするとダウンロードではなくて、ページとしてファイルが開かれてしまいます 通常 画像等を通常のリンクとしてダウンロードさせることが出来ず別ページに送ってPHPで処理をさせるとう形 […]
マウスポインターに合わせて反応する かわいいHTMLモンスター 「Smiley guy」
Smiley guy By Eli Fitch マウスポインターに合わせて目線が動くかわいい男の子を表現したものです クッキーモンスターっぽいので、HTMLモンスターって勝手に名づけました GIFアニメ & […]
HTML要素一つでつくられた ブリーフパンツ 「Underpants – One Element」
ブリーフを一つのHTMLエレメントにCSSで装飾することでブリーフを作ちゃってます 二つ目の方は、2要素で作成されています
無料のフォトショップのパターンとブラシ、テクスチャがダウンロード出来るサイト 「Brusheezy!」
Brusheezy! http://www.brusheezy.com/ Brusheezy! では Photoshop のパターン、ブラシ、テクスチャが無料でダウンロード出来ます ダウンロード出来るファイルにはそれぞれ […]
UbuntuにGoogle Chromeをダウンロードしてインストールする方法
以前こちらでもUbuntuにChromeの代用のChromiumのインストールの方法を紹介いたしましたが あとでChromeもUbuntuで使えるということなので、今回はChromeのインストールする手順を紹介致します […]
画像をアップロードするだけでWebデザインのモックアップが作れるサービス 「MockUPhone」
レスポンシブデザインになると、スマホ、タブレット、PCでの表示のモックアップを作る機会が多いともうのですが こちらのサイトをつかうと、画像をアップロードするだけで 各デバイスに画像を嵌めこんで、表示してくれます そしてそ […]
完成度の高いダウンロードリンクボタンのデザイン 「3D Download Button w/ Meter Progress」
アイコン、3Dの回転、ダウンロード中とCSSアニメーションをうまく使ったダウンロードボタンのデザインです 完成度の高いボタンになっています
フォントを重ねて比較して表示する
2つのフォントを重ねて、見比べることが出来るデモです またベースラインとレタースペース(文字間隔)の調整も見れます
「ツイート・いいね」をしないとダウンロードリンクが現れないようにするWordPressのプラグイン 「wpLike2Get」
WordPressでファイルの公開等を行っている方はこれは便利なツールですので利用の検討有りですよ！ 最近流行りつつある 「支払いはツイートで！」ってやつです 無料で配布しているのだから、SNSで拡散ぐらいしてくださいよ […]
WordPress 3.9 beta2 日本語版で 進化したビジュアルエディタの画像挿入を試してみる
WordPress 3.9 beta2 の日本語版がでましたので 一番興味のある ビジュアルでの画像のドラッグアンドドロップ操作を試してみました これが出来るようになるだけで、かなり楽になります 特に画像をよく挿入する人 […]
imgタグにリンクを指定するだけで簡単に使えるダミー画像のサービス 「lorempixel」
lorempixel http://lorempixel.com/ ダミー画像をWEBサイトで利用出来るサービスです、画像を準備するのが大変なとき 例えば、HTMLファイル等で二次配布出来る画像が無いときにこれを使えば画 […]
ビールのシュワシュワを表現した CSSアニメーション 「Beer」
ビールのあの、シュワシュワ感を表現させてCSSのみで作られたアニメーションです HTMLとCSSはメタ言語で書かれているので、一見短めのコードになっていますが
