文字列の切り詰め

テキストを指定された長さで切り詰める処理。表示領域やデータベースの制限に合わせて使用される。

文字列の切り詰め (トランケーション) とは、テキストを指定された長さで切り詰める処理です。表示領域の制限、データベースのカラムサイズ、API のレスポンスサイズなど、さまざまな制約に合わせてテキストを短縮する必要がある場面で使用されます。Web の UI 設計からバックエンドのデータ処理まで、ソフトウェア開発のあらゆる層で登場する基本的な操作です。

UI における切り詰めの代表的な手法は、省略記号 (...) を付加する方法です。CSS では text-overflow: ellipsisoverflow: hiddenwhite-space: nowrap を組み合わせることで、1 行テキストの自動省略が実現できます。複数行の省略には -webkit-line-clamp プロパティが使われます。JavaScript で文字列を切り詰める場合は、単純に str.slice(0, maxLength) とするだけでなく、単語の途中で切れないよう最後のスペース位置で切る配慮が必要です。CSS レイアウトの実践書で詳しく学べます。

日本語テキストの切り詰めには特有の注意点があります。サロゲートペア (絵文字や一部の漢字) の途中で切ると文字化けが発生します。結合文字 (基底文字 + 濁点など) の途中で切ると表示が崩れます。JavaScript では Array.from(str)[...str] でコードポイント単位に分割してから切り詰めることで、これらの問題を回避できます。また、「。」や「、」の直前で切ると不自然な印象を与えるため、句読点の位置を考慮した切り詰めが望ましいです。

検索エンジンにおける切り詰めも重要なテーマです。Google の検索結果に表示されるメタディスクリプションは、デスクトップで約 120 文字、モバイルで約 70 文字に切り詰められます。タイトルタグも表示幅に応じて切り詰められるため、重要なキーワードは冒頭に配置するのが SEO の基本です。切り詰められた部分は検索ユーザーの目に触れないため、情報の優先順位を意識した文章構成が求められます。

データベースにおける切り詰めは、データの損失につながるため特に注意が必要です。VARCHAR(255) のカラムに 256 文字以上のデータを挿入すると、MySQL ではストリクトモードが有効な場合にエラーが発生し、無効な場合は自動的に切り詰められます。UTF-8 環境では 1 文字が 3〜4 バイトを占めるため、バイト数ベースの制限と文字数ベースの制限を混同しないことが重要です。SEO 実践ガイドでもメタディスクリプションの最適な長さが解説されています。

文字数カウントとの関連では、切り詰めは「文字数制限」と表裏一体の概念です。文字数カウントツールで現在の文字数を確認し、制限を超えている場合に切り詰めを行うという流れが一般的です。切り詰め後のテキストが意味を保っているか、省略記号を含めた文字数が制限内に収まっているかを確認することが、実務では欠かせません。