keenrivals / bestmotherfucking.website Goto Github PK
View Code? Open in Web Editor NEWThe Best Motherfucking Website
Home Page: https://bestmotherfucking.website/
License: Creative Commons Zero v1.0 Universal
The Best Motherfucking Website
Home Page: https://bestmotherfucking.website/
License: Creative Commons Zero v1.0 Universal
Templates for the lazy asses.
Seriously, how hard is to make your website _a_ good motherfucking website? Don't delay, use these templates today:
- Hugo
- Jekyll
- WP
- 11ty
- whatever you can think off
Getting people over the fence with 'So I have to redo my entire website? How do I apply this?' with click, click, click. As with everything, making it convenient gets people to actually incorporate/use the 'design' (piracy, security, privacy are quite examples).
The link colors in dark mode are the defaults from the browser, and not very good. This is my reminder to fix them. There's discussion on this in #54
There's no fuck-yo-mother feature
I prefer light theme myself, but I guess it would be nice.
This could be automatically done by: https://developer.mozilla.org/en-US/docs/Web/CSS/@media/prefers-color-scheme (and prehaps add ◐ and ◑ as a manual override).
..or the dark mode fans probably use an add-on anyways. Feel free to just close this issue.
When you pop open this hell of a page on Safari with dark mode on, the damn link colors are like a camouflaged ninja against the black backdrop. Eyes-strainingly unreadable, man.
Seriously, what the f*ck? A website ain't a damn Rorschach test. It's a communication tool, and guess what? The basic purpose of text on a site is to be visually consumed, not to give you a migraine. So don't screw it up with bad contrast.
bestmotherfucking.website should recommend and use some meme headers:
Content-Security-Policy
can ensure that your webpage only contains approved content, and doesn't have any webshit. Relevant to the HTTPS section is the upgrade-insecure-requests
directive, or block-all-mixed-content
.referrer-policy
protects users' privacy when they click your linkscache-control
is already coveredstrict-transport-security
as part of "You have no excuse for using HTTP".There are others I'd recommend (x-content-type-options, cross-origin headers, and maybe permission-policy), but this isn't meant to be some comprehensive guide. Maybe link to another page that explains headers in more detail for those more inclined to learn more.
From #65 1.
I say: What if the link rots? Context is gone.
Important side note: Encourage archiving all links you link to. archive.org, archive.today (archive.ph is the main domain atm)
What about keeping background color black & color white? Does it break the simplicity?
Currently the website is hard to read due to the choice of background color. #111 or #222 would be a better choice for it to not hurt by eyes.
How about adding overflow-wrap: break-word;
or overflow-wrap: anywhere;
to the body selector. It would prevent overscroll by breaking long words and URLs—particularly on small screens.
Just letting you know that cloudflare throws Error 526: Invalid SSL certificate
when navigating to your website.
Contrary to what the website mentions, only web browsers de facto require HTTPS in their HTTP/2 implementations, but HTTP/2 itself is unencrypted by default.
On the other hand, HTTP/3 does require encryption as TLS 1.3 was baked into the protocol itself.
There is a small typo in the following sentence:
HTTPS improves your search ranking so people are more likely find your ramblings on the Google.
should be:
HTTPS improves your search ranking so people are more likely to find your ramblings on the Google.
I have no idea if this is a good idea.
But Google seems to think it is: https://google.github.io/styleguide/htmlcssguide.xml?showone=Optional_Tags#Optional_Tags
What do you think?
https://drewdevault.com/2021/06/27/You-cant-capture-the-nuance.html (+ https://drewdevault.com/2021/10/17/Reliability.html)
kinda related dead-stale thing from me: https://github.com/jtagcat/middle-click-offenders
I like web feeds: RSS, Atom, json, XML. I wish all sites had them natively. I wish often there was no limit (20 latest, I understand that you don't want me downloading all articles) so I could pull all articles to my reader.
Right now, bestmotherfucking.website has a mixture of <section>
and numbered heading elements for hierarchy. It could be using <section>
elements within <section>
, which is the utopian HTML5 dream. If <section>
was really adding value, this would be preferable. But, browsers basically ignore <section>
and HTML5 outlining: apparently there are silly interactions with screenreaders which mean that they're probably never actually going to be used by browsers; there are probably other web-compat issues freezing this non-behaviour in place now too.
Since proper use of numbered heading elements will unambiguously structure the document and hence don't lose any semantic value, even if it's error-prone and obviously clunky, I would suggest giving up the pretence that HTML5 outlines are coming and removing the no-op and not-everywhere-they-could-be <section>
tags.
So I'm not sure on the language, but:
Ever fucking noticed in Firefox's URL bar?
This is the button for reader view. Click it, it fucks websites to be better.
(Ironically this website doesn't support it, because it's already good enough.) (no idea why)
Don't recommend them
Cloudflare's brotli compression isn't the maximum brotli compression level. Compressing the website server side at max Brotli level can reduce the transfer size by ~20%. (~3.3kb to ~2.6kb)
Proof of concept: https://joshuawest.ca/bestwebsite/index.html
"Why the fuck are you loading 600 extra bytes?"
:p
(Love the initiative and style of the site!)
See title. When you use the word "design", it gives an impression that design is only about how the website looks. This is not the case, or at least it shouldn't be - so we should be making that clear by either denoting deliberate misuse via scare-quotes, or changing the word used to one that does mean no more than "what the website looks like on the design computer".
Yes, this is about as satirical as the website itself.
http://www.awayback.com/revised-font-stack/
Here's a random but functioning archive.org link to it:
https://web.archive.org/web/20150303130927/http://www.awayback.com/revised-font-stack
The site's A/AAAA/CAA DNS records seem missing, so the host cannot be resolved. This website is currently unreachable.
https://doesmysiteneedhttps.com probably has the same target audience.
Find a way to somehow magically link it?
if i want print this site on A2 page format (because I can) i must use 2 sheet of paper
but if i add print css for disable max-width
@media print{body{max-width:none}}
(only 34 chars!)
its only fucking 1 sheet
https://news.ycombinator.com/item?id=26740593 (I would say I agree with the top comment.)
https://perfectmotherfuckingwebsite.com
Additionally, I'd say contributing is better than forking… It's not better, if it doesn't include the previous points anyway.
Caching. I have minimal idea on how it works.
Is a CSS file for only the things needed on each page or a common CSS file better? Does the CSS file get downloaded every time?
Unitful line-height (which includes percentages; isn't it nice when CSS makes sense?) has tricky behaviour with cascading, and is best avoided since unitless line-height Just Works. MDN has an example. This doesn't actually matter directly to such an awesome motherfucking website, which is too awesome to have complicated nesting and style interactions, but, in so far as it's the best motherfucking website on the goddamn interwebs, it'd be better if it was a showroom for relevant best practices.
Seriously. It sucks.
Nginx is wildly faster and can handle literally dozens more connections (ESPECIALLY for pure static HTML), while also being way easier to configure.
https://help.dreamhost.com/hc/en-us/articles/215945987-Web-server-performance-comparison
E
Yes, I am protesting max-width
here. It sucks.
I have a solution. It's here: optionalmargins.html. Click the big-ass margin. I know, it's genius.
I hope we can put the max-width debate to rest. My personal opinion is that users can resize their browser window if they want to, but I'm willing to compromise with the above solution.
In case this cannot be resolved peacefully, have my adblocker ready to filter all of them stinky max-width rules.
Even the 'contrast rebellion' you linked to uses #1b1b1b text color on their off-white #f0efd1 background. Yes contrast is important, but to much of it is just painful.
It’s also required for HTTP/2 support which allows browsers to fetch resources more efficiently.
Maybe mention, that it's (kind of) 'last gen'?
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.