久々にブログのメンテナンスをした話

PHP とブログシステムのアップデート

ブログのリハビリを兼ねて他愛もない更新です。やったことは下記の2つ。

  • PHP を 5.5 にアップデート
  • a-blog cms を v2.5.1.2 にアップデート

もうじきPHP 7がリリースされるということで沸いているご時世ですが、淡々と yum install --skip-broken --enablerepo=remi --enablerepo=remi-php55 php php-devel php-mbstring php-mcrypt php-mysql を叩きました。

ブログシステムとして利用している a-blog cms (前職の製品ですね!)も久方ぶりにアップデートしました。自分が関わっていた当時の v1.5 のまま利用していたので、最新版にしたら新しい管理ページ、増えた機能 etc により浦島太郎な気分です。

SSL 対応が残ってる

大分前に取得したフリーのSSLはとっくに失効しているので、この機会に Let's Encrypt を試す予定。12/3 〜 の Public Beta 待ちです。その他のタスクリスト的には以下のような感じ。

  • HTML 内の http:// 参照を https:// に書き換え
  • Security/Server Side TLS - MozillaWiki に基づいて nginx の設定を更新
  • Search Console に再登録
  • nginx をアレして HTTP/2 に対応
  • 全ページを HTTPS にリダイレクト
  • Google Analytics の Profile URL を更新

How to Migrate from HTTP to HTTPS とかにチェックリストが延々と載ってます。これから来年は一般のWebサイトも HTTPS 化が進むと良いですね。

久々に遊びで HTML/CSS を書いた学び

普段はアンチパララックス過激派を自認していますが、CSSのみで実現する方法を見かけたので遊びで試してみました。タイトルがあるヘッダ部分の背景あたりが微妙にパララックスしています。あんまり派手だとウザいので、ほぼ気づかないくらいの移動量に抑えていますが...。

手元の MacBook Pro 2015 mid で確認した限りだと、Chrome は問題なさそうでしたが、Firefox と Safari は体感的に FPS が落ち込んでいるような感触...。マークアップ的な制約も少なくなく、実装的なアクも強いのでプロダクションでやるもんじゃないな、と思いました。:P

手元にマシンがなくて IE と Edge は未確認なんだ、ごめん

perspective きかせたらタッチデバイスでスクロールがしんだ...

そんな実装ですが、視差を生むための perspective プロパティの指定が広域に指定されていると、少なくとも iOS でタッチスクロールの慣性が死ぬようだったので、タッチデバイスでは無効にしています。

Chrome46 で object-fit が打ち消されることがあった

Chrome 46 で確認しましたが、同じ要素に object-fitwill-changetranslate3d (ようはGPU送り込み系)を併用すると打ち消されてるっぽい。下記、再現用のCodePen。

See the Pen jWNNzo by Ayumu Sato (@ahomu) on CodePen.

will-change: opacity とかを object-fit が適用された要素のラッパー要素に適用する分には問題がありません。そして↑の再現コードも Chrome 49 (Canary) では再現しなかった ので、まあいいやって感じです。

そんな感じでした

cssnext 便利ですね。Media Queries + flexbox による簡単なレイアウト変更も試してみたり。たまには自分のブログを実験場にして遊ばないとダメだな、と思い直したのでありました。

スタイルの抜け漏れやらは、ぼちぼち直す。


Author

ahomuAyumu Sato

overflow, Inc.VPoE

東京資本で生きる名古屋の鳥類

Web 技術、組織開発、趣味など雑多なブログ。技術の話題は zenn にも分散して投稿しています。

Bio: aho.mu
X: @ahomu
Zenn: ahomu
GitHub: ahomu

Related

Latest

Archives

Tags

Search