2018年2月14日に加筆・修正をしました。凝った作りのWebサイトは、どうしても重くなって表示速度が落ちます。画像やCSS、javascriptも圧縮しているのに、なぜか重い。そういうケースに遭遇したので試したことを残します。画像の圧縮率を上げるページを重くするのは結局、画像です。TinyPNGなどのサービスで画像を圧縮するのが手軽です。また、gulpを使用している...

セレクタは右から左に解釈されるため、セレクタの階層を減らせばレンダリング効率は上がるようです。とはいえ、実際のCSSの管理を考えると必要以上に手間をかけるかどうか悩ましいところなので、できるだけ意識する程度で良い気もします。特にSassでCSSを書く場合、その書きやすさから階層を深く書いてしまいがちです。検証として機能モジュール別にクラスを管理...

先日、MacBook Pro 13インチ Early 2015 を購入したついでに、AnsibleとHomebrewを使って開発ツールやアプリのインストールをできるだけ自動化してみたので、その備忘録を残します。Xcodeのインストール何はともあれXcodeが必要なのでターミナルでインストール。sudo xcodebuild -license下記を言われた後にダイアログが出たのでインストール。xcode-select: note...

エディタをNetBeansからSublimeTextに移行し始めて1ヶ月と少し。だいぶ環境に慣れてきたので、欲を出してGruntを試してみました。SCSSからCSSへの変換処理だけなら、これまでどおりで良かったのですが、機能ごとに分けて作ったJSの結合もやってみたいと思っていたのがGruntを試した理由です。Gruntを導入する工程を、残しておいたEvernoteのメモから転記します。...

先日、WebサイトをiPadにも対応させてみようかと思っていると、Twitterのタイムラインに、iPad Detection Using JavaScript or PHPという記事を発見。ご覧になっている方も多いかと思います。User-Agentを判別した後、それをどう使うかは状況によって様々だとは思いますが、記事で紹介されている内容をCSS振り分けに使うとどう なるのか、試しにやってみました。...