Web制作に便利なツールまとめ【2024最新】

ホームページ制作 安い 見積もり のバナーイメージ
キジトラねこ

今回は、実際にWeb制作を行う筆者が、Web制作者の方がオンライン上で使える便利なツールを紹介いたします。

Webデザインギャラリー、写真編集ツール、写真素材サイト、SEO対策ツール、CSSジェネレーター等幅広く、実際に使える便利なツールのみをピックアップし紹介していますので、是非参考にしてください。

目次

Web制作に便利でよく使うツールまとめ

Webデザインに使えるツールやサイト

ストック写真素材サイト

AdobeStock
https://stock.adobe.com/jp

写真素材が豊富(1億点以上)、クオリティが高い。月額3,828円〜(月10点)と少々お高めですが、他ストックサイトと比較しても非常に使いやすくオススメのストック画像サービス。

Unsplash
Web制作に便利なツール紹介 おすすめ
https://unsplash.com/ja

フリーのカメラマンによる写真投稿サイト。フリーでダウンロード出来、商用利用が可能。日本の素材はほぼ無いが、お洒落な写真素材が欲しい時はUnsplashがオススメです。

イラスト素材サイト

AdobeStock

写真素材に加え、イラスト素材も豊富で高品質な物が揃っている。

イラストAC
Web制作に便利なツール紹介 おすすめ
https://www.ac-illust.com/

日本のサイトの為、和風イラストや可愛らしいイラストが豊富。無料でも1日2~3件ダウンロードできる。無料会員だと人気順で並び替え出来ない為、頻繁に利用するなら会員になるのがオススメ

UnDraw
Web制作に便利なツール紹介 おすすめ
https://undraw.co/search

よくあるフラットデザインと組み合わせている人物イラストが手に入る。サイト上で色も変えれる為、aiなどでカラー編集する手間が省ける

NovelAI

話題の二次元アニメキャラ生成サイト。使い方次第ではWeb制作にも上手く利用できるかも?なツール

Webデザインギャラリー

Pinterest
Web制作に便利なツール紹介 おすすめ
https://www.pinterest.jp/

国内外問わず、様々なデザインが見れる。ピンとして保存もできる為、便利。

SANKOU
Web制作に便利なツール紹介 おすすめ
https://sankoudesign.com/

様々な種類のWebサイトデザインがある。

Muuuuuu.org
Web制作に便利なツール紹介 おすすめ
https://muuuuu.org/

ハイセンスかつトレンドのデザインが見れる。コーポレートサイトやブランディングサイトが多いイメージ

BANNERLIBRARY
Web制作に便利なツール紹介 おすすめ
https://design-library.jp/

バナーデザインのライブラリ。

Parts.
Web制作に便利なツール紹介 おすすめ
https://partsdesign.net/

サイトのパーツ毎のデザインが見れる。アイデアが思いつかない時に使える

SEO対策やサイト改善に使えるサイトやツール

PageSpeedInsights

ページスピードや記法の確認ができる。公開前に一度このツールでチェックするのがオススメ。

見出し抽出ツール

競合との見出しの比較や、特定キーワードで上位表示されているサイトの見出しを見ることができる。

ラッコキーワード

サジェストキーワードや流入キーワード、キーワード毎の月間検索数などをチェックできる。

被リンクチェックツール

URLを入力するとそのサイトの被リンクをチェックできる。競合との比較や被リンク数をチェックしたい際に。

サーチコンソール

サーチコンソール。自サイトの検索数、クリック数、キーワード等、流入元のキーワードや順位を確認できる。

パワーランクチェックツール

ドメインパワーをチェックできる。被リンク数と被リンク元の品質やパワーをメインに計測している。

画像加工、圧縮などのツール

BulkResizePhotos

画像を一括リサイズ・圧縮することができる。

Picwish

ボヤけた画像や小さい画像を高画質化することができる。

WebP変換ツール

jpgからWebPに変換できる。

CSSジェネレーター

グラスモーフィズム

グラスモーフィズムのCSSを生成できる。

ニューモーフィズム

ニューモーフィズムのCSSを生成できる。

グラデーション

グラデーションのCSSを生成できる。

Tailwindカラーパレット

基本的なカラーのパレット。Web制作の際カラー定義が必要になった場合こちらから抽出すると便利。

その他ツール

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

この文章はダミーです。文字の大きさ、量、字間、行間等を確認するために入れています。←これが作れる。

ホームページ制作 安い 見積もり のバナーイメージ
  • URLをコピーしました!
  • URLをコピーしました!

この記事を書いた人

kizinekoのアバター kizineko Webデザイナー

Webデザイナー。制作会社でWebサイト制作/グラフィックデザイン業務に携わり、現在フリーランスとして独立。HTML/CSS/PHP/JS/WordPressなどのWebサイト制作にかかわる言語やツールは勿論、SEO/マーケティングへの知見を深めながら日々制作を行っています。

目次