記事内に商品プロモーションを含む場合があります

Web design

lit.link(リットリンク)をwebデザイナーがおしゃれにデザイン【作り方・レビュー】

「lit.linkをwebデザイナーがおしゃれにデザイン!今流行りのリンクサイト」の画像

こんにちは!WebデザイナーのShioです*

インスタやX、TikTok…など、運営するSNSやサービスが複数あるのに、
snsのプロフィール欄に貼れるURLは限られてますよね。。。
その場合1ページにリンクをまとめられる「プロフィールリンク」があると便利!

そこでおすすめなのがリットリンクです!
リットリンクはデザインの自由度が高いので、おしゃれにブランドの世界観を表現でき
集客導線を整えるのにも効果的です。

サービスの紹介や自己紹介なども入れて工夫すれば、簡単なホームページのようにデザインすることもできるんです✨

こちらの記事では、リットリンクの説明や作り方、レビュー
Webデザイナーの私が実際に作ったデザイン
をご紹介します♪

  • snsをたくさんやっていて、リンクが増えてきて困ってる。。
  • サービスがたくさんあるので一覧で見られるページがほしい!
  • 起業初期で手軽にホームページを作りたい!
  • リットリンクでどんなデザインができるのか知りたい!

こんな方に参考にして頂けると嬉しいです^^

shio
shio
リットリンクの制作サービスを始めました!
ホームページ型デザインで制作したリットリンクも公開したので、ぜひ最後まで読んでくださいね♡

lit.link(リットリンク)とは|無料で作れるプロフィールリンクページ

リットリンクのサイトの画像
https://lit.link/

プロフィールリンクの無料作成ツールです!
サーバーやドメインなどの準備が不要なので運用コストがかかりません✨

リンクを1ページにまとめられる

▼これらのリンクをまとめられます

Instagram|Twitter|facebook|youtube|pinterest|TikTok|ポートフォリオサイト|お問い合わせフォーム|ショッピングサイト 等

LINEで操作できる

アプリ不要でLINE画面から編集できるので、スマホで作成できます♪

おしゃれなテンプレートがある

おしゃれなテンプレートや画像があるので、デザインをやったことない方でも素敵なリンクサイトができます!

私が制作したリットリンクのデザイン紹介

1年前に制作したデザインから、リニューアルしました!
ビフォーとアフターをご覧ください^^

リニューアル前のデザイン

webデザイナーshioのlit.linkの画像

▼実際のリットリンクのページ
https://lit.link/SHIOdesigner
※現在のデザインは色々追加しているので上の画像と変わっています。

モダンでちょっと大人っぽいけど優しい雰囲気のあるナチュラルなデザイン」が好きなので、このようなテイストになりました!

バナーはフリー素材の写真を編集して、文字を載せてデザインしています。
ボタンはおしゃれな装飾を設定しました\( ˆoˆ )/

リニューアル後のホームページ型デザイン

リニューアルしたリットリンクのデザイン画像

▼実際のリットリンクのページ
https://lit.link/SHIOdesign

ホームページ型にリニューアルしました!

前のデザインも気に入ってましたが、
これから個人でデザインのサービスを始めるにあたって
ブランディングから見直して、デザインのコンセプトも変えてリニューアルしました。

準備中の箇所がありますが、近々完全版を公開できるように進めていきます!

リットリンクの作り方・編集方法

作り方は下記4つだけ覚えれば、あとは感覚的に作ることができます✨

①編集するときはスイッチをON

リットリンクのサイトの画像

サイトを編集をするときは、「編集モード」に切り替えます。
画像の左上部にある、編集ボタンのスイッチをクリックすると「編集モード」と「プレビュー(確認画面)」の切替ができます。

②リンクを追加ボタンを押す

リットリンクの編集方法の画像

リンクを追加する場合は「リンクを追加」から追加したいものを選びます。
余白を追加する場合は「余白を追加」を押します。

リットリンクの編集方法の画像

丸で囲んだところを押すとこのように画像を追加できます!
リンク先のURLを入れる場合は下の白い背景のエリアで設定しましょう。
編集が終わったら「保存ボタン」を押すのを忘れずに^^

③鉛筆マークでボタン編集

編集するときは鉛筆マークをクリックする画像

後から編集したい場合、ボタンの右上にある鉛筆ボタンを押すと編集できます。

④「・・・」マークでボタン移動

「・・・」マークでボタン移動の画像

リンクボタンの順番を入れ替えたいときは、ボタン上の「・・・」をドラッグすることで上下に移動できます。

shio
shio
以上4つを理解すれば簡単にサイトのカスタマイズが可能です!

リットリンクのレビュー|メリット・デメリット

リットリンクのメリット

  1. バナー画像が作れたら、より好みのテイストで作れる
  2. キャッシュがない
  3. ボタンの装飾がおしゃれ
  4. 操作が簡単!説明が3つしかないけど感覚的に制作できる
  5. レスポンシブ対応している
  6. 今伸びてきているツールなので、これから追加される機能がある
  7. URLがシンプル

バナーが作れたら、より好みのテイストで作れる!

アイコンのボタンよりも画像に文字入れしたバナーを入れたほうがおしゃれなリンクが作れるので、画像のデザイン(バナー制作)ができればより自由にカスタマイズできると感じました。

画像サイズは指定がないので、好きなサイズの画像を挿入できます!
(三つ並べたい場合は正方形で作る必要があります)

キャッシュがない!

サイトのデザインを変更して公開するとキャッシュが残ってしまうことがあるのですが、リットリンクでの作業ではすぐ反映されたデザインを確認することができました。

キャッシュとは「一度表示した内容を保存しておき、次回表示した際の速度アップに役立てるシステム」のことで、キャッシュが残るとは「前回表示した内容が表示されてしまうこと」です。

ボタンの装飾がおしゃれ!

現状7種類のボタンから選べます!
色も好きな色に変更可能♪テキストカラーも選べます。

ボタンの背景を透明にしたい場合は下記のように編集してみてください。

リットリンクの編集方法(ボタンの背景を透明にする)画像
  1. 1の四角いボタンを押す
  2. 2の丸を画像のように左に持っていく

操作が簡単!説明が3つしかないけど感覚的に制作できる!

先ほどの説明のように、3つの使い方を理解すれば、簡単に作れちゃいます。

レスポンシブ対応している!

スマホでもパソコンからでも綺麗に表示されます。

スマホ表示
webデザイナーshioのlit.linkの画像
パソコン表示
webデザイナーshioのlit.linkのpc表示画像

今伸びてきているツールなので、これから追加される機能がある!

litlinkの今後追加される機能の紹介画像公式ページより引用

最近は音楽を追加できるようになったり、
余白の調整ができるようになったり、
アクセス数の分析ができるようになったり、
今後も飽きずに楽しく利用することができそうです^^

URLがシンプル

https://lit.link/SHIOdesigner

自分で「/以降(SHIOdesignerの箇所)」を好きに決められるので、短くシンプルなURLに設定可能です。

ぽめさん
ぽめさん
メリットたくさん!

リットリンクのデメリット

  1. 周り(好きな箇所)にあしらいなどの素材を配置できない。
  2. デザインツールに慣れていない方は難しいかも・・・

周り(好きな箇所)にあしらいなどの素材を配置できない。

これはCanvaとの比較になってしまうのですが、周りの装飾に関してはCanvaの方が自由度が高いかなと感じました。

デザインツールに慣れていない方は難しいかも・・・

カスタマイズ性が高いが故にいろんなことができるので、
逆にどのように配置してデザインすればいいか悩んでしまう方も多そうです。
導線を作ることが難しいと感じる方もいるかも・・・

shio
shio
そんな方のためにリットリンク制作サービスを始めます↓

集客導線コンサル付きHP型リットリンク制作|女性起業家様向け

自分のツールで導線迷子の女性起業家さんへ

集客に繋がる導線サポートコンサル付きHP型リットリンク制作

このようなお悩みがある方に向けたサービスです。

SNSやブログをやってて、導線がごちゃごちゃで 何をどうしたらいいか分からない。。。自分でリットリンクを作ろうと挑戦したけど、 色々考えることが多くて難しくて諦めた。導線迷子なのでプロの Webデザイナーに相談してみたい。クリックしてもらえるリットリンクを作りたい。
shio
shio
デザインだけのリットリンク制作では、お客様の目的を叶えることができません。。。
なのでお客様の悩みや制作の目的など丁寧にヒアリングしたうえで、集客導線やデザインのアドバイス・ご提案も一緒にさせていただきます。

\ 現在期間限定価格で募集してます /

キレイでおしゃれなだけでなく、
導線も整ったクリックしてもらえるリットリンクを作りましょう▼

集客までの導線を整えるHP型リットリンク制作のポイント|モニター募集のアイキャッチ画像
集客までの導線を整えるHP型リットリンク制作のポイントこんにちは!WebデザイナーのShioです* リットリンクのデザインや作り方のポイントは lit.link(リットリンク)をwe...

制作実績|エステサロンmahina様

【制作実績】ホームページ風リットリンク制作|サロンmahina様 のアイキャッチ画像
【制作実績】ホームページ風リットリンク制作|サロンmahina様 のアイキャッチ画像
【制作実績】ホームページ型リットリンク制作|エステサロンmahina様こんにちは、女性起業家様向けのweb制作をしているShioです。 エステサロンmahina様のリットリンクをデザインさせていただき...

制作の様子・ポイント・お客様の声など掲載してます♡

制作実績|起業ブランディングプロデューサー飯沼暢子様

【制作実績】ホームページ風リットリンク制作|起業ブランディングプロデューサー 飯沼 暢子様の紹介画像
【制作実績】ホームページ風リットリンク制作|起業ブランディングプロデューサー 飯沼 暢子様のアイキャッチ画像
【制作実績】ホームページ型リットリンク制作|起業ブランディングプロデューサー飯沼暢子様こんにちは、女性起業家様向けのweb制作をしているShioです。 起業ブランディングプロデューサー 飯沼 暢子様のリットリンクを ...

終わりに

canva・Link tree・instabioなど無料で使えるツールは沢山あるけど、リットリンクはカスタマイズ性が高く、おしゃれなサイトが作れるので、これから作る方におすすめのツールです!
これが無料で使えるのはすごいと思います✨

shio
shio
増えすぎたリンクをリットリンクでおしゃれにまとめちゃいましょう^^

▼デザイン紹介リールを作りました!

それではまた^^

webデザイナー|Canva公式クリエイター
shio
shioのアイコン画像
*月2万人が読んでるデザインブログ運営 *女性起業家様向けデザインサービス *ナチュラルな婚姻届制作 webデザイナーを目指したい方向けに、 【勉強方法|転職活動|ポートフォリオ制作|制作会社で働いてからのこと|webサイト制作 etc... 】について発信しています。 このブログとともにwebデザイナーとして成長していきます!
\ Follow me /