h-ash design works|アッシュデザインワークス

便利なオンラインツール Vol.1

便利なオンラインツール Vol.1

Webサイト上で「必要なパーツやソースを簡易に作成することができる」オンラインツール。
便利ですよね。作業の効率化も兼ねて、私も日々利用しています(制作者の方に感謝です)。
そこで、今回は「便利なオンラインツール」をご紹介します。
「便利なオンラインツール」といいましても数多くありますので、今回は「Vol.1」として4つのオンラインツールをご紹介します(今回は1回目ですので「オンラインでの作成のみを中心とした簡易なツール」に絞りました)。

Index

― 目次 ―

LUFTTOOLS

LUFTTOOLS
株式会社セイビーさんが運用されている「LUFTTOOLS(ルフトツールズ)」で提供されているオンラインツール。

▼LUFTTOOLS URL
https://www.luft.co.jp/cgi/

[補足]
以下のようなオンラインツールが提供されています。
  • メールアドレス暗号化
    WEBサイト上に公開されているメールアドレスを「メールアドレス自動収集ロボットから保護するための暗号化ツール」です。
  • .htaccess による認証用 パスワード暗号化ツール
    Basic認証で使用するパスワード生成ツールです。
    生成されたテキストを.htpasswdファイルに貼り付けて利用することができます。
    .htpasswdには、1行で「ユーザー名 :エンコードされたパスワード(暗号化されたパスワード)」を記述します
  • MP4→GIF変換(GIF作成)
    MP4形式の動画ファイルをGIF形式の画像(GIFアニメ)に変換することができるツールです。
    「mp4」「ogv(ogg)」「webm」の動画ファイルをGIF形式の画像(GIFアニメ)に変換することができます。
各オンラインツールの使用方法に関しましては、LUFTTOOLSのWebサイトに記載されていますので、合わせてご確認ください。

CSS Stock

CSS Stock
Otetoさんが運用されている「CSS Stock」で提供されているオンラインツール。

▼CSS Stock URL
https://pote-chil.com/css-stock/ja

[補足]
以下のようなオンラインツールが提供されています。
  • HTMLとCSSで作る吹き出しデザイン
    ブログ記事やチャットツールなどでよく見かける「吹き出しデザイン」。
    アイコンなどと組み合わせると、見た目の印象も大きく変えてくれます。
    こちらのオンラインツールを活用すれば、カラー調整に加え、コピペだけで簡単にWebサイトへ実装できます。
  • HTMLとCSSで作るグラフデザイン
    売上や実績紹介などで活用できそうな「円グラフデザイン」。
    「項目」と組み合わせることもできます。「レーダーチャートデザイン」もあります。
  • HTMLとCSSで作るローディングアニメーション
    Webサイトにアクセスした際、コンテンツが読み込まれるまでの間に表示させる「ローディングアニメーション」。
    パターンも数種類用意されています。ローディング状況(%などで表示)やローディング後にアニメーションが発動するスクリプトをJavaScriptで作成してあげると、よいコンテンツが作れそうですね。

Favicon Generator. For real.

Favicon Generator. For real.
「Favicon Generator. For real.」で提供されているオンラインツール。

▼Favicon Generator. For real. URL
https://realfavicongenerator.net

[補足]
PCサイトやスマートフォンサイト、iOSやAndroid OSなどの各種favicon(ファビコン)を一括して作成してくれるオンラインツール。
表示は英語ですが、Google翻訳で日本語にすると分かりやすいですね。
共通で使用できるICO、Apple用のPNG、Android用のPNGなど、favicon(ファビコン)をまとめて作成することができます。

以前、当サイトのブログ記事「「head要素」のまとめ」→「Favicon(ファビコン)」でも掲載していますので、是非そちらもご覧ください。

QRのススメ

QRのススメ
株式会社インフォリオさんが運用されている「QRのススメ」で提供されているオンラインツール。

▼QRのススメ URL
https://qr.quel.jp

[補足]
以下のようなオンラインツールが提供されています(QRコードは、株式会社デンソーウェーブの登録商標です)。
  • URL用QRコード
    名刺や印刷物でよく見かける「指定のURLを表示するQRコード」を作成できます。
  • アイコン・文字入りQRコード
    見た目の印象も変わる「アイコンや文字付きのQRコード」を作成できます。
    URL・メールアドレス・テキストから選択でき、URLはブラウザ、メールアドレスはメーラー、テキストはブラウザなどのアプリが立ち上がります。
  • アドレス帳登録用QRコード
    「名前・フリガナ・電話番号・メールアドレス・URL・住所・会社名をスマートフォンの連絡先に登録するQRコード」を作成できます。
    一部、読取に対応していないアプリもあるようですので、こちらを参考にしてください。
  • SMS用QRコード
    「指定の電話番号にあらかじめショートメッセージをセットするQRコード」を作成できます。
    定型文を頻繁に送る必要がある方には便利ですね。
  • 多言語対応QRコード
    個人的には、こちらが面白いと思いました。
    日本語か英語で文章を入力すると「設定した文章を外国語ユーザーに合わせ自動翻訳して表示してくれるQRコード」を作成できます。
    28カ国語に対応しています(文章は、英語設定のスマートフォンでは英語、中国語設定のスマートフォンでは中国語というように、ユーザーに応じて28カ国語に自動翻訳されるようです)。
    チラシ・掲示版・観光案内などの説明や注意書きに対して、このQRコードを利用することで多言語化が実現できますね。

今回は「便利なオンラインツール」についてご紹介しました。
便利なオンラインツールは、まだたくさんありますので、これからも当ブログ記事内で紹介していこうと思います。

キーワード関連キーワード