0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

文字数カウント+読みやすさスコア+SEO分析ができるWebツールをJSだけで作った

0
Posted at

はじめに

文字数カウンターは世の中にたくさんありますが、ほとんどは「文字数を数えるだけ」です。私がブログ記事やSNS投稿を書くとき、欲しかったのは以下のような機能でした。

  • 文字種別(ひらがな・カタカナ・漢字・英数字)の内訳
  • 文章の読みやすさを数値化したスコア
  • SEO観点でのチェック(タイトル長、キーワード密度など)
  • Twitter/Instagram等のSNS文字数制限との比較

既存ツールでこれらを一括で確認できるものがなかったので、JavaScriptだけで動くWebツールとして自作しました。

ツールの機能

リアルタイム文字数カウント

テキストを入力すると、即座に文字数・単語数・行数・段落数を表示します。全角・半角の区別にも対応しています。

文字種別分析

ひらがな・カタカナ・漢字・英字・数字・記号の割合を算出します。日本語の文章では、ひらがな比率が高いほど読みやすいとされており、この比率を意識した文章改善に使えます。

読みやすさスコア

文の平均長、漢字比率、ひらがな比率などから総合的な読みやすさスコアを0〜100で算出します。

SEOチェック

タイトルの文字数がGoogle検索結果での表示に適切か、メタディスクリプションの長さ、キーワードの出現頻度などをチェックします。

SNS文字数制限

Twitter(280文字/140文字)、Instagram(2200文字)など、主要SNSの文字数制限と比較して残り文字数を表示します。

技術的なポイント

正規表現による文字種判定

Unicodeの範囲指定で日本語の文字種を正確に分類しています。

const analyzeCharTypes = (text) => {
  const hiragana = (text.match(/[\u3040-\u309F]/g) || []).length;
  const katakana = (text.match(/[\u30A0-\u30FF]/g) || []).length;
  const kanji = (text.match(/[\u4E00-\u9FAF]/g) || []).length;
  const alpha = (text.match(/[a-zA-Z]/g) || []).length;
  const digit = (text.match(/[0-9]/g) || []).length;
  const total = text.length;

  return {
    hiragana: { count: hiragana, ratio: hiragana / total },
    katakana: { count: katakana, ratio: katakana / total },
    kanji: { count: kanji, ratio: kanji / total },
    alpha: { count: alpha, ratio: alpha / total },
    digit: { count: digit, ratio: digit / total }
  };
};

このUnicode範囲指定により、絵文字や特殊文字が混ざっていても正確にカウントできます。

読みやすさスコアのアルゴリズム

日本語の文章における読みやすさを複数の指標から算出しています。

const calcReadability = (text) => {
  const sentences = text.split(/[。!?\n]/).filter(s => s.trim());
  const avgLength = text.length / Math.max(sentences.length, 1);
  const charTypes = analyzeCharTypes(text);

  let score = 100;
  // 一文が長すぎるとペナルティ
  if (avgLength > 80) score -= (avgLength - 80) * 0.5;
  // 漢字比率が高すぎると読みにくい
  if (charTypes.kanji.ratio > 0.4) score -= (charTypes.kanji.ratio - 0.4) * 100;
  // ひらがな比率が低すぎても読みにくい
  if (charTypes.hiragana.ratio < 0.3) score -= (0.3 - charTypes.hiragana.ratio) * 80;

  return Math.max(0, Math.min(100, Math.round(score)));
};

一般的に、日本語テキストでは漢字比率30%前後、一文40〜60文字程度が読みやすいとされています。このアルゴリズムはそうした知見をベースにしています。

まとめ

「数えるだけ」で終わらない文字数カウンターを目指して作りました。SEOやSNS運用をしている方にとって、テキストの品質を多角的にチェックできるツールになっていると思います。

サーバー不要、HTML/CSS/JSだけで動作するので、ローカルでも使えます。

ツールはこちらから試せます:
AI文字数カウンター

作り方の詳細はこちら:
詳しくはこちら

0
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?