Resource - シンプル

Webデザイナー向けのリソースを目的別にまとめている・「Freestack」

Freestack FreestackはWebデザイナー向けのリソースキュレーションサイトです。無料のものを中心に収集しているようです。カラーツールやブラウザの拡張機能、モックアップやストックフォト、タイポグラフィ関連などなど。ざっと...

WCAG 2.0やSection508を基準に任意のWebサイトのアクセシビリティチェックをしてくれる・「Tenon.io」

Tenon.io Tenon.ioはWCAG 2.0やsection508.gov(参照:リハビリテーション法第508条)で設定されたアクセシビリティのガイドライン基準に準じてチェックしてくれるシンプルなツールです。WebサイトのUR...

画像をアップロードすると、その画像内で使われているフォント名を割り出してくれる・「Matcherator」

Matcherator Matcheratorは画像をアップロードすると、その画像内で使われているフォントの名前を割り出してくれるWebサービスです。既存サービスのWhatTheFontやWhatFontIsよりも、優れた性能だそうで...
Ads

Googleリッチスニペット対応の、WebページにオリジナルのLikeボタンを付けるスクリプト・「LikeBtn」

LikeBtn LikeBtnは任意のWebページにLike/Dislikeボタンを付けられるスクリプト。jQueryに依存します。上デモのように日本語にも対応しています。少し微妙ではありますが・・w  念の為、Facebook...

Webのフォームをチェック、評価してくれるフォーム最適化ツール・「FormLinter」

FormLinter FormLinterはWebフォームをチェック、評価してくれるフォーム最適化ツールです。URLを指定すると、そのページ内にあるフォームを調べて課題点や問題点があれば表示、AやA+、Bなどで評価してくれる、みたいな...

画像をアップロードする前にロード、プレビューするjQueryスクリプト・「LoadImg」

LoadImg See the Pen QGENKq by kachibito (@kachibito) on CodePen. LoadImgは画像をアップロードする前にプレビューするスクリプトです。jQueryに依存します。上デ...

ブラウザで動作するオープンソースのパスワードマネージャ・「LessPass」

LessPass LessPassはブラウザで動作するパスワードマネージャです。OSSとしてソースコードが公開されています。Webアプリケーションである為、外出先等でも様々なデバイスでも利用可能で、ブラウザの拡張機能も利用する事が出来...

管理画面内で記事やカテゴリなどのタクソノミー等をインクリメンタル検索するWordPressプラグイン・「Jarvis」

Jarvis JarvisはWordPressの管理画面内での全ての記事やカテゴリ、タグ等のタクソノミーや「外観」などの管理画面項目、コメント、プラグインなどなど管理画面内のコンテンツから横断検索してくれるプラグインです。検索はインク...

要素内やページ内でのスクロールに応じてプログレスバーを表示する軽量シンプルなスクリプト・「PrognRoll」

PrognRoll PrognRollはページやスクロールが可能なコンテナ内でのスクロールに応じてプログレスバーを表示するスクリプトです。ただそれだけのシンプルなもので、サイズも2kb以下、圧縮すれば1kb以下と軽量です・・が、jqu...

ミニマルスタイルでパワフルなMarkdownエディタ・「typora」

typora typoraはミニマルなスタイルながらパワフルな機能を持ったMarkdownエディタです。Mac、Windows、Linuxに対応。画像はD&D対応、数式も入力可能でテーマもカスタマイズ出来るようになっています。同じよう...

良質なランディングページを厳選してWebギャラリーにしている・「Landingfolio」

Landingfolio Landingfolioは良質なランディングページを厳選して収集、Webデザインギャラリーとして公開しているWebサイトです。用意されているカテゴリはモバイルアプリやツールサービス、EC、本やファッションとい...

任意のカラーパレットを保存、管理出来るシンプルなデスクトップアプリ・「ClickPalette」

ClickPalette ClickPaletteは任意のカラーパレットを管理できるシンプルなデスクトップアプリです。任意のカラーコードを登録、カラーパレットを作成して保存するだけのシンプルなものです。パレットは複数作成出来て、名前も...

CSSで作るベーシックなローダーのセット・「CSS loader」

CSS loader CSS loaderはCSSのみで作れるベーシックなローダーを簡単に設定できるスタイルシートです。画像でよく見かけるエレメントをCSSで作った、みたいなもの。他に、少し凝ったものもあります。ここ最近はCSSのみで...

各画像フォーマットをjpegにコンバートすると同時に軽量化もしてくれる・「Jpeg.io」

Jpeg.io Jpeg.ioはgifやpng、svg、psdなどのフォーマットのファイルをアップロードするだけでjpegに変換し、ついでに画像の軽量化(最適化)も行うWebサービスです。軽量化の際の劣化は自分の見た限りでは確認出来ま...

フォント名から利用している主要Webサイトをリストにし、他の利用フォントも教えてくれる・「Font Reach」

Font Reach Font Reachはフォント名で検索すると、そのフォントを実際に利用(設定)している主要なWebサイトのリストを表示してくれるWebサービスです。(例:ヒラギノ角ゴ proを使用しているWebサイト一覧)リスト...

レスポンシブなEメールの雛形をユーザー登録不要で手軽に作成、ダウンロード出来る・「Pulp」

Pulp PulpはオンラインでRWDなEメールのテンプレを作成、ダウンロード出来るWebサービスです。無料で作成、ダウンロード可能で、ユーザー登録も不要、クレジットもコメントアウトで入るだけと手軽で気軽に使えます。エレメントを追加す...

CSSのみで出来たシンプルで実用的なアイコン集・「CSS ICON」

CSS ICON CSS ICONはCSSのみで出来たアイコン集です。それぞれのアイコンは上図のようにコードが紹介されており、各部位がハイライトされるようになっていて仕組みをわかりやすくしてくれています。スマフォの普及やオールドブラウ...

オープンソースのシンプルなCSVエディタ・「Comma Chameleon」

Comma Chameleon Comma Chameleonはオープンソースのデスクトップ用CSVエディタです。electronで作られているようで、各プラットフォームで動作するようです。また、CSVlintが導入されていて、データ...

軽量で非依存型のパーティクルエンジン・「particles.js」

particles.js particles.jsは軽量で他ライブラリに依存しない非依存型のパーティクルエンジンです。簡易的なものですが圧縮版で2.5kbほどと軽量で依存せず単体で動作してくれるのと、設定が簡単で扱いやすい印象です...

CSSアニメーションの遅延をコントロールする為のシンプルなフレームワーク・「Shift.css」

Shift.css Shift.cssはCSSアニメーションの遅延で要素をコントロールするフレームワークです。上記サンプルのように要素にかかるアニメーションを遅延させてコンテンツの構築をサポートしよう、というもの。CSSとほんの少...

手軽にダミー画像を作成出来る軽量スクリプト・「placeholder.js」

placeholder.js placeholder.jsはクライアントサイドでダミー画像を生成する軽量スクリプトです。jquery等の他ライブラリへの依存もなく、2kb以下と軽量なのも良いですね。表示される画像はBase64ですが生...

任意のWebページのスクリーンキャストを撮って共有出来るChrome拡張・「Opentest」

Opentest Opentestは任意のWebページを自分の顔と一緒にスクリーンキャストを撮って共有出来るChromeエクステンションです。上図は試しに撮影したもの。カメラは起動させませんでしたがこのようにEmbedも可能です(無...
Ads