オレ流ランディングページの作り方 #8「色々便利サイト」

LPと聞けば、レコードを連想する世代の、ユゲタです。 今回は、実際にLP（ランディングページ）を作る時に、非常に役立つツールやサイトなどを紹介したいと思います。 そして、有償ソフトが個人的にあまり好きではないので、便利なのはわかるんですが、 無料、または独自で、できることでクリエイティブを追求するスタイルを貫いているだけので、 有償ソフトの方が圧倒的に便利ということは、間違いないと思います。

挿絵に便利なイラストページ

unDraw 「いらすとや」など、圧倒的に便利そうなフリー素材サイトは、最近たくさん増えてきましたが、ボクは個人的に、このunDrawで、事足りています。 このサイトって、数もものすごくたくさんあるし、無難なイラストが多いので、ビジネスLPなどで非常に便利に使えるものばかりなんですよね。 少し残念な点としては、他のサイトでもたくさん使われていて、使い古され掛かっているフシもあるので、他サイトと似たりよったりにならないように工夫する必要はありますね。 でも、便利すぎる点のもう一つは、SVG形式であるということと、その色味が変更できるという、大きなポイントがあるので、やはりこのサイトでテイストを固めるといい感じのページが作れるでしょう。 テイストを変えたいという人は、「イラスト　フリー」とか、「SVG」などで検索してみると、他にもフリー素材集ってたくさんあるので、自分のお気に入りをブックマークしておくことをおすすめします。

写真素材と動画素材

アイキャッチに、素敵な写真素材を載せるだけで、ランディングページの質がぐっとアップします。 素人が撮影した写真と、プロが撮影した写真って、やっぱり完成度のクオリティが圧倒的に違うので、そうした目を肥やすためにも、素材提供サイトなどは、 いろいろとよく見るようにしたほうがいいでしょう。 その中で、ボクのブックマークでは、 https://pixabay.com/ja/ このサイトでほぼアイキャッチをおぎなっています。 そして、このPIXABAYが便利すぎる点としては、動画のフリー素材もかなり充実しているという点です。 簡単な日本語であれば、検索できますが、できれば英語で検索したほうが精度がいいようです。 ちなみに、他の写真素材サイトも、似たような検索結果が出ることも多いので、フリー素材の検索場所として、使うという方法も悪くないかもですね。

アイコン素材

サイトで使うアイコンやファビコンは、確実にsvgでやっている最近の個人的事情に基づき、 これまでは、iconfinderや、icon専用フリーダウンロードサイトを使っていたんですが、 iconfinder 最近見つけた、Googleフォントのサイトで提供していたアイコン素材が、かなりの網羅性を持っていたので、こちらを使うようにしています。 https://fonts.google.com/icons このサイトが便利な点としては、SVG自体のコードが非常にシンプルで、同じようなデザインのアイコンを他のサイトでダウンロードした時に、ファイル容量が圧倒的に少ないというのが魅力です。 もちろん、何でもかんでもというわけではなく、どうしても、目的のアイコンがない場合は、フリーアイコン素材集をまとめたキュレーション記事をもとに、 探し歩くこともあるので、こちらも紹介しておきます。 https://photoshopvip.net/124402

CSSツール

CSSで三角形を書く時に使う便利サイト http://apps.eky.hk/css-triangle-generator/ja たまーにですが、三角表示をする時に、サイズ計算や、cssコードをそのままコピペできるという点が非常に便利なので、ブックマークしてよく使わせてもらっています。 CSSグラデーション https://cssgradient.io/ ページの背景色にさりげなくグラデーションを配置すると、非常に高品位な印象を出すことができるので、 このサイトを使って、グラデーションの確認と、cssコードをコピペして使えるようになるので、便利に使わせてもらっています。

まとめ

他にもたくさんのツールを使っているはずなんですが、個人的に非常によくアクセスするブックマークを書き出してみました。 逆に考えると、こうした便利に使ってもらえるツールを自分で作り出すと、 いい感じにアクセスの多いサイトを作ることも可能かもしれませんね。 それにしても、無料で色々と使わせてもらって、改めて非常に有り難い世の中になったなあと感じましたね。 それぞれのサイト主さん、どうもありがとうございます。