画像や Google Fonts のチラつきが気になったので datauri を使って改善

背景画像が占める領域が大きいので読み込み時のちらつきが気になる。(Chromeを使用) これは画像のキャッシュが効いていても解消されませんでした。 ※GIF画像。更新を連打しています。 キャッシュをしていても、結局のところ「スタイル読み込み → 画像の非同期読み込み」と...

実際に使い倒している、ブラウザ上で使えるWebフロントエンド開発に役立つ13サイト

ブラウザ上で使える開発が便利なるツールやサイトっていっぱいあるけど、ブックマークに入れていても一回も使わずに肥やしになる物も多いです。 なので、今回は実際に使ってるのと、使う機会がそこそこあったサイトだけを紹介してみます。 リファレンス系 Mozilla Developer Ne...

Twitterの動画が140秒まで可能になったので最適解を求めて仕様を確認してみる

最近Twitterの動画投稿による長さの制限が30秒から140秒になったのでTwitterの動画の仕様を調べてみました。 とりあえず Twitter Developers Twitter Developers に動画の仕様が書いてあります。 https://dev.twitte...

ブログを改装したので、一から作るブログテンプレートの作り方の一例を紹介

ブログのデザインを改装しました。 数ヶ月に一回しか更新のないどうしようもないブログですが、コーディング意欲を発散するのにはもってこいのオモチャです。 そんなブログでもいい加減更新しないとなぁと思ったので、今回はブログのテンプレートを作った時の個人的な手順を記事にしました。 デザイ...

CSSだけでできる!overflow:hiddenを使用した画像の中央トリミング決定版

overflow:hiddenしたボックスの中に画像を入れて、画像の縦横を:100%なんかしちゃったりしてトリミングすること多いと思うのだけど、最適なCSSを探してもどうも日本の記事は情報が古い記事が多い。 そんなこんなで世界各国の記事を探してたどり着いたトゥルーなトリミング...

黄ばみ、バッテリーの膨張からPS3コントローラーを救った話

今までPS2のコントローラーでPCゲームを遊んでいましたが、スティックの誤入力が増えてゲームにならなくなった。 いい機会なのでXboX360コントローラーを買ったものの、スティックの誤入力が多くてこれまたゲームになりませんでした。 仕方がないので部屋の隅で放置されていたPS3のコ...

AngularJSはWebサイトのテンプレートエンジンとしてだけ見てもなかなか使える

AngularJSは色々な事ができるし少し難しい印象もあるけど、基本的な機能だけ使っても便利だよーって話。 AngularJS(あんぎゅらーじぇいえす) Javascriptのフレームワーク。 MV*(Model-View-ほにゃらら)設計。 データバインディング...

「.co」ドメインの実力について調べてみた

ノリだけで「.co」ドメインで作ってしまったこのサイト。 元々はコロンビアに割り当てられているドメインらしい。 .coは、国別コードトップレベルドメインの一つで、コロンビアに割り当てられている。管理は、1991年の割り当て以来ロス・アンデス大学が行っていたが、 Arcelan...

手抜きをこじらせてSVG画像一枚のみのWebページを作りました

「デザインからコードを起こすのが面倒。画像をそのままWebページにできたらいいのに…。」って思ったことありませんか? そんなあなたの怠惰な望みも、SVG画像でレスポンシブデザインにも対応しつつ実現できるかもしれません。 この記事ではSVG画像がベクター画像であるという特性を...