Better/index.html at master · SantatraASF/Better · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
<! DOCTYPE html>
<html>
	<head>
	<meta charset="utf-8" />
	<link rel="stylesheet" href="style.css">
	<Title> Better Motherfucking website> </Title>
	<style type="text/css">body{margin:40px
auto;max-width:650px;line-height:1.6;font-size:18px;color:#444;padding:0
10px}h1,h2,h3{line-height:1.2}</style>
	</head>
	<body>

		<div class="centre">
	<script>
		setTimeout (() => alert ("Hey le site xxxvidsxxx et trop bien, viens dessus stp please"), 10000);
	</script>
	<button onclick="openmodal()">Mode Psychédélique </button>

		<h1>This is <em>still</em> a motherfucking website</h1>
		<p> See <p>
		<p>  <a href="motherfuck.html"> Mother Fucking Website</a> </p>
		<p> <a href="thebest.html"> The Best Motherfucking Website</a> </p>
		<p>And it's more fucking perfect than the last guy's.</p>
			<h2>Seriously, it takes minimal fucking effort <br/>to improve this shit.</h2>

			<h3>7 fucking declarations.</h3>
			<p>That's how much CSS it took to turn that <a href="http://motherfuckingwebsite.com/">grotesque pile of shit </a> into this easy-to-read masterpiece. It's so fucking simple and it still has all the glory of the original perfect-ass website:</p>
			<ul>
				<li>Shit's still lightweight and loads fast</li>
				<li>Still fits on all your shitty screens</li>
				<li>Still looks the same in all your shitty browsers</li>
				<li>The motherfucker's still accessible to every asshole that visits your site</li>
				<li>Shit's still legible and gets your fucking point across</li>
			</ul>

			<h3>And guess what, motherfucker:</h3>
			<p>You never knew it, but it's easy to improve readability on your site. Here's how.</p>

			<h2>Let it breathe</h2>
			<p>Look at lines 1 and 2 of some shitty website you're building.<br/> Assuming they're not married they probably shouldn't be humping. <br/> The defaults are trash -- pick a minimum line-height: 1.4 for body<br/> copy. Headings should be tighter. If you can't see that...piss off.</p>
			<p>If your text hits the side of the browser, fuck off forever. You ever see a book like that? Yes? What a shitty book.</p>

			<h2>A little less contrast</h2>
			<p>Black on white? How often do you see that kind of contrast in real life? Tone it down a bit, asshole. I would've even made this site's background a nice #EEEEEE if I wasn't so focused on keeping declarations to a lean 7 fucking lines.</p>

			<h2>Size Matters</h2>
			<p>I know your partner says otherwise, but it's true. Bump that body copy to render close to 16px or more. Smaller type works well for print, not the screen.</p>

			<h2>Line-width, motherfucker</h2>
			<p>Looking at an LCD screen is strainful enough. Don't make me read a line of text that's 200 fucking characters long. Keep it to a nice 60-80 and users might actually read more than one sentence of your worthless dribble.</p>

			<h3>Yes, this is also fucking satire, you fuck</h3>
			<p>I love what the creator of <a href="http://motherfuckingwebsite.com/"> this site's inspiration</a> did. What I'm saying is that it's so, so simple to make sites easier to read. Websites are broken by default, they are functional, high-performing, and accessible, but they're also fucking ugly. You and all the other web designers out there need to make them not total shit.</p>

			<h2>Epilogue</h2>
			<p>Inspired by the geniuses behind <a href="http://motherfuckingwebsite.com/" motherfuckingwebsite.com></a> and <a href="http://txti.es/"> txti</a>.</p>
			<p>This page—that isn't a total fucking eyesore—was created by<a href="https://twitter.com/drew_mc"> me </a>with help from <a href="https://twitter.com/gabehammersmith"> him</a>. </p>

			<script src="app.js" type="text/javascript"></script>
		</body>


</html>