191019 瀧内賢 ／ 『これからはじめるSEO 顧客思考の教科書』 読書グラフィ今日読んだ本
読書グラフィ 今日読んだ本
★瀧内賢 ／ 『これからはじめるSEO 顧客思考の教科書 〜ユーザー重視のWebサイトを5つの視点で実現する』
●HTML5から figure
画像に説明（キャプション）をつける目的。
figcaption
<figure id="example">
<img src="example.jpg" alt="exampleのイメージ" width="100" height="100">
<figcaption>exampleのシーン</figcaption>
</figure>
●一説によると、
ページの読み込みが0.5秒遅くなると、
アクセス数が20％減少するという研究結果も出ているようです。
□Google PageSpeed Insights
https://developers.google.com/speed/pagespeed/insights/?hl=JA
ページスピードを改善するために、
具体的に何をすればよいかを案内してくれる。
□画像の最適化について Google Developers
https://developers.google.com/web/fundamentals/performance/optimizing-content-efficiency/image-optimization?csw=l
□オンライン 画像圧縮ツール compressor.io
https://compressor.io/
□tinypng
https://tinypng.com/
□JPEGmini
http://www.jpegmini.com/
●letter-spacing プロパティ 文字間隔を調節
●画像は専用フォルダにまとめる。
●フォルダを分ける場合、画像へのパスを簡潔にする。意味のある名前にする。
●JavaScriptは</body>直前に記述。
●リアルタイムで新しい情報を掲載するようなWebサイトの場合、内部参照。
2回目以降のアクセス時、キャッシュにより有利になるのは、外部参照。
●ファーストビューのような重要な部分の装飾は、
HTMLのhead内に書いておくことで、読み込み速度が改善される。
□Critical Path CSS Generator
https://jonassebastianohlsson.com/criticalpathcssgenerator/
クリティカルパスのCSSが検出される。
□mergely
http://mergely.com/editor
CSSのFULLとCRITHICAL PATHの差分が1目でわかる。
●.htaccess ファイル
キャッシュ期間を自分で変更できる。
●gzip
データ圧縮プログラムのひとつ。
●CSSは、右から左に読まれていきます。
□JSCompress
https://jscompress.com/
JavaScriptの圧縮
●W3C
World Wide Webで使用される各種技術の標準化を推進するために設立された
標準化団体、非営利団体の略称。
W3Cに準拠したWebサイトは、この基準を満たしている、
高品質なWebサイトであるといえます。
□W3C Markup Validation Service
http://validator.w3.org/
ソースコード内にあるエラーを抽出することができる。
□エディタ Crescent Eve
アップロードする前にソースコードエラーをチェック可能。
□W3C Link Checker
http://validator.w3.org/checklink
リンク切れをチェックする。
#読書 #Web
