Evolution of <img>: Gif without the GIF
Colin Bendell is a performance and ideas junkie. He is co-author of O'Reilly's High Performance Images and part of the CTO Office at Cloudinary. tl;dr GIFs are awesome but terrible for quality and performance Replacing GIFs with <video> is better but has perf. drawbacks: not preloaded, uses range requests Now you can <img src=".mp4">s in Safari Technology Preview Early results show mp4s in <img> t
入門者向け alt属性の書き方アドバイス
入門者向け alt属性の書き方アドバイス Web Accessibility Advent Calendar 2017
【レポート】ラスベガスでパスポートの盗難・紛失に遭ったらすべきこと #reinvent | DevelopersIO
はじめに AWS re:Invent(以下re:Invent)は、2012年の初回から毎年ラスベガスで開催され、2017年の今年で6回を数える事になりました。規模は回を重ねる毎に大きくなり、今年は日本から1000人を超える参加があったとのことです。 これだけ多人数が参加すると、パスポートを盗難されたり、紛失する機会も増えてくることが想像され、その場合日本に帰国するために何をどうすればいいのか、事前に情報を知っておくに越したことはありません。本エントリでは、パスポートを失った際の具体的な対応方法を、実例を元に確認します。 パスポート盗難・紛失時の対応方法 盗難はともかく、パスポートの紛失は気付くのは早いに越したことはありません。下記は飛行機から降りた直後に機内に忘れたことに気付いた場合です。 [re:Invent2017] とっさの事故にも困らないために 〜パスポート遺失編〜 #reinve
JavaScript の実行を最適化する | Articles | web.dev
JavaScript の実行を最適化する コレクションでコンテンツを整理 必要に応じて、コンテンツの保存と分類を行います。 JavaScript は多くの場合、視覚的な変化を引き起こします。それはスタイル操作を通じて直接行われることもあれば、データの検索や並べ替えのように計算によって視覚的な変化が生じることもあります。タイミングの悪い JavaScript や実行時間の長い JavaScript は、パフォーマンスの問題の一般的な原因です。このような影響は可能な限り最小限に抑える必要があります。 JavaScript は多くの場合、視覚的な変化を引き起こします。場合によっては、スタイル操作を通じて直接行われる場合もあれば、データの検索や並べ替えなど、計算によって視覚的変化がもたらされる場合もあります。タイミングの悪い JavaScript や長時間実行される JavaScript は、パフ
Morph anything [ GSAP MorhSVG / AI ] by Alaric Baraou on CodePen
Cool right ? Must be hard to do this... Well it's absolutly not ! We'll see step by step how you can reproduce this with your own illustrations ! Requirements Greensock MorphSVGPlugin (for free on Codepen!) And TweenMax Adobe illustrator ( CC in this tutorial ) Some vectors to play with ( We'll use some from www.flaticon.com ) Basics knowledge of SVG / JS / HTML / CSS *Special Note* Hi ! I apologi
Vue.jsでD3.jsを使わずにグラフを実装する - Qiita
Vue.jsでグラフ を実装するサンプルコードを探すとD3.jsを用いている例が結構見つかります。 しかし本当にD3.jsが必要なのでしょうか？ この記事ではD3.jsやその他グラフライブラリを用いずにVue.jsのみで実装したグラフについて解説します。 TL;DR SVGでおｋ グラフコンポーネントにSVGのテンプレートを書く テンプレートに必要な値を computed でじゃんじゃん作る デモとリポジトリ デモ： https://haribote.github.io/vue-graph-demo/ リポジトリ: https://github.com/haribote/vue-graph-demo 折れ線グラフ、棒グラフ、円グラフ、の3つのグラフを実装してみました。 データの内容はプロ野球における直近5シーズンの年間入場者数です。 NPBが公開している統計データからJSONを用意しました
「この部屋に漆黒の闇をもたらして……」とGoogle Homeに命じて消灯してみる
「この部屋に漆黒の闇をもたらして……」とGoogle Homeに命じて消灯してみる：山口真弘のスマートスピーカー暮らし（1/2 ページ） スマートスピーカーやその関連デバイスについて、試行錯誤を繰り返しつつ、機能をバリバリ使えるようになる（予定）までの過程を、時系列でお届けする本連載。今回はGoogle Homeで家電製品をコントロールできるスマートリモコン「Nature Remo」の設定例を紹介する。 赤外線リモコンで操作可能な家電製品を、「Google Home」から音声でコントロール可能にしてくれるのが「Nature Remo」だ。利用にあたっては、まずスマートフォンから家電製品をコントロールできるように設定し、その後外部サービスを使って、Google Homeと連携させるという手順を踏む。 前回の記事では、スマホから家電製品をコントロールするための設定手順を紹介した。今回はWebサ
Gravit Designer
Accessible everywhere The web-based vector graphics app that empowers you to create on any device. Design your creative projects in a user-friendly tool with intuitive, powerful features and save your projects to the cloud to access them anywhere there’s a web browser. Easy to learn and use Kick-start your creations with diverse, curated templates. Enjoy a smooth learning curve without unnecessary
グリグリ動くUIをVueとSVGでサクッと書く - No Regrets in Bathing
これは Vue.js #3 Advent Calendar 2017 – Qiita 4日目の記事です。 こんにちは。SVGで色々なコンポーネントを作っているものです。最近の作品は下記のような感じです。 Webでグリグリ動くUIを作りたい！！という一心でやっています。 これらはほとんどSVGとVueの組み合わせのみで作っています。依存が少ないというのは大事で、ライブラリ間の相性でハマったり、いろんなドキュメント間を往復することがなくなります。 Webでグリグリ動くUIを作るのは基本的にめんどくさいです。jQuery pluginを駆使して作るのも闇が多いですし、divやcanvasをゴリゴリするのも結構手間がかかります。 ですが、最近はSVGで高度なUI実装されることが増えてきた気がします。特に自分が衝撃を受けたのは、CacooがFlashからSVGにスイッチしたことです。 nulab-i
12 月 2 日になると iOS 11.0/11.1 が突然再起動を繰り返すようになった原因 - 家計簿アプリ Zaim
何が起きていたのか？ 既報の通り、12 月 2 日未明より一部の iOS デバイスが数十秒に一回再起動のような動作を繰り返し、操作不能になる OS の不具合が全世界で発生しています。Zaim もこの影響を受け原因調査と対策を実施しましたので、技術的に判明したことをこのエントリーで開発者向けに共有します。 なお、iOS 11.2 では解決していますので、まだアップデートしていない方は早急にアップデートをお願いします。 iPhone が再起動を繰り返す不具合 12 月 2 日に発生 「iOS 11.2」リリース、高速無線充電対応など iPhoneの連続再起動の不具合も修正 実際には OS が再起動していたわけではなく、SpringBoard と呼ばれるホーム画面などを管理している内部のアプリケーションがクラッシュを繰り返していました。 （時計アプリにも不具合があったようですが、こちらの現象は
Asepriteでドット絵を描く - Qiita
記事で解説しているAsepriteのバージョンは執筆時の最新版であるv1.2.5-bate2になります。 Asepriteとは？ スプライトアニメーションとドット絵の制作に特化した有料ペイントツールです。 公式サイト：Aseprite - Animated sprite editor & pixel art tool エースプライトと読みます。 公式サイト 発音動画：Aseprite - Pronunciation ドット絵制作に特化したペイントツールはEDGEやGraphicsGaleなどがありますが、Asepriteの特徴はこんな感じです。 Windows、Mac、LinuxどのOSでも使える アニメーション制作に便利な機能がすごく豊富 ソースコードがGitHubで公開されている 現在も開発中で、機能追加、バグ修正などの更新が活発に行われている 有料 海外製のソフトのためインターフェイ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
俺的MarkdownにおけるXSS - Qiita
stone #1 書く気分を高めるアプリの開発｜日本デザインセンター