Web制作特有の工数

わりとよく耳にするような話で、「チラシのデザイン5,000円ぐらいなのにWebページ1ページがなんで何万円もするのか?」というのがあります。
私自身はそういうことを直接、クライアント様から言われたことはありませんが、「なんとなくそう思われているんじゃないかな」と感じるときはたまにあります。(^^)

印刷とWebは全然違うものなので、そもそも比較することは出来ないのですが・・・
たしかに、ショップなどでも実店舗を作るよりWebサイトを作った方がよっぽど安いとか、印刷だったら部数分の印刷代が掛かるからWebの方が安上がりだ、というのはその通りかもしれなくて、だからこそコストメリットの点でWeb制作は優れているということにもなるわけですが、
Web制作にもそれなりの世界があって、それ相応の工数(手間)がいろいろと掛かりますので、簡単な事例で説明したいと思います。
(コンピュータなので、なんでもワンタッチでできてしまえば、我々ももっと楽に商売が出来るというものですが・・・)

 

例えば「すでにサイトにアップされている画像を差し替えたい」という場合、
(ブログやCMSなどのようにユーザー自ら、今ある画像を削除して新しい画像をアップしなおすという場合ではなく、あくまで制作者がCMS管理画面を使わずにファイルを更新する場合)

(1) 新しい画像を作って用意する。
もしPC表示用とスマホ表示用の2種類の画像がある場合は2種類用意する。

(2) HTMLファイル上(またはCSSファイル上)に書かれたファイル名を新しいファイル名に変更する。
ファイル名を変えない場合は、キャッシュ防止のため(後述)ファイル名の後ろに日付などの文字列(クエリー文字列)を書き加える。

(2-1) CSSファイルに画像のURLを記述している場合は、キャッシュ防止のため(後述)HTMLファイル上のCSSファイル名の後ろに日付などの文字列(クエリー文字列)を書き加える。

※PC表示用とスマホ表示用の2種類のHTMLやCSSがある場合は、それぞれに同じ対応を行う。

(3) 画像ファイルとHTMLとCSSをサイトにアップする。

(4) 正しく表示されているか、それぞれの端末で確認する。

※いきなりサイトを修正・確認するのが問題がある場合は、テストサイトで一回、上記の作業をしてから、本番サイトで同じ作業を実施する。

※キャッシュ防止とは?
ウェブサイトを閲覧するソフト(ブラウザ)には、前に見たページをパソコンに記憶して、次回アクセスしたときにページが変更されていない場合は記憶されたページを見せるという「キャッシュ」の機能があります。
ですので、ファイル名が同じ画像ファイルをアップすると、以前のファイルと同じだと判断されて、記憶された古い画像を表示してしまいます。
それを防止するために、HTML等に書かれたファイル名を変更する必要があるのです。

 

というわけで、たった1枚の画像を差し替えるだけでも、担当者はこれだけの作業をすることになります。
個人の趣味のサイトでしたら、単に同じファイル名の画像を作ってアップするだけでも良いですが、商用のサイトではやはりきちんと作業したほうが、更新した内容がより確実に訪問者に届きます。

上記はあくまで
Web制作には「いろいろ細かくてシビアな工程がある」
ということをお伝えするための例です。

実際にはクライアント様のワークフローや制作側の環境、サイトの作り方等によって更新や確認作業の手順も異なりますので、参考としてご理解頂けましたら幸いです。

ブログを自分のサーバーで運営すること

ブログを自分のサーバーで運営する(および制作のプロに作ってもらう)ことのメリットと注意点を少し挙げておきます。

例えばフリーのブログサービスでブログを立ち上げていて、「こういうことが出来ない」という状況になったときに、別のサービスに乗り換えたりすると思いますが、そうすると一般的にはURL(ドメイン)が変わってしまったりリダイレクト(従来の検索エンジンの評価を引き継ぎながら転送する)が出来なかったりします。
また、ブログサービスが仕様変更をした場合に、それを受け入れなければならない場合も有り得ます。

最初から自分のサーバーでブログを運営していれば、そういう制約は無いですし、欲しい機能やデザインを実現してくれるプロに依頼すれば、より思い通りのブログに進化させることも可能です。また、単にブログにとどまらず、幾つかの固定ページや専用のお問い合わせフォームなどを持った「ウェブサイト」へと拡張させて行くことも可能です。

ただし、制作のプロによってレベルや得意分野が異なるので、希望をはっきりと伝えて、対応可否を確認することは必要だと思いますが。

それと、フリーのブログサービスは、多くのユーザーが利用することを前提に企画され開発されたシステム、デザインバリエーションを持っていて、機能・操作面でのクオリティや安全性は高いものです。
個人的に制作しようとするブログをそれと同じクオリティーにすることは困難なので、プロに頼めば何でも出来るとは言えない、ということは承知しておく必要があります。

謹賀新年

IKEA KOBE

あけましておめでとうございます。
皆様にとって楽しく素敵な年となりますよう、お祈り致します。

昨年は幾つかの新しい出会い、意義のある仕事、に恵まれ充実した一年となりました。
お声がけを頂いて、お仕事をさせて頂き、喜んで頂けることで達成感を得られる機会がこれまでより多くあり、ようやく世の中のために役に立っている実感がわいてきました。

また、昨年末に事務所(兼自宅)を移転し、これまでより大阪・神戸等へのアクセスがしやすくなりましたので、進んで人に会うようにしたいと思っています。

今年も引き続き、ご期待に応え、結果を出すべく努力してまいりますので、どうぞよろしくお願い申し上げます。

PS.
写真は昨年末、IKEA神戸に行ったときのもので、カフェの照明が気に入ったので撮りました。

Designing in the Browser への移行

レスポンシブ対応デザインなど、1つのリソースでマルチデバイスに対応する可変レイアウトのデザインは、今とこれからの大きな流れだと思っています。

HTMLがもともといろいろなデバイスで閲覧することを考慮して作られているので、技術の進歩やモバイル端末の普及により当初のイメージが現実になったと捉えています。

ページのレイアウトなどの視覚デザインは、今まではデザインイメージをグラフィックツール(例えば FireWorks、 Photoshop、Illustrator)で作成して、クライアント様に確認頂いてからHTMLコーディングの作業に入っていました。

しかし、レスポンシブデザインになると次のような課題が生じます。

(1) 現状は少なくともパソコンとスマホの両方のデザインをクライアントにお見せする必要がある。
(2) コーディングした結果のサイトをイメージしながらデザインする必要がある。
(3) ナビゲーション(メニュー)の動き、その他、動的な効果についても確認の必要がある。

そのため、最初からコーディングを行なって実際のサイトを作りながらデザインしていくという Designing in the Browser の考え方でデザイン制作を進めるほうが効率的で正確であろうということなのです。
また、Webフォントを利用するケースが標準的になってくると、実際のサイトで確認するというフローが一般的になると思われます。

どんなデザインもこの制作フローで出来るとは断定できませんが、システマティックなデザインならばこの方法でやっていけると考えていますし、複雑なグラフィック要素はグラフィックツールを使用して作成し組み合わせることになります。計画段階での全体的なサイトイメージやレイアウトのようなもの(ワイヤフレーム)は必要になる場合もあるでしょう。

今後はこの Designing in the Browser を基本に制作を進めていきますが、その手法については未知の部分もありますので、やりながら考え勉強していきたいと思っています。

制作の実務的なお話

実務的なお話はあまりしたことなかったかと思いますが、うちの仕事の大半が実務(普通そうですかね?)なので、最近の実務についてご紹介しておきたいと思います。大きく3つの内容に分けて書いておきます。

pepper

1.請負によるコーディング・その他

制作会社からのご依頼によりサイト構築をしています。現在、特定の会社様とのお取り引きがあります。
Fireworks や Photoshop でデザインされたデータを頂き、そこからHTMLコーディング、Javascript(jQuery)等のスクリプト実装、WordPressでのサイト構築、専用CMSを使用したショップサイト構築、またサイトによってはPHPでのアプリケーション製作と実装、などもしています。

つまり、デザインから後の(またはHTMLコーディングから後の)サイト構築全般を請け負っています。

2.一般の会社からのご依頼によるサイト構築

上記と異なる点は、一般のクライアント様からのご依頼に対応しているところと、デザインや企画面にも対応しているというところです。制作のご相談があった場合、ヒアリングしてからご提案とお見積もり、デザイン・・という風に進んで行きます。

ネットショップのご相談の場合は、企画面に入り込んだお話をさせて頂く場合もあります。商品の種類、内容、売り方等によっては、ネット展開してもあまり効果がない場合もあるので、その辺りの判断も含みます。

当方のクライアント様は、デザイナーの方もおられて、デザインをご自身でなさりたいと仰られる場合もよくありますので、その場合は基本的なイメージデザインをして頂き、そこからサイトに適用させるためのデザインを当方で行ないます。その後、コーディング他、サイト構築を全て当方で行なわせて頂いています。

最近ではスマホ、タブレットなどへの対応、いわゆるサイトのマルチデバイス化をしている関係上、基本デザインで全てを決めることは困難であり、個別の形態に合わせたデザインのアレンジが必要になります。

3.今後の展開

一般の会社からのご依頼に関してましては、当方であまり強くない部分(デザイン・SEO)をそれぞれの専門家にお願いしてチームで制作に当たっていくのが望ましく、状況に応じて判断していきたいと考えています。

ページトップにもどる