最近知り合いのサイトデザインを進めているのですが、要素の優先順位付けや構成の決定がスムーズに進められずにモヤモヤしていました。（ワイヤー→ラフを何度繰り返したか。。）今日はその悩みの答えになる記事を発見したので翻訳に挑戦！
デザイナー以外のチームメンバーやクライアントも一緒に構成デザインに参加できる簡単な方法です。早速試してみようと思います〜
元記事： “How to design better websites by writing them first” by Stephan Roessler
ウェブサイトのサインアップフローをデザインするところを想像してみてください。ゴールは、ユーザーにとって素晴らしい参加体験を創ることです。リサーチが終わり、実際にデザイン作業に入ろうとしている今・・・あなたはまず何に手をつけますか？
人によって様々な進め方があると思います。ある人はブラウザを開いて直接書き込みはじめ、別の人はSketchやPhotoshopなどのツールを開き、またほかの人は紙とペンを取り出してスケッチを始めるでしょう。これらの方法は間違いではありませんが、多くの人が見落としている、もっと便利なツールがあります。テキストエディターです。
ウェブデザインを文字で考えよう
ウェブサイトの構成要素を挙げてみてください。ヘッダー、パラグラフ、リスト、引用、ラベル、、、この世に存在するウェブサイトはすべて文字でできています。写真や動画をたくさん使用したサイトでも、文字が無ければ成立しません。「ウェブデザインの９５％はタイポグラフィだ」というオリバー・リヒテンシュタインの言葉が頭に浮かびます。
複数のカラムを使うことは忘れよう
スクリーンサイズの小さいモバイル端末は、レイアウト校正はそれほど重要ではないことを教えてくれます。iPhoneが世に出る前、多くのデザイナーはグリッドとカラムのことで頭がいっぱいでした。グリッドやカラムは現在でもいくらか大切ですが、モバイルファーストのデザインでは、すべてのウェブサイトを１つのカラムで魅せることが要求されます。
情報の流れを分かりやすく整理しよう
極論をいうと、すべての（レスポンシブ）ウェブサイトは１つのカラムで成り立ちます。そのことを頭に入れておくと、基本的なことに集中できるようになります。テキストエディターでウェブサイトを「書き起こす」ときには、要素同士を横並びにはできません。情報の流れを縦軸のみで考え、決定することになります。２つの要素を並列で隣同士並べることができないため、どちらが先にくるか、慎重に優先順位を考えることになります。
形は機能によって決まる。デザインは目的によって決まる。
ウェブサイトを「書き起こす」とき、そのサイトの機能をしっかりと見据えなければいけません。「このサイトの目的はなんだろう？」この問いに答えられるようにしましょう。ウェブサイトのデザインは、デザイナーがどう見せたいかではなく、サイトの目的に沿って決められるべきです。ウェブサイトをすべて書き起こし終わってから、実際のデザイン作業に入りましょう。
だれもが違うスキルを持ったデザイナーだと考えよう
ウェブサイトをデザインすることは、難しいことです。多くの場合、それぞれ別の興味、責任、スキルを持った複数の意思決定者たちが一緒に仕事を進めます。そんなバラバラな意思決定者たちが共通で使えるツールがテキストエディターです。ウェブサイトを「書き起こす」作業には全員が参加できます。
ウェブサイトを「書き起こす」ことのメリット
・早い
・簡単
・シンプル
・誰でも参加できる
文書化されたドキュメントは、いいウェブサイトを作る上での最適なリソースです。文章をコピーしてhtmlタグをつければ、そのままサイトの基盤にもなります。もちろんCSSやJavascriptは必要ですが、複雑にしてしまう前のデザイン工程にチームのメンバー全員で参加してもらいましょう。
