コーディング作業を楽にするhtml・CSSをサポートツールまとめ

Can I use Can I use… Support tables for HTML5, CSS3, etc HTML5、CSS3のタグのブラウザサポートがチェックが出来る 実装をしていていままで使ったこ…

Can I use

Can I use… Support tables for HTML5, CSS3, etc

HTML5、CSS3のタグのブラウザサポートがチェックが出来る

実装をしていていままで使ったことのないCSSプロパティを使用しなければならない場合、ブラウザに対応しているか否か確認する必要が出てきます。

その時に便利なのが「Can I use」でページのサーチボックスに調べたいプロパティを入力するだけで対応・未対応が確認できちゃいます。

また、Googleアナリティクスと連結させることで解析対象サイトにアクセスしたユーザーがどのくらいCSSプロパティに対応したブラウザを使用しているのかが分かります。

この機能ってクライアントにブラウザの対象にするかどうか検討する際にとても役にたちますよね。

Font-familyメーカー

Font-familyメーカー:標準フォント一覧からサクッと指定

フォントの形を見てからfont-familyを作れる

サイトを新規構築する時、CSSでフォントファミリーを作る時にあらかじめフォントの形(デザイン)を見ることができるので重宝しています。

font-familyのタグ記述もフォントの種類を視覚的でドラッグ&ドロップ操作するだけで作成できるところは良い点だと思います。

あと、Facebook、Twitter、BuzzFeedで使われているfont-familyやおすすめのfont-familyがセットされていて参考になります。

Excel to Table

Excel to Table | Excel表からHTMLテーブルへ一発変換 | すぐに使える便利なWEBツール | Tech-Unlimited

Excelの表からテーブルタグに変換させる

Excelの表をHTMLのテーブルタグに変換させるWebサービスは結構あるが、
「見出し行や見出し列」の有無の設定のみのシンプルな機能はこれだけです。

余計な追加機能がないため、忙しい作業の時、初見でもすぐに使用できるところが素敵です。
サイトをパッと開いてすぐに変換できる!これ最高。

ULタグOLタグLIタグ挿入ツール

ULタグOLタグLIタグ挿入ツール|ちょっと便利なツール・ジェネレーター置き場

箇条書きテキストをリストタグに変換させる

これもシンプルな機能でサイトをパッと開いてすぐに変換できる!これ最高。

翻訳サイトの原稿を流し込みをする時に使ったらめっちゃ快適で作業を進めることができた。
流し込み作業の前半は、手作業でリストタグを入力していたのでこのツールを作業途中から知って始めからしっとけばと後悔してしまった。

痒い所に手が届く的でニッチなツールです。

ダミーテキストジェネレータ

ダミーテキストジェネレータ | Web制作小物ツール – dounokouno.com

文字数が指定できるダミーテキスト生成ツール

ダミーテキスト生成のツールもネットでは有り難いことに複数あります。
しかし「ダミーテキストジェネレータ」は文字数が指定できるので、レスポンシブデザインで実装する際に最低限一行○文字は入れたいという要望に対応できるので嬉しいツールです。

機能が絞られていて直感的に使いやすいです。

都道府県selectメニューコードジェネレータ

都道府県selectメニューコードジェネレータ | Web制作小物ツール – dounokouno.com

使い回せる都道府県selectのソース

応募フォームの実装の際に何度も助けられたやつ。
都道府県selectタグが入ったソースを直書きしていたら結構時間が取られてしまうので、こういうアーカイブ化されたツールは嬉しい。

htmlに貼り付ける前に「検証」ボタンを押下することで事前にセレクトメニューが形・動き共に確認できる。

コーダーなら絶対一度は都道府県セレクトメニューの実装に当たると思いますのでブックマークしておくと良いかと。

まとめ.ツールの製作者に感謝

これらのツールは実装時に毎回使うものではありませんが、必要な場面でかなりの時間短縮が望めるものばかりです。

紹介しているツールは初見でサイトを開いて直感的に使えるので、使い方を読む時間も不要です。すべてブックマークしておくといざ必要になった場合、めっちゃ恩恵を受けると思います。

それもツールを製作してくれているエンジニアの方たちが居てこそなので感謝をしたい。これらのツールがよりコーダーの方に認知されたらいいなと思い記事にさせてもらいました。

まだまだ知らないツールがあると思うので、常に調べていきたいと思いました。

シェアボタン

おすすめ記事

関連記事