ライター兼カメラマンの私にWeb制作のコーディングをさせる4つのメリット
私は関西を中心にライター兼カメラマンとして活動しています。「自分が納品する記事をうまく生かしてもらっていない」と思ったことがあり、「いっそのこと、Webサイト全般にかかわったほうがいい」と考え、Web制作の勉強を始めました。
今はコーディングの案件を探しています。「ライター兼カメラマンとしての経験を生かして、一般的なコーダーとは違う仕事ができる」と考えています。「どう違うか」について語ってみます。宣伝丸出しの記事になるのはお許しください。
1.Photoshop やIllustratorで作ったカンプのクセや限界がわかる
まずは、こちらの画像をご覧ください。左はPhotoshopで作られたカンプ（一部）、右はそれを元に私がコーディングしたものです。小分けされた欄が多いことを除けば、どこにでもある入力フォームです。
多くの人にとっては、「言われてみれば」程度の細かいことかもしれませんが、左のカンプには作りに粗さがあります。文字の左端がそろっておらず、「性別」と「メールアドレス」はほかよりも右に寄っています。
入力のボックスの高さは、「年齢」はやや広く、「住所」は狭くなっていますが、変化を付ける理由はありません。こういったバラツキはほかのボックスにもあります。文字とボックスの間のすき間も狭かったり広かったりです。
これらの粗さは、カンプを写真補正ソフトであるPhotoshopで作成したの主な原因でしょう。位置や高さを決めるには、カーソルを動かし、ほとんど「手で置いていく」といった作業になります。
Illustratorでも同じことが起こります。また、程度の差こそあれ、Web制作のために開発されたFigmaやAdobe XDでも起こりうることです。
ところが、全くの初心者を抜け出したぐらいのコーダーにはカンプは絶対です。「ピクセルパーフェクト」を目指し、これらのバラツキもきれいに踏襲するのではないでしょうか。
私がコーディングした右では、文字の位置・ボックスとのすき間は全部同じにしてあります。ボックスの高さも、最後の「ご質問・不明点等」を除いて、45pxに統一しました。「Photoshop を使い慣れているからこそ、自信を持って『変えたほうがいい』と判断できる」といったところです。
2.実際にサイトに使う状態で画像の補正ができる
本来、水平・垂直である線が傾いている写真は見る人を不安にさせます。色調がおかしい料理写真は、おいしく見えません。にもかかわらず、この種の質の低い写真は当たり前に使われています。
じっと見るのが辛いので、訪問者はここで離脱してしまうかもしれません。サイトにとって大きなマイナスなのですが、実際にはこういった問題ありの写真も放置されています。
・Webディレクターも写真の問題を見落とすことがある
以前、カステラ風のスイーツの写真に文字入れして作られた、バナー画像がTwitterで流れてきました。投稿したのは、Web制作会社の社員で、Webディレクターをやっている人です。
「当社が依頼しているデザイナーさんはすばらしい。一言お願いしただけで、意図を正確に理解し、これだけのバナーを作ってくれる」と大絶賛です。しかし、肝心のスイーツの写真はピンぼけでした。
気が付かないカメラマンは論外です。デザイナーもあまり優秀とはいえません。Webディレクターも全く役目を果たせていません。カメラマンらを指揮し、その仕事をチェックする立場ですから。
ただ、Webサイトで使われる写真は意外に軽視されています。記事用に新しく撮らずに、写真ストックサービスのものが多用されているのが、その一例です。
このWebディレクターにしても、ちゃんと写真を勉強する環境が社内にあって、自分でも取り組まない限り、これからもピンぼけなどの問題のある写真を見逃すでしょう。
ただ、現実の問題として、そういった「環境」があるWeb制作会社はごく一部ではないでしょうか。
・中途半端な完成度の写真を使っていませんか？
今回例に挙げたパターンとは異なり、カメラマンやWebデザイナーがまともであっても、問題が発生する可能性があります。
というのは、カメラマンがちゃんとした写真を納品しても、その後、Webデザイナーらが使う段階になり、実際にサイトに当てはめると、調整が必要になるからです。たとえば、「カメラマンが選んだのと違う写真のほうがいい」「予定よりも多くの写真を使うことになった」となるかもしれません。
しかし、多くの場合、もうカメラマンの仕事は終わっており、関与しません。助けを求めるわけにもいきません。
また、「一枚一枚見ればおかしくない。だけども、サイトの中に入れると、色調などがバラバラになる。もう一度、写真レタッチ（色調補正、トリミングなど）が必要になる」といった問題も発生します。これらは本来はWebデザイナーの仕事なのですが、そういったスキルを持っていないWebデザイナーもいます。
写真については放置されたままです。Webディレクターのチェックも期待できないとなると、「あと少し写真を工夫をすれば、サイト全体がよくなる」と、だれも気が付かない可能性も少なくありません。
・カメラマンでもある私ならば、サイト構築の作業中も関与できる
長年カメラマンとしてやってきた私ならば、「サイト全体として考えるならば、写真の組み合わせは、これとこれと、これがいい」「この1枚は、少しアンダー目（暗め）なので再補正したほうがいい」などが言えます。それも、わざわざ「写真をチェックしている」という意識もなく、コーディングをやりながら自然と気が付きます。
実際、ライターとして原稿を納品し、「どう掲載されているか」とチェックして、しばしば「写真はこう変えればいいのに」と考えていました。ただ、あくまで自分の立場はライターです。カメラマンとしても活動していますが、サイトが走り出した後から参加するので、意見を言うとしても自分の記事に直接かかわるところだけです。
もちろんWebコーディネーター、Webデザイナー次第ですが、今後「コーダー」の看板も掲げるからには、積極的に関与していくつもりです。
以下に、同じ写真でもレタッチでどう変わるかのサンプルを1組用意しました。標高1,000メートル以上の山頂で撮り、背景は琵琶湖です。
ずいぶん印象が変わったかと思います。
これは写真について書く記事ではなく、ここで詳しく説明する余裕はありません。それでも一言だけ申し上げておきます。レタッチして写真を変えるのは、「実際にあった光景を変えてしまう」ためではなく、「どんな高性能なカメラでも限界がある。肉眼で見たときの印象に近づける」ためです。
3.原稿の間違いを直す、平易な表現に改める。必要とあらばリライトも
サイトの記事を用意するのには、ライターだけでは不十分です。原稿をチェックし、場合によっては見出し部分までは作るなどのために編集者が必要です。さらには、校正・校閲者もいたほうがいいでしょう。
しかし、現実には「編集者」とは名ばかりで、単に社内の役回りでついただけの人が珍しくありません。そういった場合、基本的な文章ルールさえ知らないのが大半です。また、ライターも資格の必要な職種ではなく、自称でやっている人がたくさんいます。多くの場合、採用するのは編集者なので、どういった人が選ばれるかは推して知るべしです。
校正・校閲者に至っては、Webの世界ではかなりぜいたくな存在です。ほとんどの場合、編集者が兼ねます。しかし、その編集者は先に述べたとおりです。
また、サイトによってはライターなどは使わずに、原稿はクライアントの持ち込みになります。つまり、お客さんが自分で書くのです。多くの場合、Web制作会社は受け取ったそのまま使います。
「文章のプロの手を経ていない文章で作ったサイトが世の中にあふれている」といった状況はこうやってできます。
私ならば、誤字脱字、日本語の間違いぐらいならば、コーディングをやる中で気が付きます。Webディレクターに報連相しながら、私の方で直します。ご依頼があれば書き直し（リライト）もします。何しろ、元は全国紙の記者で、今はWebライターや取材ライターとしてもやっていますので。私がどの程度の文章を書くかは、この記事も参考にしていただければと思います。
誤字脱字などのチェックには、「校正ソフト」を利用しています。これだけで完ぺきに直せません。しかし、時間短縮・労力節約になるのは確かです。
用字用語は特にご指定がなければ、多くの地方新聞社が採用している『記者ハンドブック』（共同通信社）に準拠させます。つまり、「新聞にあるように、平易でありながら、政治・経済、科学、芸術、スポーツなどあらゆるジャンルが表現できるジャンルでもカバーできる言葉遣い」とお考えください。
4.著作権は当然熟知している。コーダーとしても順守は当たり前
サイトは著作権物の塊です。文章や写真で作られているのですから、当たり前といえばたり前です。しかし、Webディレクター、コーダー、ライターなどが著作権をよく知っているとは限りません。
「『ウオーターマークを消して使うように』とディレクターから言われた」といったデザーナーやコーダーの話まで聞こえてきます。「ウオーターマーク」とは写真などに入れた薄い文字や記号のことです。多くの場合、著作権者の名前などが入っています。消してから使おうが、そのままであろうが、著作権者の許可がなければ著作権法違反です。
コーダーに至っては、特にまだ実績らしい実績のない場合に、「模写サイト」をポートフォリオとして掲げている場合があります。模写する元が、「使ってもらって結構です」としているのならば、問題はありません。
しかし、実に多くのコーダーがネット上で見かけただけのサイトを模写の元に選んでいます。中でも多いのが、「慶應義塾大学病院」です。「慶応大学病院」「模写」「ポートフォリオ」でググると無数に見つかります。充実したサイトなので、「これだけ正確に模写できました」とアピールするのに最適だと思っているのでしょう。
慶応大学義塾病院の許可を取っていなければ、著作権侵害です。サイトの趣旨からして、病院側が許可を出すとは思えません。おそらくは模写サイトのすべてが著作権違反です。
彼らの多くは、「○カ月の学習で、仕事を始めることができます」などのセミナーの釣り文句でコーディングの学習を始めた人ではないでしょうか。著作権物などそれまでに扱ったことはなく、学習するとしても後回しになるでしょう。なにしろ、手っ取り早く始めるには邪魔になりますので。「職業人としても未熟」というしかありません。
私は全国紙の記者として、仕事を始めました。その後、同業他社に移り、最初は記者、しばらくしてカメラマンに転向しました。
どちらの社でも、書いた記事、撮った写真・使った写真で著作権を侵害しようものなら首が飛びます。それだけではなく、社としての信頼も落とします。それだけに、著作権については厳しい教育を受けてきました。許可もなく模写サイトを作って公開したり、著作権者の許可もない写真を使ったりは、間違ってもできません。
また、「どの程度ならば大丈夫か」もわかっています。これもほかのこと同様に、コーディングしながらでも、「この文章は、パクリと判定されてしまうかも」「この写真の仕様は許可をとっているのか」を気にしながら作業をすることになります。もちろん、「危ない」と思ったらWebディレクターに相談し、適切な対応をします。
サイトの企画からWordress実装、コンテンツの提供までを1人でやる
Web制作の話の中では、文章や写真は「コンテンツ」と呼ばれます。今まで私はコンテンツの供給者でした。「文章と写真の2つだけでも、両方をプロとしてやれる人間は少ない。私はその『少ない』人間の1人である」と自負しています。
それがさらにコーディングやJavaScriptの組み込み、WoredPress実装までやろうとしているわけです。それには2つの理由があります。
(1)訪問者が絶望的に少ないサイトも多い。中には「どうやら、規約違反をしたらGoogleから課せられるGoogleペナルティーの対象になっているレベル」まであります。苦労して書いたり撮ったりしたコンテンツもドブに捨てるようなものだ。「金をもらったからいい」ものではない。もっと、サイト全体に関与したい。
(2)サイトを作るには、Webディレクター、Webデザイナー、コーダーなどなどたくさんの専門家をそろえるのが理想だ。この記事では触れなかったけども、検索順位を上げるにはSEO対策のメンバーまで必要だ。しかし、中小企業や家族経営規模の焦点には荷が重すぎる。こういったところを対象に、小型のサイトならば1人で請け負えるようにしたい。
これら2つを実現するために、現時点で私がやるべきステップは、コーディングのスキルの習得だと考えています。そのため、今はコーディングの案件を最優先で受けさせていただきます。
この記事は「Web制作関係者の目に留まり、私のことをご理解いただき、コーディングの仕事が来ないか」との下心があって書きました。
もし、少しでも私にご興味をお持ちいただき、ご質問でもあるようでしたら、連絡ください。この note のリンクを貼ったサイトに用意された方法でよろしくおねがいします。すぐに回答させていただきます。
この記事が気に入ったらサポートをしてみませんか？