第１４回スクプロ講座（Docs to Markdown編）
第１４回スクプロ講座（Docs to Markdown編）
SmartHRのプログレッシブデザイングループでアクセシビリティテスターをしている柳瀬と言います。
今回は１２月２５日にプログレッシブデザイングループ所属で私の上司でもある辻勝利（つじかつとし）さんのもとで行われた第１４回スクリーン・リーダープロフェッショナル養成講座（スクプロ講座）について報告していこうと思います。
辻さんは弊社のアクセシビリティスペシャリストであり、またNVDA日本語チームの代表でもあるスクリーン・リーダーの第一人者になります。
このスクプロ講座は私だけでなく色々な方にも有意義な情報になると思い、会話形式で記事にしています。
※スクリーンリーダーはNVDAを使用しています。
目次
はじめに
Docs to Markdownをインストールしてみよう
Docs to Markdownを使用してみよう
Docs to Markdownのできること
まとめ
最後に
はじめに
辻：今日はDocs to Markdownというアドオンを使用してGoogleドキュメントで書いてもらっているドキュメントをマークダウンに変換しようと思います。
柳瀬：よろしくお願いします。
Docs to Markdownをインストールしよう
辻：Google検索でDocs to Markdownを検索してほしいんですよ。
柳瀬：わかりました。
Docs to Markdownを検索しページを開く。
今回使用したページ（Google Workspace Marketplace「Docs to Markdown」）
柳瀬：開きました。
辻：そしたらインストールっていうボタンがあるんですよ。なのでまず見出しに移動してみてください。
柳瀬：はい。見出しはないみたいです。
辻：Shift+Hではどうですか？
前の見出しがありませんという
辻：ないみたいですね。ならボタン移動でインストールを探してみてください。
柳瀬：ありました。
辻：これを押すとどうなるかというと、これはchromeにインストールするのではなくGoogle work spaceにインストールするものなんですよ。いったん新しいドキュメントをdoc.newで作ってもらっていいですか。
柳瀬：わかりました。
無題のドキュメントを作成する
柳瀬：できました。
辻：そしたらですね。Googleドキュメントのメニューを出したいのですが。Alt+Shift+Fを押してもらっていいですか？
ファイルmenuと読上げる
辻：ファイルmenuがでますよね。Altだけを押すとchromeのメニューが出てきます。なのでShiftを入れてメニューを出すようになります。
柳瀬：はい。
辻：ちょっと右の方に行ってください。拡張機能というところがあります。アドオンというところを右に移動してください。
柳瀬：はい。
辻：そうそうそう。ここに本当はDocs to Markdownが入ってくるんですよ。
柳瀬：なるほど。
辻：その状態で下矢印を押すと何か言いますか？
柳瀬：何も言いませんね。
辻：一度左矢印を押してみてください。
アドオンを取得という
辻：これが出ているということはまだDocs to Markdownはyanaさんの作業環境には入っていないということですね。
柳瀬：なるほど。
辻：なので先ほどの画面に戻ってDocs to Markdownをインストールしましょう。
柳瀬：わかりました。
Docs to Markdownのインストールボタンを押す
柳瀬：利用規約の確認とインストールの実行を行っていいですよね？
辻：アドオンというのはドキュメントの全情報にアクセスしたりできるんですよ。会社で書いている機密文書をDocs to Markdownで使用して問題ないのか確認する必要があるのですが、ここは実行を押してください。
Docs to MarkdownとGoogleアカウントを共有するか聞かれる
辻：どのGoogleアカウントにDocs to Markdownをインストールするかここで選択できます。もちろんyanaさん個人のGoogleアカウントにもインストールできますし、今回は会社のアカウントにインストールするので先ほどyanaさんのアカウントがリンクになっていたと思うのでそちらを押してもらうとyanaさんの会社のアカウントにインストールできます。
柳瀬：わかりました。やってみます。
yanaの会社アカウントのリンクを選択する
辻：何度も本当にインストールするか聞かれますが、それほどアドオンをインストールすることは気を付けないといけないことなんです。chromeを乗っ取って悪さをすることがあるので。それと同じくらいGoogle Workspaceにアドオンをインストールすることも自分の情報だけでなく会社の情報にもアクセスされるかもしれないので気を付けてくださいね。ってことで何度も忠告をしてきます。
柳瀬：なるほど。分かりました。
インストールが終了する
辻：そしたら先程のGoogleドキュメントに反映されているのかな？ちょっと先程の拡張メニューを出してみてください。
拡張メニューに移動する
柳瀬：移動しました。Docs to Markdownがありますね。
辻：これでGoogleドキュメントのファイルをMarkdownに変換できるようになりました。
柳瀬：これでできたんですね。
辻：はい。せっかくなんで今yanaさんが書いているnoteの記事をGoogleドキュメントで出してもらっていいですか。
柳瀬：はい。分かりました。
Docs to Markdownを使用してみよう
辻：そうしたら早速変換してみましょうか。また拡張のところに行ってもらってDocs to Markdownの右に移動してください。
コンバートと読上げる
辻：コンバートを今回使用したいので押してください。
柳瀬：はい。コンバートを押します。
辻：押してもらったらボタンを探して見てください。
MarkdownとHTMLと読上げる
辻：今yanaさんが書いているnoteの記事を何に変換するか聞かれているんです。Markdownにしますか。またはHTMLにしますかと聞かれています。
柳瀬：へぇ～
辻：どちらでも変換できるんです。
柳瀬：すごいですね。
辻：ではMarkdownを選択してみてもらえますか？
Markdownボタンを選択する
辻：選択しても何も読み上げないんですよ。今一生懸命変換しているんです。
柳瀬：そうなんですね。
辻：ものの数秒で変換が終了します。
柳瀬：へぇ～すごいです。
辻：これをどうやって使うかといいますと。エディットボックスがあるんですよ。Eのコマンドでいけるかな。
柳瀬：いけました。
辻：エンターを押してください。フォーカスモードになりましたよね。
柳瀬：なりました。
辻：一番上の方はメタ情報といって本文とはあまり関係がないんです。今回はこういうソフトを使用しましただとか、変換には何秒かかりましたとか、Docs to Markdownのバージョンはいくつです。などの情報が書いてあります。その辺は記事には使わないので飛ばしてください、記事に見出しはつけていますか？
柳瀬：はい、つけていました。
辻：では＃で始まる行を下矢印で探してもらっていいですか？
you have some errorsとよみあげる
辻：今 you have some errorsって聞こえたと思うんですが、多分Google docにエラーがあるのかもしれません。
柳瀬：そうなんですね。
辻：エラーチェックもしているんです。Markdownにしてから修正すればいいと思います。では引き続き＃を探してみてください。
柳瀬：ありました。
辻：そこからがほしい場所です。ここを起点にしてShift+Ctrl+Endで最後まで選択してください。
選択した文字数を読み上げる。
辻：これで選択ができているのでクリップボードにコピーしてもらって今度はVisual Studio Codeを開いてください。
柳瀬：開きました。
辻：ではそこに貼り付けてください。
柳瀬：貼りつきました。へぇ〜簡単ですね。
辻：エラーがあると言っていたから注意深く見る必要があるのですが、一番上のところに移動してもらうとタイトルにアスタリスクって言っているので普通の見出しではないのでアスタリスクが必要なければ消してもらって大丈夫です。
柳瀬：なるほど。
辻：Docs to Markdownの特徴としてリストをつくるとハイフンspaceではなくて自動的にアスタリスクspaceに変換されるんですよ。どちらでも同じ結果が得られるので問題はないのですが。
柳瀬：アスタリスクでも問題ないのですか？
辻：問題ないんです。なのでこれでMarkdownは完成したので保存してもらって大丈夫です。そしてCtrl+Shift+Vで実際のWebページとして表示されるので確認してください。
柳瀬：へぇ〜そうなんですね。
辻：これを使って記事の投稿をしてもらうとnoteに記事がつくれます。
柳瀬：すごいですね。
辻：便利でしょ？
柳瀬：そうですね。今までVisual Studio Codeで作成してましたが、これを利用すれば楽になりますよね？
辻：おっしゃるとおりです。だからGoogleドキュメントをしっかり作成しておくとそれがそのまま生かせるって感じです。
柳瀬：便利ですね。こういうものがあるなんて。
辻：定例会議とかでもドキュメントで作成したらDocs to Markdownを使ってMarkdownに変換したうえで少し手直しをしたらそのままDocBaseに貼り付けるなんてこともできます。今回はDocBaseではなくVisual Studio Codeでnoteの記事に使えるように変換していく感じになります。
柳瀬：すごいです。でも自分でまずMarkdownができるようになっていないと使えなかったかもしれませんね。
辻：そうですね。Markdownの使い方を覚えていないと、もしエラーがあるよって言われたとしてもどこにエラーがあるのかがわからないのでMarkdown記法を覚えてもらうのももちろん大切です。だけど、一度Markdownを覚えてしまえばyanaさんはプログラム言語を1つ覚えているのと同じなんですよ。
柳瀬：なるほど。
辻：Markdownはいろんな読み手に読みやすいように変換できることがメリットなんですよと話したと思います。それを今yanaさん自身に体感してもらっている状態になります。
柳瀬：では、今回のスクプロ講座はドキュメントで作成してDocs toMarkdownにしてもいいかもしれませんね。
辻：その方が保存とかを手元でしなくてもいいから楽かもしれない。yanaさんが作成して僕が確認する時にドキュメントだと提案モードでコメントすることができて、提案を受け入れるとそのまま簡単に修正して反映することができます。それをVisual Studio Codeに貼り付けて整えて出すということもできます。
柳瀬：覚えてしまえばどんどん作業が楽になりますね。
辻：そのとおりです。
Docs to Markdownのできること
辻：今yanaさんにはMarkdownにしてもらいましたがHTMLにするとホームページをつくることだってできるんです。
柳瀬：本当ですか？
辻：吐き出されたソースコードを編集する画面に持って行って貼り付けることでホームページを作成できます。
柳瀬：本当に便利ですね。
辻：昔は僕らが自分たちでタグとかを書いていたんです。人間がタグを書くと何が恐ろしいかというと、疲れてくるとミスが出てきてしまうのでそういうことも Markdownを使用することで人的ミスはかなり減らせます。
柳瀬：なるほど。
辻：これを活用してもらって楽しんで文章を作成してもらいたい。
柳瀬：笑。楽できるところはですね。
辻：そう。これからエラーを修正する必要がありますが、Ctrl+Shift+Vでビューを見ることができるので確認してもらうとここが壊れているとわかるので修正してみてください。
柳瀬：わかりました。
辻：なんでもっと早く教えなかったんだろうと思われるかもしれませんが、先にDocs to Markdownを使うとMarkdownを覚えられない可能性があるので少し教えるのを後にしました。
柳瀬：そうですね。先に覚えてしまうと確かに覚えてなかったかも。
辻：これで記事を書くのが楽になったと思うのでぜひ活用してください。
柳瀬：早速使わせてもらおうと思います。ありがとうございました。
まとめ
今回はDocs to Markdownを使用してドキュメントを Markdownに変換する方法を教えていただきました。途中からへぇ〜とか凄いとしか言っていなかった感じがします。新しいことを教えてもらって次から活用してみようという気持ちになりました。こういったことを知ると私の知らないことがたくさんあるんだなと改めて実感します。自分でも調べながらチャレンジしていこうと思いました。
最後に
今回でいったんスクプロ講座は終了になります。これからは不定期で開催する予定なのでぜひ見に来てください。
辻さんもnoteで有益な情報を発信されているので、URLを貼っておきます！