Ind.ie is now Small Technology Foundation.
styleguide.html 6.84 KB
Newer Older
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16
<!DOCTYPE html><html lang="en"><head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width,initial-scale=1,shrink-to-fit=no">
	<title data-set-text="title">Content authoring guidelines | Better</title>
	<link rel="stylesheet" href="/styles/magnific-popup.css">
	<link rel="stylesheet" href="/styles/global.css">
	<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png?v=LbyxjJleOL">
	<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png?v=LbyxjJleOL">
	<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png?v=LbyxjJleOL">
	<link rel="manifest" href="/site.webmanifest?v=LbyxjJleOL">
	<link rel="mask-icon" href="/safari-pinned-tab.svg?v=LbyxjJleOL" color="#0098fe">
	<link rel="shortcut icon" href="/favicon.ico?v=LbyxjJleOL">
	<meta name="msapplication-TileColor" content="#2d89ef">
	<meta name="theme-color" content="#ffffff">
	<meta property="og:title" content="Better">
	<meta property="og:description" content="Better is a privacy tool for Safari that protects you from trackers and privacy-eroding ads on the web.">
17
	<meta property="og:image" content="https://better.fyi/social.jpg">
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 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94
	<meta property="twitter:card" content="summary_large_image">
	<meta property="twitter:description" content="Better is a privacy tool for Safari that protects you from trackers and privacy-eroding ads on the web.">
</head>
<body data-set-attribute="class category" class="none">

	<header class="site-header" data-set-text="html header"><nav class="site-navigation">
			<h2 class="hide">Navigation</h2>
			<ul>
				<li data-set-repeat="navigationItem navigationList" data-set-attribute="class navigationItem.class" class="home">
					<a data-set-attribute="aria-selected navigationItem.selected; href navigationItem.link" data-set-text="navigationItem.label" href="/" aria-selected="false">Home</a>
				</li><li data-set-attribute="class navigationItem.class" data-set-alias="navigationItem navigationList 1" data-set-dummy="1" class="news">
					<a data-set-attribute="aria-selected navigationItem.selected; href navigationItem.link" data-set-text="navigationItem.label" href="/news" aria-selected="false">News</a>
				</li><li data-set-attribute="class navigationItem.class" data-set-alias="navigationItem navigationList 2" data-set-dummy="1" class="sites">
					<a data-set-attribute="aria-selected navigationItem.selected; href navigationItem.link" data-set-text="navigationItem.label" href="/sites" aria-selected="false">Sites</a>
				</li><li data-set-attribute="class navigationItem.class" data-set-alias="navigationItem navigationList 3" data-set-dummy="1" class="trackers">
					<a data-set-attribute="aria-selected navigationItem.selected; href navigationItem.link" data-set-text="navigationItem.label" href="/trackers" aria-selected="false">Trackers</a>
				</li><li data-set-attribute="class navigationItem.class" data-set-alias="navigationItem navigationList 4" data-set-dummy="1" class="support">
					<a data-set-attribute="aria-selected navigationItem.selected; href navigationItem.link" data-set-text="navigationItem.label" href="/support" aria-selected="false">Support</a>
				</li>
			</ul>
		</nav></header>
	<main data-set-text="html content"><h1 id="content-authoring-guidelines">Content authoring guidelines</h1>


<section id="copywriting">
	<h2>Copywriting</h2>
<ul>
<li><p>Be brief: do not quote the whole privacy policy; pick out interesting bits.</p>
</li>
<li><p>You can editorialise (with restraint). Sometimes you just have to laugh at the ridiculousness of some of the trackers that we’re covering. It also helps, when trudging through the cesspit of surveillance capitalism to retain our humour. And it also makes the pages more interesting to read (we don’t want to create a dry database). Please only add editorial comments for something unusually important or to highlight egregious abuses. A good rule of thumb would be: “would this make a good slide in a presentation to illustrate the problem with this particular thing or practice?” Editorial comments should be brief, marked with ‘– Ed.’ and limited to at most one per tracker.</p>
</li>
</ul>

</section>
<section id="images">
	<h2>Images</h2>
<ul>
<li>Use images (sparingly). Not every humdrum tracker page needs images. However, if you are making an editorial comment and you feel that a visual aid is important in highlighting the point, please feel free to use images. Images and screenshots should be 1,160px wide (to display well at their 580pt width on high resolution screens). Please resize and compress images properly. On Mac, <a href="https://imageoptim.com/mac">ImageOptim</a> is a great application for compressing PNGs and <a href="https://itunes.apple.com/us/app/photobulk-watermark-resize/id537211143?mt=12">PhotoBulk</a> is a convenient app for converting between formats.</li>
</ul>

</section>
<section id="quotes">
	<h2>Quotes</h2>
<ul>
<li><p>We use consistent quotation style in the content:</p>
<ul>
<li>Outer quotes are typographical (curly) double quotes: “…”</li>
<li>Inner quotes are typographical (curly) single quotes ‘…’</li>
</ul>
<p><em>e.g “At this time, we do not honor ‘Do Not Track’ headers and similar mechanisms.”</em></p>
</li>
<li><p>If quoted text has quote marks, they should be updated accordingly to match our quotation style. Please do not leave typewriter quotes ("…") in quoted text.</p>
</li>
</ul>
</section></main>
	<footer class="site-footer">
		<div class="footer-wrap">
			<a href="https://ind.ie"><img src="/images/indie.svg" alt="Ind.ie" class="indie-logo"></a>
			<h2>Made in Cork by <a href="https://ind.ie">Ind.ie</a></h2>
			<p id="privacy"><small><strong><a href="/legal">Privacy Policy:</a></strong> We exist to protect your privacy.</small></p>
			<p><small>All content on this site, except <a href="/legal">our trademarks</a>, is released under <a href="https://creativecommons.org/licenses/by-sa/4.0/">Creative Commons Attribution-ShareAlike 4.0 International</a>. <a href="https://source.ind.ie/better/" class="view-source">View Source</a></small></p>
			<div data-set-if="category isNot home" class="downloads">
				<a href="https://itunes.apple.com/us/app/better-by-ind.ie/id1080964978?ls=1&amp;mt=8" class="download-on-the-app-store"><img class="download-on-the-app-store-badge" alt="Download on the App Store" src="/images/download-on-app-store-badge-black.svg"></a>
				<a href="https://itunes.apple.com/us/app/better/id1121192229?ls=1&amp;mt=12" class="download-on-mac-app-store"><img src="/images/download-on-the-mac-app-store-black.svg" class="no-frame" alt="Download on the Mac App Store"></a>
			</div>
		</div>
	</footer>

	<!-- Scripts for performance visualisations -->
	<script src="/scripts/zepto.min.js"></script>
	<script> var jQuery = Zepto; </script>
	<script src="/scripts/jquery.peity.min.js"></script>
	<script src="/scripts/magnific-popup.min.js"></script>
	<script src="/scripts/better.js"></script>


</body></html>