読者です 読者をやめる 読者になる 読者になる

Webサイト専門プログラマの言いたい放題

元システムエンジニアがサイト制作とプログラミングについて好き放題しゃべります。

サイト制作実務の話

【伝えない希望は叶わない】

たとえ仕事を依頼する相手のほうが その分野のことに詳しくても、 「こうして欲しい」 を具体的に伝えることができなければ、 期待通りのモノは出来上がってこない。 なぜなら、 作る側は、提供された情報で作るから。 言われてもいないことを、 想像で作っ…

【フロントエンジニアがサーバーエラーに挑む】

ものすごいアクセス数を集めている メディアサイトで頻繁にサーバーエラーが 発生して見れなくなり、困っているという ご相談をいただきました。 レンタルサーバーのログ解析ページを見て、 サイトに大きな負荷をかけているページの ランキングを割り出すと…

【更新しやすいホームページとは】

診療時間や料金表など、 追加や変更が生じやすい箇所を 全て画像で作ってしまうと、 ホームページが制作者の手を離れて、 画像ソフトを使えないクライアント様の 手に引き渡したあとで困ります。 「ちょっと文字を変更したいだけなのに、 画像ソフトがないか…

【パトラッシュ・・・】

結局、IE8互換対応の先陣を 切ることになりました。 「互換用のjsプラグインが いろいろ転がってるから、 簡単に対応できるだろ?」 とかすぐに言いたがる 現場を知らないエンジニアに 言ってやりたい。 『じゃあアナタがやれば?』 『簡単なんでしょ?』 と…

【IEはウェブ制作者を苦しめる】

いったん納品を終えた とあるサイト構築案件で、 IE8への互換対応が 必要だという話になりました。 制作側の関係者が、 コスト・信用ともに手痛い ダメージを被ることに。 私には直接的な飛び火は していませんが、気の毒です。 本件のコーディングでは、 ・…

【こうしてプロジェクトは暗礁に乗り上げる】

ワイヤーフレームはサイト制作の骨格であり、 制作サイドとクライアントが唯一同じ情報を 共有して、「あーでもないこーでもない」を 相談できる設計図です。 だから、ワイヤーフレームで手抜きをすると、 後ろの工程であるデザインやコーディングで 必ず露…

【レスポンシブ案件の危険ポイント】

ディレクターがレスポンシブサイトの 制作手順について熟知していない場合、 PC用のデザインが出来上がった時点で コーディングの工程に入ろうとします。 するとコーディングの担当者は、 「このサイト、スマホで見たときは どんなレイアウトにすればいいの…

【Zen-Cartをダウンロードして思ったこと】

ショッピングカートのプログラムとして 有名(?)な、Zen-Cart。フリーです。 ダウンロードしてみて感じたのは、 「これはもはや単独のプログラムではなく1つのシステムと考えたほうがよい。」 ということです。 ただ単に商品をカートに入れて メールで注…

【見積交渉におけるRetina対応とレスポンシブ】

レスポンシブという言葉は浸透してきましたが、 Retinaディスプレイへの対応をするかしないかで 制作の手間が変わることや、Retina対応の必要性を 考えておられるクライアント様は少ないようです。 そんなクライアント様と見積交渉する上で、 Retina対応の必…

【ECサイトの送料ルール変更プログラム】

某スイーツショップのECサイトで 複数エリアへの配送に対応するように プログラムをカスタマイズしています。 プログラムは考え方1つ間違えると どこかで必ず不具合が起こるので、 通常のパターンだけ動作確認してOKでも 安心できません。 プログラムが想定…

【5つ☆評価をいただきました】

サイト構築案件についてクライアント様から 評価をいただきました。良くも悪くも、直接 自分への評価を頂けるのは、フリーランスの 醍醐味ですね。 感謝☆☆☆☆☆

【FullCalendarでイベントをポップアップ】

某Web学習サービスのフロントコーディング。 大きな山場を超えて明日、納品予定です。 BootstrapをCSSのグリッドシステムだけでなく、 アイコン(ウェブフォント)やナビゲーション、 スライダー、モーダルなど各種コンポーネントを ふんだんに活用したサイ…

【高機能なイベントカレンダープラグイン】

仕事で出会った便利なカレンダープラグインをご紹介します。日別にイベントを挿入できるjQueryのカレンダーです。ビューや日付のレンダリング完了イベント(コールバック関数)が 用意されているので、動的にカレンダーの中身を書き換え可能です。イベントデ…

【コーダーに求められるスキル】

スマホユーザー層を取り込むために、 Webのアプリやシステムのフロントを レスポンシブにする需要が多い模様。 必然的に、スマホでの操作に反応して スライドやメニューを動かす「動作」を 組み込むことも求められています。 かつての、デザイン通りの「静止…

【ツールチップ連動&レスポンシブなプログレスバー】

達成率を表すとき使われるプログレスバー。 バーの表示原理は意外とシンプルです。 ・背景色の違う2枚のボックスを重ねる ・手前のボックスに style="width:80%;" のように 横幅をパーセントで指定する これだけです。 バーの幅をCSSファイルに記述しないの…

【ミステリアスでクールでスタイリッシュなダンディズム?】

今日は、とある商品LPの原稿を書いています。 思いつく言葉がことごとく自分に似合わなくて 苦笑してしまいますw 全然ミステリアスじゃないし、 クールとは正反対のオトボケ系だし、 スタイリッシュじゃないし、 ダンディズムなんて意識したことがないw …

【6時間集中コーディング】

パワーポイントで好きなように描かれたデザインを、 画像なしのフルテキストでCSSのみでコーディング・・・ って、すごく疲れました。 ピクセル単位の計算を要するので、 普段はアクセサリに入ってる電卓をよく使います。 ・セルの斜め線 ・リストの自動段組…

【ECサイトのプログラム解析】

ネットショップの送料計算ロジックを 複数のお届け先ごとに別々に計算する ように変更したいというご相談があり、 システム的にカスタマイズができるか どうかを見極めるために、 プログラムの流れを解析しました。 結論、仕組み的には可能ということが わか…

【「シリウス」のテンプレートをWordPressテーマ化】

仕事でシリウスのHTMLサイトをWordPressに載せ替える案件をやっています。 シリウスそのものを使ったことはないけれど、 生成されたHTML自体はとてもシンプルな印象を受けます。 テーマ名は「Procyon」にしました。 おおいぬ座の一等星がシリウスなので、こ…

【発注者も制作者も知って欲しい120年ぶりの民法改正】

システム開発に限らずWeb制作に関わる 全ての人に知って欲しい法改正です。 ・イラストレーター ・デザイナー ・プログラマー など、制作側の人だけでなく、 仕事を発注する側のクライアント様にも。 今まで、モノ作りにおいて、制作物に間違いが あった場合…

【いまさらスマホ対応?っていうときのCSS】

PC専用サイトって言ってたのに、後から 「スマホでもちゃんと見れるようにしたいんですけど」 って言われることありませんか? スマホ対応は最初の段階で想定しておくからこそ 「レスポンシブ」という言葉は現実味を帯びることができます。 でも残念ながら、…

【プログラミングで一番大切な心構え】

純粋なHTMLサイトの構築もやっていますが、 実務ではWordPressが一番多いです。 大半の時間は、調べごとをしています。 たとえばこんなページで構文を確認したり、 WordPress の関連 URL、パスを呼び出す関数、定数色々 | WordPressの開発テクニック集 WP Ti…

【翻訳もウェブプログラマーの仕事のうち】

海外製品を扱うランディングページで 一部翻訳が必要だったので、 Google翻訳とか単語の用例を調べて 和訳しました。 入試英語の読解問題を問いてるような 懐かしいひと時でした。 難しいですね。翻訳って。 1つの単語にはいくつもの翻訳候補が あるので、…

【エンジニアとして最高に嬉しいこと】

お客様と一緒に1つのモノを作り、 お客様と一緒に達成の喜びを分かち合い、 お客様に感謝され、 お客様に感謝をする。 エンジニアとしてそれほど嬉しいことは 他にありません。 「スーツを着た労働者」と揶揄される、 システムエンジニア(SE)として会社に…

【ホームページの熱い部分を見るツール】

あなたのホームページをユーザーがどこまで スクロールして見てくれたのか? どのリンクが一番クリックされているのか? ユーザーがマウスを動かす手を止めて、 じっくり見てくれた場所はどこなのか? といった情報を、サーモグラフィのように 「熱い部分」…

【要件提示はクライアント様の責任】

クライアント様経由でエンドユーザー様から サイト構築の素材・情報を受け取ったのですが、 サイトカラーを1つに決めていただかないと デザインが開始できないと伝えてあるのに、 なぜか2つの案が返ってきました(笑) いったいどっちにしろと(^^; た…

【ネットショップ復旧までの8時間】

ちょうどお昼すぎに連絡が入って、 夕方の外出を除いて8時間かかって ようやく復旧できました。 クライアント様からユーザーさんに、 きちんとバックアップの方法とか 「どんなときバックアップが必要か」 を教育していただかないといけない。 そう痛感しま…

【福沢先生を破り捨てる勇気に乾杯】

エンドユーザー様が操作ミスをして とあるショップのレイアウトが崩れ てしまったという連絡が入りまして。 修正する私にとっては、 「なんでそんなデリケートなボタンを よく分からないのに押すの?」 と思うのですが、ユーザー様は 「うーん、よくわかんな…

【Wordpressの事業サイト構築サポート】

とある国際事業のサイトを再構築するため 当該企業のウェブ担当の方(生徒さん)と 打ち合せをしておりました。 サイトを訪問するユーザーがどんな視点で どういう順番でどんな情報を見たいのか、 という観点から、サイトの導線についての ご意見を聞くこと…

【公開中のホームページのメンテナンスは深夜にやるべき】

※記事の最後にプレゼント企画のご案内があります。 ウェブサイトとかシステムの修正は ユーザーのアクセスが少ない夜間に 行ったほうが良いですね。 仮のテスト環境を用意していない 場合は、少しでもユーザーさんに 修正中のページを見せないように。 どう…

【不正アクセスと改ざんの対応】

昨日の続き。結局、サーバー会社の 杓子定規な対応に業を煮やした知人は 私に依頼してくださいました。 どんな情報を手掛かりにどんな対処を したのかは置いといて、サイトを持つ 人に言っておきたいことが一つだけ。 「ソフト任せでサーバーのことを 知らな…

【ワードプレスに不正ファイル混入事件】

しばらくご無沙汰していた生徒さんから 事件の連絡がありまして。 他所のデザイナーさんにワードプレスの カスタマイズを依頼したところ、 最近セキュリティ上の不具合が出ている とのこと。 ちょうどそのデザイナーさんに依頼した 日以降のタイムスタンプに…

【レスポンシブの注意点】

ferret plusに大事なことが完結に書いてあったので 抜粋します。 ▼抜粋ここから=============== 特に「コンテンツを精査しスマートフォンの 小さな画面でも閲覧しやすい情報構造が必要」 が重要で、PCサイトありきで「レスポンシブ」 に対応…

【アジャイルとウォーターフォール】

www.nec-nis.co.jp ITシステムやWebサイトなどを構築 する手法に、ウォーターフォール型 やアジャイル型というのがあります。 (ほんとは他にもいっぱいある) ウォーターフォール型というのは、 その名の通り水が流れ落ちるように 構築の手順をいくつもの工…

【生徒さんとのコラボが決定!!実務の裏話が聞けるのは今だけ】

ワードプレスの個人レッスンを受講していただいていたとある生徒さんから、 サイト構築を部分的に手伝って欲しいというご相談をいただきました。 ご本人のサイトではなく、クライアントさんのサイトを作るためだそうです。 私が担当するのはプログラムの部分…

【海原雄山とサイト制作】

とある業界で営業を中心とした ベンチャー企業を経営している 社長さんから、ホームページを 再構築したいとご相談を受け、 予算内で可能な改善ポイントを 探し出しているのですが、 「HPを誰に見て欲しいのか?」 「どういう印象を与えたいか?」 「どんな…

【見えないものにお金を払う価値はあるか?】

ホームページ関係のやり取りで、 ときどき問題になるのが打ち合せ。 これは会社や人によって考え方が 違うのかも知れませんが、 私は次のように考えます。 (1)発注する可能性がある場合 ホームページは制作に入る前に決めて おかないといけないことが多々…

【FF6がFF13より高い】

うおー!見積おわったー! 気付いたら外は真っ暗。 で、何の見積りかというと、 昨日面談した生徒さんからの作業依頼。 WordPressで会員制キュレーションサイト 作りたいそうなので、プラグインの相性を 確認した上で見積り作成をしてたんだけど、 見積りよ…

【Cookieの保存と取得でカウントダウンタイマーを実装】

今日はWordPressのサーバーエラー調査に引き続き、 Cookieを使ったカウントダウンタイマーを実装しました。肝になるのがCookieの書き込みと取り出しです。 Cookie(クッキー)とは? Cookie(クッキー)とは、一人一人のパソコンに個別に 保存されるデータの…

【Cookieの保存と取得でカウントダウンタイマーを実装】

今日はWordPressのサーバーエラー調査に引き続き、 Cookieを使ったカウントダウンタイマーを実装しました。肝になるのがCookieの書き込みと取り出しです。 Cookie(クッキー)とは? Cookie(クッキー)とは、一人一人のパソコンに個別に 保存されるデータの…

aspxやphpのサイトカスタマイズ見積について

aspxは動的サイト とあるサイトのレスポンシブ対応について見積依頼をいただきました。 ユーザーを選択してログインするサイトで、URLこそ見かけはHTMLですが いわゆる静的サイトではなく、aspxというサーバーサイドプログラムで 動的にHTMLが生成される動的…

【Webサイト緊急トラブル解消 -原因究明の考え方-】

とあるネットショップでページの更新ができなくなったという緊急トラブルが発生。 半日かかって分かった原因は、プラグイン同士の優先順でした。 最初は、 1.DNSの設定ミス、漏れ 2.パーミッション 3.ショップの設定ファイル 4.サーバーの設定ファイ…

MovabletypeからWordpressへの移行方法

MT(Movabletype)からWP(Wordpress)への移行について、 お世話になっている知り合いから相談をいただきました。 年末までに数百ページもあるブログとホームページを MTからWPへ移行しなければならないというのです。 ブログはMTからページのデータをダウンロ…

ショップのシステムエラー復旧

HTMLレッスンの準備をしていたら携帯に電話が。 一瞬、不安がよぎりました。 「お世話になっております。ちょっと困ったことがありまして」 ネットショップに導入した決済用モジュールを ウェブサーバーからFTPで削除したところ、 管理画面もショップもサー…

ネットショップのシステム運用サポート風景

ネットショップって、管理画面の中でサイトデザインのカスタマイズ以外に 商品情報の登録など、いろいろできるシステムになっているのですが、 最初から用意されている以外の設定をしたい場合に悩むんですよね。 「これってどこかで設定できるの?」 「シス…

【Webサイト制作の相場がわかるサイト】

howmuchdoesawebsiteco.stやってみたところ、日本円で250~300万円 の相場だという結果がでました。 そんなにもらっていませんが・・・(笑) もっともらっても良いのでしょうか? よほど日本の相場が低すぎるのでしょうか? ページ数も機能的にもそこそこの…

【あなたのコードは見られている】

とある大手サイトから手を引いた デザイナーが手掛けていたページに、 地雷が仕掛けられていました。 夫婦で昼からずっと、修復をしましたが、 あまりの酷さに溜息が。 「どこの誰だよ、こんなの書いたのは」 「これって初心者同然じゃないか?」 「何でここ…

【お金に関わることなので】

サイト制作でお金に関するページといえば サービス内容や料金を掲載するページだと 思います。 大事なページなので慎重になりますよね? 今ちょうど通販サイトの料金計算を変更 するカスタマイズを行っているのですが、 商品ジャンルによって計算が変わるの…

【制作会社と金額交渉】

諸々の事情で深夜作業や制作ページが 増えたことによる請求額の変更について 制作会社と交渉することになりました。 関西人の私としては、お金の話をする時 「いくらになりますか?」 『そうですね、300万円』 というベタなジョークで場を和ませてから 真面…

【後ろにも前にも目を向ける理由】

サイト制作には工程があります。 ・要件定義(目的、機能設計) ・企画構成(レイアウト、ページ構成) ・デザイン ・コーディング ・搭載(実際のサーバーに載せる) ・動作確認 ・納品 といった工程があり、それぞれの工程に 担当者がいます。 いくつかを…