今回は、コーディングする際に便利だと思うWEBサービス一覧を紹介します。
まだ暫定なので、これから良いWEBサービスを見つけたら追加していこうと思います。
実装者の人は参考になると思うので、是非参考にしてみてください。
コーディングする際に便利なWEBサービス一覧
①Font-familyメーカー
Font-familyメーカーは、WEBサイトで指定する際のフォントの種類を検索したり、font-familyコードを生成することができるサイトです。
フォントの並び順も自分好みに設定することが出来るので、かなり便利です。
あと、MacやWindowsでそれぞれ対応しているフォントも簡単に知ることが出来るので、ブラウザを意識してフォントを指定することも出来ますよ。
② HTML5 入れ子チートシート
HTML5 入れ子チートシートは、HTMLの親要素と子要素のそれぞれの入れ子をチェックすることができるサイトです。
もしあなたが使おうとしているタグの入れ子が分からない場合は、是非こちらのサイトを活用してみてください。
③ Can I use?
Can I use?は、HTMLやCSSのタグやプロパティがどのブラウザに対応しているのか一覧で確認することが出来るサイトです。
特に新しいタグやプロパティの場合はメジャーブラウザに対応されていないことが多いので、その時によくチェックするようにしています。
④ OGP確認
OGP確認は、WEBサイトのSNSシェア時の見え方を確認することが出来るサイトです。
端末はパソコン/スマホ、SNSはFacebook/Twitter/はてなブックマーク/LINEで表示確認をすることが出来ます。
WEBサイトを納品する前に最後OGPタグの表示を確認する際に使われます。
⑤ CSS三角形作成ツール
CSS三角形作成ツールは、名前の通りCSSで三角形を作成する際の数値やコードを取得することが出来るサイトです。
数値をいじるだけで簡単に三角形のコードを取得することが出来るので、三角形をCSSで作成する際によく使用します。
⑥ 一括pxからvw計算機
一括pxからvw計算機は、pxの値をvwへと簡単に変換してくれるサイトです。
相対的なレイアウトを組む際にvwを使用するので、その時によく使います。
⑦ カラーコード変換ツール
カラーコード変換ツールは、カラーコードやRGBの色の値を変換出来るサイトです。
色の値を変換したい際にかなり重宝しています。
⑧ Text Shadow ジェネレーター
Text Shadow ジェネレーターは、テキストに影をつけることが出来るtext-Shadowを自動生成することが出来るサイトです。
値を出力し、実際にブラウザで表示を確認しながら影を作成することが出来るので、かなり便利です。
まとめ
以上が、コーディングする際に便利なWEBサービス一覧でした。
