IE対策の「X-UA-Compatible:IE=edge」は必要か？
HTML ヘッダーの見直しをしている際に、理解した内容の覚書です。 次のような記載について考慮している方が対象です。 <meta http-equiv="X-UA-Compatible" content="IE=11"> or ...
Webページでユーザデータを保存する方法
URL URLに指定してデータを保存する。 URLの最大長問題があるため、最大で2,048文字（IEのURL最大文字数）までに抑えたほうが良さそう。 短縮URLと組み合わせると、URLの見栄えも良くなる。 例 GitHub - nwtgck/nipp: 🎒 ...
JavaScriptなしでGoogleAnalyticsデータを収集する
はじめに JavaScript無効環境では、analytics.jsやgtag.jsでデータ収集することはできません。そのため、別の方法でデータ収集する必要があります。 ここでは、 Measurement Protocol を利用して、データを収集します。 Measurement...
古いブラウザに自動で polyfill を適用する
古いブラウザへのes6対応です。 古いブラウザにも一応対応したい。ただし、煩わしいことはしたくない。最新ブラウザでpolyfillによるコード量増加などの悪影響を防ぎたい。とかの場合に使うといいかも…。 ただし、HTML5やCSS3、JavaScriptの最新構文を使用できるわけ...
Bloggerの空テンプレートを作成する
Bloggerの自作テンプレート作成に向けての第一歩です。 空テンプレート Bloggerテンプレートの最小構成です。 空テンプレートの基準は以下の通りです。詳しくは参考の資料を参照してください。 <b:skin> を含む <b:section> を含む ...
画像のないimgタグのSEO対策
画像のない <img> のSEO対策です。 問題 画像のない <img> を配置して、alt属性がないと警告を受ける。画像には、alt属性を付けましょう…。 だが、alt属性をを付けるとalt属性の文字列が表示されてしまう。alt属性の文字列が画面上に表示...
FontAwesome を SVG で使用する【JavaScript なし】
はじめに 「FontAwesome を JavaScript なしで使用する方法」または、「FontAwesome の一部のアイコンを使用する方法」です。 JavaScript 無効環境で FontAwesome を使用したページを閲覧すると文字化けしたような表示になるのを目にし...
HTMLにテキストファイルを埋め込んでダウンロードする
やること ブログなどのファイルが置けないない環境で、小規模なテキストファイルを外部ホスティングせずに、ダウンロード可能にする。 HTMLファイル内にファイルを埋め込む リンクのクリックでダウンロードする 追記 data: で画像ファイルの埋め込みなどと同じように埋め込めるようです...
table要素をCSV形式でダウンロードする機能を実現する
table要素をCSV形式でダウンロードする機能を実現するために作成しました。 大抵のテーブルにそのまま使用できるといいな…。 仕様・制約 指定のtableをCSVで取得する UTF-8BOMありで出力する Excel対策のため カンマ(,)、ダブルクォーテーション("...
GoogleChartAPIでテーブルをグラフで表示する
GoogleChartAPIのサンプルです。 下記記事のGoogleChartsとの比較用にテーブルをグラフ化します。 GoogleChartsでテーブルをグラフで表示する 完成品 番号 データ１ データ2 データ3 1 1025 7840 1917 2 452 2553 211...