WP案件を、今ではなんとなくこなせるようになっているものの、PHP自体はあまりちゃんと理解できておらず。サーバーの保守管理のようなものも苦手。データベース関連とか未知の世界で。いう部分に理解がないとWPって取り扱うのが結構しんどいです。自分の本当に頑張れる範囲はHTML+CSS、時々jQueryってところだよな、と思うと、そのほかの部分に頑張る余力が、ここしばらく本当になくなってきたなーと、思っていたのです。WPサイトの面倒見るのが実はしんどいと気が付いてしまった。前任者が作ったWPサイトの中身がわからなすぎて、クライアントのオーダーで修正したいと思っても、社内でどうにもならないWPに限らず、安いからといってオープンソースのシステムを使っていると起こりがちな問題のように思います。社内にWPに詳しい人がいるなら、問題なく安全に取り扱える人がいるなら大丈夫だと思いますが、そう出ないなら、ちょっと立ち止まって考えてみてもいいかもしれません。WPのアップデートに使っている時間を考えて見る2017年7月から1年間の間に、WPは22回のアップデートをリリースしました。そのうち8回がセキュリティアップデートでした。最低限としてセキュリティアップデートのみを対応し、年間8回アップデートの対応をしたと仮定しましょう。その際に行われる作業を、ちょっと細かく書き出してみます。1アップデートの通知を受け取り内容を把握2先方にアップデートの必要ができたことを告げ、実施スケジュールを確認、その日の更新は控えてもらう3当日、まず諸々バックアップ4アップデート(何もなければ数分で終わる)5サイトの見え方や管理画面の挙動を確認6ちょっとトラブってその解決に時間が取られる7仕様の変更などがあって、先方に操作の仕方を伝達、マニュアルの書き換え8アップデートのレポートを先方に伝達という感じで、平均2時間ぐらいかかったとして、年間で16時間です。意外と少ないですか?でも管理しているWPサイトが10個あったら10倍です、160時間。アップデートが必要なくなったら。年間で16時間、そのクライアントに対して時間を使うことができたら、何ができそうでしょうか?お客様のサイトをささっとチェックして、コンテンツに対するアドバイスができるかもしれません。これを2月に1回ペースで行ったとして6時間ほどとしましょう。その中でもっとうまくするアイデアを思いつくかもしれません。残りの10時間近くがあれば、もしかしたら素敵な企画が出来上がるかもしれません。社内にわかる人間がいないからという理由でCMSの管理を外部委託するなら、Webサービスを使うのを考えて見るのはどうでしょう。しんどくても、なんとか知識を身につけて自前でWPの面倒をみることも多少なりとメンテ契約という費用としてお金になるのは確かなのですが、CMSのセキュリティや思ったように動き続かせるために力を取られると言うことは、本来力を注ぐべきところ、例えばコンテンツのクオリティをあげるとか、ユーザーのニーズを探るとか、UI/UXを向上すると言う方へ力が回らないと言うことです。本来、その部分がお金になる方が、コンサルを兼ねたウェブ制作をする場合、本当に成果の上がるウェブの制作を目指すと言う場合において、意味があると思います。WebサービスとしてCMSを利用する場合、オープンソースのCMSを使う場合と比べて、ウェブサイトとして使える機能は、大抵の場合、減ります。そこがおそらく大きな違いです。そこを補って余りあるのが、使える機能は限られるが、間違いなく「使える」と保証されていることです。マニュアル通りの使い方の範囲で、と言うことになるでしょうけれど。アップデートして使えなくなった、おかしくなった、と言うことが起こるリスクは減ります。不具合があれば、必ずサポート対応してくれるでしょうし、使い方の問い合わせなどにも対応してくれる場合があるでしょう(そのための利用料金ですよね)。MTのWebサービスの場合、サーバーにインストールする方法のものと違って、Webサービスはそこでしか使えない便利機能もあるそうです。使ってみませんか?コミュニティに参加している時点で回し者なので(冗談です)、いや、それ以上に、使えそうだな、と思ったので、お伝えします。Type.net」を検討してみませんか。安いライトプランの利用料は年間25,000円(年間一括払い)です。・サーバー込み・メールサーバーはない・独自ドメイン使える・無料SSLが使える、プランによっては持ち込みSSL証明書も使える・無料で使えるテンプレートがある・テンプレートはカスタマイズ可能なので独自のデザインもOK・カスタムフィールド使える・項目の編集可能なメールフォームが使えるなどなど。他にも説明を聞きながら便利が機能があるなあ、と思ったのですがそれはまたいずれ。正直なところでは、今のところ、ライトプランだと機能が限られているので、案件によってはすすめにくい可能性があると思いました。様々未検証なのでなんとも言えないですが。ブログに毛が生えた程度でお問い合わせフォームがひとつあればいい、と言うぐらいの案件であれば、ライトプランでいけます。独自ドメインで、一応独自ドメインのメールも使って、と言うぐらいでライトプランを利用したとすると。約3,000円(年間)と言う感じで概ね年間30,000円(税抜)ぐらいと試算できます。(CMSのアップデートの作業は無くなりますが、使い方の問い合わせなどをお客様から直接サービス提供会社に連絡するのはハードルが高い場合などを考え、サポートについては別途料金設定をする必要があると思います。)ひとつのWPのアップデートに年間16時間使っていたとして、1時間5,000円のコストと考えると、年間8万円(税抜)。差額は50,000円。10サイト管理しているなら10倍です。この試算には嘘がありますが、少なくともアップデートに使っていた時間は浮くはずです。それを儲けのある仕事に割り当てることができるなら、もしくは社員の勉強の時間や、残業を減らせるなら・・・ちょっと、心揺れませんか?心揺れたかもしれない、と思うウェブ制作者の方はぜひ評価版を試して見てください。評価版の申し込みはこちら。TypeにコメントWPサイトデザインのコツ(ちょっと知ろうCSS編)前回、デザインカンプを受け取るコーダーが何を考えてWebサイトを作っているかについて、自分を参考に、お話ししました。今回はコーダーの主なお仕事である、CSSを書くこと、そのCSSについてちょっとだけ知ってみよう、というお話しです。Sheets(カスケーディングスタイルシート)」というもので、スタイルシートとも言ったりします。HTML文書に対して、人間の目に見える部分の「装飾」を一手に担っているデータです。この見出しを実現しているCSSとはこの見出しは見出しレベル3<h3>というタグでマークアップされています。これに対しかけられているスタイルは以下のようなものです。1.1852em;}フォントのサイズや行の高さ、上下のマージン(空白)などが設定されています。フォントの太さについての情報がありませんね。その記述を探して、CSSのファイルを上の方に遡ると、こんな記述がありました。700;}見出しについて、各見出しレベルまとめて設定があります。回り込みを解除することと、フォントの太さについてです。文字の色については、ここにも書かれていませんが、さらに記述を遡ると、この文書全体を表す<body>タグについての指定で書かれています。1.6;}実際には、下記のような順でスタイルが記述されています。1.1852em;}<body>要素では文字の色、フォントの種類(ファミリー)の次に、フォントサイズや行の高さについての指定があります。文字色やフォントの種類についてはこのbodyに対して書かれた設定が反映されていますが、フォントサイズや行の高さについては、最後のh3について書かれた設定が反映されています。これがCSSの特徴と言えるカスケーディングの仕組みです。詳細な指定で記載してあったり、元のものよりも後に記述することで、設定を上書きしていける一方で、特に指定がなければ親要素・先祖要素に遡って書かれているスタイルの設定が反映されます。最初の方に基本的な設定を書き、共通しているものはその設定を使い、特別な設定が必要なものを後回しに書いたり、詳細度をあげて記述することで、部分的に上書きしながら、全体のスタイルを書き上げていく、ということをしています。レイアウトの中から共通項を見つけ出す作業をし、最初にまとめて書いてしまうということをやっています。パターンを見出したり、共通できるものはまとめておきたい、というのがコーダーの頭の中には常にあるわけです。カスケーディングの良さと難しさ共通ものをベースにして、個別の設定をそのあとに書いていく、という基本の構造があり、効率よく書いていくというものの、ひとつのサイトに利用するCSSが3000行以上になることも珍しくありません。それらの構成を把握しながら、順序立てて書いていても、途中でスタイルが変更になったり、追加のレイアウトが増えて行ったり、などが繰り返されると、共通の部分がどこで、そのあとのどこでどう上書きされているかの関係性を見失ってしまう場合もあります。複数人で開発している場合には、ルールが必要にもなるでしょう。全部それぞれ別々に書けばいいのでは?身もふたもないですが、そういう風に考えることもできます。共通の部分など考えず、ひとつひとつ全て別々に書けば、思った部分だけを修正できるのではないか?しかし実際そういう風に書いたとするとCSSファイルはとても量の多いものになり、レイアウトに何か共通の修正が入った場合は、それぞれに直す必要もあり、手間がかかります。これを避けるために、コーダーは共通部分はまとめたいと強く願うのです。いうのほんとありえない、、、になるわけですね。文字のCSSを見てみるCSSプロパティというウインドウパネルを出して、テキストを選択すると、そのテキストのCSSをみることができます。これらの積み重ねで、Webサイトはその形を成しています。まとめCSSについてもっと詳しく知りたい方、書けるようになりたい方は、そのための教本を探していただくことにして、ここでは詳しく書きません(書ききれません)。以前、HTMLとCSSをちょっと書いてみる連載を書いたので、もっすごい基本的なマークアップやCSSの話をしているのでそちらをご覧ください。次回からはもっと具体的な、デザインを作る時の考え方について書きます。カテゴリー:WebデザインあれこれWPサイトデザインのコツ(ちょっと知ろうCSS編)にコメントWPサイトデザインのコツ(コーダーの頭の中編)Webサイトを作る時のデザイナの役割について前回書いてみました。今回は、デザインを受け取って実際に起こす作業をしているコーダーについて書きます。DTPもあとの作業である印刷の工程に知識のあることが作るものの質を変えるように、Webデザインも、デザイナのあとの工程にあるコーディングやそれを担う人が何を考えているか知ることで、デザインが変わると思っています。デザインそれ自体も大事ですが、デザインカンプを受け取り、デザイナの思惑を読み取って、Webサイトとしての最終的な形を作る「コーダー」が何を考えて作業をしているのか、ちょっとのぞいてみたいと思います。私の頭の中か・・・・・。遊ぶことしかないようですけど。悪って何?デザイナの意図を読み取ってデータにするコーダーがデザインカンプを受け取って何をしているかというと、写真にもあるように、デザインデータから、CSSを書くためのあらゆる数値や情報を読み取ります。私はそれをデザインカンプをプリントしたものに、とにかく書き込んでおきます。あとから見返すことも結構多いので。WebサイトにするにはHTMLとCSSとでデザイン要素をデータに還元して、ブラウザが解釈して表示できるものに変換しているのです。画像データやアイコンなどのデータをデザインカンプから書き出す作業もします。自動化できないの?それができたらコーダーの仕事がなくなってしまう・・・・の、ですが、部分的に自動化することはできますし、試みられてもいます。Illustratorでは文字周りのCSSを書き出せるようになっています。それらを活用すると、コーダーの負担が減るかもしれないですね。効率的にCSSを書きたい!コーダーの思いWebサイトを仕上げていくとき、コーダーの頭の中には、こんな考えがあります。CSSは後々でも管理しやすいように、わかりやすく簡潔に書くべき(なぜならWebサイトは繰り返し改善する=あとで修正の必要があるから)HTMLに余計な要素を書くべきではない(マークアップにはルールがあり、正しく簡潔に書くことが求められている)なるべく共通のパターンで整えたい、ルール化したい(そうしとかないとあとで分からなくなる)(毎回別々のレイアウトパターンのものを作るとかは手間である)などです。そんなコーダーをイラっとさせるのが、以下のようなこと。いうことがあると「デザイナーの気まぐれか?」「レイアウトはその時の気分かよ」「余白の取り方に一貫性とかルールとかないわけ?」などと、頭を抱えてしまうことになります。それでも、理由があれば、いいのです。「ここはこれまでの流れとトーンを変えて目立たせる必要があるので、フォントやレイアウトに差をもたせます」など、など。本当に作るときに間違えてずれてしまった、とかならば、仕方ないのですが、問題は、読み取る方には「意図がある」のか「うっかり」なのかはっきりわからないことです。デザインカンプだけから意図を探ろうとするのがまず、無理筋です。デザイナは、意志を持ってそのレイアウトを決めているなら、コーダーに向かって「見出しはこういうスタイル、空白は基本Xピクセルで、例外はどこのページのどの部分、本文サイズはどれぐらいで、行間はゆったりさせたいのでフォントサイズのX倍とっています」など、意図を伝えればいい。コーダーから疑問点を確認すればいい。社内ならともかく、デザインとコーディングを全く別の組織の人間が受け持つことも少なくないので、それらのコミュニケーションに手間がかかることもあって敬遠されるのかもしれません。デザイナ側に経験やCSSなどの知識が乏しいと、何をどう伝えていいのかわからないこともあると思います。それを上手にするためには、まず一言伝えてみること以外に、上手くなる方法もないと思っています。まとめデザインの後にあるコーディングのことに少し興味を持ってもらえたら何よりです。効率だのパターン化だの、つまらん話だ、と思われましたかね?もちろん、デザインに素晴らしい意図が読み取れ、それがWebサイトを構成することに欠かせず、その効果を遺憾なく発揮してWebサイトの目的を達成するだろう、と信じられる場合には、こちらもやる気が出ますけど。なんとなくWFから指定された要素を組み込み、なんとなくこんなもんかで形にして、自分にだけわかるルールで整えて、それっぽくなったからOK?クライアントが気に入ればOK?で作ったものは、すぐわかります。コーダーだけじゃなくて、ユーザーも。デザインデータをもとにせっせとそれを実現するのがコーダーの仕事ですけど、予算には上限が存在し、使える時間も限られている。一度作ってしまえば終わりではなく、何度も修正繰り返していく前提なのです。どんな細かい無茶振りな指定にも答えます!というわけにはいきませんからね。わがままデザインにならないようにするには、何をポイントに考えればいいのか、このあとの回で書いていきたいと思います。WordPress.プライバシーポリシ。