From d54e49660c7c9ee07beb0bf983cc95e956209ee2 Mon Sep 17 00:00:00 2001 From: Khaldoon Mutahar Date: Mon, 17 May 2021 17:37:13 +0300 Subject: [PATCH] Add Editor Config File and clean all files based on .editorconfig --- .editorconfig | 17 ++ _config.yml | 42 +-- _includes/blue-team.html | 18 +- _includes/faq-01.html | 23 +- _includes/faq-02.html | 32 ++- _includes/faq-03.html | 9 +- _includes/faq-04.html | 16 +- _includes/faq-05.html | 16 +- _includes/faq-06.html | 8 +- _includes/faq-07.html | 19 +- _includes/green-team.html | 18 +- _includes/orange-team.html | 18 +- _layouts/default.html | 76 +++--- _redirects | 2 +- assets/css/style.css | 533 +++++++++++++++++++------------------ index.md | 94 +++---- netlify.toml | 2 +- 17 files changed, 502 insertions(+), 441 deletions(-) create mode 100644 .editorconfig diff --git a/.editorconfig b/.editorconfig new file mode 100644 index 0000000..7f271a1 --- /dev/null +++ b/.editorconfig @@ -0,0 +1,17 @@ +# http://editorconfig.org + +root = true + +[*] +charset = utf-8 +indent_style = space +indent_size = 4 +end_of_line = lf +insert_final_newline = true +trim_trailing_whitespace = true + +[*.gemspec] +indent_size = 2 + +[*.yml] +indent_size = 2 diff --git a/_config.yml b/_config.yml index a83d039..4a5d442 100644 --- a/_config.yml +++ b/_config.yml @@ -1,21 +1,21 @@ -plugins: - - jekyll-sitemap - - jekyll-seo-tag - -# SEO Stuff -author: Kev Quirk -title: 512KB Club -tagline: A showcase of lightweight websites. -description: The 512KB Club is an exclusive list of web pages weighing less than 512 kilobytes. -lang: en -locale: en_GB -url: "https://512kb.club" -baseurl: "" -permalink: :title - -# Syntax Highlighting -highlighter: rouge - -# Netlify redirects -include: - - _redirects \ No newline at end of file +plugins: + - jekyll-sitemap + - jekyll-seo-tag + +# SEO Stuff +author: Kev Quirk +title: 512KB Club +tagline: A showcase of lightweight websites. +description: The 512KB Club is an exclusive list of web pages weighing less than 512 kilobytes. +lang: en +locale: en_GB +url: "https://512kb.club" +baseurl: "" +permalink: :title + +# Syntax Highlighting +highlighter: rouge + +# Netlify redirects +include: + - _redirects diff --git a/_includes/blue-team.html b/_includes/blue-team.html index 6be913c..c71ef73 100644 --- a/_includes/blue-team.html +++ b/_includes/blue-team.html @@ -1,9 +1,9 @@ - + diff --git a/_includes/faq-01.html b/_includes/faq-01.html index 8bfe366..ca8b64b 100644 --- a/_includes/faq-01.html +++ b/_includes/faq-01.html @@ -1,13 +1,18 @@
- How to join The 512KB Club -

If you're interested in getting your site added to The 512KB Club, all you need to do is follow these instructions:

+ How to join The 512KB Club +

If you're interested in getting your site added to The 512KB Club, all you need to do is follow these + instructions:

-
    -
  1. Do a GTMetrix scan on your website.
    2. -
  2. Once complete, click on the Waterfall tab to make sure the uncompressed size of your site is less than 512KB.
    3. -
  3. If your site satisfies this requirement, create a pull request (instructions here) to add your site.
    4. -
  4. I will then review you PR and merge it into main. Once merged, your site will be added to the list.
    5. -
+
    +
  1. Do a GTMetrix scan on your website.
    2. +
  2. Once complete, click on the Waterfall tab to make sure the uncompressed size of your site is + less than 512KB.
    3. +
  3. If your site satisfies this requirement, create a pull request (instructions + here) to add your site.
    4. +
  4. I will then review you PR and merge it into main. Once merged, your site will be added to the list.
    5. +
-

Note: I reserve the right to not add sites based on whether I think they're suitable to be added or not.

+

Note: I reserve the right to not add sites based on whether I think they're suitable to + be added or not.

diff --git a/_includes/faq-02.html b/_includes/faq-02.html index 1a0c2b8..b34e0b9 100644 --- a/_includes/faq-02.html +++ b/_includes/faq-02.html @@ -1,23 +1,29 @@
- Once you're in The 512KB Club -

If your site qualifies for The 512KB Club, I will add it to one of the following 3 teams:

+ Once you're in The 512KB Club +

If your site qualifies for The 512KB Club, I will add it to one of the following 3 teams:

-
    -
  1. The green team is for sites with a total uncompressed size of less than 100KB.
    2. -
  2. The orange team is for sites with a total uncompressed size of less than 250KB.
    3. -
  3. The blue team is for sites with a total uncompressed size of less than 512KB.
    4. -
+
    +
  1. The green team is for + sites with a total uncompressed size of less than 100KB.
    2. +
  2. The orange team is + for sites with a total uncompressed size of less than 250KB.
    3. +
  3. The blue team is for + sites with a total uncompressed size of less than 512KB.
    4. +
-

Once you're a proud member of one of the teams, you are free to use one of the banners below on your own website. You can either save the SVG or use the code snippet below (remembering to change the name to whichever team you're in).

+

Once you're a proud member of one of the teams, you are free to use one of the banners below on your own website. + You can either save the SVG or use the code snippet below (remembering to change the name to whichever team + you're in).

-

green team banner

+

green team banner

-

orange team banner

+

orange team banner

-

blue team banner

+

blue team banner

- 
<a href="https://512kb.club"><img src="https://512kb.club/assets/images/green-team.svg" /></a>
+ 
<a href="https://512kb.club"><img src="https://512kb.club/assets/images/green-team.svg" /></a>
-

Alternatively, you can add the banner to your site in pure HTML/CSS using this CodePen as a guide.

+

Alternatively, you can add the banner to your site in pure HTML/CSS using this CodePen as a guide.

diff --git a/_includes/faq-03.html b/_includes/faq-03.html index 04974e9..03607c5 100644 --- a/_includes/faq-03.html +++ b/_includes/faq-03.html @@ -1,6 +1,9 @@
- I've optimised some more, what now? -

The 512KB Club appears to have sparked some interest in a lot of website owners and the whole thing has become somewhat of a race to the top.

+ I've optimised some more, what now? +

The 512KB Club appears to have sparked some interest in a lot of website owners and the whole thing has + become somewhat of a race to the top.

-

If you have optimised your website further and want to change your number, please log a new GitHub issue ensuring the title clearly states this is an update.

+

If you have optimised your website further and want to change your number, please log a new GitHub issue ensuring the title + clearly states this is an update.

diff --git a/_includes/faq-04.html b/_includes/faq-04.html index 70a80bc..a442a44 100644 --- a/_includes/faq-04.html +++ b/_includes/faq-04.html @@ -1,15 +1,19 @@
- My site doesn't qualify, what can I do? -

Many sites won't qualify for the 512KB Club, but there are some quick things you could try to reduce the size of your site:

+ My site doesn't qualify, what can I do? +

Many sites won't qualify for the 512KB Club, but there are some quick things you could try to reduce the size of + your site:

-

1. Replace custom fonts with a local font stack by replacing your font-family declerations in your CSS to one of the following:

-
# Sans-serif font stack
+    
1. Replace custom fonts with a local font stack by replacing your font-family declerations in
+            your CSS to one of the following:

+    
# Sans-serif font stack
 font-family: -apple-system, BlinkMacSystemFont, "Avenir Next", Avenir, "Nimbus Sans L", Roboto, Noto, "Segoe UI", Arial, Helvetica, "Helvetica Neue", sans-serif;
 
 # Serif font stack
 font-family: Constantia, "Lucida Bright", Lucidabright, "Lucida Serif", Lucida, "DejaVu Serif", "Bitstream Vera Serif", "Liberation Serif", Georgia, serif;

 
-  
2. Optimise any images you have on your page. Short Pixel is a great service for this.

+    
2. Optimise any images you have on your page. Short
+            Pixel is a great service for this.

 
-  
3. If all else fails and your site is pretty close the 512KB, but not quite there, why not apply for Bradley Taunt's 1MB Club instead?

+    
3. If all else fails and your site is pretty close the 512KB, but not quite there, why not apply for
+        Bradley Taunt's 1MB Club instead?
diff --git a/_includes/faq-05.html b/_includes/faq-05.html index 0097296..6478a1a 100644 --- a/_includes/faq-05.html +++ b/_includes/faq-05.html @@ -1,11 +1,13 @@
- What's the point of all this? -

That's a great question!

+ What's the point of all this? +

That's a great question!

-

I decided to start this project for a couple of reasons:

+

I decided to start this project for a couple of reasons:

-
    -
  1. Most, if not all, of the sites listed below are personal sites. Many of which are blogs. The 512KB Club is a great way of discovering other blog owners who are also interested in minimalist/efficient web design. Think of it like a modern day webring.
    2. -
  2. It's a bit of fun, so why not?
    3. -
+
    +
  1. Most, if not all, of the sites listed below are personal sites. Many of which are blogs. The 512KB Club is a + great way of discovering other blog owners who are also interested in minimalist/efficient web design. Think + of it like a modern day webring.
    2. +
  2. It's a bit of fun, so why not?
    3. +
diff --git a/_includes/faq-06.html b/_includes/faq-06.html index e18f15d..c21c8ca 100644 --- a/_includes/faq-06.html +++ b/_includes/faq-06.html @@ -1,6 +1,8 @@
- I see a problem / how do I get in touch? -

See a problem on this site? Maybe there's a site listed that's not longer live, or no longer qualifies for the club. Or, maybe you just want to get in touch for some reason.

+ I see a problem / how do I get in touch? +

See a problem on this site? Maybe there's a site listed that's not longer live, or no longer qualifies for the + club. Or, maybe you just want to get in touch for some reason.

-

If so, create an issue on GitHub or use the contact page on my main website.

+

If so, create an issue on GitHub or + use the contact page on my main website.

diff --git a/_includes/faq-07.html b/_includes/faq-07.html index c78cc0d..570626d 100644 --- a/_includes/faq-07.html +++ b/_includes/faq-07.html @@ -1,12 +1,19 @@
- Notice about ultra lightweight sites -

There are a growing number of "sites" being submitted to The 512KB Club that are ultra lightweight (usually <1KB). These sites often contain absolutely no information apart from a couple of links to other pages that do contain information.

+ Notice about ultra lightweight sites +

There are a growing number of "sites" being submitted to The 512KB Club that are ultra lightweight (usually + <1KB). These sites often contain absolutely no information apart from a couple of links to other pages that + do contain information.

-

These sites are not in keeping with the aim of The 512KB Club and will not be added. To be added to this site the page you submit must contain a reasonable amount of information.

+

These sites are not in keeping with the aim of The 512KB Club and will not be added. To be added to this + site the page you submit must contain a reasonable amount of information.

-

But what qualifies as a "reasonable amount of information"?

+

But what qualifies as a "reasonable amount of information"?

-

Great question! Ultimately it's for me to decide and I will use my own discretion, but as a guide, if your site contains nothing more than a title and a couple of links, it won't be added. If you page contains some CSS formatting, a couple of paragraphs of text, and links to other pages, it will probably be added.

+

Great question! Ultimately it's for me to decide and I will use my own discretion, but as a guide, if your site + contains nothing more than a title and a couple of links, it won't be added. If you page contains some + CSS formatting, a couple of paragraphs of text, and links to other pages, it will probably be added.

-

The aim of The 512KB Club is to showcase lightweight websites. Anyone can create a website that is under 1KB, but composed only of a single h1 tag and a couple of links. That's boring - try and be more interesting.

+

The aim of The 512KB Club is to showcase lightweight websites. Anyone can create a website that is under 1KB, but + composed only of a single h1 tag and a couple of links. That's boring - try and be more + interesting.

diff --git a/_includes/green-team.html b/_includes/green-team.html index f1933e2..aa0f315 100644 --- a/_includes/green-team.html +++ b/_includes/green-team.html @@ -1,9 +1,9 @@ - + diff --git a/_includes/orange-team.html b/_includes/orange-team.html index 7ab8fcb..7490be6 100644 --- a/_includes/orange-team.html +++ b/_includes/orange-team.html @@ -1,9 +1,9 @@ - + diff --git a/_layouts/default.html b/_layouts/default.html index 7aa7177..3479a52 100644 --- a/_layouts/default.html +++ b/_layouts/default.html @@ -1,36 +1,40 @@ - - - - - - {% seo %} - - - - - - - - -
-

The 512KB Club

-
- -
- - {{ content }} - -
- -
- -

The 512KB Club was created by Kev Quirk and was inspired by Bradley Taunt's 1MB Club.

- -

Maintained with ♥ for a performant, lightweight web.

- - ^ TOP ^ - -
- - - + + + + + + + {% seo %} + + + + + + + + + +
+

The 512KB Club

+
+ +
+ + {{ content }} + +
+ +
+ +

The 512KB Club was created by Kev Quirk and was inspired by Bradley Taunt's 1MB Club.

+ +

Maintained with ♥ for a performant, lightweight web.

+ + ^ TOP ^ + +
+ + + + diff --git a/_redirects b/_redirects index d332db2..e8543c2 100644 --- a/_redirects +++ b/_redirects @@ -1,3 +1,3 @@ https://512kb.club/images/green-team.svg https://512kb.club/assets/images/green-team.svg https://512kb.club/images/orange-team.svg https://512kb.club/assets/images/orange-team.svg -https://512kb.club/images/blue-team.svg https://512kb.club/assets/images/blue-team.svg \ No newline at end of file +https://512kb.club/images/blue-team.svg https://512kb.club/assets/images/blue-team.svg diff --git a/assets/css/style.css b/assets/css/style.css index 17315bf..b3b0d4c 100644 --- a/assets/css/style.css +++ b/assets/css/style.css @@ -1,261 +1,272 @@ -/* Global colour variables */ - :root { - --sans-font: -apple-system, BlinkMacSystemFont, "Avenir Next", Avenir, "Nimbus Sans L", Roboto, Noto, "Segoe UI", Arial, Helvetica, "Helvetica Neue", sans-serif; - --mono-font: Consolas, Menlo, Monaco, "Andale Mono", "Ubuntu Mono", monospace; - - --bg: #FAFAFA; - --header-bg: #212121; - --text: #212121; - --header-text: #FAFAFA; - --link: #0D47A1; - --code: #D81B60; - --pre: #D0D0D0; - --pre-bg: #1A1A1A; - --accent: #e6e6e6; - --before-blue: #64B5F6; - --after-blue: #BBDEFB; - --before-orange: #FBC02D; - --after-orange: #FFF176; - --before-green: #4CAF50; - --after-green: #C8E6C9; - - } - - /* Define colours for auto dark mode */ -@media (prefers-color-scheme: dark) { - :root { - --bg: #212121; - --header-bg: #111; - --text: #EEE; - --link: #64B5F6; - --accent: #333; - --code: #F06292; - } - - ul li { - opacity: .8; - } -} - -* { - box-sizing: border-box; -} - -html { - scroll-behavior: smooth; -} - -body { - font-family: var(--sans-font); - font-size: 1.1rem; - margin: 0 0 4rem 0; - padding: 0 .5rem; - background: var(--bg); - color: var(--text); -} - -header,main,footer { - margin: 0 auto; - max-width: 50rem; - width: 100%; -} - -header { - background: var(--header-bg); - color: var(--header-text); - border-radius: 5px; - text-align: center; - padding: 3rem 0; - margin-top: .5rem; -} - -header h1 { - margin: 0; - font-size: 3rem; - padding: 0 .5rem; -} - -.small { - font-size: .9rem; -} - -.medium { - font-weight: bold; - font-size: 1.4rem; -} - -h1,h2,h3,h4,h5,h6 { - line-height: 1.2; -} - -h2 { - margin: 4rem 0 -1.5rem 0; -} - -.jump li { - display: inline-block; - padding-right: 1rem; -} - -a, a:visited { - color: var(--link) -} - -a:hover,a:focus { - text-decoration: none; -} - -a.site, a.site:visited { - color: currentColor; - text-decoration: none; -} - -a.site:hover,a.site:focus { - text-decoration: underline; -} - -pre { - font-family: var(--mono-font); - background: var(--pre-bg) !important; - border-radius: 5px; - margin-bottom: 1.6em; - max-width: 100%; - white-space: pre-wrap; - padding: 1.6em; - max-height: 650px; -} - -pre code { - font-size: 1.1rem; - font-family: var(--mono-font); - color: #ccc; -} - -code { - font-family: var(--mono-font); - color: var(--code); -} - -ul { - list-style: none; - margin: 3rem 0 0 0; - padding: 0; -} - -/* BLUE COLOURS */ -ul.blue li { - background: var(--after-blue); - color: #212121; - line-height: 1; - margin: 0 0 0.5rem 0; - padding: 15px 10px 12px; - position: relative; - border-radius: 4px; -} - -ul.blue li span.before { - background: var(--before-blue); - height: 100%; - width: calc(var(--data-size)/512 * 100%); - border-radius: 4px; - z-index: 0; -} - -/* ORANGE COLOURS */ -ul.orange li { - background: var(--after-orange); - color: #212121; - line-height: 1; - margin: 0 0 0.5rem 0; - padding: 15px 10px 12px; - position: relative; - border-radius: 4px; -} - -ul.orange li span.before { - background: var(--before-orange); - height: 100%; - width: calc(var(--data-size)/512 * 100%); - border-radius: 4px; - z-index: 0; -} - -/* GREEN COLOURS */ -ul.green li { - background: var(--after-green); - color: #212121; - line-height: 1; - margin: 0 0 0.5rem 0; - padding: 15px 10px 12px; - position: relative; - border-radius: 4px; -} - -ul.green li span.before { - background: var(--before-green); - height: 100%; - width: calc(var(--data-size)/512 * 100%); - border-radius: 4px; - z-index: 0; -} - -ul li span.before, -ul li span.after { - left: 0; - position: absolute; - top: 0; -} - -ul li span.after { - left: auto; - opacity: 0.8; - right: 10px; - top: auto; -} - -ul li a { - font-weight: bold; - position: relative; - z-index: 2; -} - -footer { - border-top: 1px solid var(--text); - margin: 3rem auto 0; - padding: 0.5rem 0 0; - text-align: center; - font-size: .9rem; -} - -@media(max-width:500px) { - body { - margin: 0 0 4rem 0; - padding: 0 10px; - } -} - -/* Format the accordion */ -details { - padding: .6rem 1rem; - background: var(--accent); - border: 1px solid; - border-radius: 5px; - margin-bottom: 1rem; -} - -summary { - cursor: pointer; - font-weight: bold; -} - -details[open] { - padding-bottom: .75rem; -} - -details[open] summary { - margin-bottom: .5rem; -} - -details[open]>*:last-child { - margin-bottom: 0; -} +/* Global colour variables */ +:root { + --sans-font: -apple-system, BlinkMacSystemFont, "Avenir Next", Avenir, "Nimbus Sans L", Roboto, Noto, "Segoe UI", Arial, Helvetica, "Helvetica Neue", sans-serif; + --mono-font: Consolas, Menlo, Monaco, "Andale Mono", "Ubuntu Mono", monospace; + + --bg: #FAFAFA; + --header-bg: #212121; + --text: #212121; + --header-text: #FAFAFA; + --link: #0D47A1; + --code: #D81B60; + --pre: #D0D0D0; + --pre-bg: #1A1A1A; + --accent: #e6e6e6; + --before-blue: #64B5F6; + --after-blue: #BBDEFB; + --before-orange: #FBC02D; + --after-orange: #FFF176; + --before-green: #4CAF50; + --after-green: #C8E6C9; + +} + +/* Define colours for auto dark mode */ +@media (prefers-color-scheme: dark) { + :root { + --bg: #212121; + --header-bg: #111; + --text: #EEE; + --link: #64B5F6; + --accent: #333; + --code: #F06292; + } + + ul li { + opacity: .8; + } +} + +* { + box-sizing: border-box; +} + +html { + scroll-behavior: smooth; +} + +body { + font-family: var(--sans-font); + font-size: 1.1rem; + margin: 0 0 4rem 0; + padding: 0 .5rem; + background: var(--bg); + color: var(--text); +} + +header, +main, +footer { + margin: 0 auto; + max-width: 50rem; + width: 100%; +} + +header { + background: var(--header-bg); + color: var(--header-text); + border-radius: 5px; + text-align: center; + padding: 3rem 0; + margin-top: .5rem; +} + +header h1 { + margin: 0; + font-size: 3rem; + padding: 0 .5rem; +} + +.small { + font-size: .9rem; +} + +.medium { + font-weight: bold; + font-size: 1.4rem; +} + +h1, +h2, +h3, +h4, +h5, +h6 { + line-height: 1.2; +} + +h2 { + margin: 4rem 0 -1.5rem 0; +} + +.jump li { + display: inline-block; + padding-right: 1rem; +} + +a, +a:visited { + color: var(--link) +} + +a:hover, +a:focus { + text-decoration: none; +} + +a.site, +a.site:visited { + color: currentColor; + text-decoration: none; +} + +a.site:hover, +a.site:focus { + text-decoration: underline; +} + +pre { + font-family: var(--mono-font); + background: var(--pre-bg) !important; + border-radius: 5px; + margin-bottom: 1.6em; + max-width: 100%; + white-space: pre-wrap; + padding: 1.6em; + max-height: 650px; +} + +pre code { + font-size: 1.1rem; + font-family: var(--mono-font); + color: #ccc; +} + +code { + font-family: var(--mono-font); + color: var(--code); +} + +ul { + list-style: none; + margin: 3rem 0 0 0; + padding: 0; +} + +/* BLUE COLOURS */ +ul.blue li { + background: var(--after-blue); + color: #212121; + line-height: 1; + margin: 0 0 0.5rem 0; + padding: 15px 10px 12px; + position: relative; + border-radius: 4px; +} + +ul.blue li span.before { + background: var(--before-blue); + height: 100%; + width: calc(var(--data-size)/512 * 100%); + border-radius: 4px; + z-index: 0; +} + +/* ORANGE COLOURS */ +ul.orange li { + background: var(--after-orange); + color: #212121; + line-height: 1; + margin: 0 0 0.5rem 0; + padding: 15px 10px 12px; + position: relative; + border-radius: 4px; +} + +ul.orange li span.before { + background: var(--before-orange); + height: 100%; + width: calc(var(--data-size)/512 * 100%); + border-radius: 4px; + z-index: 0; +} + +/* GREEN COLOURS */ +ul.green li { + background: var(--after-green); + color: #212121; + line-height: 1; + margin: 0 0 0.5rem 0; + padding: 15px 10px 12px; + position: relative; + border-radius: 4px; +} + +ul.green li span.before { + background: var(--before-green); + height: 100%; + width: calc(var(--data-size)/512 * 100%); + border-radius: 4px; + z-index: 0; +} + +ul li span.before, +ul li span.after { + left: 0; + position: absolute; + top: 0; +} + +ul li span.after { + left: auto; + opacity: 0.8; + right: 10px; + top: auto; +} + +ul li a { + font-weight: bold; + position: relative; + z-index: 2; +} + +footer { + border-top: 1px solid var(--text); + margin: 3rem auto 0; + padding: 0.5rem 0 0; + text-align: center; + font-size: .9rem; +} + +@media(max-width:500px) { + body { + margin: 0 0 4rem 0; + padding: 0 10px; + } +} + +/* Format the accordion */ +details { + padding: .6rem 1rem; + background: var(--accent); + border: 1px solid; + border-radius: 5px; + margin-bottom: 1rem; +} + +summary { + cursor: pointer; + font-weight: bold; +} + +details[open] { + padding-bottom: .75rem; +} + +details[open] summary { + margin-bottom: .5rem; +} + +details[open]>*:last-child { + margin-bottom: 0; +} diff --git a/index.md b/index.md index c9ee09e..c0299f0 100644 --- a/index.md +++ b/index.md @@ -1,47 +1,47 @@ ---- -permalink: / -layout: default ---- -The internet has become a bloated mess. Massive JavaScript libraries, countless client-side queries and overly complex frontend frameworks are par for the course these days. - -When online newspapers like [The Guardian](https://www.theguardian.com/uk) are **over 4MB in size**, you know there's a problem. Why does an online newspaper need to be over 4MB in size? It's crazy. - -But we can make a difference - all it takes is some optimisation. Do you really need that extra piece of JavaScript? Does your WordPress site need a theme that adds lots of functionality you're never going to use? Are those huge custom fonts really needed? Are your images optimised for the web? - -**The 512KB Club** is a collection of performance-focused web pages from across the Internet. To qualify your website must satisfy **both** of the following requirements: - -1. It must be an actual site that contains a reasonable amount of information, not just a couple of links on a page ([more info here](#lightweight-notice)). -2. Your total UNCOMPRESSED web resources must not exceed 512KB. - - -{% include faq-01.html %} - -{% include faq-02.html %} - -{% include faq-03.html %} - -{% include faq-04.html %} - -{% include faq-05.html %} - -{% include faq-06.html %} - -{% include faq-07.html %} - -
-
- -{:.jump} -* **Jump to:** -* [Green Team (<100KB)](#100) -* [Orange Team (<250KB)](#250) -* [Blue Team (<512KB)](#512) - -

The Green Team (<100KB) ^ Top ^

-{% include green-team.html %} - -

The Orange Team (<250KB) ^ Top ^

-{% include orange-team.html %} - -

The Blue Team (<512KB) ^ Top ^

-{% include blue-team.html %} +--- +permalink: / +layout: default +--- +The internet has become a bloated mess. Massive JavaScript libraries, countless client-side queries and overly complex frontend frameworks are par for the course these days. + +When online newspapers like [The Guardian](https://www.theguardian.com/uk) are **over 4MB in size**, you know there's a problem. Why does an online newspaper need to be over 4MB in size? It's crazy. + +But we can make a difference - all it takes is some optimisation. Do you really need that extra piece of JavaScript? Does your WordPress site need a theme that adds lots of functionality you're never going to use? Are those huge custom fonts really needed? Are your images optimised for the web? + +**The 512KB Club** is a collection of performance-focused web pages from across the Internet. To qualify your website must satisfy **both** of the following requirements: + +1. It must be an actual site that contains a reasonable amount of information, not just a couple of links on a page ([more info here](#lightweight-notice)). +2. Your total UNCOMPRESSED web resources must not exceed 512KB. + + +{% include faq-01.html %} + +{% include faq-02.html %} + +{% include faq-03.html %} + +{% include faq-04.html %} + +{% include faq-05.html %} + +{% include faq-06.html %} + +{% include faq-07.html %} + +
+
+ +{:.jump} +* **Jump to:** +* [Green Team (<100KB)](#100) +* [Orange Team (<250KB)](#250) +* [Blue Team (<512KB)](#512) + +

The Green Team (<100KB) ^ Top ^

+{% include green-team.html %} + +

The Orange Team (<250KB) ^ Top ^

+{% include orange-team.html %} + +

The Blue Team (<512KB) ^ Top ^

+{% include blue-team.html %} diff --git a/netlify.toml b/netlify.toml index 5f94233..d2b4c39 100644 --- a/netlify.toml +++ b/netlify.toml @@ -2,4 +2,4 @@ [[headers]] for = "/*" [headers.values] - Permissions-Policy = "interest-cohort=()" \ No newline at end of file + Permissions-Policy = "interest-cohort=()"