2014/04/10
昨日あたりから各ニュースで取り上げられていますが、
中でもギズモードの記事がよくまとまっています。
「ネット史上最大級のバグ発見。カナダは確定申告を緊急停止、危険度は10段階の11レベル？」
タイトルは充分に反射でクリックしてもらう事を狙ったセンセーショナルなものになっておりますが…この場合、見る側にも充分すぎるメリットがあります。
海外で、しかも検証されたものだけのリストですが、
https://github.com/musalbas/heartbleed-masstest/blob/master/top1000.txt
危ないリストも乗っていますね。ここの10番～57番が該当の危険性がある、つまりこのサイトにユーザー登録したり、クレカでお買い物していたりしたら情報抜かれている可能性があります、という事のようです。
上記は海外だけのデータですが、このバグ、Apache等Linux系のサーバOSなら割と多く（ちらっと見ただけでもCentOS、Debian、FreeBSD、Ubuntu）該当してしまうようで、弊社が見た限りでは日本でもApache使っているサーバさんはかなりの量がありましたので、対岸の火事ではないでしょう。
今頃、各レンタルサーバでは担当の方がチェックし、パッチをあてていると思いますが（弊社ではサーバをお奨めするときはマネージドサーバしかお奨めしておりませんので、弊社がお奨めしたサーバでは、黙っていても管理者がそのような作業をしています）
この穴、存在自体は2012年からあって、発見（報告？）が本年3月との事で、完全に楽観はできない状況のようです。
windowsxpのサポート終了やSTAP細胞関連のニュースに埋もれがちですが、実は結構なビッグニュースではないかと思います。
2014/04/09
本日を持ちまして、Windowsxpのサポートが全て終了となります。
これに伴い、弊社では確認対応ブラウザのうち、IEの最低限を原則「IE9」に変更させて頂きます。
IEの強制アップデートは以下のページの通りで、
http://technet.microsoft.com/ja-jp/ie/hh859701.aspx
普通にwindowsupdateを使用している方でしたら、
windowsxp→最終的にIE8
windowsvista→最終的にIE9
へとブラウザが強制アップデートされています。
このうち、windowsvistaは2017年4月までサポートが有効となりますので、最低限を原則IE9とする、と判断させて頂きました。
勿論、上記のアップデート状況にも例外がありまして、強制アップデート阻止プログラム（Blocker Toolkit）等を導入なさっている方等は、IE8以下のブラウザーが残っているケースもありえます。
ですので、レイアウト構造だけは、IE8でみても崩壊しない構造とします。（おかげで使えない記法がいくつも…）
2014/01/15
弊社ホームページを2014年版にリニューアルしました。
今回のポイントは
■スマホ最適化のためレスポンシブデザイン導入
■もうIE8は切り捨てると決めて、CSS3を使用しはじめた
あたりになります。
閲覧ユーザー中のスマホの比率は年々上がってきていますが、去年あたり特に大きなインパクトがあったらしく、もはや最適化なしではこの先不安、という状況になっておりましたので、レスポンシブデザインを採用してみました。
弊社のように更新するページが一部分に限られているサイトの場合、本来はモバイル向けに別ページを作るほうが向いていると思いますが、単純にレスポンシブデザインやってみたかったので、やっちゃいました。
今年の4月を持ってWindowsXPのサポートが全て終了＝IE8終了となるわけですが、CSS3を使うにはまだIE9というもう１枚でかい壁が残っています。このあたりでどのような構築にするか悩んだ訳ですが、やはりレスポンシブデザイン優先…という事で、IE9以下のブラウザには、余分な読み込みになりますがcss3-mediaqueries.jsを使わせてもらう事にしました。
他に擬似要素やアニメーションなど、対応していなくてもレイアウトが崩れないような場所にはCSS3を使いまくっています。
あと１つのネックはHTML5対応なのですが…いい加減各陣営仲直りしてもらいたいものです。
2013/10/08
きつい見出しになりますが、久しぶりにMakeshopを覗いてみてびっくりしました。
未だにMakeshopではdoctypeが出力されません。
こう書いた時点で、コーディングに理解のある人なら、ああ…と思い当たるかと思いますが、
doctypeが無い（※html5の !DOCTYPE html が書いてある、という訳ではありません。doctypeそのものがないのです）という事は、IE8はおろか、IE9で見ても標準で互換モードになってしまうのです。
試しにサンプルショップをIEの開発者ツールを開いた状態でみていただければ、「ドキュメントモード：IE5Quirks」という寒気のする文字が見られると思います。（IE10だけは互換モードが進化しているので無事）
しかも、カテゴリーリストや商品一覧の表示が、現在もう先進的なサイトでは完全にCSS3に移行している所も多くなっているこの時勢に、未だにガチガチのテーブルコーディング、しかもtableの多重入れ子になっています。
とにかくIE9でもしょぼい互換モードになってしまうので、それ相応の対応をしなければなりません。
IE=edgeいれときゃいいんじゃね？とお思いかもしれませんが、Makeshopは決められたMeta以外ヘッダをいじらせてもらえないのです…
即ち、互換モードが既定になってしまうのを防ぐ方法はないのです。
いつまでこんな時代遅れの設計にしておくのでしょうか。
2013/10/07
ニュース記事より
「ＸＰ期限切れ、自治体「攻撃めったにない」」
それを言ったら、地震などの災害だって滅多にないから対策が遅れても大丈夫、てことになるじゃないですか。
仮にも「ＩＴ推進課」でこういう事言っていられるのは、ある意味羨ましくあります。
致命的な状態を招いても自分の生活に影響しないからこそ、安穏としていられるのでしょうね。
2013/10/04
先月末あたりから、ディレクトリ登録サービス宛てにgoogleからリンクにnofollowを付与するようにというメッセージが来た、という話をちらほらみかけるようになりました。
まだ提案段階でペナルティの実働はないようですが、弊社のSEO解説ページでも前々から書いております通り、googleの目的は一貫して
「自社のキーワード広告以外にお金をかけてgoogle検索上位表示させる仕組みを潰す」、即ち商売敵を潰すという事でしょう。
サービスを売る側の立場としては、うちのコンテンツで優位に立ちたかったらうちに金を払うのが当然、という姿勢は営利企業としてこれまた当然ですので、この点はどうこう言えません。
問題はこの先、いつになるかは不明瞭ですが確実にYahoo!ディレクトリ等のほかのディレクトリ登録サービスにも同様の影響が出てくるであろうという事、そして当然ながら、近いうちによくある「リンク○個保証」と謳っている被リンクサービスにもその影響は及んでくるでしょう。
（勿論、多数の自社運営サイトでそれぞれちゃんとオリジナルのコンテンツを運営しているような所なら話は別ですが）
上記の通り今はまだ影響は些少なようですが、なにせgoogleは全ての判断をオートマチックで行う、というのがポリシーの会社ですので、怪しいと思われる行為はしないにこした事はありません。
影響が些少な今のうちに有為なコンテンツを増やしたりする地道な施策を併せて行っておくのが正解かと思います。
2013/07/11
ブラウザーチェックをばっちりやって納入したのに、IE8やIE9でレイアウトが思い切り崩れていると言われる。
見せてもらうと、まるでIE6やIE7で表示したような崩れ方。
この症状の場合、ほぼ100%そのIEの「互換機能」がONになっているのが原因と思われます。
互換機能という名前からして「いいもの」と思われがちですが、実のところは「IE8以上でもまともに動かなくなるような旧い旧いシステム（…どんなものか想像もつきませんが）を搭載したWEBサイトでも、IE8以上で見られるようにする」という機能で、端的にいうと「解釈をIE7程度に戻す」という機能です。
いわば、「旧式ブラウザー表示機能」と言えます。
…しかし先にも書きました通り、マイクロソフト自体がIE6/IE7を撲滅しておきながらこの機能、一体なんなんだと言わざるを得ません。
この機能を制作側で回避するには2つ方法があり、
1、Doctypeをがっちり書いておく…HTML5のDOCTYPEにしておけばIE9/IE10では最初から標準モードになるはずですが、ASPの利用などでそうもいかない場合もあり、そもそもIE8がこぼれてしまいますので
2、METAタグを書く
< meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1" />
と書く事で、モードを強制的にそのIEの「最新Verでレンダリング」に固定でき、互換機能ボタンを消せます。
—————-
余談ですが、この機能、IE8や9ではあまり心配する必要がありませんでした。
ちゃんとボタンとして独立しているため、意図的に押さない限りまず発動しませんし、自分で押した結果レンダリングが変わったというのが分かるので、もう一回押せば元に戻る、というのもすぐ分かるためです。
ところがIE10になって、ボタンのデザインが…
こんなですよ。(※紙が破れたようなマークが互換ボタン）
どう考えても「再読み込み」と間違えておします。
このレイアウト考えたデザイナー、なに考えてるんでしょう。
普通こんなん上げてきたらグーで殴られてもおかしくない酷さだと思います。
—————-
IE10へのバージョンアップがはじまった今、今後はもう上記のをデフォで書いておく必要があると思いますが、問題は…
このタグ、ヘッダのかなり上、おそらくはエンコードのすぐ下くらいの順位で書かないと場合によっては動作しない事があります。なので弊社が得意とするカラーミーSHOP-PROなんかでは使えない方法なんですよね。
※カラーミーSHOP-PROのMETA追加はヘッダ内の「一番下」に追加される
実際やってみましたが、IE8/9では対処できたものの、IE10では互換ボタンがでたままという…
肝心なIE10が対処できないという結果でした。
2013/07/03
WordPressとMovabletype、どちらが良いか。
WEB制作系のブログを書く人なら、一度は必ずネタにする話ですね。
勿論、うちはDrupal!Joomla!や、カスタマイズされた有料CMSパッケージサービス！という方も沢山いるとは思いますが、やはり日本でCMSのビッグタイトルといえばWPとMTというのは確実なところかと思います。（※海外ではWPが圧倒的です）
日本でもいうまでもなく今はwordpressのほうが優勢ですが、弊社はMovabletypeをお奨めするケースがあります。
—–
CMSを導入するお客様にとって、大きな「障壁」が3つあります。
（１）ひとつは（CMSに限りませんが）プレーンなWEBに何かシステムを追加する事による「セキュリティの問題」
（２）もうひとつは万一のデータベース破損による「バックアップの問題」
（３）そして最後が「直感的な管理画面の問題」です。
上記のうち（１）はwordpressが圧倒的に優れていますね。今まで見てきたCMSの中でも、WPのアップデートのしやすさは秀逸です。管理画面に「アップデートのお知らせ」がでたら「このボタンを押せばＯＫ」と嫌でも分かるこのインターフェイスは実に素晴らしいです。OPENPNEあたりはこの簡単さを是非見習ってほしいものです。UIというのは「分かる人だけ分かればいい」というものでは絶対にありません。
（２）はwordpressにも優れたバックアップツールがいくつもあり、自動的かつ定期的にバックアップを取ってくれます。一方Movabletypeは基本のバックアップ機能はいちいち手動操作ですが、そもそも静的HTMLを吐き出すシステムなので万一のDBクラッシュが起きてもとりあえづホームページが見られない状態にならない、というのは非常に大きなアドバンテージです。
※Wordpressにも静的化プラグインはありますが、どうも動作関連や他プラグインとの相性で問題があります。
※wordpressはクラッシュが起きたら修復するまではWEBサイトは壊れたままです。
まぁ今時のレンタルサーバは大抵データベースのミラー化を採用してますのでこのような事態はまずありませんが、ごく稀にRAIDを採用していないレンタルサーバもあります。某大手とか…
で、弊社がMovabletypeをお奨めする大きな要因になるのが、以外にも（３）です。
Wordpressもカスタム投稿タイプの導入により、コーナーの分類はMovabletypeと互角の仕様になったと言えますが、管理画面がどうしても、それぞれのコーナーへの入り口が縦一直線に並んでしまいます。これが弊社としては、わかりづらいと感じています。
（勿論管理画面自体を改造すれば解消できますが、そこまでの予算をかけられない場合が多数ですので…）
MovabletypeはWEBサイト→それぞれのコーナー→それぞれのカテゴリとツリー式になっているため、WEBに不慣れなお客様でも分かりやすい管理画面構造をしているのがポイントなのですね。
—–
ですので弊社としては、
頻繁に更新するページが一箇所のみ、もしくは少ない→Wordpress
全てのページをある程度更新する可能性がある→Movabletype
という風に提案を分けております。
あ、あとあれですね、どうしても特定のメールフォームを使いたいというかcontactform7以外を使いたい時。
あとハウジングの同居数が多そうなサーバだと、静的HTMLを出してくれるMTのほうを使いたいです。
投稿時は圧倒的にWPのほうが速いのですが、それは投稿する側の快適性の問題であって、閲覧する側はプレーンなHTMLで見られるのがより良いのではないかと思っています。
…勿論、プラグインの関係で、どうしてもWordpressでないといけないというケースもあります。
今は大抵の要件はjqueryのプラグイン導入でどうにかなりますが、そうもいかないケースもやはりありますからね。
2013/06/19
弊社のようなお客様から受注して作業するタイプの業種の場合、どうしても、「案件を抱えている最中なのに、ヒマ」という状況がたまに発生します。
お客様からの返信待ち、素材提供待ちの時間がそれにあたります。
で、２時間ほど空いたので、突貫でブログデザインを作ってみました。
以前レスポンシブデザインの基本的な勉強用に作りかけていたフレームを流用したもので、
幅はまだ可変になってませんが、段階的な寸法（スマホサイズ/7インチタブレットサイズ/それ以上）でレイアウトが可変するようにしました。
無段階可変でなければ、まだまだ計算が楽なうちですね…。
見返してみたらpreタグのとこが突き抜けちゃってかっこわるいですね。なんとかせねば。
構造は、Wordpressテンプレートの本当に基礎の基礎、絶対ないと困る
header/sidebar/footer/function/index/css
の6ファイルだけでできています。
functionの機能もadminバーを消す
wordpressのバージョンを消す
サイドバーのウィジェット化、の3点だけです。
まさに余計なモノが一切無い状態。3Dモデルでいうとボーンだけの状態です。
Wordpressのデフォルトのテーマはとかく構造が複雑なので…おそらく全ての機能を動かす必要がある以上、そうなっているのだと思いますが、こういったシンプルな基本機能のみのテーマが一個あってもいいかと思っています。
必要に応じて後から肉付けしていけるタイプ、みたいな。
ちなみにテーマのソースコード全部足しても500行ないです。短！
2013/06/16
実に４年以上ぶりに、弊社サイトをリニューアルしました。
ただこのデザイン、２年前に作成しかけで、業務に手一杯になり放置されていたものを完成させたもので、
現時点で作りたかったものではありません。
※コンテンツ文章の見直しなども全然できていませんし
いつまでもTOPにFlashを置いている事態だけはなんとしても一刻も早く改善したかったので、このような
２段階のリニューアルに踏み切った次第です。
あくまで「つなぎ」の状態ですが、今後とも宜しくお願い致します。
このブログのテンプレートまで手が廻らない状態ですので、しばらく既存のテンプレートを使用しておきます。
