If you have a site where you have a page similar to this one and want to include this website, wrap the SVG button an <a>
element that links somewhere here. I have no preference as to whether you include the animation code.
@media (prefers-reduced-motion: no-preference) {
@keyframes ethamck-88-31 {
from {background-position: 0% 50%;}
to {background-position: -200% 50%;}
}
}
It’s 868 bytes with whitespace. You can get it down to about one hundred less with minification and SVGO, and another hundred less with no animation code.
You may want to add a <title>
element with alt text under <svg>
if you can’t use aria-label
on <a>
. I don’t predefine alt text for this button.
This is my collection of websites I’ve seen and admire both in design and content, roughly ordered by how many columns they fill up here and how attached I am to them. The third column is a link to their page of links, which is intentionally more vast than mine. You can find many more links in my blogroll which are more focused on content than design.