とあるweb屋の仕事術

とあるweb屋の仕事術

10年以上現役のweb製作屋さん。web製作雑務全部やる。

クライアント

一緒に仕事したいと思うWebエンジニア/デザイナーはゼロ回答をせずに代案を出す。

Web製作は、社内社外問わず なんといってもコミュニケーションの つらみが多いですよね。 Webエンジニアやデザイナーは クライアントやディレクター、 同じチームや組織のメンバーから 実現方法や仕様の相談を受けることが 多いとますが、こういうときにやっ…

スマホのディスプレイ、画面サイズ、解像度の種類の多さの説明に役立つ記事

モバイルファーストやレスポンシブデザインが 当たり前になってきている最近のWebサイト。 スマホ端末がどのくらい世の中にあるのか、 わかりやすい記事をご紹介します。 少し古いですがまずはこちら gigazine.net 可視化されているのでわかりやすいですね。…

最近よく見かけるCookieの使用を宣言したり使用にクッキーの使用に同意するUIはGDPR対策の一環

海外のサイトでよく見られる Cookie使用に同意するUIや クッキーの使用を宣言して ユーザに案内を促すUI。 ここ最近では少しづつ、 日本のWebサイトでも 見かけるようになってきました。 CNET Japan CNET Japan のサイトではフッターでCookieの使用宣言と同…

サポートセンターじゃねぇぞ!と思っても、Webサイト制作に関係ないクライアントからの質問や相談は邪険にしないで丁寧に応対しよう

Web制作あるあるですが、 クライアントからWebサイトに 関係ないことで質問や相談を 受けることがたまーにあります。 たとえば 「PCが動かなくなった」 「PCを変えたらメールが受信できなくなった」 「印刷設定が変わってしまった」 などなど。 クライアント…

デザイン案を印刷するときの用紙サイズは A3 がおすすめ!企画提案・プレゼンの印象を少しでもよくしよう

Web製作のフローで デザイン案をクライアントに 提案・プレゼンするフローは 必ずあります。 最近だとプロトタイプを作って 実際にブラウザ動かし画面上で 提案し、クライアントに見て もらうことも多いと思いますが、 プロトタイプと合わせて、紙で 印刷し…

デキるデザイナー、ディレクターの条件。相手の時間を奪わない、負担をかけない、考えさせない。

ディレクターやデザイナーが Web製作する上で、手を動かす 実務より大切なことがあります。 それは 相手の時間を奪わない、 相手に負担をかけない、 相手に考えさせないやりとりを 心がけること、です。 気が利くかどうかがデキるWeb屋の条件です。 先日見か…

企画・プレゼン力・提案力を養う。別の視点でみる『誰も教えてくれなかった「余白」デザインがわかる本。けっきょく、よはく。 余白を活かしたデザインレイアウトの本』

今回は、デザインは「余白」が9割 というキャッチの書籍、 「けっきょく、よはく。 余白を活かしたデザインレイアウトの本」 を別の視点で見ると、 企画、プレゼン力、提案の勉強になり いい訓練になる、というお話です。 書籍の内容紹介 この書籍は、 お題…

不具合や技術的な問題が起きたときのガイドライン、テンプレ。クライアントからの質問の質が低い場合は正しく伝えてもらうように誘導しよう

今回はクライアントワークでの コミュニケーションのお話。 先日こんなツイートを見かけました。 技術的な問題で質問する時質問側がちゃんと状況説明できないと難航する。〈悪い例〉サイトが急に動かなくなった!〈良い例〉wordpressで作ったサイトに○○をし…

LP(ランディングページ)制作費用40万は高いのか?相場はいくらか?Web製作の現場のリアルな話。

LP(ランディングページ)の 制作費用に関してこんなツイートが。 LP制作費が40万〜と答えると「たかっ!」っていう人多いです。確かに1ページとして考えるとめちゃくちゃ高いかもしれませんが、目標を達成するための必要な情報を凝縮させる1ページを作るの…

スマホサイトに記載されている電話番号は「<a href="tel:電話番号">」で電話発信用リンクにするべきか

スマホサイトにある 電話番号はリンクにすべきか問題。 店舗を取り扱っているWebサイト であればお店の電話番号が掲載されているし、 会社サイトであれば 会社概要に電話番号が掲載されています。 ECサイト、ネットショップであれば、 特定商取引法に基づく…

Webサイトの修正依頼・フィードバックをどこまでやるかの線引きと仕切り

Webサイト製作の過程で、 クライアントの確認のフェーズが かならずありますが、そのあとには だいたい修正要望・修正依頼があります。 フィードバックというやつですね。 この修正依頼というやつは なかなか注意が必要です。 言われるがままにやりだすと エ…

1画面内に自動で動く要素を2箇所以上いれないようにデザイン設計をしよう

リッチなUIが多くなってきた昨今の Webサイト。 ブラウザでの表現も豊かになり、 情報の見せ方が多様になってきています。 見栄えがいいからと言って、 なんでもかんでもリッチにすれば いいというわけではないので 基本、1画面内に動く要素が2つ以上ある …

Web製作の品質とお金と早さの話

めちゃくちゃ共感、 共感の嵐のこんなツイートがあったので ご紹介。 めっちゃこれいいわ。発注者にわかって欲しい事実。 pic.twitter.com/B4VQZRA0cx — ふぁるこん 7/28-8/2 SIGGRAPH (@makotofalcon) June 19, 2019 品質/価格(安さ)/早さの相関を うま…

使いにくいUIでPVと広告収入が増える?記事を分割するUIが採用される理由

メディアサイトによく見られるUIですが、 一つの記事をページ分割、 ページネーションして 分けるサイトがあります。 ページネーションUI このページ分割することは、 UI/UXとしてはいいとは言えません。 ですが採用しているサイトは多いです。 とくにメデ…

広告バナーには規格がある!2カラムのWebサイトのサイドカラムの幅は広告バナーサイズを基準にするといい

モバイルファーストな世の中ですが、 今日はPCサイト寄りの話。 モバイルファーストとはいえど、 モバイルサイトのデザインオンリーで 考えるクライアントはまだまだ少ないです。 モバイルファーストだけど PCサイトもしっかり構築する、 というかんじ。 ス…

全国展開のWebサイトにおける地域の分け方(エリア、都道府県の区分)

全国規模での コンテンツを取り扱う Webサイトでは必ず地域での セグメントがあります。 コンテンツの検索や、 ぐるなびや食べログ、 不動産のWebサイトのように 入口が地域で分かれていたりします。 ユーザ視点ではあまり意識することは ないかもしれません…

メインビジュアルにスライドショー、カルーセルUIを採用しても意味ない問題

トップページの最上部、 ファーストビューによくある カルーセルUI、スライドショーのあれ。 メインビジュアルとか キービジュアルとか ヒーローヘッダとか いろいろ呼び名はありますが、 とにかくスライドして大きな イメージが流れるあれ。 すっかり定番の…

ランディングページにコストかけるかどうか問題。まじめにやると1サイト制作分のコストかかりまっせ

企業のイベントやキャンペーンなどの ランディングページなんて 無料ホームページ作成ツールで つくればいいじゃん。 と思っている、n太郎です。 お客さんからよく イベントやキャンペーンなどをやるから それに合わせて既存サイトのデザイン枠 の中ではなく…

2019年5月9日の気になるIT・Web界隈の記事まとめ

デザイナ目線でピックアップ、 IT業界・Web界隈の気になる記事まとめ、 2019年5月9日号です。 気になる動向・ニュース Instagram、アカウント停止に関するガイドラインを改定へ LINEアプリ「画像内の文字起こし」機能を追加!画像内のテキスト翻訳も対応 勉…

簡単なお問い合わせやアンケートに便利。webサイトのフォームにはGoogleフォームを活用しよう

当ブログにはそういえば お問い合わせページがなかったのですが、 先ほどGoogleフォームで作成しました。 www.google.com はてなブログでは お問い合わせフォームを作成する 機能がないようで、調べてみると Googleフォームを利用している方が 多かったので…

ペッパーくんに搭載されているタブレットで動作するwebシステム・業務ツールを開発したときの話

3年くらいまえの話です。 以前ペッパーくんに搭載されている タブレットで動作する webシステム・業務ツールを 開発したことがありました。 とくに学びになるような話でもないのですが、 まぁ思い出話的な。 ペッパーくんの胸にあるタブレットは、 なんてこ…

webサイトの画像を簡単には保存できないようにするCSS「pointer-events」が便利

クライアントワークの webサイトの受託案件で たまにくる要望。 「画像保存できないようにしてほしい」 web製作あるあるだと思います。 結論から言うとwebサイトの画像を 保存できなくする方法はありません。 webにあがっている以上、それは どうしようもな…

「それをやる意味...」目的を意識せよ。webサイト、webサービスの改善は見た目から考えるとうまくいかない

経験の少ない営業、ディレクター、 web製作者はなんでもすぐ「見た目」の話をしがち、 というおはなし。 webサイトやwebサービスのリニューアルや、 新規機能の導入といった企画・提案において、 見た目、つまりビジュアルの話をしがち。 本質の目的を無視し…

webページ(HTML)をPDF化するなら mPDF が便利。ただし使えるCSSが限定されるから注意。

「webページ(HTML)をPDF化したい。」 クライアントからそんな相談をされたら mPDF を使いましょう。 受託でweb製作をやっていると このニーズはそこそこ多くて 何回か要望いただいたことがあります。 とはいえPDF化するのも簡単ではありません。 要望を詳…

特定のブラウザだけCSSを調整したいときはハックを使おう

大手のナショナルクライアントの webサイトではいまだにIEが捨てきれずに 動作保証範囲としているwebサイトも多いと思います。 Microsoftが、企業にIE11の使用をやめるように 推奨はしているものの、ユーザの使用率によっては 捨てられないwebサイト、サービ…

スマホサイトの推奨環境・動作保証端末はOSのシェア率で決める。OSのシェアがひと目で分かる「スマタブinfo」

スマホサイト実装・製作の際に、 どのOSを推奨しどの端末を動作保証するかは OSのシェア率を見て決めましょう。 動作保証範囲はサイト製作のはじめにクライアントと しっかり定義していないと、クライアントが 持っている古い一部の端末で表示がおかしいだと…

クライアントからもらう資料のテキストをそのままコピペするとスペースやゴミデータがはいることあるので注意

クライアントから資料をもらって、 webサイトにテキストを掲載するとき。 クライアントは、パワポやWordファイル、 エクセル、CSV、PDF...などなどいろいろな ファイル形式で送ってきますよね。 実装あるあるなんですが、 それらのファイルからテキストをコ…

【メモ】winmail.datという添付ファイルはGmailに転送したら見れるよ

今日クライアントからの メールで「winmail.dat」という添付ファイルを 受け取りました。 これたまーにあるんですよね。 いつもは再送お願いしたりしていたのですが、 そもそもこれなんなのというので調べてみると、 winmail.datという添付ファイルを受け取…