とあるweb屋の仕事術

とあるweb屋の仕事術

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

仕事の効率化

【Webデザイナー、ディレクターとしての経験を爆上げする方法】場数を踏む。自発的に何でもやる、勝手にやる、面倒なタスクを積極的に引き受ける

Webデザイナーやディレクターとしての 経験を上げたい。でも経験ばかりは、 ある程度の期間を必要とするのですぐに どうこうできるものでもないし、難しい。 そう考えているひとも多いと思います。 たしかに「経験」は他人から得られるものでも ないですし、…

【良記事紹介】meta descriptionのベストプラクティス。指定しない(Googleの自動抽出にまかせる)という考え方

サイトの meta description を指定せずに Googleの自動抽出にまかせる方針のほうが よいのでは、という良記事の紹介です。 www.waca.associates 一部引用します。 実務的に考えると、meta descriptionを1ページずつしっかりと考えるのは、かなりの手間です。…

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

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

【時短ツール】favicon(ファビコン)やWebクリップアイコン、PC・モバイル各種アイコンジェネレーターで一発作成

Webサイト製作時には 設定が欠かせないアイコン類。 favicon(ファビコン)やWebクリップアイコン作成も Webデザイナーのタスクのひとつです。 まじめに一つ一つ作成すると結構な数になるため 各種のアイコン類を作成するのは 面倒ですし、手間も工数も意外…

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

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

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

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

仕事をスムーズにこなすための4つの思考【良ツイート紹介】

仕事がうまく回らないときや 回ってない状況を一歩引いてみると、 何かやり方が間違っていて、 遠回りしているということが 多いですよね。 無駄なことをしていたり、 話をややこしくしていたり、 むずかしく考えすぎていたり、 根本から間違っていたり、 方…

漫画から学べる。ドラゴンボールビジネス論が勉強&参考になりすぎておもしろい!

面白くて勉強になるツイートを 見かけたのでご紹介。 漫画ドラゴンボールの キャラクターやストーリーが ビジネス視点で解説されています。 ドラゴンボールビジネス論①「なぜ、同じ人間なのにヤムチャは凋落し、クリリンは世界一強い地球人になれたのか?」…

普段の何気ない会話から周囲の人間との情報レベルを合わせておくとディレクションやWeb製作フローがスムーズになりますよ

上司や同僚がどんなことを 考えているのかだったり、 いま気にしているWebのトレンドや 技術は何なのか、 よくみるWebサイト、 よく使うWebサービスは何か。 どんな技術書、 参考書・教本を読んでいるかなど、 よく仕事をするひとが 普段どういった情報に 触…

結論から言う、具体的に言う、箇条書きにする。要点をまとめて相手に物事をわかりやすく伝える方法。

Web製作で一番むずかしいのは コミュニケーションです。 デザイン設計やシステム設計、 プログラミングなど実装レベルの業務も もちろん難しいですが、プロジェクトを うまく進行するには、 コミュニケーションスキルが必須で、 いちばんむずかしく、悩まし…

tableコーディングするのめんどくさい。ジェネレーターでサクッとHTML化してしまおう

tableのコーディング・実装に役立つツール のご紹介。 tableのコーディングは面倒なので、 ジェネレーターでサクッと HTML化してしまいましょう。 表のレイアウトをwebサイトに 掲載する際にtableをコーディング する場面はそこそこ多いです。 簡単な表をtab…

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

デザイナ目線でピックアップ、 IT業界・Web界隈の気になる記事まとめ、 2019年5月6日号です。 気になる動向・ニュース Microsoftが丸くなる?新しいデザインのテストを開始へ ほか、学びの多い良記事まとめです。どうぞー。 note.mu www.softantenna.com qii…

Bootstrapの無料のテーマギャラリーサイト Bootswatch が便利&参考になる

Bootstrapとは ウェブサイトやWebアプリケーションを作成するフロントエンドWebアプリケーションフレームワークである。タイポグラフィ、フォーム、ボタン、ナビゲーション、その他構成要素やJavaScript用拡張などが、HTMLおよびCSSベースのデザインテンプレ…

超軽量。ライティング・文章執筆作業にはMac OS専用テキストエディタ CotEditor がおすすめ

僕はコーディング用のエディタと ライティングや文章執筆時のエディタを 分けて使用しています。 コーディング用のエディタは Codaを使用しています。 https://panic.com/jp/coda/ それとは別にテキストエディタ として CotEditor を使用しています。 macOS…

PCの画面上ならなんでも測れる定規・ルーラーアプリがめちゃくちゃ便利。px幅をサクッと確認

Mac限定になりますが便利なアプリをご紹介。 web製作をしていると、幅や高さを知りたいという 場面がよくあります。 レイアウトやバナー、アイコンのサイズ、 余白などなど。 他のwebサイト見ていてサクッとサイズ感を 確認したい。そんなときに便利なアプリ…

ファイル名をキーワードで区切る場合に使用するのはハイフンではなくアンダーバーがいい理由

webサイトの実装で取り扱うファイルは 多岐に渡りますが、主なものとしては HTML、CSS、画像(jpg/png/svg/gif)、JavaScript、PHPあたりでしょうか。 資料作成など含めるとPDFやWord、Excel、PowerPointあたりもよく使われるファイルだと思います。 これら…

Slackの新着・未読をわかりやすく表示。サイドバーのチャンネルリストにバッジをつける方法。

Slackのサイドバーの新着・未読っていまいちわかりにくいし、 見づらいと思いませんか? 僕は長年Skypeを使用してSkypeに慣れすぎてたせいか、 いまいちSlackの未読表示が慣れなくて困っていたのですが、 未読がわかりやすくなる方法を見つけたのでご紹介し…

検索能力は問題解決能力。web製作の現場では調べる力、検索能力のスキルも重要。

組織やチームでweb製作するメリットのひとつ として、知識量と経験値があります。 課題や問題にぶち当たったときに、 自分ひとりの知識や経験だけでなく チーム内の全員の知識と経験がプラスされるので、 解決が早かったり、自分ひとりではたどり着けない ア…

web製作でのメール術「メールは先に書いておく」

web製作や保守運用する場合社内・社外に関わらず、 メールでのやりとりが多いと思います。 今回はメールを先に書いておくメール術を紹介します。 僕がよくやるメール技です。 使いドコロは、タスクの完了報告や進捗報告など、 なにか物事を報告するとき。 た…

いまさら感満載だけど、ガラケーサイトの表示確認に。FireMobileSimulator

いまだにまだ残るガラケーサイト。 受託でweb製作やっていると、 ガラケーサイトを捨てないクライアントも多いです。 特にキャリアの公式サイトを運営している場合は、 捨てる理由があまりないので、そのまま継続という パタンが多いのかなと思います。 下火…

ディレクション力は想像力。「相手」を仮想化して先回りすること。

webディレクションは 対人スキルだという話を 以前書いたのですが、少し別の視点の話。 ディレクションに限らずですが、 web制作は人とのコミュニケーションが 制作進行に大きな影響を与えます。 スムーズに進めるためにはどうすればいいか。 こたえは、 「…

デザインの引き出しの多さが差をつける!デザインスクラップはイラレのアートボードにベタベタ貼り付ける方法がおすすめ

アイデアのひらめきや、 デザインの引き出しを増やすには 普段からクオリティの高いデザインに ふれて目を肥やしておくことが大切です。 ただ見ておわるのではなく、 いつでもそのアイデアや引き出しをひきだせる ようにしておきたい。 いいデザインは反復し…

マルチタスクは小さいタスクから片付けるのが鉄則。

仕事を早くするコツ。 だいたいWeb屋の皆さんはマルチタスクで 同時進行のタスクをいくつか抱えて 日々業務にあたっていると思います。 マルチタスクでは、ひとつのタスクが 滞ったり何かでハマったりして 作業が遅れたり止まったりしてしまうと、 あとのタ…

webサイトの不具合を素早く解決するコツ

webサイトは生モノで、 生き物のように日々変化しています。 動的なwebサイトでは毎日コンテンツが 更新されますし、デバイスやOS、ブラウザ などwebサイトを取り巻く環境まわりの環境も 変わっていきます。 そのためwebサイトは、問題や課題、改善点 が常に…

タスクは抱えるな。なるべく相手にボールをもたせよう。

web制作の現場では、 なるべく相手にボールをもたせておく、 ということを意識してやるとスムーズに 事が進みます。 これはどういうことかというと、 何かしらのタスクを自分のところで 止めておかない、ということです。 自分待ち、という状況をなるべく つ…

メールの返信は早ければ早いほどいい。一次返信をうまく使おう。

web制作の過程で、重要なスキル、メールです。 メールのスキルはほんとうに重要で、 今回は返信の早さについてのお話。 仕事ができるひとって メールも即返信くれたりしますよね。 安心感があります。 逆になかなか返信がかえってこない 人もいます。メール…

デザインカンプやプロトタイプはリアルにつくれ。ダミーテキストダミー画像は意味ないぞ

デザインカンプやプロトタイプ、 モックアップの作成時に、 ダミー画像やダミーテキストをいれる場合が ありますが、意味がないのでおすすめしません。 意味がない、というのは 結局リアルなコンテンツや 具体的なイメージでないとクライアントが 想像できな…

仕様書はいらない。Webサイト製作前の要件定義書/仕様書は幻想である。

Webサイト制作フローのひとつ、 要件定義。 制作前には要件定義書や仕様書を作成し、 その仕様どおりに、実装し製作を進行していく。 「仕様書」これはもうファンタジーです。 妄想も大概にしろと言いたい。 仕様書どおりに進むことは100%ないです。 完璧な…

見逃すな!要望や要件追加はリスケのチャンス。タスク管理、ディレクション術

Webサイト製作の進行中は クライアントから 何かと要件が変わったり、 追加要望がでてくるもんです。 製作側も実際に制作してみないと 気づけない問題が出てきたり、 そのパターンもあったのかなど 進めていて出てくる問題や課題も 多くあります。 どんなに…

クライアントと相性が合わなければメンバーを変えろ

クライアントの担当者と 相性合わないな、 と感じることありませんか。 こういう場合、 コミュニケーションコストもかかる上に、 お互いの精神衛生上もよくありません。 人間なので相性はやはりありますし、 重要な問題です。 合わない相手とやりとりすると…