diff options
| author | Shulhan <ms@kilabit.info> | 2023-10-16 00:25:20 +0700 |
|---|---|---|
| committer | Shulhan <ms@kilabit.info> | 2023-10-16 00:25:20 +0700 |
| commit | dba7fb6de3755924a5278ee34332d29212884493 (patch) | |
| tree | 049096c6c332ed4d7c47bfc9e16ba49e3e7336a3 /_content/template.gohtml | |
| parent | 7c082605495f473c18491dbbd52e37c358284a9f (diff) | |
| download | kilabit.info-dba7fb6de3755924a5278ee34332d29212884493.tar.xz | |
all: improve the web rendering based on result from webpagetest.org
Changes,
* In CSS, use "font-display:swap" [1]. This allow browser use fallback
font first and changes to target font once the file downloaded.
* In HTML, add "lang=en"
* Load CSS asynchronously using `media="print" onload="this.media='all'"`
* Set empty alt text for decorative image
* Set width and height for image ratio
[1] https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display
Diffstat (limited to '_content/template.gohtml')
| -rw-r--r-- | _content/template.gohtml | 6 |
1 files changed, 4 insertions, 2 deletions
diff --git a/_content/template.gohtml b/_content/template.gohtml index 075d71e..c04aa4f 100644 --- a/_content/template.gohtml +++ b/_content/template.gohtml @@ -1,17 +1,19 @@ <!DOCTYPE html> -<html> +<html lang="en"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <meta name="viewport" content="width=device-width, initial-scale=1" /> <meta name="theme-color" content="#375EAB" /> <title>{{.Title}}</title> - <link href="/index.css" rel="stylesheet" type="text/css" media="all" /> + <link href="/index.css" rel="stylesheet" type="text/css" media="print" onload="this.media='all'" /> </head> <body> <img + alt="" class="background" src="/assets/images/maple-leaf-transparent-540.png" + width="920" /> <div class="topbar"> |