タグ

2017年9月26日のブックマーク (6件)

  • Atom Editor - status bar is missing

  • gulpでshift_jisとCR+LFの開発環境を構築

    gulpでSassコンパイルやBrowsersyncを使った自動更新を使うことが多いのですが 案件によっては、文字コードにshift_jisの指定があるものがあります。 gulpでshift_jisを取り扱うにあたり、懸念点となるのはこの4つ SassはCSS1行目の@charsetをUTF-8と固定出力してしまう Browsersyncはshift_jisが文字化けする jQueryなどのライブラリ類の文字コードはshift_jisに変えたくない 画像までshift_jis変換すると化ける まずは gulp-convert-encodingで文字コードをshift_jis変換 gulp-cr-lf-replaceで改行コードをCR+LFに変換 と対処した上で ポイントには、このように対応してみました。 サンプルをGitHubで確認 SassはCSS1行目の@charsetをUTF-8と固

    gulpでshift_jisとCR+LFの開発環境を構築
  • 改行コードの確認 - Qiita

    tests-MBA:test $ ll total 48 -rw-r--r--@ 1 test staff 20 2 29 20:05 test001 ★Unix版 -rw-r--r--@ 1 test staff 20 2 29 20:05 test002 ★OSX版 -rw-r--r--@ 1 test staff 24 2 29 20:05 test003 ★Windows版 tests-MBA:test test$ tests-MBA:test test$ od -c test001 0000000 t e s t \n t e s t \n t e s t \n t 0000020 e s t \n 0000024 tests-MBA:test test$ tests-MBA:test test$ tests-MBA:test test$ od -c test002 000000

    改行コードの確認 - Qiita
  • HTML要素からHTTP/2優先度を指定する Priority Hints - ASnoKaze blog

    20180912追記 Chrome71で動作確認しました。 仕様的にも変更が入ってるので、下記記事参照 asnokaze.hatenablog.com HTTP/2ではリクエストは並列的に行われますが、クライアントは各リクエストに優先度を設定できます。サーバはこの優先度によって、レスポンスの順番(正確にはレスポンスを返すのに使用するリソース)を、制御しています。 この優先度の設定はブラウザが自動で行っており、Webエンジニアは意識する必要はありません。例えばレンダリングを開始するのに必要なCSSなどは優先度が高く、画像などは優先度が低く設定されるのが一般的です。 しかし、Webエンジニアが明示的にHTML要素にどの優先度でリクエストするか指示したい場合でも現状は出来ません。例えば、ユーザの閲覧目的が特定の画像である場合や、特定のJavaScriptがコンテンツに重要ということもあるかもしれ

    HTML要素からHTTP/2優先度を指定する Priority Hints - ASnoKaze blog
  • ゆめいろデザイン|ブランドマネージャー・Web/UX/UIデザイナー・デザインコンサルタント ヒガシナオヤ

    まず、iPhone Xに対応していないWebサイトはSafariブラウザではどのように表示されるのでしょうか? ポートレートモードでは一見正しく表示されます。 下向きにスクロールするとステータスバーが表示されなくなり、画面下部のラウンドした領域にもコンテンツが表示されます。 早い話が、追尾型広告のようなページ下部に表示されるコンテンツに重要なコンテンツやナビゲーションを配置すると、クリックされない可能性が高くなります。 また、ランドスケープモードでははっきりと違いがわかります。 ツールバーやステータスバーは全画面で表示されます。 中央左右に安全領域がありますが、それ以外の部分もbody要素のbackground-colorで描画されます。 なお、背景画像を指定していても無視されるということを覚えておきましょう。 そのほかにも、セーフエリアの存在でデザイナーが意図した描画がされない状態になり

    ゆめいろデザイン|ブランドマネージャー・Web/UX/UIデザイナー・デザインコンサルタント ヒガシナオヤ
  • HTMLのheadの書き方、head内に記述する要素の総まとめ

    HTMLページのhead内に記述する最小限の構成、そしてmeta要素やlink要素、ソーシャルサービス用の要素、デスクトップ・スマホのブラウザ用の要素などがまとめられた「<head> cheatsheet」を紹介します。 <head> cheatsheet 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。 去年紹介した以前の版からいろいろと変更されています。 head内に記述する最小限の構成 head内の要素 meta要素 link要素 ソーシャル関連のhead内の要素 ブラウザ・プラットフォーム関連のhead内の要素 メモ head内に記述する最小限の構成 下記はシンプルなWebサイトで必須となるhead内に記述する最小限のタグです。 <meta charset="utf-8"> <meta http-equiv="x-ua-c

    HTMLのheadの書き方、head内に記述する要素の総まとめ