Hacker News new | past | comments | ask | show | jobs | submit login

The right way to start is with HTML and motherfucking website.

https://motherfuckingwebsite.com/

Really. At this point this is what websites should strive to be. Text on the screen.

Everything about HTML can be learned from the MDN documentation:

https://developer.mozilla.org/en-US/docs/Web/HTML

It can be written by hand but that's way too verbose. Pug is a great solution to that problem: it's just HTML but much less verbose. I integrated it with GitHub Pages so pug sources get compiled to HTML and published when commits are pushed. Great experience.

https://pugjs.org/

https://github.com/pugjs/pug

After this, the next step is to learn CSS so you can make it look a little nicer.

https://developer.mozilla.org/en-US/docs/Web/CSS

Javascript should only be necessary if you want to do something like this:

https://ciechanow.ski/mechanical-watch/




Super nitpick, but I much prefer better mother fucking website: http://bettermotherfuckingwebsite.com/

I think at the bare minimum you should strive to be readable, and you can do that with surprisingly few extra lines of CSS and very basic web design principles (avoid using full black or full white backgrounds). CSS is uhh... a choice, but you don't need to know too much in the very beginning to start building up some motivation of making stuff that looks easy on the eyes.


There's also this one with 10 CSS declarations and night mode:

https://perfectmotherfuckingwebsite.com


The so-called "better" motherfucking website is actually worse than the original. Its worst sin being, of course, setting text in illegible gray.

https://contrastrebellion.com/


Illegible? It's #444 on a white background—that is a 9.73:1 contrast ratio, which gives it a perfect AAA accesibility rating.

If you can't read it, there's probably a wild CSS messing things up on your end.


#000 on a white background has an even better contrast ratio.


Yes, and text doesn't need to have maximum contrast (#000 over #FFF) to be legible. The website you linked above says:

> W3C's Web Content Accessibility Guidelines set the minimum contrast between text and its background so that it can be read by people with moderately low vision (which is quite common).

If you follow that link to W3C, you'll see that the minimum contrast for text to be considered legible is 3:1, though that's for people with standard vision (it's the lowest rating). To be truly accessible, the minimum we should strive for is 7:1. Anything above that has a AAA rating.




Join us for AI Startup School this June 16-17 in San Francisco!

Guidelines | FAQ | Lists | API | Security | Legal | Apply to YC | Contact

Search: