[JS]ボタンがパネルに、パネルがモーダルウインドウにアニメーションで変形する超軽量スクリプト -cta.js

最近のWebページで人気があるのは、ビジュアルの連続性。
パネルをクリックすると、それが拡大してモーダルウインドウになり、ボタンをクリックすると、それが変形してパネルになるなど、ユーザーのアクションをトリガーに要素が別の要素にアニメーションで表示される超軽量(1.2KB)スクリプトを紹介します。

サイトのキャプチャ

cta.js
cta.js -GitHub

続きを読む

ちょっと面白い太っ腹ライセンス、商用無料クレジット表記無しで利用できるフラットな色使いがかわいいアイコン素材 -Icons8

312種類のフラットにデザインされたかわいいカラーのアイコン素材を紹介します。

ライセンスはちょっと変わってて「Good Boy License」。
Good Boyの良い子だけが無料で利用できます。

素材のキャプチャ

300+ Free Flat Color Icons
Flat Color Icons -GitHub

続きを読む

この作りこみはスゴすぎ!!ガーリーにかわいくデザインされたテクスチャ素材 -Missesglass

細部まで徹底的に作りこまれた、かわいくてキレイにデザインされたコラージュのテクスチャ素材を紹介します。素材の利用にあたっては、個人のみ無料で利用できます。

作者の方は、2015年3月で制作作業の休止宣言をしました。いつか再開したら嬉しいですね。
※ダウンロードは、当面はこのまま続けるとのことです。

素材のキャプチャ

3 800x600 Textures 1401

素材のキャプチャ

3 800x600 Textures 2807

続きを読む

スマホ・タブレットのさまざまなデバイスの表示チェックに対応!レスポンシブの確認ができる無料オンラインツール -.resizr

iPhone 4, 5, 6, 6+をはじめ、Android各機種のスマホ、iPad, Surface, Kindleなどのタブレットのさまざまなスクリーンサイズをエミュレートし、それぞれのサイズでWebページがどのように表示されるかチェックができるオンラインツールを紹介します。

サイトのキャプチャ

.resizr

続きを読む

Googleウェブマスターツールの使い方やデータの見方・上位表示のための知識が身につく、今読んでおきたいオススメの良書

Googleウェブマスターツールの使い方やそれぞれのデータの見方をはじめ、検索の仕組み、Googleの新アルゴリズム、今必要とされているHTMLの効果的なマークアップ方法、スマホ対応、ユーザビリティやパフォーマンス改善など、ツールの使い方を通じて上位表示のための知識が身につくオススメの本を紹介します。

アナリティクスでは分からないGoogleBotの動きをウェブマスターツールで検証しましょう。

本のキャプチャ

続きを読む

Chromeのデベロッパーツールが見やすくなる!デベロッパーツールのUIをダーク系に変更する方法

ブラックの背景の方が作業が捗る!そんな人にオススメのChromeのデベロッパーツールのUIをダーク系にするテーマファイルとその変更方法を紹介します。

※リクエストを頂いたので、ダーク系以外のテーマも追加しました。

Chromeのデベロッパーツールをカスタマイズ

テーマを適用するとこんな感じに

続きを読む

[CSS]ページのレイアウトで、意図せずできてしまった隙間の原因とその解決方法のまとめ

Webページを作成している時に、意図しないのにできてしまう隙間の原因とその解決方法を紹介します。

サイトのキャプチャ

Mind The Gap: Six Causes of Unwanted Spaces In Page Layouts

続きを読む

この手描き素材カワイイ!花・葉・羽・リボンなどが丁寧にかわいく描かれたベクター素材

Webページやブログに、そして招待状、ハンドクラフトのアイテム、ロゴのデザイン、ブランディングのエレメントにも使える、花、葉、羽、花輪、花冠、月桂冠、リボンなど、完全手描きのベクター素材を紹介します。

通常は有料ですが今週末まで無料なので、ダウンロードはお早めに!

素材のキャプチャ

66 Hand sketched elements for design

続きを読む

 1 2 3 4 5 ... 612 613 Next

top of page

©2015 coliss