Get better Lighthouse score in a11y and performance #78
Conversation
templates/main.html
Outdated
| <head> | ||
| <meta charset="utf-8"> | ||
| <title>GCI Leaders</title> | ||
| <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"> | ||
| <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=5.0, user-scalable=yes"> |
There was a problem hiding this comment.
I think maximum-scale=5.0, user-scalable=yes is not needed now.
There was a problem hiding this comment.
Favicon has white border, looks ugly, remove them.
Also, I don't know if this is accurate or not, but checked via https://realfavicongenerator.net/favicon_checker
favicon.ico should contain multiple sizes (in the same file).
There was a problem hiding this comment.
Commit message should be in imperative present tense https://coala.io/commit
e.g. Improved ~> Improve
|
@myfrom , please undo your merge commit. We do proper rebases at coala. see http://coala.io/rebase . Also please in future do not create pull requests from your 'master' branch. (but please do not close this PR; we'll get this one fixed & merged ; ask us for help on Zulip) |
|
If you turn the GCI logo on the website into png or vector with transparent background, it might reduce the size. Try it first. |
|
Also, your branch is still outdated, you need to rebase. http://coala.io/rebase |
|
Oh, sorry, should be OK now. |
There was a problem hiding this comment.
Some of the images are broken. See https://deploy-preview-78--gci-leaders.netlify.com/ (deploy/netlify on below)
And wiki icons are gone, you need to add them back, resize if needed, and add the alt
|
Oh, sorry, missed those new icons. I updated them and basically have everything working, I'll upload tomorrow. @blazeu |
|
We should add a CACHE_VERSION and increment it whenever anything breaking occurs to the data. This will let us bust the cache if it becomes stale. I can do this in a few hours. |
|
Why not just remove the image url from the JSON and then rely on the chat platform name. Edit: @myfrom ^ You should do that |
|
That would be one option, but adding a CACHE_VERSION would allow us to avoid this problem entirely in the future, such as if a new key were added or an existing one were taken away. |
|
In the mean time, I'm gonna run |
Imporve page accessibility (and Lighthouse score) by: Adding `alt` attribute to images, adding `lang="en"` to `<html>` tag, making the page user-scaleable Related to #55
Minify images to speed up page load time Related to #55
Use Code-In logo as page favicon, also improving best pracitses score in Lighthouse Related to #55
Change the generator (and other files to retain compatibility) to output contents of /static to /out instead of /out/static. This allows files such as favicon or manifest to be placed in root of the webpage. Related to #55
|
Should be OK now if we run it through |
|
Okay. After this one, I want you sent another PR to Edit: ^ Done. |
I did a few things (all mentioned in the commits) to improve the Lighthouse score. There are a few differences between my tests and the test file from https://gci-leaders.netlify.com/ that were caused by my development environment and the fact that machine is fairly slow.
I also changed the output of /static from /out/static to the root of /out as we were discussing in #55
Here are test results before and after:
tests.zip
Related to #55, part of GCI task