Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Website on Safari #61

Closed
glenrobson opened this issue Oct 12, 2021 · 6 comments
Closed

Website on Safari #61

glenrobson opened this issue Oct 12, 2021 · 6 comments

Comments

@glenrobson
Copy link
Member

It doesn't look like Safari has good webp support:

https://caniuse.com/webp

Screenshot 2021-10-12 at 23 58 49

I'm using macOS Catalina Safari 14.0.1

@hadro
Copy link
Contributor

hadro commented Oct 12, 2021 via email

@hadro
Copy link
Contributor

hadro commented Oct 13, 2021

@glenrobson is the webserver configuration option here an option for us?
https://github.com/sverrirs/jekyll-webp#advanced-use-webserver-configuration

@glenrobson
Copy link
Member Author

Yes I think that would be possible although I was half hoping to get rid of the nginx proxy in front of the website to remove one layer and save some money. Once I've got the validators working Ill know if I can do with out the proxy.

I thought the 'automated-webp-production-in-jekyll' article looked promising. Did you give that a go?

@glenrobson
Copy link
Member Author

Just documenting what we briefly discussed on the call. The two links above point to a plugin called jekyll-webp which looks good and maybe is something we should look at. It converts the jpg/pngs to webp when it builds the website so you only need to have the jpgs/pngs in the repo not the webp.

It provides two ways of showing these files but assumes both the jpg/png and webp are present in the generated website. I have the HTML picture / option method working and we could look at the server option in the second link which instead of having the two image links in the html re-writes the request so that if you request a jpg and you support webp it will forward you to the webp version.

The problem I've come across is we have some webp files with out a png/jpg source image. We will need to generate a jpg/png version of these files to do either the HTML method or the server redirects.

@glenrobson
Copy link
Member Author

It looks like there isn't a good way to do webp/png switching with css so the hero images are an issue. The server option would fix this...

@glenrobson
Copy link
Member Author

I think its all fixed. I've implemented the HTML method for most but for the hero images I've done it server side. It all looks good on safari.

Screenshot 2021-10-20 at 03 32 22

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants