yasuda

エンジニアもデザイナーもVS Codeとテキスト校正くんで手軽に文章の校正を始めよう

文章の校正(誤字脱字や文法の誤りを正すこと)というと、ライターや編集者がするものと考えがちですが、エンジニアやデザイナー、ディレクターなどのウェブサイト製作にかかわるすべての人にも有益なスキルではないでしょうか。

エンジニアの最終成果物はコードですが、仕様書などの文章を書くことも意外と多いです。アウトプットにブログを書くこともあります。
デザイナーが校正をわかっていると、文章修正の手戻りが少なくなるかもしれません。コピーライティングまでできるとデザイナーの大きな武器の1つになります。
ディレクターはメールやチャットでやり取りをしたり、資料や原稿を作ったり、校正スキルが役に立つ場面も多いです。

といっても、校正の知識もないし、何から始めればいいのかわからないという方には、コードエディター「VS Code」と拡張機能「テキスト校正くん」がオススメです。
難しい設定もなく、文章の校正が始められます。

VS Codeとテキスト校正くんのインストール

VS CodeはMicrosoftが開発している無料のコードエディターです。macOSとWindowsのどちらでも使えます。
公式サイトからダウンロードできます。

Visual Studio Code – コード エディター | Microsoft Azure

テキスト校正くんはVS Codeの拡張機能です。textlintというテキスト向けのLintツールをVS Codeで使えるように作られています。
VS Codeの設定から「テキスト校正くん」と検索してインストールするだけで使えます。

詳しい導入・設定方法は割愛します。
「VS Code 設定」などと検索するか、Dropbox Paperに個人的にまとめているドキュメントがあるので参考にしてください。

テキスト校正くんの校正ルール

テキスト校正くんのページに説明があります。

ウェブ業界の専門用語を含め、一般的な文章のルールに沿って主に以下のようなチェックを行います。
「ですます」調と「である」調の混在
ら抜き言葉
二重否定
同じ助詞の連続使用
同じ接続詞の連続使用逆接の接続助詞「が」の連続使用
全角と半角アルファベットの混在
弱い日本語表現の利用(〜かもしれない)
読点の数(1文に4つまで)
ウェブの用語や名称の表記統一(Javascript→JavaScript、Github→GitHub等)
漢字の閉じ方、開き方(下さい→ください、出来る→できる等)

VS Codeの設定から、チェックする項目を選択できます。

.md.txtファイルを開くと自動で校正が実行されます。入力した時点でチェックされるのでスムーズです。
「例えば、VSCodeでこの文章を入力すると、問題箇所が赤い波線で表示されます。」という文章を試してみましょう。問題箇所が赤い波線で表示されているのがわかります。

スクリーンショット:問題箇所に赤い波線で表示されている様子

問題箇所にマウスを乗せると、ポップアップでその理由が、もしあれば解決する方法も確認できます。

スクリーンショット:問題内容などが表示されている様子

テキスト校正くんを試してみる

まずは、やってしまいがちな項目の「ら抜き言葉」「技術用語」「助詞の重複」「開く漢字」「外来語カタカナ表記」を試します。

項目 文章 問題 訂正後
ら抜き言葉 食べれる ら抜き言葉を使用しています。(preset-japanese/no-dropping-the-ra) 食べられる
技術用語 github github => GitHub(技術用語)(prh) GitHub
技術用語 PhotoShop PhotoShop => Photoshop(技術用語)(prh) Photoshop
助詞の重複 AとBとCです。 一文に二回以上利用されている助詞 "と" がみつかりました。(preset-japanese/no-doubled-joshi) AとB、それとCです。
開く漢字 特に。 特に => とくにひらがなで書くと読みやすくなります(ひらく漢字)(prh) とくに。
開く漢字 例えば。 例えば => たとえばひらがなで書くと読みやすくなります(ひらく漢字)(prh) たとえば。
開く漢字 教えて下さい。 下さい => くださいひらがなで書くと読みやすくなります(ひらく漢字)(prh) 教えてください。
外来語カタカナ表記 セレクタ セレクタ => セレクター語尾が -er, -or, -ar で終わる語彙には長音を付けます(外来語カタカナ表記)(prh) セレクター
外来語カタカナ表記 フォルダ フォルダ => フォルダー語尾が -er, -or, -ar で終わる語彙には長音を付けます(外来語カタカナ表記)(prh) フォルダー

「ら抜き言葉」と「助詞の重複」は幼い印象を与えてしまうので避けたいです。「このページのニュースの概要」ではなく、「このページに関するニュースの概要」とした方がしっかりとしている印象を与えられます。

「外来語カタカナ表記」は人によってバラツキが出やすいです。
「技術用語」は頻繁に間違えていると信用度が落ちるので、注意したいところです。

「開く漢字」は読みやすさに繋がります。パソコンやスマートフォンを使っていると、ついつい漢字が増えてしまので、適度にひらがなにして読みやすくします。

「冗長な表現」「読点の数」「重言」なども試してみます。

項目 文章 問題 訂正後
冗長な表現 Aをすることができます。 することができます => できます冗長な表現ではないでしょうか?(冗長な表現)(prh) Aができます。
読点の数 これは、それで、あれで、だから、そもそも。 一つの文で"、"を4つ以上使用しています(preset-japanese/max-ten) これは、それで、あれで、だから。
重言 初デビュー 初デビュー => デビュー(重言)(prh) デビュー
重言 馬から落馬した 馬から落馬 => 落馬(重言)(prh) 落馬した
重言 再び再考した なし なし
重言 ほんのわずかに微調整した なし なし
重言 価格を値下げしました なし なし
算用数字 0123456789 算用数字は「半角」で表記します。(preset-jtf-style/2.1.8.算用数字) 123456789
句読点 Aはすごい,Bもすごい,Cはそこそこ. 句読点には全角の「、」と「。」を使います。和文の句読点としてピリオド(.)とカンマ(,)を使用しません。(preset-jtf-style/1.2.1.句点(。)と読点(、)) Aはすごい、Bもすごい、Cはそこそこ。
括弧内外の余白 括弧(括弧の中のスペース ) の外のスペース かっこの外側、内側ともにスペースを入れません。(preset-jtf-style/3.3.かっこ類と隣接する文字の間のスペースの有無) 括弧(括弧の中のスペース)の外のスペース
ハイフン -は禁止。 原則として和文ではハイフン(-)を使用しません。例外は、住所や電話番号の区切りに使う場合です。(preset-jtf-style/4.2.6.ハイフン(-)) ハイフンは禁止。
ハイフン 012-3456 なし なし
疑問符のスペース なんでしょうか? なんでしょう。 文末に感嘆符を使用し、後に別の文が続く場合は、直後に全角スペースを挿入します。(preset-jtf-style/4.2.2.疑問符(?)) なんでしょうか?なんでしょう。なんでしょうか? なんでしょう。
ですます調とである調の混在 これは、ですます調です。これは、である調である。これは、である調だ。これは、ですます調です。 なし なし
二重否定 間に合わないこともありません。 なし なし
弱い日本語 だったかもしれません。 なし なし

「冗長な表現」の「することができます」という表現は使ってしまいがちです。遠回しな表現よりも「できます」と言い切ってしまいましょう。

「重言」の一部や、「ですます調とである調の混在」「二重否定」「弱い日本語」はうまくチェックできないことがあるようです。

Code Spell Checkerで英語のスペルチェック

テキスト校正くんでも技術用語のスペルチェックはしてくれますが、「Code Spell Checker」を追加すると漏れをさらに減らすことができます。
テキスト校正くんと同様に、VS Codeの設定から検索してインストールします。

「This is a wrong sentance.」と入力すると、緑色の波線で問題箇所を表示してくれます。正しくは「sentance」ではなく「sentence」ですね。

スクリーンショット:問題箇所に緑色の波線で表示されている様子

「クイック フィックス…」を選択すると、修正候補を確認できます。
「Add: "<単語> to user dictionary"」を選択すると、その単語を合っているものとして登録できます。英単語として存在しないツールやサービスの名前が警告表示されるのを防ぎます。

スクリーンショット:修正候補が表示されている様子

できるところから文章校正を始めよう

VS Codeは校正用のツールではないので、完璧な文章の校正はできません。本格的に校正をするなら専用のツールが必要です。でも、一定の品質を保つことはできると思います。
校正を初めると、VS Codeを使っていないときにも「あっ、『することができます』は『できます』だな」と気付けるようになりました。文章校正を意識づける意味合いでも導入してよかったと思っています。

今回紹介したツールはすべて無料で、MacとWindowsの両方で使えます。
校正を意識したことがない人も、まだ始められていない人も、テキスト校正くんで文章校正を始めてみてください。

新しいウェブ体験を作ろう TAMのPWA開発
お問い合わせはこちら