便利なツール、WEBサイトまとめ

html5リファレンス ：ホームページ制作についての早見表。HTML5はここ。

CSS Validation Service ：CSS3検証サービス。CSSの正当性を確認するために。

Another HTML-lint ：HTMLの検証サービス。エラーや警告がありわかりやすい。

SHRTHND ：そのまま、ショートハンド可能部位を変換してくれる。

Web Code Tools ：ツイッター埋め込みなど便利なツールが揃っている。

Google Fonts + Japanese：無料で使えるWEBフォント。数は少ないが無料で使える日本語フォントがある。

Canva：無料デザインツール。

こぴぺっと：コピペで使えるCSS

See-SS：様々なデザインを一覧で

WEBパーツ屋：シンプルなデザインを検索で

アンテナサイト等

ランディングページ集めました。：LP作成のアイデア・トレンド学習に

coliss：UIやデザインに悩んだら

PHOTOSHOPVIP：デザインに悩んだら

ツール

Brackets：オープンソーステキストエディタ

Beautify：コード自動整形

colorHints：一度指定した色を、コードヒントとして視覚的に表示

Emmet：コーディング高速化

indent guides：インデントを視覚化、可読性向上

全角空白・スペース・タブ表示：可読性向上

Chrome機能拡張

ResponsiveViewer

素材等

スニペットを利用する際に。

CodePenのライセンスについて。パブリックPenはMITライセンスです。

MITライセンスでは、商用利用だけではなく、コピーの使用、複製、変更、統合、公開、配布、サブライセンス複製物を販売することが認められています。

ただし公開時には著作権表示とライセンス表示をする必要があるので注意しましょう。

著作権の表示は、ソースコード上の重要な部分に、著作権およびライセンス表示をすれば、サイト上で公開する義務はありません。

例

Copyright Jed Trow

Released under the MIT license

http://opensource.org/licenses/mit-license.php

jQueryプラグイン

bxSlider：レスポンシブ対応スライダー

LIGHTBOX：ギャラリーボックス

aタグをクリックできる範囲

aタグはインライン要素なので、中身のテキストの部分しか大きさを持ちません。

aタグをブロック要素にすると、大きさが親要素いっぱいにひろがるので全体をクリックできるようになります。