summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authorAndres Rey <[email protected]>2016-12-17 10:34:05 -0300
committerAndres Rey <[email protected]>2016-12-17 10:34:05 -0300
commit984ded395de1982a773f9639481552550c5e17ef (patch)
tree94d8dd265349da187b1ccd223b66c6f18834c41b
parent6f91f4f21f9bc88cc15f038febde4eb3b0c292bf (diff)
Corrected more test cases
Diffstat
-rw-r--r--test/test-pages/heise/expected.html31
-rw-r--r--test/test-pages/ietf-1/expected.html174
-rw-r--r--test/test-pages/keep-images/expected.html537
-rw-r--r--test/test-pages/lifehacker-post-comment-load/expected.html564
-rw-r--r--test/test-pages/lifehacker-working/expected.html564
-rw-r--r--test/test-pages/medium-1/expected.html409
-rw-r--r--test/test-pages/medium-2/expected.html28
-rw-r--r--test/test-pages/missing-paragraphs/expected.html41
-rw-r--r--test/test-pages/mozilla-1/expected.html159
-rw-r--r--test/test-pages/mozilla-2/expected.html129
-rw-r--r--test/test-pages/remove-extra-brs/expected.html26
11 files changed, 1992 insertions, 670 deletions
diff --git a/test/test-pages/heise/expected.html b/test/test-pages/heise/expected.html
index 224dd24..04dc19a 100644
--- a/test/test-pages/heise/expected.html
+++ b/test/test-pages/heise/expected.html
@@ -1,13 +1,20 @@
- <div class="meldung_wrapper">
- <figure class="aufmacherbild"> <img src="http://3.f.ix.de/scale/geometry/600/q75/imgs/18/1/4/6/2/3/5/1/Barcode-Scanner-With-Border-fc08c913da5cea5d.jpeg"/>
- <figcaption>
- <p class="caption">1Password scannt auch QR-Codes.</p>
+<div class="meldung_wrapper">
+
+
+ <figure class="aufmacherbild"><img src="http://3.f.ix.de/scale/geometry/600/q75/imgs/18/1/4/6/2/3/5/1/Barcode-Scanner-With-Border-fc08c913da5cea5d.jpeg"></img><figcaption><p class="caption">1Password scannt auch QR-Codes.</p>
+
+
<p class="source">(Bild: Hersteller)</p>
- </figcaption>
- </figure>
- <p class="meldung_anrisstext"><strong>Das in der iOS-Version bereits enthaltene TOTP-Feature ist nun auch für OS X 10.10 verfügbar. Zudem gibt es neue Zusatzfelder in der Datenbank und weitere Verbesserungen.</strong></p>
- <p><a rel="external" target="_blank" href="https://itunes.apple.com/de/app/1password-password-manager/id443987910">AgileBits hat Version 5.3 seines bekannten Passwortmanagers 1Password für OS X freigegeben.</a> Mit dem Update wird eine praktische Funktion nachgereicht, die <a href="http://fakehost/mac-and-i/meldung/Passwortmanager-1Password-mit-groesseren-Updates-fuer-OS-X-und-iOS-2529204.html">die iOS-Version der Anwendung bereits seit längerem beherrscht</a>: Das direkte Erstellen von Einmal-Passwörtern. Unterstützt wird dabei der <a rel="external" target="_blank" href="https://blog.agilebits.com/2015/01/26/totp-for-1password-users/">TOTP-Standard</a> (Time-Based One-Time Passwords), den unter anderem Firmen wie Evernote, Dropbox oder Google einsetzen, um ihre Zugänge besser abzusichern. Neben Account und regulärem Passwort wird dabei dann ein Zusatzcode verlangt, der nur kurze Zeit gilt.</p>
- <p>Zur TOTP-Nutzung muss zunächst ein Startwert an 1Password übergeben werden. Das geht unter anderem per QR-Code, den die App über ein neues Scanfenster selbst einlesen kann – etwa aus dem Webbrowser. Eine Einführung in die Technik gibt <a rel="external" target="_blank" href="http://1pw.ca/TOTPvideoMac">ein kurzes Video</a>. Die TOTP-Unterstützung in 1Password erlaubt es, auf ein zusätzliches Gerät (z.B. ein iPhone) neben dem Mac zu verzichten, das den Code liefert – was allerdings auch die Sicherheit verringert, weil es keinen "echten" zweiten Faktor mehr gibt.</p>
- <p>Update 5.3 des Passwortmanagers liefert auch noch weitere Verbesserungen. So gibt es die Möglichkeit, FaceTime-Audio- oder Skype-Anrufe aus 1Password zu starten, die Zahl der Zusatzfelder in der Datenbank wurde erweitert und der Umgang mit unterschiedlichen Zeitzonen klappt besser. Die Engine zur Passworteingabe im Browser soll beschleunigt worden sein.</p>
- <p>1Password kostet aktuell knapp 50 Euro im Mac App Store und setzt in seiner aktuellen Version mindestens OS X 10.10 voraus. <span class="ISI_IGNORE">(<a title="Ben Schwan" href="mailto:[email protected]">bsc</a>)</span>
- <br class="clear"/> </p> \ No newline at end of file
+
+ </figcaption></figure><p class="meldung_anrisstext"><strong>Das in der iOS-Version bereits enthaltene TOTP-Feature ist nun auch für OS X 10.10 verfügbar. Zudem gibt es neue Zusatzfelder in der Datenbank und weitere Verbesserungen.</strong></p>
+ <p><a href="https://itunes.apple.com/de/app/1password-password-manager/id443987910" rel="external" target="_blank">AgileBits hat Version 5.3 seines bekannten Passwortmanagers 1Password für OS X freigegeben.</a> Mit dem Update wird eine praktische Funktion nachgereicht, die <a href="http://fakehost/mac-and-i/meldung/Passwortmanager-1Password-mit-groesseren-Updates-fuer-OS-X-und-iOS-2529204.html">die iOS-Version der Anwendung bereits seit längerem beherrscht</a>: Das direkte Erstellen von Einmal-Passwörtern. Unterstützt wird dabei der <a href="https://blog.agilebits.com/2015/01/26/totp-for-1password-users/" rel="external" target="_blank">TOTP-Standard</a> (Time-Based One-Time Passwords), den unter anderem Firmen wie Evernote, Dropbox oder Google einsetzen, um ihre Zugänge besser abzusichern. Neben Account und regulärem Passwort wird dabei dann ein Zusatzcode verlangt, der nur kurze Zeit gilt.</p>
+<p>Zur TOTP-Nutzung muss zunächst ein Startwert an 1Password übergeben werden. Das geht unter anderem per QR-Code, den die App über ein neues Scanfenster selbst einlesen kann – etwa aus dem Webbrowser. Eine Einführung in die Technik gibt <a href="http://1pw.ca/TOTPvideoMac" rel="external" target="_blank">ein kurzes Video</a>. Die TOTP-Unterstützung in 1Password erlaubt es, auf ein zusätzliches Gerät (z.B. ein iPhone) neben dem Mac zu verzichten, das den Code liefert – was allerdings auch die Sicherheit verringert, weil es keinen "echten" zweiten Faktor mehr gibt.</p>
+<p>Update 5.3 des Passwortmanagers liefert auch noch weitere Verbesserungen. So gibt es die Möglichkeit, FaceTime-Audio- oder Skype-Anrufe aus 1Password zu starten, die Zahl der Zusatzfelder in der Datenbank wurde erweitert und der Umgang mit unterschiedlichen Zeitzonen klappt besser. Die Engine zur Passworteingabe im Browser soll beschleunigt worden sein.</p>
+<p>1Password kostet aktuell knapp 50 Euro im Mac App Store und setzt in seiner aktuellen Version mindestens OS X 10.10 voraus.
+
+
+
+<span class="ISI_IGNORE">(<a href="mailto:[email protected]" title="Ben Schwan">bsc</a>)</span>
+<br class="clear"></br></p>
+
+ </div> \ No newline at end of file
diff --git a/test/test-pages/ietf-1/expected.html b/test/test-pages/ietf-1/expected.html
index 5ce872f..8d80a2e 100644
--- a/test/test-pages/ietf-1/expected.html
+++ b/test/test-pages/ietf-1/expected.html
@@ -1,9 +1,7 @@
-<span class="pre noprint docinfo top">[<a href="http://fakehost/test/../html/" title="Document search and retrieval page">Docs</a>] [<a href="https://tools.ietf.org/id/draft-dejong-remotestorage-04.txt" title="Plaintext version of this document">txt</a>|<a href="http://fakehost/pdf/draft-dejong-remotestorage-04.txt" title="PDF version of this document">pdf</a>] [<a href="https://datatracker.ietf.org/doc/draft-dejong-remotestorage" title="IESG Datatracker information for this document">Tracker</a>] [<a href="mailto:[email protected]?subject=draft-dejong-remotestorage%20" title="Send email to the document authors">Email</a>] [<a href="http://fakehost/rfcdiff?difftype=--hwdiff&amp;url2=draft-dejong-remotestorage-04.txt" title="Inline diff (wdiff)">Diff1</a>] [<a href="http://fakehost/rfcdiff?url2=draft-dejong-remotestorage-04.txt" title="Side-by-side diff">Diff2</a>] [<a href="http://fakehost/idnits?url=https://tools.ietf.org/id/draft-dejong-remotestorage-04.txt" title="Run an idnits check of this document">Nits</a>] </span>
- <br/> <span class="pre noprint docinfo"> </span>
- <br/> <span class="pre noprint docinfo">Versions: <a href="http://fakehost/test/draft-dejong-remotestorage-00">00</a> <a href="http://fakehost/test/draft-dejong-remotestorage-01">01</a> <a href="http://fakehost/test/draft-dejong-remotestorage-02">02</a> <a href="http://fakehost/test/draft-dejong-remotestorage-03">03</a> <a href="http://fakehost/test/draft-dejong-remotestorage-04">04</a> </span>
- <br/> <span class="pre noprint docinfo"> </span>
- <br/> <pre>INTERNET DRAFT Michiel B. de Jong
-Document: <a href="http://fakehost/test/draft-dejong-remotestorage-04">draft-dejong-remotestorage-04</a> IndieHosters
+<div>
+
+<span class="pre noprint docinfo top">[<a href="http://fakehost/html/" title="Document search and retrieval page">Docs</a>] [<a href="https://tools.ietf.org/id/draft-dejong-remotestorage-04.txt" title="Plaintext version of this document">txt</a>|<a href="/pdf/draft-dejong-remotestorage-04.txt" title="PDF version of this document">pdf</a>] [<a href="https://datatracker.ietf.org/doc/draft-dejong-remotestorage" title="IESG Datatracker information for this document">Tracker</a>] [<a href="mailto:[email protected]?subject=draft-dejong-remotestorage%20" title="Send email to the document authors">Email</a>] [<a href="/rfcdiff?difftype=--hwdiff&amp;url2=draft-dejong-remotestorage-04.txt" title="Inline diff (wdiff)">Diff1</a>] [<a href="/rfcdiff?url2=draft-dejong-remotestorage-04.txt" title="Side-by-side diff">Diff2</a>] [<a href="/idnits?url=https://tools.ietf.org/id/draft-dejong-remotestorage-04.txt" title="Run an idnits check of this document">Nits</a>] </span><br></br><span class="pre noprint docinfo"> </span><br></br><span class="pre noprint docinfo">Versions: <a href="http://fakehost/draft-dejong-remotestorage-00">00</a> <a href="http://fakehost/draft-dejong-remotestorage-01">01</a> <a href="http://fakehost/draft-dejong-remotestorage-02">02</a> <a href="http://fakehost/draft-dejong-remotestorage-03">03</a> <a href="http://fakehost/draft-dejong-remotestorage-04">04</a> </span><br></br><span class="pre noprint docinfo"> </span><br></br><pre>INTERNET DRAFT Michiel B. de Jong
+Document: <a href="http://fakehost/draft-dejong-remotestorage-04">draft-dejong-remotestorage-04</a> IndieHosters
F. Kooman
Intended Status: Proposed Standard (independent)
Expires: 18 June 2015 15 December 2014
@@ -24,7 +22,7 @@ Abstract
Status of this Memo
This Internet-Draft is submitted in full conformance with the
- provisions of <a href="http://fakehost/test/bcp78">BCP 78</a> and <a href="http://fakehost/test/bcp79">BCP 79</a>.
+ provisions of <a href="http://fakehost/bcp78">BCP 78</a> and <a href="http://fakehost/bcp79">BCP 79</a>.
Internet-Drafts are working documents of the Internet Engineering
Task Force (IETF). Note that other groups may also distribute
@@ -43,7 +41,7 @@ Copyright Notice
Copyright (c) 2014 IETF Trust and the persons identified as the
document authors. All rights reserved.
- This document is subject to <a href="http://fakehost/test/bcp78">BCP 78</a> and the IETF Trust's Legal
+ This document is subject to <a href="http://fakehost/bcp78">BCP 78</a> and the IETF Trust's Legal
Provisions Relating to IETF Documents
(<a href="http://trustee.ietf.org/license-info">http://trustee.ietf.org/license-info</a>) in effect on the date of
publication of this document. Please review these documents
@@ -55,7 +53,7 @@ Copyright Notice
<span class="grey">de Jong [Page 1]</span>
-</pre><pre class="newpage"><a name="page-2" id="page-2" href="#page-2" class="invisible"> </a>
+</pre><pre class="newpage"><a class="invisible" href="#page-2" id="page-2" name="page-2"> </a>
<span class="grey">Internet-Draft remoteStorage December 2014</span>
@@ -91,7 +89,7 @@ Table of Contents
<a href="#section-18">18</a>. Authors' addresses............................................<a href="#page-22">22</a>
-<span class="h2"><a class="selflink" name="section-1" href="#section-1">1</a>. Introduction</span>
+<span class="h2"><a class="selflink" href="#section-1" name="section-1">1</a>. Introduction</span>
Many services for data storage are available over the internet. This
specification describes a vendor-independent interface for such
@@ -105,7 +103,7 @@ Table of Contents
<span class="grey">de Jong [Page 2]</span>
-</pre><pre class="newpage"><a name="page-3" id="page-3" href="#page-3" class="invisible"> </a>
+</pre><pre class="newpage"><a class="invisible" href="#page-3" id="page-3" name="page-3"> </a>
<span class="grey">Internet-Draft remoteStorage December 2014</span>
@@ -124,11 +122,11 @@ Table of Contents
The exact details of these four actions are described in this
specification.
-<span class="h2"><a class="selflink" name="section-2" href="#section-2">2</a>. Terminology</span>
+<span class="h2"><a class="selflink" href="#section-2" name="section-2">2</a>. Terminology</span>
The key words "MUST", "MUST NOT", "REQUIRED", "SHALL", "SHALL NOT",
"SHOULD", "SHOULD NOT", "RECOMMENDED", "MAY", and "OPTIONAL" in this
- document are to be interpreted as described in <a href="http://fakehost/test/rfc2119">RFC 2119</a> [<a href="#ref-WORDS">WORDS</a>].
+ document are to be interpreted as described in <a href="http://fakehost/rfc2119">RFC 2119</a> [<a href="#ref-WORDS">WORDS</a>].
"SHOULD" and "SHOULD NOT" are appropriate when valid exceptions to a
general requirement are known to exist or appear to exist, and it is
@@ -137,7 +135,7 @@ Table of Contents
implement the general requirement when such failure would result in
interoperability failure.
-<span class="h2"><a class="selflink" name="section-3" href="#section-3">3</a>. Storage model</span>
+<span class="h2"><a class="selflink" href="#section-3" name="section-3">3</a>. Storage model</span>
The server stores data in nodes that form a tree structure.
Internal nodes are called 'folders' and leaf nodes are called
@@ -155,7 +153,7 @@ Table of Contents
<span class="grey">de Jong [Page 3]</span>
-</pre><pre class="newpage"><a name="page-4" id="page-4" href="#page-4" class="invisible"> </a>
+</pre><pre class="newpage"><a class="invisible" href="#page-4" id="page-4" name="page-4"> </a>
<span class="grey">Internet-Draft remoteStorage December 2014</span>
@@ -165,7 +163,7 @@ Table of Contents
* content length
* content
-<span class="h2"><a class="selflink" name="section-4" href="#section-4">4</a>. Requests</span>
+<span class="h2"><a class="selflink" href="#section-4" name="section-4">4</a>. Requests</span>
Client-to-server requests SHOULD be made over https [<a href="#ref-HTTPS">HTTPS</a>], and
servers MUST comply with HTTP/1.1 [<a href="#ref-HTTP">HTTP</a>]. Specifically, they
@@ -205,7 +203,7 @@ Table of Contents
<span class="grey">de Jong [Page 4]</span>
-</pre><pre class="newpage"><a name="page-5" id="page-5" href="#page-5" class="invisible"> </a>
+</pre><pre class="newpage"><a class="invisible" href="#page-5" id="page-5" name="page-5"> </a>
<span class="grey">Internet-Draft remoteStorage December 2014</span>
@@ -255,7 +253,7 @@ Table of Contents
<span class="grey">de Jong [Page 5]</span>
-</pre><pre class="newpage"><a name="page-6" id="page-6" href="#page-6" class="invisible"> </a>
+</pre><pre class="newpage"><a class="invisible" href="#page-6" id="page-6" name="page-6"> </a>
<span class="grey">Internet-Draft remoteStorage December 2014</span>
@@ -305,11 +303,11 @@ Table of Contents
<span class="grey">de Jong [Page 6]</span>
-</pre><pre class="newpage"><a name="page-7" id="page-7" href="#page-7" class="invisible"> </a>
+</pre><pre class="newpage"><a class="invisible" href="#page-7" id="page-7" name="page-7"> </a>
<span class="grey">Internet-Draft remoteStorage December 2014</span>
-<span class="h2"><a class="selflink" name="section-5" href="#section-5">5</a>. Response codes</span>
+<span class="h2"><a class="selflink" href="#section-5" name="section-5">5</a>. Response codes</span>
Response codes SHOULD be given as defined by [HTTP, <a href="#section-6">section 6</a>] and
[BEARER, <a href="#section-3.1">section 3.1</a>]. The following is a non-normative checklist
@@ -342,7 +340,7 @@ Table of Contents
Clients SHOULD also handle the case where a response takes too long
to arrive, or where no response is received at all.
-<span class="h2"><a class="selflink" name="section-6" href="#section-6">6</a>. Versioning</span>
+<span class="h2"><a class="selflink" href="#section-6" name="section-6">6</a>. Versioning</span>
All successful requests MUST return an 'ETag' header [<a href="#ref-HTTP">HTTP</a>] with, in
the case of GET, the current version, in the case of PUT, the new
@@ -355,7 +353,7 @@ Table of Contents
<span class="grey">de Jong [Page 7]</span>
-</pre><pre class="newpage"><a name="page-8" id="page-8" href="#page-8" class="invisible"> </a>
+</pre><pre class="newpage"><a class="invisible" href="#page-8" id="page-8" name="page-8"> </a>
<span class="grey">Internet-Draft remoteStorage December 2014</span>
@@ -372,14 +370,14 @@ Table of Contents
A provider MAY offer version rollback functionality to its users,
but this specification does not define the user interface for that.
-<span class="h2"><a class="selflink" name="section-7" href="#section-7">7</a>. CORS headers</span>
+<span class="h2"><a class="selflink" href="#section-7" name="section-7">7</a>. CORS headers</span>
All responses MUST carry CORS headers [<a href="#ref-CORS">CORS</a>]. The server MUST also
reply to OPTIONS requests as per CORS. For GET requests, a wildcard
origin MAY be returned, but for PUT and DELETE requests, the
response MUST echo back the Origin header sent by the client.
-<span class="h2"><a class="selflink" name="section-8" href="#section-8">8</a>. Session description</span>
+<span class="h2"><a class="selflink" href="#section-8" name="section-8">8</a>. Session description</span>
The information that a client needs to receive in order to be able
to connect to a server SHOULD reach the client as described in the
@@ -397,7 +395,7 @@ Table of Contents
can however be reused in subsequent interactions with the same
client, as long as that client is still trusted. Example:
* 'ofb24f1ac3973e70j6vts19qr9v2eei'
- * &lt;storage_api&gt;, always '<a href="http://fakehost/test/draft-dejong-remotestorage-04">draft-dejong-remotestorage-04</a>' for this
+ * &lt;storage_api&gt;, always '<a href="http://fakehost/draft-dejong-remotestorage-04">draft-dejong-remotestorage-04</a>' for this
alternative version of the specification.
The client can make its requests using https with CORS and bearer
@@ -405,7 +403,7 @@ Table of Contents
<span class="grey">de Jong [Page 8]</span>
-</pre><pre class="newpage"><a name="page-9" id="page-9" href="#page-9" class="invisible"> </a>
+</pre><pre class="newpage"><a class="invisible" href="#page-9" id="page-9" name="page-9"> </a>
<span class="grey">Internet-Draft remoteStorage December 2014</span>
@@ -420,7 +418,7 @@ Table of Contents
* https://storage.example.com/bob/public/documents/
* https://storage.example.com/bob/public/documents/draft.txt
-<span class="h2"><a class="selflink" name="section-9" href="#section-9">9</a>. Bearer tokens and access control</span>
+<span class="h2"><a class="selflink" href="#section-9" name="section-9">9</a>. Bearer tokens and access control</span>
A bearer token represents one or more access scopes. These access
scopes are represented as strings of the form &lt;module&gt; &lt;level&gt;,
@@ -455,12 +453,12 @@ Table of Contents
<span class="grey">de Jong [Page 9]</span>
-</pre><pre class="newpage"><a name="page-10" id="page-10" href="#page-10" class="invisible"> </a>
+</pre><pre class="newpage"><a class="invisible" href="#page-10" id="page-10" name="page-10"> </a>
<span class="grey">Internet-Draft remoteStorage December 2014</span>
-<span class="h2"><a class="selflink" name="section-10" href="#section-10">10</a>. Application-first bearer token issuance</span>
+<span class="h2"><a class="selflink" href="#section-10" name="section-10">10</a>. Application-first bearer token issuance</span>
To make a remoteStorage server available as 'the remoteStorage of
&lt;account&gt; at &lt;host&gt;', exactly one link of the following format
@@ -505,7 +503,7 @@ Table of Contents
<span class="grey">de Jong [Page 10]</span>
-</pre><pre class="newpage"><a name="page-11" id="page-11" href="#page-11" class="invisible"> </a>
+</pre><pre class="newpage"><a class="invisible" href="#page-11" id="page-11" name="page-11"> </a>
<span class="grey">Internet-Draft remoteStorage December 2014</span>
@@ -535,7 +533,7 @@ Table of Contents
client_id parameter in favor of relying on the redirect_uri
parameter for client identification.
-<span class="h2"><a class="selflink" name="section-11" href="#section-11">11</a>. Storage-first bearer token issuance</span>
+<span class="h2"><a class="selflink" href="#section-11" name="section-11">11</a>. Storage-first bearer token issuance</span>
The provider MAY also present a dashboard to the user, where they
have some way to add open web app manifests [<a href="#ref-MANIFEST">MANIFEST</a>]. Adding a
@@ -555,7 +553,7 @@ Table of Contents
<span class="grey">de Jong [Page 11]</span>
-</pre><pre class="newpage"><a name="page-12" id="page-12" href="#page-12" class="invisible"> </a>
+</pre><pre class="newpage"><a class="invisible" href="#page-12" id="page-12" name="page-12"> </a>
<span class="grey">Internet-Draft remoteStorage December 2014</span>
@@ -593,19 +591,19 @@ Table of Contents
debug tool, thus bypassing the need for an OAuth dance. Clients
SHOULD NOT rely on this in production.
-<span class="h2"><a class="selflink" name="section-12" href="#section-12">12</a>. Example wire transcripts</span>
+<span class="h2"><a class="selflink" href="#section-12" name="section-12">12</a>. Example wire transcripts</span>
The following examples are not normative ("\" indicates a line was
wrapped).
-<span class="h3"><a class="selflink" name="section-12.1" href="#section-12.1">12.1</a>. WebFinger</span>
+<span class="h3"><a class="selflink" href="#section-12.1" name="section-12.1">12.1</a>. WebFinger</span>
In application-first, an in-browser application might issue the
following request, using XMLHttpRequest and CORS:
<span class="grey">de Jong [Page 12]</span>
-</pre><pre class="newpage"><a name="page-13" id="page-13" href="#page-13" class="invisible"> </a>
+</pre><pre class="newpage"><a class="invisible" href="#page-13" id="page-13" name="page-13"> </a>
<span class="grey">Internet-Draft remoteStorage December 2014</span>
@@ -634,7 +632,7 @@ g.com HTTP/1.1
"href": "<a href="https://3pp.io:4439/storage/michiel">https://3pp.io:4439/storage/michiel</a>",
"rel": "remotestorage",
"properties": {
- "<a href="http://remotestorage.io/spec/version">http://remotestorage.io/spec/version</a>": "<a href="http://fakehost/test/draft-dejong-re">draft-dejong-re</a>\
+ "<a href="http://remotestorage.io/spec/version">http://remotestorage.io/spec/version</a>": "<a href="http://fakehost/draft-dejong-re">draft-dejong-re</a>\
motestorage-04",
"<a href="http://tools.ietf.org/html/rfc6749#section-4.2">http://tools.ietf.org/html/rfc6749#section-4.2</a>": "https\
://3pp.io:4439/oauth/michiel",
@@ -645,7 +643,7 @@ motestorage-04",
}]
}
-<span class="h3"><a class="selflink" name="section-12.2" href="#section-12.2">12.2</a>. OAuth dialog form</span>
+<span class="h3"><a class="selflink" href="#section-12.2" name="section-12.2">12.2</a>. OAuth dialog form</span>
Once the in-browser application has discovered the server's OAuth
end-point, it will typically redirect the user to this URL, in
@@ -655,7 +653,7 @@ motestorage-04",
<span class="grey">de Jong [Page 13]</span>
-</pre><pre class="newpage"><a name="page-14" id="page-14" href="#page-14" class="invisible"> </a>
+</pre><pre class="newpage"><a class="invisible" href="#page-14" id="page-14" name="page-14"> </a>
<span class="grey">Internet-Draft remoteStorage December 2014</span>
@@ -675,7 +673,7 @@ unhosted.5apps.com&amp;response_type=token HTTP/1.1
&lt;title&gt;Allow access?&lt;/title&gt;
...
-<span class="h3"><a class="selflink" name="section-12.3" href="#section-12.3">12.3</a>. OAuth dialog form submission</span>
+<span class="h3"><a class="selflink" href="#section-12.3" name="section-12.3">12.3</a>. OAuth dialog form submission</span>
When the user submits the form, the request would look something
like this:
@@ -700,12 +698,12 @@ low
Location:https://drinks-unhosted.5apps.com/#access_token=j2YnGt\
XjzzzHNjkd1CJxoQubA1o%3D&amp;token_type=bearer&amp;state=
-<span class="h3"><a class="selflink" name="section-12.4" href="#section-12.4">12.4</a>. OPTIONS preflight</span>
+<span class="h3"><a class="selflink" href="#section-12.4" name="section-12.4">12.4</a>. OPTIONS preflight</span>
<span class="grey">de Jong [Page 14]</span>
-</pre><pre class="newpage"><a name="page-15" id="page-15" href="#page-15" class="invisible"> </a>
+</pre><pre class="newpage"><a class="invisible" href="#page-15" id="page-15" name="page-15"> </a>
<span class="grey">Internet-Draft remoteStorage December 2014</span>
@@ -728,7 +726,7 @@ XjzzzHNjkd1CJxoQubA1o%3D&amp;token_type=bearer&amp;state=
Access-Control-Allow-Headers: Authorization, Content-Length, Co\
ntent-Type, Origin, X-Requested-With, If-Match, If-None-Match
-<span class="h3"><a class="selflink" name="section-12.5" href="#section-12.5">12.5</a>. Initial PUT</span>
+<span class="h3"><a class="selflink" href="#section-12.5" name="section-12.5">12.5</a>. Initial PUT</span>
An initial PUT may contain an 'If-None-Match: *' header, like this:
@@ -751,11 +749,11 @@ ntent-Type, Origin, X-Requested-With, If-Match, If-None-Match
Access-Control-Allow-Origin: <a href="https://drinks-unhosted.5apps.com">https://drinks-unhosted.5apps.com</a>
ETag: "1382694045000"
-<span class="h3"><a class="selflink" name="section-12.6" href="#section-12.6">12.6</a>. Subsequent PUT</span>
+<span class="h3"><a class="selflink" href="#section-12.6" name="section-12.6">12.6</a>. Subsequent PUT</span>
<span class="grey">de Jong [Page 15]</span>
-</pre><pre class="newpage"><a name="page-16" id="page-16" href="#page-16" class="invisible"> </a>
+</pre><pre class="newpage"><a class="invisible" href="#page-16" id="page-16" name="page-16"> </a>
<span class="grey">Internet-Draft remoteStorage December 2014</span>
@@ -781,7 +779,7 @@ e.io/spec/modules/myfavoritedrinks/drink"}
Access-Control-Allow-Origin: <a href="https://drinks-unhosted.5apps.com">https://drinks-unhosted.5apps.com</a>
ETag: "1382694048000"
-<span class="h3"><a class="selflink" name="section-12.7" href="#section-12.7">12.7</a>. GET</span>
+<span class="h3"><a class="selflink" href="#section-12.7" name="section-12.7">12.7</a>. GET</span>
A GET request would also include the bearer token, and optionally
an If-None-Match header:
@@ -805,7 +803,7 @@ e.io/spec/modules/myfavoritedrinks/drink"}
<span class="grey">de Jong [Page 16]</span>
-</pre><pre class="newpage"><a name="page-17" id="page-17" href="#page-17" class="invisible"> </a>
+</pre><pre class="newpage"><a class="invisible" href="#page-17" id="page-17" name="page-17"> </a>
<span class="grey">Internet-Draft remoteStorage December 2014</span>
@@ -840,7 +838,7 @@ charset=UTF-8","Content-Length":106}}}
HTTP/1.1 404 Not Found
Access-Control-Allow-Origin: <a href="https://drinks-unhosted.5apps.com">https://drinks-unhosted.5apps.com</a>
-<span class="h3"><a class="selflink" name="section-12.8" href="#section-12.8">12.8</a>. DELETE</span>
+<span class="h3"><a class="selflink" href="#section-12.8" name="section-12.8">12.8</a>. DELETE</span>
A DELETE request may look like this:
@@ -855,7 +853,7 @@ charset=UTF-8","Content-Length":106}}}
<span class="grey">de Jong [Page 17]</span>
-</pre><pre class="newpage"><a name="page-18" id="page-18" href="#page-18" class="invisible"> </a>
+</pre><pre class="newpage"><a class="invisible" href="#page-18" id="page-18" name="page-18"> </a>
<span class="grey">Internet-Draft remoteStorage December 2014</span>
@@ -865,7 +863,7 @@ charset=UTF-8","Content-Length":106}}}
Access-Control-Allow-Origin: <a href="https://drinks-unhosted.5apps.com">https://drinks-unhosted.5apps.com</a>
ETag: "1382694048000"
-<span class="h2"><a class="selflink" name="section-13" href="#section-13">13</a>. Distributed versioning</span>
+<span class="h2"><a class="selflink" href="#section-13" name="section-13">13</a>. Distributed versioning</span>
This section is non-normative, and is intended to explain some of
the design choices concerning ETags and folder listings. At the
@@ -905,7 +903,7 @@ charset=UTF-8","Content-Length":106}}}
<span class="grey">de Jong [Page 18]</span>
-</pre><pre class="newpage"><a name="page-19" id="page-19" href="#page-19" class="invisible"> </a>
+</pre><pre class="newpage"><a class="invisible" href="#page-19" id="page-19" name="page-19"> </a>
<span class="grey">Internet-Draft remoteStorage December 2014</span>
@@ -927,7 +925,7 @@ charset=UTF-8","Content-Length":106}}}
but it is up to whichever client discovers a given version
conflict, to resolve it.
-<span class="h2"><a class="selflink" name="section-14" href="#section-14">14</a>. Security Considerations</span>
+<span class="h2"><a class="selflink" href="#section-14" name="section-14">14</a>. Security Considerations</span>
To prevent man-in-the-middle attacks, the use of https instead of
http is important for both the interface itself and all end-points
@@ -955,7 +953,7 @@ charset=UTF-8","Content-Length":106}}}
<span class="grey">de Jong [Page 19]</span>
-</pre><pre class="newpage"><a name="page-20" id="page-20" href="#page-20" class="invisible"> </a>
+</pre><pre class="newpage"><a class="invisible" href="#page-20" id="page-20" name="page-20"> </a>
<span class="grey">Internet-Draft remoteStorage December 2014</span>
@@ -972,7 +970,7 @@ charset=UTF-8","Content-Length":106}}}
The server SHOULD also detect and stop denial-of-service attacks
that aim to overwhelm its interface with too much traffic.
-<span class="h2"><a class="selflink" name="section-15" href="#section-15">15</a>. IANA Considerations</span>
+<span class="h2"><a class="selflink" href="#section-15" name="section-15">15</a>. IANA Considerations</span>
This document registers the 'remotestorage' link relation, as well
as the following WebFinger properties:
@@ -982,7 +980,7 @@ charset=UTF-8","Content-Length":106}}}
* "<a href="http://tools.ietf.org/html/rfc7233">http://tools.ietf.org/html/rfc7233</a>"
* "<a href="http://remotestorage.io/spec/web-authoring">http://remotestorage.io/spec/web-authoring</a>"
-<span class="h2"><a class="selflink" name="section-16" href="#section-16">16</a>. Acknowledgements</span>
+<span class="h2"><a class="selflink" href="#section-16" name="section-16">16</a>. Acknowledgements</span>
The authors would like to thank everybody who contributed to the
development of this protocol, including Kenny Bentley, Javier Diaz,
@@ -995,95 +993,95 @@ charset=UTF-8","Content-Length":106}}}
Rick van Rein, Mark Nottingham, Julian Reschke, and Markus
Lanthaler, among many others.
-<span class="h2"><a class="selflink" name="section-17" href="#section-17">17</a>. References</span>
+<span class="h2"><a class="selflink" href="#section-17" name="section-17">17</a>. References</span>
-<span class="h3"><a class="selflink" name="section-17.1" href="#section-17.1">17.1</a>. Normative References</span>
+<span class="h3"><a class="selflink" href="#section-17.1" name="section-17.1">17.1</a>. Normative References</span>
- [<a name="ref-WORDS" id="ref-WORDS">WORDS</a>]
+ [<a id="ref-WORDS" name="ref-WORDS">WORDS</a>]
Bradner, S., "Key words for use in RFCs to Indicate Requirement
- Levels", <a href="http://fakehost/test/bcp14">BCP 14</a>, <a href="http://fakehost/test/rfc2119">RFC 2119</a>, March 1997.
+ Levels", <a href="http://fakehost/bcp14">BCP 14</a>, <a href="http://fakehost/rfc2119">RFC 2119</a>, March 1997.
<span class="grey">de Jong [Page 20]</span>
-</pre><pre class="newpage"><a name="page-21" id="page-21" href="#page-21" class="invisible"> </a>
+</pre><pre class="newpage"><a class="invisible" href="#page-21" id="page-21" name="page-21"> </a>
<span class="grey">Internet-Draft remoteStorage December 2014</span>
- [<a name="ref-IRI" id="ref-IRI">IRI</a>]
+ [<a id="ref-IRI" name="ref-IRI">IRI</a>]
Duerst, M., "Internationalized Resource Identifiers (IRIs)",
- <a href="http://fakehost/test/rfc3987">RFC 3987</a>, January 2005.
+ <a href="http://fakehost/rfc3987">RFC 3987</a>, January 2005.
- [<a name="ref-WEBFINGER" id="ref-WEBFINGER">WEBFINGER</a>]
+ [<a id="ref-WEBFINGER" name="ref-WEBFINGER">WEBFINGER</a>]
Jones, P., Salguerio, G., Jones, M, and Smarr, J.,
- "WebFinger", <a href="http://fakehost/test/rfc7033">RFC7033</a>, September 2013.
+ "WebFinger", <a href="http://fakehost/rfc7033">RFC7033</a>, September 2013.
- [<a name="ref-OAUTH" id="ref-OAUTH">OAUTH</a>]
+ [<a id="ref-OAUTH" name="ref-OAUTH">OAUTH</a>]
"<a href="#section-4.2">Section 4.2</a>: Implicit Grant", in: Hardt, D. (ed), "The OAuth
- 2.0 Authorization Framework", <a href="http://fakehost/test/rfc6749">RFC6749</a>, October 2012.
+ 2.0 Authorization Framework", <a href="http://fakehost/rfc6749">RFC6749</a>, October 2012.
-<span class="h3"><a class="selflink" name="section-17.2" href="#section-17.2">17.2</a>. Informative References</span>
+<span class="h3"><a class="selflink" href="#section-17.2" name="section-17.2">17.2</a>. Informative References</span>
- [<a name="ref-HTTPS" id="ref-HTTPS">HTTPS</a>]
- Rescorla, E., "HTTP Over TLS", <a href="http://fakehost/test/rfc2818">RFC2818</a>, May 2000.
+ [<a id="ref-HTTPS" name="ref-HTTPS">HTTPS</a>]
+ Rescorla, E., "HTTP Over TLS", <a href="http://fakehost/rfc2818">RFC2818</a>, May 2000.
- [<a name="ref-HTTP" id="ref-HTTP">HTTP</a>]
+ [<a id="ref-HTTP" name="ref-HTTP">HTTP</a>]
Fielding et al., "Hypertext Transfer Protocol (HTTP/1.1):
- Semantics and Content", <a href="http://fakehost/test/rfc7231">RFC7231</a>, June 2014.
+ Semantics and Content", <a href="http://fakehost/rfc7231">RFC7231</a>, June 2014.
- [<a name="ref-COND" id="ref-COND">COND</a>]
+ [<a id="ref-COND" name="ref-COND">COND</a>]
Fielding et al., "Hypertext Transfer Protocol (HTTP/1.1):
- Conditional Requests", <a href="http://fakehost/test/rfc7232">RFC7232</a>, June 2014.
+ Conditional Requests", <a href="http://fakehost/rfc7232">RFC7232</a>, June 2014.
- [<a name="ref-RANGE" id="ref-RANGE">RANGE</a>]
+ [<a id="ref-RANGE" name="ref-RANGE">RANGE</a>]
Fielding et al., "Hypertext Transfer Protocol (HTTP/1.1):
- Conditional Requests", <a href="http://fakehost/test/rfc7233">RFC7233</a>, June 2014.
+ Conditional Requests", <a href="http://fakehost/rfc7233">RFC7233</a>, June 2014.
- [<a name="ref-SPDY" id="ref-SPDY">SPDY</a>]
+ [<a id="ref-SPDY" name="ref-SPDY">SPDY</a>]
Mark Belshe, Roberto Peon, "SPDY Protocol - Draft 3.1", <a href="http://www.chromium.org/spdy/spdy-protocol/spdy-protocol-draft3-1">http://</a>
<a href="http://www.chromium.org/spdy/spdy-protocol/spdy-protocol-draft3-1">www.chromium.org/spdy/spdy-protocol/spdy-protocol-draft3-1</a>,
September 2013.
- [<a name="ref-JSON-LD" id="ref-JSON-LD">JSON-LD</a>]
+ [<a id="ref-JSON-LD" name="ref-JSON-LD">JSON-LD</a>]
M. Sporny, G. Kellogg, M. Lanthaler, "JSON-LD 1.0", W3C
Proposed Recommendation,
<a href="http://www.w3.org/TR/2014/REC-json-ld-20140116/">http://www.w3.org/TR/2014/REC-json-ld-20140116/</a>, January 2014.
- [<a name="ref-CORS" id="ref-CORS">CORS</a>]
+ [<a id="ref-CORS" name="ref-CORS">CORS</a>]
van Kesteren, Anne (ed), "Cross-Origin Resource Sharing --
W3C Candidate Recommendation 29 January 2013",
<span class="grey">de Jong [Page 21]</span>
-</pre><pre class="newpage"><a name="page-22" id="page-22" href="#page-22" class="invisible"> </a>
+</pre><pre class="newpage"><a class="invisible" href="#page-22" id="page-22" name="page-22"> </a>
<span class="grey">Internet-Draft remoteStorage December 2014</span>
<a href="http://www.w3.org/TR/cors/">http://www.w3.org/TR/cors/</a>, January 2013.
- [<a name="ref-MANIFEST" id="ref-MANIFEST">MANIFEST</a>]
+ [<a id="ref-MANIFEST" name="ref-MANIFEST">MANIFEST</a>]
Mozilla Developer Network (ed), "App manifest -- Revision
330541", <a href="https://developer.mozilla.org/en-">https://developer.mozilla.org/en-</a>
US/Apps/Build/Manifest$revision/566677, April 2014.
- [<a name="ref-DATASTORE" id="ref-DATASTORE">DATASTORE</a>]
+ [<a id="ref-DATASTORE" name="ref-DATASTORE">DATASTORE</a>]
"WebAPI/DataStore", MozillaWiki, retrieved May 2014.
<a href="https://wiki.mozilla.org/WebAPI/DataStore#Manifest">https://wiki.mozilla.org/WebAPI/DataStore#Manifest</a>
- [<a name="ref-KERBEROS" id="ref-KERBEROS">KERBEROS</a>]
+ [<a id="ref-KERBEROS" name="ref-KERBEROS">KERBEROS</a>]
C. Neuman et al., "The Kerberos Network Authentication Service
- (V5)", <a href="http://fakehost/test/rfc4120">RFC4120</a>, July 2005.
+ (V5)", <a href="http://fakehost/rfc4120">RFC4120</a>, July 2005.
- [<a name="ref-BEARER" id="ref-BEARER">BEARER</a>]
+ [<a id="ref-BEARER" name="ref-BEARER">BEARER</a>]
M. Jones, D. Hardt, "The OAuth 2.0 Authorization Framework:
- Bearer Token Usage", <a href="http://fakehost/test/rfc6750">RFC6750</a>, October 2012.
+ Bearer Token Usage", <a href="http://fakehost/rfc6750">RFC6750</a>, October 2012.
[]
"Using remoteStorage for web authoring", reSite wiki, retrieved
September 2014. <a href="https://github.com/michielbdejong/resite/wiki">https://github.com/michielbdejong/resite/wiki</a>
/Using-remoteStorage-for-web-authoring
-<span class="h2"><a class="selflink" name="section-18" href="#section-18">18</a>. Authors' addresses</span>
+<span class="h2"><a class="selflink" href="#section-18" name="section-18">18</a>. Authors' addresses</span>
Michiel B. de Jong
IndieHosters
@@ -1106,7 +1104,7 @@ charset=UTF-8","Content-Length":106}}}
de Jong [Page 22]
-</pre>
- <br/> <span class="noprint"><small><small>Html markup produced by rfcmarkup 1.111, available from
+</pre><br></br><span class="noprint"><small><small>Html markup produced by rfcmarkup 1.111, available from
<a href="https://tools.ietf.org/tools/rfcmarkup/">https://tools.ietf.org/tools/rfcmarkup/</a>
-</small></small></span> \ No newline at end of file
+</small></small></span>
+</div> \ No newline at end of file
diff --git a/test/test-pages/keep-images/expected.html b/test/test-pages/keep-images/expected.html
index c8965ca..97ff3ac 100644
--- a/test/test-pages/keep-images/expected.html
+++ b/test/test-pages/keep-images/expected.html
@@ -1,157 +1,380 @@
- <div class="postField postField--body">
- <section name="ef8c" class=" section--first section--last">
- <div class="section-content">
- <div class="section-inner u-sizeFullWidth">
- <figure name="b9ad" id="b9ad" class="graf--figure postField--fillWidthImage graf--first">
- <div class="aspectRatioPlaceholder is-locked"><img class="graf-image" data-image-id="1*sLDnS1UWEFIS33uLMxq3cw.jpeg" data-width="2100" data-height="1402" src="https://d262ilb51hltx0.cloudfront.net/max/2000/1*sLDnS1UWEFIS33uLMxq3cw.jpeg"/></div>
- </figure>
- </div>
- <div class="section-inner layoutSingleColumn">
- <h4 name="9736" id="9736" data-align="center" class="graf--h4">Welcome to DoctorX’s Barcelona lab, where the drugs you bought online are tested for safety and purity. No questions asked.</h4>
- <figure name="7417" id="7417" class="graf--figure">
- <div class="aspectRatioPlaceholder is-locked"><img class="graf-image" data-image-id="1*3vIhkoHIzcxvUdijoCVx6w.png" data-width="1200" data-height="24" data-action="zoom" data-action-value="1*3vIhkoHIzcxvUdijoCVx6w.png" src="https://d262ilb51hltx0.cloudfront.net/max/800/1*3vIhkoHIzcxvUdijoCVx6w.png"/></div>
- </figure>
- <p name="8a83" id="8a83" class="graf--p">Standing at a table in a chemistry lab in Barcelona, Cristina Gil Lladanosa tears open a silver, smell-proof protective envelope. She slides out a transparent bag full of crystals. Around her, machines whir and hum, and other researchers mill around in long, white coats.</p>
- <p name="b675" id="b675" class="graf--p">She is holding the lab’s latest delivery of a drug bought from the “deep web,” the clandestine corner of the internet that isn’t reachable by normal search engines, and is home to some sites that require special software to access. Labeled as <a href="http://en.wikipedia.org/wiki/MDMA" data-href="http://en.wikipedia.org/wiki/MDMA" class="markup--anchor markup--p-anchor" rel="nofollow">MDMA</a> (the street term is ecstasy), this sample has been shipped from Canada. Lladanosa and her colleague Iván Fornís Espinosa have also received drugs, anonymously, from people in China, Australia, Europe and the United States.</p>
- <p name="3c0b" id="3c0b" class="graf--p graf--startsWithDoubleQuote">“Here we have speed, MDMA, cocaine, pills,” Lladanosa says, pointing to vials full of red, green, blue and clear solutions sitting in labeled boxes.</p>
- </div>
- <div class="section-inner u-sizeFullWidth">
- <figure name="c4e6" id="c4e6" class="graf--figure postField--fillWidthImage">
- <div class="aspectRatioPlaceholder is-locked"><img class="graf-image" data-image-id="1*4gN1-fzOwCniw-DbqQjDeQ.jpeg" data-width="2100" data-height="1402" src="https://d262ilb51hltx0.cloudfront.net/max/2000/1*4gN1-fzOwCniw-DbqQjDeQ.jpeg"/></div>
- <figcaption class="imageCaption">Cristina Gil Lladanosa, at the Barcelona testing lab | photo by Joan Bardeletti</figcaption>
- </figure>
- </div>
- <div class="section-inner layoutSingleColumn">
- <p name="7a54" id="7a54" class="graf--p">Since 2011, with the launch of <a href="http://en.wikipedia.org/wiki/Silk_Road_%28marketplace%29" data-href="http://en.wikipedia.org/wiki/Silk_Road_%28marketplace%29" class="markup--anchor markup--p-anchor" rel="nofollow">Silk Road</a>, anybody has been able to safely buy illegal drugs from the deep web and have them delivered to their door. Though the FBI shut down that black market in October 2013, other outlets have emerged to fill its role. For the last 10 months the lab at which Lladanosa and Espinosa work has offered a paid testing service of those drugs. By sending in samples for analysis, users can know exactly what it is they are buying, and make a more informed decision about whether to ingest the substance. The group, called <a href="http://energycontrol.org/" data-href="http://energycontrol.org/" class="markup--anchor markup--p-anchor" rel="nofollow">Energy Control</a>, which has being running “harm reduction” programs since 1999, is the first to run a testing service explicitly geared towards verifying those purchases from the deep web.</p>
- <p name="4395" id="4395" class="graf--p">Before joining Energy Control, Lladanosa briefly worked at a pharmacy, whereas Espinosa spent 14 years doing drug analysis. Working at Energy Control is “more gratifying,” and “rewarding” than her previous jobs, Lladanosa told me. They also receive help from a group of volunteers, made up of a mixture of “squatters,” as Espinosa put it, and medical students, who prepare the samples for testing.</p>
- <p name="0c18" id="0c18" class="graf--p">After weighing out the crystals, aggressively mixing it with methanol until dissolved, and delicately pouring the liquid into a tiny brown bottle, Lladanosa, a petite woman who is nearly engulfed by her lab coat, is now ready to test the sample. She loads a series of three trays on top of a large white appliance sitting on a table, called a gas chromatograph (GC). A jungle of thick pipes hang from the lab’s ceiling behind it.</p>
- </div>
- <div class="section-inner u-sizeFullWidth">
- <figure name="559c" id="559c" class="graf--figure postField--fillWidthImage">
- <div class="aspectRatioPlaceholder is-locked"><img class="graf-image" data-image-id="1*2KPmZkIBUrhps-2uwDvYFQ.jpeg" data-width="2100" data-height="1402" src="https://d262ilb51hltx0.cloudfront.net/max/2000/1*2KPmZkIBUrhps-2uwDvYFQ.jpeg"/></div>
- <figcaption class="imageCaption">Photo by Joan Bardeletti</figcaption>
- </figure>
- </div>
- <div class="section-inner layoutSingleColumn">
- <p name="1549" id="1549" class="graf--p graf--startsWithDoubleQuote">“Chromatography separates all the substances,” Lladanosa says as she loads the machine with an array of drugs sent from the deep web and local Spanish users. It can tell whether a sample is pure or contaminated, and if the latter, with what.</p>
- <p name="5d0f" id="5d0f" class="graf--p">Rushes of hot air blow across the desk as the gas chromatograph blasts the sample at 280 degrees Celsius. Thirty minutes later the machine’s robotic arm automatically moves over to grip another bottle. The machine will continue cranking through the 150 samples in the trays for most of the work week.</p>
- </div>
- <div class="section-inner u-sizeFullWidth">
- <figure name="d6aa" id="d6aa" class="graf--figure postField--fillWidthImage">
- <div class="aspectRatioPlaceholder is-locked"><img class="graf-image" data-image-id="1*PU40bbbox2Ompc5I3RE99A.jpeg" data-width="2013" data-height="1241" src="https://d262ilb51hltx0.cloudfront.net/max/2000/1*PU40bbbox2Ompc5I3RE99A.jpeg"/></div>
- <figcaption class="imageCaption">Photo by Joan Bardeletti</figcaption>
- </figure>
- </div>
- <div class="section-inner layoutSingleColumn">
- <p name="15e0" id="15e0" class="graf--p">To get the drugs to Barcelona, a user mails at least 10 milligrams of a substance to the offices of the Asociación Bienestar y Desarrollo, the non-government organization that oversees Energy Control. The sample then gets delivered to the testing service’s laboratory, at the Barcelona Biomedical Research Park, a futuristic, seven story building sitting metres away from the beach. Energy Control borrows its lab space from a biomedical research group for free.</p>
- <p name="2574" id="2574" class="graf--p">The tests cost 50 Euro per sample. Users pay, not surprisingly, with Bitcoin. In the post announcing Energy Control’s service on the deep web, the group promised that “All profits of this service are set aside of maintenance of this project.”</p>
- <p name="2644" id="2644" class="graf--p">About a week after testing, those results are sent in a PDF to an email address provided by the anonymous client.</p>
- <p name="9f91" id="9f91" class="graf--p graf--startsWithDoubleQuote">“The process is quite boring, because you are in a routine,” Lladanosa says. But one part of the process is consistently surprising: that moment when the results pop up on the screen. “Every time it’s something different.” For instance, one cocaine sample she had tested also contained phenacetin, a painkiller added to increase the product’s weight; lidocaine, an anesthetic that numbs the gums, giving the impression that the user is taking higher quality cocaine; and common caffeine.</p>
- <figure name="b821" id="b821" class="graf--figure">
- <div class="aspectRatioPlaceholder is-locked"><img class="graf-image" data-image-id="1*ohyycinH18fz98TCyUzVgQ.png" data-width="1200" data-height="24" data-action="zoom" data-action-value="1*ohyycinH18fz98TCyUzVgQ.png" src="https://d262ilb51hltx0.cloudfront.net/max/800/1*ohyycinH18fz98TCyUzVgQ.png"/></div>
- </figure>
- <p name="39a6" id="39a6" class="graf--p">The deep web drug lab is the brainchild of Fernando Caudevilla, a Spanish physician who is better known as “DoctorX” on the deep web, a nickname given to him by his Energy Control co-workers because of his earlier writing about the history, risks and recreational culture of MDMA. In the physical world, Caudevilla has worked for over a decade with Energy Control on various harm reduction focused projects, most of which have involved giving Spanish illegal drug users medical guidance, and often writing leaflets about the harms of certain substances.</p>
- </div>
- <div class="section-inner u-sizeFullWidth">
- <figure name="eebc" id="eebc" class="graf--figure postField--fillWidthImage">
- <div class="aspectRatioPlaceholder is-locked"><img class="graf-image" data-image-id="1*mKvUNOAVQxl6atCbxbCZsg.jpeg" data-width="2100" data-height="1241" src="https://d262ilb51hltx0.cloudfront.net/max/2000/1*mKvUNOAVQxl6atCbxbCZsg.jpeg"/></div>
- <figcaption class="imageCaption">Fernando Caudevilla, AKA DoctorX. Photo: Joseph Cox</figcaption>
- </figure>
- </div>
- <div class="section-inner layoutSingleColumn">
- <p name="c099" id="c099" class="graf--p">Caudevilla first ventured into Silk Road forums in April 2013. “I would like to contribute to this forum offering professional advice in topics related to drug use and health,” he wrote in an <a href="http://web.archive.org/web/20131015051405/https://dkn255hz262ypmii.onion.to/index.php?topic=147607.0" data-href="http://web.archive.org/web/20131015051405/https://dkn255hz262ypmii.onion.to/index.php?topic=147607.0" class="markup--anchor markup--p-anchor" rel="nofollow">introductory post</a>, using his DoctorX alias. Caudevilla offered to provide answers to questions that a typical doctor is not prepared, or willing, to respond to, at least not without a lecture or a judgment. “This advice cannot replace a complete face-to-face medical evaluation,” he wrote, “but I know how difficult it can be to talk frankly about these things.”</p>
- <p name="ff1d" id="ff1d" class="graf--p">The requests flooded in. A diabetic asked what effect MDMA has on blood sugar; another what the risks of frequent psychedelic use were for a young person. Someone wanted to know whether amphetamine use should be avoided during lactation. In all, Fernando’s thread received over 50,000 visits and 300 questions before the FBI shut down Silk Road.</p>
- <p name="1f35" id="1f35" class="graf--p graf--startsWithDoubleQuote">“He’s amazing. A gift to this community,” one user wrote on the Silk Road 2.0 forum, a site that sprang up after the original. “His knowledge is invaluable, and never comes with any judgment.” Up until recently, Caudevilla answered questions on the marketplace “Evolution.” Last week, however, the administrators of that site <a href="http://motherboard.vice.com/read/one-of-the-darknets-biggest-markets-may-have-just-stole-all-its-users-bitcoin" data-href="http://motherboard.vice.com/read/one-of-the-darknets-biggest-markets-may-have-just-stole-all-its-users-bitcoin" class="markup--anchor markup--p-anchor" rel="nofollow">pulled a scam</a>, shutting the market down and escaping with an estimated $12 million worth of Bitcoin.</p>
- <p name="b20f" id="b20f" class="graf--p">Caudevilla’s transition from dispensing advice to starting up a no-questions-asked drug testing service came as a consequence of his experience on the deep web. He’d wondered whether he could help bring more harm reduction services to a marketplace without controls. The Energy Control project, as part of its mandate of educating drug users and preventing harm, had already been carrying out drug testing for local Spanish users since 2001, at music festivals, night clubs, or through a drop-in service at a lab in Madrid.</p>
- <p name="f739" id="f739" class="graf--p graf--startsWithDoubleQuote">“I thought, we are doing this in Spain, why don’t we do an international drug testing service?” Caudevilla told me when I visited the other Energy Control lab, in Madrid. Caudevilla, a stocky character with ear piercings and short, shaved hair, has eyes that light up whenever he discusses the world of the deep web. Later, via email, he elaborated that it was not a hard sell. “It was not too hard to convince them,” he wrote me. Clearly, Energy Control believed that the reputation he had earned as an unbiased medical professional on the deep web might carry over to the drug analysis service, where one needs to establish “credibility, trustworthiness, [and] transparency,” Caudevilla said. “We could not make mistakes,” he added.</p>
- </div>
- <div class="section-inner u-sizeFullWidth">
- <figure name="4058" id="4058" class="graf--figure postField--fillWidthImage">
- <div class="aspectRatioPlaceholder is-locked"><img class="graf-image" data-image-id="1*knT10_FNVUmqQIBLnutmzQ.jpeg" data-width="4400" data-height="3141" src="https://d262ilb51hltx0.cloudfront.net/max/2000/1*knT10_FNVUmqQIBLnutmzQ.jpeg"/></div>
- <figcaption class="imageCaption">Photo: Joseph Cox</figcaption>
- </figure>
- </div>
- <div class="section-inner layoutSingleColumn">
- <figure name="818c" id="818c" class="graf--figure">
- <div class="aspectRatioPlaceholder is-locked"><img class="graf-image" data-image-id="1*ohyycinH18fz98TCyUzVgQ.png" data-width="1200" data-height="24" data-action="zoom" data-action-value="1*ohyycinH18fz98TCyUzVgQ.png" src="https://d262ilb51hltx0.cloudfront.net/max/800/1*ohyycinH18fz98TCyUzVgQ.png"/></div>
- </figure>
- <p name="7b5e" id="7b5e" class="graf--p">While the Energy Control lab in Madrid lab only tests Spanish drugs from various sources, it is the Barcelona location which vets the substances bought in the shadowy recesses of of the deep web. Caudevilla no longer runs it, having handed it over to his colleague Ana Muñoz. She maintains a presence on the deep web forums, answers questions from potential users, and sends back reports when they are ready.</p>
- <p name="0f0e" id="0f0e" class="graf--p">The testing program exists in a legal grey area. The people who own the Barcelona lab are accredited to experiment with and handle drugs, but Energy Control doesn’t have this permission itself, at least not in writing.</p>
- <p name="e002" id="e002" class="graf--p graf--startsWithDoubleQuote">“We have a verbal agreement with the police and other authorities. They already know what we are doing,” Lladanosa tells me. It is a pact of mutual benefit. Energy Control provides the police with information on batches of drugs in Spain, whether they’re from the deep web or not, Espinosa says. They also contribute to the European Monitoring Centre for Drugs and Drug Addiction’s early warning system, a collaboration that attempts to spread information about dangerous drugs as quickly as possible.</p>
- <p name="db1b" id="db1b" class="graf--p">By the time of my visit in February, Energy Control had received over 150 samples from the deep web and have been receiving more at a rate of between 4 and 8 a week. Traditional drugs, such as cocaine and MDMA, make up about 70 percent of the samples tested, but the Barcelona lab has also received samples of the prescription pill codeine, research chemicals and synthetic cannabinoids, and even pills of Viagra.</p>
- </div>
- <div class="section-inner u-sizeFullWidth">
- <figure name="b885" id="b885" class="graf--figure postField--fillWidthImage">
- <div class="aspectRatioPlaceholder is-locked"><img class="graf-image" data-image-id="1*Vr61dyCTRwk6CemmVF8YAQ.jpeg" data-width="2100" data-height="1402" src="https://d262ilb51hltx0.cloudfront.net/max/2000/1*Vr61dyCTRwk6CemmVF8YAQ.jpeg"/></div>
- <figcaption class="imageCaption">Photo by Joan Bardeletti</figcaption>
- </figure>
- </div>
- <div class="section-inner layoutSingleColumn">
- <p name="e76f" id="e76f" class="graf--p">So it’s fair to make a tentative judgement on what people are paying for on the deep web. The verdict thus far? Overall, drugs on the deep web appear to be of much higher quality than those found on the street.</p>
- <p name="5352" id="5352" class="graf--p graf--startsWithDoubleQuote">“In general, the cocaine is amazing,” says Caudevilla, saying that the samples they’ve seen have purities climbing towards 80 or 90 percent, and some even higher. To get an idea of how unusual this is, take a look at the <a href="http://www.unodc.org/documents/wdr2014/Cocaine_2014_web.pdf" data-href="http://www.unodc.org/documents/wdr2014/Cocaine_2014_web.pdf" class="markup--anchor markup--p-anchor" rel="nofollow">United Nations Office on Drugs and Crime World Drug Report 2014</a>, which reports that the average quality of street cocaine in Spain is just over 40 percent, while in the United Kingdom it is closer to 30 percent.“We have found 100 percent [pure] cocaine,” he adds. “That’s really, really strange. That means that, technically, this cocaine has been purified, with clandestine methods.”</p>
- <p name="a71c" id="a71c" class="graf--p">Naturally, identifying vendors who sell this top-of-the-range stuff is one of the reasons that people have sent samples to Energy Control. Caudevilla was keen to stress that, officially, Energy Control’s service “is not intended to be a control of drug quality,” meaning a vetting process for identifying the best sellers, but that is exactly how some people have been using it.</p>
- <p name="cb5b" id="cb5b" class="graf--p">As one buyer on the Evolution market, elmo666, wrote to me over the site’s messaging system, “My initial motivations were selfish. My primary motivation was to ensure that I was receiving and continue to receive a high quality product, essentially to keep the vendor honest as far as my interactions with them went.”</p>
- <p name="d80d" id="d80d" class="graf--p">Vendors on deep web markets advertise their product just like any other outlet does, using flash sales, gimmicky giveaways and promises of drugs that are superior to those of their competitors. The claims, however, can turn out to be empty: despite the test results that show that deep web cocaine vendors typically sell product that is of a better quality than that found on the street, in plenty of cases, the drugs are nowhere near as pure as advertised.</p>
- <p name="36de" id="36de" class="graf--p graf--startsWithDoubleQuote">“You won’t be getting anything CLOSE to what you paid for,” one user complained about the cocaine from ‘Mirkov’, a vendor on Evolution. “He sells 65% not 95%.”</p>
- </div>
- <div class="section-inner u-sizeFullWidth">
- <figure name="8544" id="8544" class="graf--figure postField--fillWidthImage">
- <div class="aspectRatioPlaceholder is-locked"><img class="graf-image" data-image-id="1*a-1_13xE6_ErQ-QSlz6myw.jpeg" data-width="2100" data-height="1402" src="https://d262ilb51hltx0.cloudfront.net/max/2000/1*a-1_13xE6_ErQ-QSlz6myw.jpeg"/></div>
- <figcaption class="imageCaption">Photo by Joan Bardeletti</figcaption>
- </figure>
- </div>
- <div class="section-inner layoutSingleColumn">
- <figure name="d521" id="d521" class="graf--figure">
- <div class="aspectRatioPlaceholder is-locked"><img class="graf-image" data-image-id="1*ohyycinH18fz98TCyUzVgQ.png" data-width="1200" data-height="24" data-action="zoom" data-action-value="1*ohyycinH18fz98TCyUzVgQ.png" src="https://d262ilb51hltx0.cloudfront.net/max/800/1*ohyycinH18fz98TCyUzVgQ.png"/></div>
- </figure>
- <p name="126b" id="126b" class="graf--p">Despite the prevalence of people using the service to gauge the quality of what goes up their nose, many users send samples to Energy Control in the spirit of its original mission: keeping themselves alive and healthy. The worst case scenario from drugs purchased on the deep web is, well the worst case. That was the outcome when <a href="http://www.independent.co.uk/news/uk/crime/teenager-patrick-mcmullen-who-died-while-on-skype-had-bought-drugs-from-silk-road-8942329.html" data-href="http://www.independent.co.uk/news/uk/crime/teenager-patrick-mcmullen-who-died-while-on-skype-had-bought-drugs-from-silk-road-8942329.html" class="markup--anchor markup--p-anchor" rel="nofollow">Patrick McMullen,</a> a 17-year-old Scottish student, ingested half a gram of MDMA and three tabs of LSD, reportedly purchased from the Silk Road. While talking to his friends on Skype, his words became slurred and he passed out. Paramedics could not revive him. The coroner for that case, Sherrif Payne, who deemed the cause of death ecstasy toxicity, told <em class="markup--em markup--p-em">The Independent</em> “You never know the purity of what you are taking and you can easily come unstuck.”</p>
- <p name="5e9e" id="5e9e" class="graf--p">ScreamMyName, a deep web user who has been active since the original Silk Road, wants to alert users to the dangerous chemicals that are often mixed with drugs, and is using Energy Control as a means to do so.</p>
- <p name="19a6" id="19a6" class="graf--p graf--startsWithDoubleQuote">“We’re at a time where some vendors are outright sending people poison. Some do it unknowingly,” ScreamMyName told me in an encrypted message. “Cocaine production in South America is often tainted with either levamisole or phenacetine. Both poison to humans and both with severe side effects.”</p>
- <p name="9fef" id="9fef" class="graf--p">In the case of Levamisole, those prescribing it are often not doctors but veterinarians, as Levamisole is commonly used on animals, primarily for the treatment of worms. If ingested by humans it can lead to cases of extreme eruptions of the skin, as <a href="http://www.ncbi.nlm.nih.gov/pubmed/22127712" data-href="http://www.ncbi.nlm.nih.gov/pubmed/22127712" class="markup--anchor markup--p-anchor" rel="nofollow">documented in a study</a> from researchers at the University of California, San Francisco. But Lladanosa has found Levamisole in cocaine samples; dealers use it to increase the product weight, allowing them to stretch their batch further for greater profit — and also, she says, because Levamisole has a strong stimulant effect.</p>
- <p name="7886" id="7886" class="graf--p graf--startsWithDoubleQuote">“It got me sick as fuck,” Dr. Feel, an Evolution user, wrote on the site’s forums after consuming cocaine that had been cut with 23 percent Levamisole, and later tested by Energy Control. “I was laid up in bed for several days because of that shit. The first night I did it, I thought I was going to die. I nearly drove myself to the ER.”</p>
- <p name="18d3" id="18d3" class="graf--p graf--startsWithDoubleQuote">“More people die because of tainted drugs than the drugs themselves,” Dr. Feel added. “It’s the cuts and adulterants that are making people sick and killing them.”</p>
- </div>
- <div class="section-inner u-sizeFullWidth">
- <figure name="552a" id="552a" class="graf--figure postField--fillWidthImage">
- <div class="aspectRatioPlaceholder is-locked"><img class="graf-image" data-image-id="1*IWXhtSsVv0gNnCwnDEXk-Q.jpeg" data-width="2100" data-height="1192" src="https://d262ilb51hltx0.cloudfront.net/max/2000/1*IWXhtSsVv0gNnCwnDEXk-Q.jpeg"/></div>
- <figcaption class="imageCaption">Photo by Joan Bardeletti</figcaption>
- </figure>
- </div>
- <div class="section-inner layoutSingleColumn">
- <p name="839a" id="839a" class="graf--p">The particular case of cocaine cut with Levamisole is one of the reasons that ScreamMyName has been pushing for more drug testing on the deep web markets. “I recognize that drug use isn’t exactly healthy, but why exacerbate the problem?” he told me when I contacted him after his post. “[Energy Control] provides a way for users to test the drugs they’ll use and for these very users to know what it is they’re putting in their bodies. Such services are in very short supply.”</p>
- <p name="18dc" id="18dc" class="graf--p">After sending a number of Energy Control tests himself, ScreamMyName started a de facto crowd-sourcing campaign to get more drugs sent to the lab, and then shared the results, after throwing in some cash to get the ball rolling. <a href="https://blockchain.info/address/1Mi6VjMFqjcD48FPV7cnPB24MAtQQenRy3" data-href="https://blockchain.info/address/1Mi6VjMFqjcD48FPV7cnPB24MAtQQenRy3" class="markup--anchor markup--p-anchor" rel="nofollow">He set up a Bitcoin wallet</a>, with the hope that users might chip in to fund further tests. At the time of writing, the wallet has received a total of 1.81 bitcoins; around $430 at today’s exchange rates.</p>
- <p name="dcbd" id="dcbd" class="graf--p">In posts to the Evolution community, ScreamMyName pitched this project as something that will benefit users and keep drug dealer honest. “When the funds build up to a point where we can purchase an [Energy Control] test fee, we’ll do a US thread poll for a few days and try to cohesively decide on what vendor to test,” he continued.</p>
- </div>
- <div class="section-inner u-sizeFullWidth">
- <figure name="9d32" id="9d32" class="graf--figure postField--fillWidthImage">
- <div class="aspectRatioPlaceholder is-locked"><img class="graf-image" data-image-id="1*NGcrjfkV0l37iQH2uyYjEw.jpeg" data-width="1368" data-height="913" src="https://d262ilb51hltx0.cloudfront.net/max/2000/1*NGcrjfkV0l37iQH2uyYjEw.jpeg"/></div>
- <figcaption class="imageCaption">Photo by Joan Bardeletti</figcaption>
- </figure>
- </div>
- <div class="section-inner layoutSingleColumn">
- <p name="bff6" id="bff6" class="graf--p">Other members of the community have been helping out, too. PlutoPete, a vendor from the original Silk Road who sold cannabis seeds and other legal items, has provided ScreamMyName with packaging to safely send the samples to Barcelona. “A box of baggies, and a load of different moisture barrier bags,” PlutoPete told me over the phone. “That’s what all the vendors use.”</p>
- <p name="bb78" id="bb78" class="graf--p">It’s a modest program so far. ScreamMyName told me that so far he had gotten enough public funding to purchase five different Energy Control tests, in addition to the ten or so he’s sent himself so far. “The program created is still in its infancy and it is growing and changing as we go along but I have a lot of faith in what we’re doing,” he says.</p>
- <p name="5638" id="5638" class="graf--p">But the spirit is contagious: elmo666, the other deep web user testing cocaine, originally kept the results of the drug tests to himself, but he, too, saw a benefit to distributing the data. “It is clear that it is a useful service to other users, keeping vendors honest and drugs (and their users) safe,” he told me. He started to report his findings to others on the forums, and then created a thread with summaries of the test results, as well as comments from the vendors if they provided it. Other users were soon basing their decisions on what to buy on elmo666‘s tests.</p>
- <p name="de75" id="de75" class="graf--p graf--startsWithDoubleQuote">“I’m defo trying the cola based on the incredibly helpful elmo and his energy control results and recommendations,” wrote user jayk1984. On top of this, elmo666 plans to launch an independent site on the deep web that will collate all of these results, which should act as a resource for users of all the marketplaces.</p>
- <p name="6b72" id="6b72" class="graf--p">As word of elmo666's efforts spread, he began getting requests from drug dealers who wanted him to use their wares for testing. Clearly, they figured that a positive result from Energy Control would be a fantastic marketing tool to draw more customers. They even offered elmo666 free samples. (He passed.)</p>
- <p name="b008" id="b008" class="graf--p">Meanwhile, some in the purchasing community are arguing that those running markets on the deep web should be providing quality control themselves. PlutoPete told me over the phone that he had been in discussions about this with Dread Pirate Roberts, the pseudonymous owner of the original Silk Road site. “We [had been] talking about that on a more organized basis on Silk Road 1, doing lots of anonymous buys to police each category. But of course they took the thing [Silk Road] down before we got it properly off the ground,” he lamented.</p>
- <p name="49c8" id="49c8" class="graf--p">But perhaps it is best that the users, those who are actually consuming the drugs, remain in charge of shaming dealers and warning each other. “It’s our responsibility to police the market based on reviews and feedback,” elmo666 wrote in an Evolution forum post. It seems that in the lawless space of the deep web, where everything from child porn to weapons are sold openly, users have cooperated in an organic display of self-regulation to stamp out those particular batches of drugs that are more likely to harm users.</p>
- <p name="386d" id="386d" class="graf--p graf--startsWithDoubleQuote">“That’s always been the case with the deep web,” PlutoPete told me. Indeed, ever since Silk Road, a stable of the drug markets has been the review system, where buyers can leave a rating and feedback for vendors, letting others know about the reliability of the seller. But DoctorX’s lab, rigorously testing the products with scientific instruments, takes it a step further.</p>
- </div>
- <div class="section-inner u-sizeFullWidth">
- <figure name="890b" id="890b" class="graf--figure postField--fillWidthImage">
- <div class="aspectRatioPlaceholder is-locked"><img class="graf-image" data-image-id="1*WRlKt3q3mt7utmwxcbl3sQ.jpeg" data-width="2100" data-height="1373" src="https://d262ilb51hltx0.cloudfront.net/max/2000/1*WRlKt3q3mt7utmwxcbl3sQ.jpeg"/></div>
- <figcaption class="imageCaption">Photo by Joan Bardeletti</figcaption>
- </figure>
- </div>
- <div class="section-inner layoutSingleColumn">
- <p name="b109" id="b109" class="graf--p graf--startsWithDoubleQuote">“In the white market, they have quality control. In the dark market, it should be the same,” Cristina Gil Lladanosa says to me before I leave the Barcelona lab.</p>
- <p name="e3a4" id="e3a4" class="graf--p">A week after I visit the lab, the results of the MDMA arrive in my inbox: it is 85 percent pure, with no indications of other active ingredients. Whoever ordered that sample from the digital shelves of the deep web, and had it shipped to their doorstep in Canada, got hold of some seriously good, and relatively safe drugs. And now they know it.</p>
- <figure name="31cf" id="31cf" class="graf--figure">
- <div class="aspectRatioPlaceholder is-locked"><img class="graf-image" data-image-id="1*320_4I0lxbn5x3bx4XPI5Q.png" data-width="1200" data-height="24" data-action="zoom" data-action-value="1*320_4I0lxbn5x3bx4XPI5Q.png" src="https://d262ilb51hltx0.cloudfront.net/max/800/1*320_4I0lxbn5x3bx4XPI5Q.png"/></div>
- </figure>
- <p name="9b87" id="9b87" data-align="center" class="graf--p"><em class="markup--em markup--p-em">Top photo by Joan Bardeletti</em> </p>
- <p name="c30a" id="c30a" data-align="center" class="graf--p graf--last">Follow Backchannel: <a href="https://twitter.com/backchnnl" data-href="https://twitter.com/backchnnl" class="markup--anchor markup--p-anchor" rel="nofollow"><em class="markup--em markup--p-em">Twitter</em></a> <em class="markup--em markup--p-em">|</em><a href="https://www.facebook.com/pages/Backchannel/1488568504730671" data-href="https://www.facebook.com/pages/Backchannel/1488568504730671" class="markup--anchor markup--p-anchor" rel="nofollow"><em class="markup--em markup--p-em">Facebook</em></a> </p>
- </div>
- </div>
- </section> \ No newline at end of file
+<div class="postField postField--body">
+ <section class=" section--first section--last" name="ef8c">
+ <div class="section-content">
+ <div class="section-inner u-sizeFullWidth">
+ <figure class="graf--figure postField--fillWidthImage graf--first" id="b9ad" name="b9ad"><div class="aspectRatioPlaceholder is-locked">
+ <p></p>
+ <img class="graf-image" data-height="1402" data-image-id="1*sLDnS1UWEFIS33uLMxq3cw.jpeg" data-width="2100" src="https://d262ilb51hltx0.cloudfront.net/max/2000/1*sLDnS1UWEFIS33uLMxq3cw.jpeg"></img></div>
+ </figure></div>
+ <div class="section-inner layoutSingleColumn">
+
+
+ <h4 class="graf--h4" data-align="center" id="9736" name="9736">Welcome to DoctorX’s Barcelona lab, where the drugs you bought online are tested for safety and purity. No questions asked.</h4>
+ <p class="graf--p graf--empty" id="fc64" name="fc64">
+ <br></br></p>
+ <figure class="graf--figure" id="7417" name="7417"><div class="aspectRatioPlaceholder is-locked" style="max-width: 700px; max-height: 14px;">
+
+ <img class="graf-image" data-action="zoom" data-action-value="1*3vIhkoHIzcxvUdijoCVx6w.png" data-height="24" data-image-id="1*3vIhkoHIzcxvUdijoCVx6w.png" data-width="1200" src="https://d262ilb51hltx0.cloudfront.net/max/800/1*3vIhkoHIzcxvUdijoCVx6w.png"></img></div>
+ </figure><p class="graf--p" id="8a83" name="8a83">Standing at a table in a chemistry lab in Barcelona, Cristina Gil Lladanosa
+ tears open a silver, smell-proof protective envelope. She slides out a
+ transparent bag full of crystals. Around her, machines whir and hum, and
+ other researchers mill around in long, white coats.</p>
+ <p class="graf--p" id="b675" name="b675">She is holding the lab’s latest delivery of a drug bought from the “deep
+ web,” the clandestine corner of the internet that isn’t reachable by normal
+ search engines, and is home to some sites that require special software
+ to access. Labeled as <a class="markup--anchor markup--p-anchor" data-href="http://en.wikipedia.org/wiki/MDMA" href="http://en.wikipedia.org/wiki/MDMA" rel="nofollow">MDMA</a> (the street
+ term is ecstasy), this sample has been shipped from Canada. Lladanosa and
+ her colleague Iván Fornís Espinosa have also received drugs, anonymously,
+ from people in China, Australia, Europe and the United States.</p>
+ <p class="graf--p graf--startsWithDoubleQuote" id="3c0b" name="3c0b">“Here we have speed, MDMA, cocaine, pills,” Lladanosa says, pointing to
+ vials full of red, green, blue and clear solutions sitting in labeled boxes.</p>
+ </div>
+ <div class="section-inner u-sizeFullWidth">
+ <figure class="graf--figure postField--fillWidthImage" id="c4e6" name="c4e6"><div class="aspectRatioPlaceholder is-locked">
+
+ <img class="graf-image" data-height="1402" data-image-id="1*4gN1-fzOwCniw-DbqQjDeQ.jpeg" data-width="2100" src="https://d262ilb51hltx0.cloudfront.net/max/2000/1*4gN1-fzOwCniw-DbqQjDeQ.jpeg"></img></div>
+ <figcaption class="imageCaption">Cristina Gil Lladanosa, at the Barcelona testing lab | photo by Joan Bardeletti</figcaption></figure></div>
+ <div class="section-inner layoutSingleColumn">
+ <p class="graf--p" id="7a54" name="7a54">Since 2011, with the launch of <a class="markup--anchor markup--p-anchor" data-href="http://en.wikipedia.org/wiki/Silk_Road_%28marketplace%29" href="http://en.wikipedia.org/wiki/Silk_Road_%28marketplace%29" rel="nofollow">Silk Road</a>, anybody has been able to safely buy illegal
+ drugs from the deep web and have them delivered to their door. Though the
+ FBI shut down that black market in October 2013, other outlets have emerged
+ to fill its role. For the last 10 months the lab at which Lladanosa and
+ Espinosa work has offered a paid testing service of those drugs. By sending
+ in samples for analysis, users can know exactly what it is they are buying,
+ and make a more informed decision about whether to ingest the substance.
+ The group, called <a class="markup--anchor markup--p-anchor" data-href="http://energycontrol.org/" href="http://energycontrol.org/" rel="nofollow">Energy Control</a>,
+ which has being running “harm reduction” programs since 1999, is the first
+ to run a testing service explicitly geared towards verifying those purchases
+ from the deep web.</p>
+ <p class="graf--p" id="4395" name="4395">Before joining Energy Control, Lladanosa briefly worked at a pharmacy,
+ whereas Espinosa spent 14 years doing drug analysis. Working at Energy
+ Control is “more gratifying,” and “rewarding” than her previous jobs, Lladanosa
+ told me. They also receive help from a group of volunteers, made up of
+ a mixture of “squatters,” as Espinosa put it, and medical students, who
+ prepare the samples for testing.</p>
+ <p class="graf--p" id="0c18" name="0c18">After weighing out the crystals, aggressively mixing it with methanol
+ until dissolved, and delicately pouring the liquid into a tiny brown bottle,
+ Lladanosa, a petite woman who is nearly engulfed by her lab coat, is now
+ ready to test the sample. She loads a series of three trays on top of a
+ large white appliance sitting on a table, called a gas chromatograph (GC).
+ A jungle of thick pipes hang from the lab’s ceiling behind it.</p>
+ </div>
+ <div class="section-inner u-sizeFullWidth">
+ <figure class="graf--figure postField--fillWidthImage" id="559c" name="559c"><div class="aspectRatioPlaceholder is-locked">
+
+ <img class="graf-image" data-height="1402" data-image-id="1*2KPmZkIBUrhps-2uwDvYFQ.jpeg" data-width="2100" src="https://d262ilb51hltx0.cloudfront.net/max/2000/1*2KPmZkIBUrhps-2uwDvYFQ.jpeg"></img></div>
+ <figcaption class="imageCaption">Photo by Joan Bardeletti</figcaption></figure></div>
+ <div class="section-inner layoutSingleColumn">
+ <p class="graf--p graf--startsWithDoubleQuote" id="1549" name="1549">“Chromatography separates all the substances,” Lladanosa says as she loads
+ the machine with an array of drugs sent from the deep web and local Spanish
+ users. It can tell whether a sample is pure or contaminated, and if the
+ latter, with what.</p>
+ <p class="graf--p" id="5d0f" name="5d0f">Rushes of hot air blow across the desk as the gas chromatograph blasts
+ the sample at 280 degrees Celsius. Thirty minutes later the machine’s robotic
+ arm automatically moves over to grip another bottle. The machine will continue
+ cranking through the 150 samples in the trays for most of the work week.</p>
+ </div>
+ <div class="section-inner u-sizeFullWidth">
+ <figure class="graf--figure postField--fillWidthImage" id="d6aa" name="d6aa"><div class="aspectRatioPlaceholder is-locked">
+
+ <img class="graf-image" data-height="1241" data-image-id="1*PU40bbbox2Ompc5I3RE99A.jpeg" data-width="2013" src="https://d262ilb51hltx0.cloudfront.net/max/2000/1*PU40bbbox2Ompc5I3RE99A.jpeg"></img></div>
+ <figcaption class="imageCaption">Photo by Joan Bardeletti</figcaption></figure></div>
+ <div class="section-inner layoutSingleColumn">
+ <p class="graf--p" id="15e0" name="15e0">To get the drugs to Barcelona, a user mails at least 10 milligrams of
+ a substance to the offices of the Asociación Bienestar y Desarrollo, the
+ non-government organization that oversees Energy Control. The sample then
+ gets delivered to the testing service’s laboratory, at the Barcelona Biomedical
+ Research Park, a futuristic, seven story building sitting metres away from
+ the beach. Energy Control borrows its lab space from a biomedical research
+ group for free.</p>
+ <p class="graf--p" id="2574" name="2574">The tests cost 50 Euro per sample. Users pay, not surprisingly, with Bitcoin.
+ In the post announcing Energy Control’s service on the deep web, the group
+ promised that “All profits of this service are set aside of maintenance
+ of this project.”</p>
+ <p class="graf--p" id="2644" name="2644">About a week after testing, those results are sent in a PDF to an email
+ address provided by the anonymous client.</p>
+ <p class="graf--p graf--startsWithDoubleQuote" id="9f91" name="9f91">“The process is quite boring, because you are in a routine,” Lladanosa
+ says. But one part of the process is consistently surprising: that moment
+ when the results pop up on the screen. “Every time it’s something different.”
+ For instance, one cocaine sample she had tested also contained phenacetin,
+ a painkiller added to increase the product’s weight; lidocaine, an anesthetic
+ that numbs the gums, giving the impression that the user is taking higher
+ quality cocaine; and common caffeine.</p>
+ <figure class="graf--figure" id="b821" name="b821"><div class="aspectRatioPlaceholder is-locked" style="max-width: 700px; max-height: 14px;">
+
+ <img class="graf-image" data-action="zoom" data-action-value="1*ohyycinH18fz98TCyUzVgQ.png" data-height="24" data-image-id="1*ohyycinH18fz98TCyUzVgQ.png" data-width="1200" src="https://d262ilb51hltx0.cloudfront.net/max/800/1*ohyycinH18fz98TCyUzVgQ.png"></img></div>
+ </figure><p class="graf--p" id="39a6" name="39a6">The deep web drug lab is the brainchild of Fernando Caudevilla, a Spanish
+ physician who is better known as “DoctorX” on the deep web, a nickname
+ given to him by his Energy Control co-workers because of his earlier writing
+ about the history, risks and recreational culture of MDMA. In the physical
+ world, Caudevilla has worked for over a decade with Energy Control on various
+ harm reduction focused projects, most of which have involved giving Spanish
+ illegal drug users medical guidance, and often writing leaflets about the
+ harms of certain substances.</p>
+ </div>
+ <div class="section-inner u-sizeFullWidth">
+ <figure class="graf--figure postField--fillWidthImage" id="eebc" name="eebc"><div class="aspectRatioPlaceholder is-locked">
+
+ <img class="graf-image" data-height="1241" data-image-id="1*mKvUNOAVQxl6atCbxbCZsg.jpeg" data-width="2100" src="https://d262ilb51hltx0.cloudfront.net/max/2000/1*mKvUNOAVQxl6atCbxbCZsg.jpeg"></img></div>
+ <figcaption class="imageCaption">Fernando Caudevilla, AKA DoctorX. Photo: Joseph Cox</figcaption></figure></div>
+ <div class="section-inner layoutSingleColumn">
+ <p class="graf--p" id="c099" name="c099">Caudevilla first ventured into Silk Road forums in April 2013. “I would
+ like to contribute to this forum offering professional advice in topics
+ related to drug use and health,” he wrote in an <a class="markup--anchor markup--p-anchor" data-href="http://web.archive.org/web/20131015051405/https://dkn255hz262ypmii.onion.to/index.php?topic=147607.0" href="http://web.archive.org/web/20131015051405/https://dkn255hz262ypmii.onion.to/index.php?topic=147607.0" rel="nofollow">introductory post</a>,
+ using his DoctorX alias. Caudevilla offered to provide answers to questions
+ that a typical doctor is not prepared, or willing, to respond to, at least
+ not without a lecture or a judgment. “This advice cannot replace a complete
+ face-to-face medical evaluation,” he wrote, “but I know how difficult it
+ can be to talk frankly about these things.”</p>
+ <p class="graf--p" id="ff1d" name="ff1d">The requests flooded in. A diabetic asked what effect MDMA has on blood
+ sugar; another what the risks of frequent psychedelic use were for a young
+ person. Someone wanted to know whether amphetamine use should be avoided
+ during lactation. In all, Fernando’s thread received over 50,000 visits
+ and 300 questions before the FBI shut down Silk Road.</p>
+ <p class="graf--p graf--startsWithDoubleQuote" id="1f35" name="1f35">“He’s amazing. A gift to this community,” one user wrote on the Silk Road
+ 2.0 forum, a site that sprang up after the original. “His knowledge is
+ invaluable, and never comes with any judgment.” Up until recently, Caudevilla
+ answered questions on the marketplace “Evolution.” Last week, however,
+ the administrators of that site <a class="markup--anchor markup--p-anchor" data-href="http://motherboard.vice.com/read/one-of-the-darknets-biggest-markets-may-have-just-stole-all-its-users-bitcoin" href="http://motherboard.vice.com/read/one-of-the-darknets-biggest-markets-may-have-just-stole-all-its-users-bitcoin" rel="nofollow">pulled a scam</a>,
+ shutting the market down and escaping with an estimated $12 million worth
+ of Bitcoin.</p>
+ <p class="graf--p" id="b20f" name="b20f">Caudevilla’s transition from dispensing advice to starting up a no-questions-asked
+ drug testing service came as a consequence of his experience on the deep
+ web. He’d wondered whether he could help bring more harm reduction services
+ to a marketplace without controls. The Energy Control project, as part
+ of its mandate of educating drug users and preventing harm, had already
+ been carrying out drug testing for local Spanish users since 2001, at music
+ festivals, night clubs, or through a drop-in service at a lab in Madrid.</p>
+ <p class="graf--p graf--startsWithDoubleQuote" id="f739" name="f739">“I thought, we are doing this in Spain, why don’t we do an international
+ drug testing service?” Caudevilla told me when I visited the other Energy
+ Control lab, in Madrid. Caudevilla, a stocky character with ear piercings
+ and short, shaved hair, has eyes that light up whenever he discusses the
+ world of the deep web. Later, via email, he elaborated that it was not
+ a hard sell. “It was not too hard to convince them,” he wrote me. Clearly,
+ Energy Control believed that the reputation he had earned as an unbiased
+ medical professional on the deep web might carry over to the drug analysis
+ service, where one needs to establish “credibility, trustworthiness, [and]
+ transparency,” Caudevilla said. “We could not make mistakes,” he added.</p>
+ </div>
+ <div class="section-inner u-sizeFullWidth">
+ <figure class="graf--figure postField--fillWidthImage" id="4058" name="4058"><div class="aspectRatioPlaceholder is-locked">
+
+ <img class="graf-image" data-height="3141" data-image-id="1*knT10_FNVUmqQIBLnutmzQ.jpeg" data-width="4400" src="https://d262ilb51hltx0.cloudfront.net/max/2000/1*knT10_FNVUmqQIBLnutmzQ.jpeg"></img></div>
+ <figcaption class="imageCaption">Photo: Joseph Cox</figcaption></figure></div>
+ <div class="section-inner layoutSingleColumn">
+ <figure class="graf--figure" id="818c" name="818c"><div class="aspectRatioPlaceholder is-locked" style="max-width: 700px; max-height: 14px;">
+ <p></p>
+ <img class="graf-image" data-action="zoom" data-action-value="1*ohyycinH18fz98TCyUzVgQ.png" data-height="24" data-image-id="1*ohyycinH18fz98TCyUzVgQ.png" data-width="1200" src="https://d262ilb51hltx0.cloudfront.net/max/800/1*ohyycinH18fz98TCyUzVgQ.png"></img></div>
+ </figure><p class="graf--p" id="7b5e" name="7b5e">While the Energy Control lab in Madrid lab only tests Spanish drugs from
+ various sources, it is the Barcelona location which vets the substances
+ bought in the shadowy recesses of of the deep web. Caudevilla no longer
+ runs it, having handed it over to his colleague Ana Muñoz. She maintains
+ a presence on the deep web forums, answers questions from potential users,
+ and sends back reports when they are ready.</p>
+ <p class="graf--p" id="0f0e" name="0f0e">The testing program exists in a legal grey area. The people who own the
+ Barcelona lab are accredited to experiment with and handle drugs, but Energy
+ Control doesn’t have this permission itself, at least not in writing.</p>
+ <p class="graf--p graf--startsWithDoubleQuote" id="e002" name="e002">“We have a verbal agreement with the police and other authorities. They
+ already know what we are doing,” Lladanosa tells me. It is a pact of mutual
+ benefit. Energy Control provides the police with information on batches
+ of drugs in Spain, whether they’re from the deep web or not, Espinosa says.
+ They also contribute to the European Monitoring Centre for Drugs and Drug
+ Addiction’s early warning system, a collaboration that attempts to spread
+ information about dangerous drugs as quickly as possible.</p>
+ <p class="graf--p" id="db1b" name="db1b">By the time of my visit in February, Energy Control had received over
+ 150 samples from the deep web and have been receiving more at a rate of
+ between 4 and 8 a week. Traditional drugs, such as cocaine and MDMA, make
+ up about 70 percent of the samples tested, but the Barcelona lab has also
+ received samples of the prescription pill codeine, research chemicals and
+ synthetic cannabinoids, and even pills of Viagra.</p>
+ </div>
+ <div class="section-inner u-sizeFullWidth">
+ <figure class="graf--figure postField--fillWidthImage" id="b885" name="b885"><div class="aspectRatioPlaceholder is-locked">
+
+ <img class="graf-image" data-height="1402" data-image-id="1*Vr61dyCTRwk6CemmVF8YAQ.jpeg" data-width="2100" src="https://d262ilb51hltx0.cloudfront.net/max/2000/1*Vr61dyCTRwk6CemmVF8YAQ.jpeg"></img></div>
+ <figcaption class="imageCaption">Photo by Joan Bardeletti</figcaption></figure></div>
+ <div class="section-inner layoutSingleColumn">
+ <p class="graf--p" id="e76f" name="e76f">So it’s fair to make a tentative judgement on what people are paying for
+ on the deep web. The verdict thus far? Overall, drugs on the deep web appear
+ to be of much higher quality than those found on the street.</p>
+ <p class="graf--p graf--startsWithDoubleQuote" id="5352" name="5352">“In general, the cocaine is amazing,” says Caudevilla, saying that the
+ samples they’ve seen have purities climbing towards 80 or 90 percent, and
+ some even higher. To get an idea of how unusual this is, take a look at
+ the <a class="markup--anchor markup--p-anchor" data-href="http://www.unodc.org/documents/wdr2014/Cocaine_2014_web.pdf" href="http://www.unodc.org/documents/wdr2014/Cocaine_2014_web.pdf" rel="nofollow">United Nations Office on Drugs and Crime World Drug Report 2014</a>,
+ which reports that the average quality of street cocaine in Spain is just
+ over 40 percent, while in the United Kingdom it is closer to 30 percent.“We
+ have found 100 percent [pure] cocaine,” he adds. “That’s really, really
+ strange. That means that, technically, this cocaine has been purified,
+ with clandestine methods.”</p>
+ <p class="graf--p" id="a71c" name="a71c">Naturally, identifying vendors who sell this top-of-the-range stuff is
+ one of the reasons that people have sent samples to Energy Control. Caudevilla
+ was keen to stress that, officially, Energy Control’s service “is not intended
+ to be a control of drug quality,” meaning a vetting process for identifying
+ the best sellers, but that is exactly how some people have been using it.</p>
+ <p class="graf--p" id="cb5b" name="cb5b">As one buyer on the Evolution market, elmo666, wrote to me over the site’s
+ messaging system, “My initial motivations were selfish. My primary motivation
+ was to ensure that I was receiving and continue to receive a high quality
+ product, essentially to keep the vendor honest as far as my interactions
+ with them went.”</p>
+ <p class="graf--p" id="d80d" name="d80d">Vendors on deep web markets advertise their product just like any other
+ outlet does, using flash sales, gimmicky giveaways and promises of drugs
+ that are superior to those of their competitors. The claims, however, can
+ turn out to be empty: despite the test results that show that deep web
+ cocaine vendors typically sell product that is of a better quality than
+ that found on the street, in plenty of cases, the drugs are nowhere near
+ as pure as advertised.</p>
+ <p class="graf--p graf--startsWithDoubleQuote" id="36de" name="36de">“You won’t be getting anything CLOSE to what you paid for,” one user complained
+ about the cocaine from ‘Mirkov’, a vendor on Evolution. “He sells 65% not
+ 95%.”</p>
+ </div>
+ <div class="section-inner u-sizeFullWidth">
+ <figure class="graf--figure postField--fillWidthImage" id="8544" name="8544"><div class="aspectRatioPlaceholder is-locked">
+
+ <img class="graf-image" data-height="1402" data-image-id="1*a-1_13xE6_ErQ-QSlz6myw.jpeg" data-width="2100" src="https://d262ilb51hltx0.cloudfront.net/max/2000/1*a-1_13xE6_ErQ-QSlz6myw.jpeg"></img></div>
+ <figcaption class="imageCaption">Photo by Joan Bardeletti</figcaption></figure></div>
+ <div class="section-inner layoutSingleColumn">
+ <figure class="graf--figure" id="d521" name="d521"><div class="aspectRatioPlaceholder is-locked" style="max-width: 700px; max-height: 14px;">
+ <p></p>
+ <img class="graf-image" data-action="zoom" data-action-value="1*ohyycinH18fz98TCyUzVgQ.png" data-height="24" data-image-id="1*ohyycinH18fz98TCyUzVgQ.png" data-width="1200" src="https://d262ilb51hltx0.cloudfront.net/max/800/1*ohyycinH18fz98TCyUzVgQ.png"></img></div>
+ </figure><p class="graf--p" id="126b" name="126b">Despite the prevalence of people using the service to gauge the quality
+ of what goes up their nose, many users send samples to Energy Control in
+ the spirit of its original mission: keeping themselves alive and healthy.
+ The worst case scenario from drugs purchased on the deep web is, well the
+ worst case. That was the outcome when <a class="markup--anchor markup--p-anchor" data-href="http://www.independent.co.uk/news/uk/crime/teenager-patrick-mcmullen-who-died-while-on-skype-had-bought-drugs-from-silk-road-8942329.html" href="http://www.independent.co.uk/news/uk/crime/teenager-patrick-mcmullen-who-died-while-on-skype-had-bought-drugs-from-silk-road-8942329.html" rel="nofollow">Patrick McMullen,</a> a
+ 17-year-old Scottish student, ingested half a gram of MDMA and three tabs
+ of LSD, reportedly purchased from the Silk Road. While talking to his friends
+ on Skype, his words became slurred and he passed out. Paramedics could
+ not revive him. The coroner for that case, Sherrif Payne, who deemed the
+ cause of death ecstasy toxicity, told <em class="markup--em markup--p-em">The Independent</em> “You
+ never know the purity of what you are taking and you can easily come unstuck.”</p>
+ <p class="graf--p" id="5e9e" name="5e9e">ScreamMyName, a deep web user who has been active since the original Silk
+ Road, wants to alert users to the dangerous chemicals that are often mixed
+ with drugs, and is using Energy Control as a means to do so.</p>
+ <p class="graf--p graf--startsWithDoubleQuote" id="19a6" name="19a6">“We’re at a time where some vendors are outright sending people poison.
+ Some do it unknowingly,” ScreamMyName told me in an encrypted message.
+ “Cocaine production in South America is often tainted with either levamisole
+ or phenacetine. Both poison to humans and both with severe side effects.”</p>
+ <p class="graf--p" id="9fef" name="9fef">In the case of Levamisole, those prescribing it are often not doctors
+ but veterinarians, as Levamisole is commonly used on animals, primarily
+ for the treatment of worms. If ingested by humans it can lead to cases
+ of extreme eruptions of the skin, as <a class="markup--anchor markup--p-anchor" data-href="http://www.ncbi.nlm.nih.gov/pubmed/22127712" href="http://www.ncbi.nlm.nih.gov/pubmed/22127712" rel="nofollow">documented in a study</a> from researchers at the University
+ of California, San Francisco. But Lladanosa has found Levamisole in cocaine
+ samples; dealers use it to increase the product weight, allowing them to
+ stretch their batch further for greater profit — and also, she says, because
+ Levamisole has a strong stimulant effect.</p>
+ <p class="graf--p graf--startsWithDoubleQuote" id="7886" name="7886">“It got me sick as fuck,” Dr. Feel, an Evolution user, wrote on the site’s
+ forums after consuming cocaine that had been cut with 23 percent Levamisole,
+ and later tested by Energy Control. “I was laid up in bed for several days
+ because of that shit. The first night I did it, I thought I was going to
+ die. I nearly drove myself to the ER.”</p>
+ <p class="graf--p graf--startsWithDoubleQuote" id="18d3" name="18d3">“More people die because of tainted drugs than the drugs themselves,”
+ Dr. Feel added. “It’s the cuts and adulterants that are making people sick
+ and killing them.”</p>
+ </div>
+ <div class="section-inner u-sizeFullWidth">
+ <figure class="graf--figure postField--fillWidthImage" id="552a" name="552a"><div class="aspectRatioPlaceholder is-locked">
+
+ <img class="graf-image" data-height="1192" data-image-id="1*IWXhtSsVv0gNnCwnDEXk-Q.jpeg" data-width="2100" src="https://d262ilb51hltx0.cloudfront.net/max/2000/1*IWXhtSsVv0gNnCwnDEXk-Q.jpeg"></img></div>
+ <figcaption class="imageCaption">Photo by Joan Bardeletti</figcaption></figure></div>
+ <div class="section-inner layoutSingleColumn">
+ <p class="graf--p" id="839a" name="839a">The particular case of cocaine cut with Levamisole is one of the reasons
+ that ScreamMyName has been pushing for more drug testing on the deep web
+ markets. “I recognize that drug use isn’t exactly healthy, but why exacerbate
+ the problem?” he told me when I contacted him after his post. “[Energy
+ Control] provides a way for users to test the drugs they’ll use and for
+ these very users to know what it is they’re putting in their bodies. Such
+ services are in very short supply.”</p>
+ <p class="graf--p" id="18dc" name="18dc">After sending a number of Energy Control tests himself, ScreamMyName started
+ a de facto crowd-sourcing campaign to get more drugs sent to the lab, and
+ then shared the results, after throwing in some cash to get the ball rolling.
+ <a class="markup--anchor markup--p-anchor" data-href="https://blockchain.info/address/1Mi6VjMFqjcD48FPV7cnPB24MAtQQenRy3" href="https://blockchain.info/address/1Mi6VjMFqjcD48FPV7cnPB24MAtQQenRy3" rel="nofollow">He set up a Bitcoin wallet</a>, with the hope that users might chip in
+ to fund further tests. At the time of writing, the wallet has received
+ a total of 1.81 bitcoins; around $430 at today’s exchange rates.</p>
+ <p class="graf--p" id="dcbd" name="dcbd">In posts to the Evolution community, ScreamMyName pitched this project
+ as something that will benefit users and keep drug dealer honest. “When
+ the funds build up to a point where we can purchase an [Energy Control]
+ test fee, we’ll do a US thread poll for a few days and try to cohesively
+ decide on what vendor to test,” he continued.</p>
+ </div>
+ <div class="section-inner u-sizeFullWidth">
+ <figure class="graf--figure postField--fillWidthImage" id="9d32" name="9d32"><div class="aspectRatioPlaceholder is-locked">
+
+ <img class="graf-image" data-height="913" data-image-id="1*NGcrjfkV0l37iQH2uyYjEw.jpeg" data-width="1368" src="https://d262ilb51hltx0.cloudfront.net/max/2000/1*NGcrjfkV0l37iQH2uyYjEw.jpeg"></img></div>
+ <figcaption class="imageCaption">Photo by Joan Bardeletti</figcaption></figure></div>
+ <div class="section-inner layoutSingleColumn">
+ <p class="graf--p" id="bff6" name="bff6">Other members of the community have been helping out, too. PlutoPete,
+ a vendor from the original Silk Road who sold cannabis seeds and other
+ legal items, has provided ScreamMyName with packaging to safely send the
+ samples to Barcelona. “A box of baggies, and a load of different moisture
+ barrier bags,” PlutoPete told me over the phone. “That’s what all the vendors
+ use.”</p>
+ <p class="graf--p" id="bb78" name="bb78">It’s a modest program so far. ScreamMyName told me that so far he had
+ gotten enough public funding to purchase five different Energy Control
+ tests, in addition to the ten or so he’s sent himself so far. “The program
+ created is still in its infancy and it is growing and changing as we go
+ along but I have a lot of faith in what we’re doing,” he says.</p>
+ <p class="graf--p" id="5638" name="5638">But the spirit is contagious: elmo666, the other deep web user testing
+ cocaine, originally kept the results of the drug tests to himself, but
+ he, too, saw a benefit to distributing the data. “It is clear that it is
+ a useful service to other users, keeping vendors honest and drugs (and
+ their users) safe,” he told me. He started to report his findings to others
+ on the forums, and then created a thread with summaries of the test results,
+ as well as comments from the vendors if they provided it. Other users were
+ soon basing their decisions on what to buy on elmo666‘s tests.</p>
+ <p class="graf--p graf--startsWithDoubleQuote" id="de75" name="de75">“I’m defo trying the cola based on the incredibly helpful elmo and his
+ energy control results and recommendations,” wrote user jayk1984. On top
+ of this, elmo666 plans to launch an independent site on the deep web that
+ will collate all of these results, which should act as a resource for users
+ of all the marketplaces.</p>
+ <p class="graf--p" id="6b72" name="6b72">As word of elmo666's efforts spread, he began getting requests from drug
+ dealers who wanted him to use their wares for testing. Clearly, they figured
+ that a positive result from Energy Control would be a fantastic marketing
+ tool to draw more customers. They even offered elmo666 free samples. (He
+ passed.)</p>
+ <p class="graf--p" id="b008" name="b008">Meanwhile, some in the purchasing community are arguing that those running
+ markets on the deep web should be providing quality control themselves.
+ PlutoPete told me over the phone that he had been in discussions about
+ this with Dread Pirate Roberts, the pseudonymous owner of the original
+ Silk Road site. “We [had been] talking about that on a more organized basis
+ on Silk Road 1, doing lots of anonymous buys to police each category. But
+ of course they took the thing [Silk Road] down before we got it properly
+ off the ground,” he lamented.</p>
+ <p class="graf--p" id="49c8" name="49c8">But perhaps it is best that the users, those who are actually consuming
+ the drugs, remain in charge of shaming dealers and warning each other.
+ “It’s our responsibility to police the market based on reviews and feedback,”
+ elmo666 wrote in an Evolution forum post. It seems that in the lawless
+ space of the deep web, where everything from child porn to weapons are
+ sold openly, users have cooperated in an organic display of self-regulation
+ to stamp out those particular batches of drugs that are more likely to
+ harm users.</p>
+ <p class="graf--p graf--startsWithDoubleQuote" id="386d" name="386d">“That’s always been the case with the deep web,” PlutoPete told me. Indeed,
+ ever since Silk Road, a stable of the drug markets has been the review
+ system, where buyers can leave a rating and feedback for vendors, letting
+ others know about the reliability of the seller. But DoctorX’s lab, rigorously
+ testing the products with scientific instruments, takes it a step further.</p>
+ </div>
+ <div class="section-inner u-sizeFullWidth">
+ <figure class="graf--figure postField--fillWidthImage" id="890b" name="890b"><div class="aspectRatioPlaceholder is-locked">
+
+ <img class="graf-image" data-height="1373" data-image-id="1*WRlKt3q3mt7utmwxcbl3sQ.jpeg" data-width="2100" src="https://d262ilb51hltx0.cloudfront.net/max/2000/1*WRlKt3q3mt7utmwxcbl3sQ.jpeg"></img></div>
+ <figcaption class="imageCaption">Photo by Joan Bardeletti</figcaption></figure></div>
+ <div class="section-inner layoutSingleColumn">
+ <p class="graf--p graf--startsWithDoubleQuote" id="b109" name="b109">“In the white market, they have quality control. In the dark market, it
+ should be the same,” Cristina Gil Lladanosa says to me before I leave the
+ Barcelona lab.</p>
+ <p class="graf--p" id="e3a4" name="e3a4">A week after I visit the lab, the results of the MDMA arrive in my inbox:
+ it is 85 percent pure, with no indications of other active ingredients.
+ Whoever ordered that sample from the digital shelves of the deep web, and
+ had it shipped to their doorstep in Canada, got hold of some seriously
+ good, and relatively safe drugs. And now they know it.</p>
+ <figure class="graf--figure" id="31cf" name="31cf"><div class="aspectRatioPlaceholder is-locked" style="max-width: 700px; max-height: 14px;">
+
+ <img class="graf-image" data-action="zoom" data-action-value="1*320_4I0lxbn5x3bx4XPI5Q.png" data-height="24" data-image-id="1*320_4I0lxbn5x3bx4XPI5Q.png" data-width="1200" src="https://d262ilb51hltx0.cloudfront.net/max/800/1*320_4I0lxbn5x3bx4XPI5Q.png"></img></div>
+ </figure><p class="graf--p" data-align="center" id="9b87" name="9b87"><em class="markup--em markup--p-em">Top photo by Joan Bardeletti</em>
+ </p>
+ <p class="graf--p graf--last" data-align="center" id="c30a" name="c30a">Follow Backchannel: <a class="markup--anchor markup--p-anchor" data-href="https://twitter.com/backchnnl" href="https://twitter.com/backchnnl" rel="nofollow"><em class="markup--em markup--p-em">Twitter</em></a>
+ <em class="markup--em markup--p-em">|</em><a class="markup--anchor markup--p-anchor" data-href="https://www.facebook.com/pages/Backchannel/1488568504730671" href="https://www.facebook.com/pages/Backchannel/1488568504730671" rel="nofollow"><em class="markup--em markup--p-em">Facebook</em></a>
+ </p>
+ </div>
+ </div>
+ </section></div> \ No newline at end of file
diff --git a/test/test-pages/lifehacker-post-comment-load/expected.html b/test/test-pages/lifehacker-post-comment-load/expected.html
index 1e7a084..ed41c96 100644
--- a/test/test-pages/lifehacker-post-comment-load/expected.html
+++ b/test/test-pages/lifehacker-post-comment-load/expected.html
@@ -1,76 +1,488 @@
- <div class="post-content entry-content new-annotation">
- <p data-textannotation-id="58a492029dca5e6a6e481d21b6b2933a" class="has-media media-640"><span class="img-border"><img width="636" height="358" data-format="jpg" data-asset-url="http://i.kinja-img.com/gawker-media/image/upload/s--hqqO9fze--/n1s6c2m6kc07iqdyllj6.jpg" data-chomp-id="n1s6c2m6kc07iqdyllj6" alt="How to Program Your Mind to Stop Buying Crap You Don’t Need" src="http://i.kinja-img.com/gawker-media/image/upload/s--hqqO9fze--/n1s6c2m6kc07iqdyllj6.jpg" class="js_annotatable-image cursor-crosshair"/></span></p>
- <p data-textannotation-id="a043044f9b3e31fd85568b17e3b1b5f3" class="first-text"><span>We all buy things from time to time that we don't really need. It's okay to appeal to your wants every once in a while, as long as you're in control. If you struggle with clutter, impulse buys, and buyer's remorse, here's how to put your mind in the right place before you even set foot in a store.</span></p>
- <h3 data-textannotation-id="e51cbbc52eb8c3b33571908351076cf7"><strong>Understand How Your Own Brain Works Against You</strong></h3>
- <p data-textannotation-id="268f7702467d33e3b0972dd09f1cf0a6" class="has-media media-640"><span class="img-border"><img width="636" height="358" data-format="jpg" data-asset-url="http://i.kinja-img.com/gawker-media/image/upload/s--QeUTCiuW--/o4dpyrcbiqyfrc3bxx6p.jpg" data-chomp-id="o4dpyrcbiqyfrc3bxx6p" alt="How to Program Your Mind to Stop Buying Crap You Don’t Need" src="http://i.kinja-img.com/gawker-media/image/upload/s--QeUTCiuW--/o4dpyrcbiqyfrc3bxx6p.jpg" class="js_annotatable-image cursor-crosshair"/></span></p>
- <p data-textannotation-id="32604538f84919efff270e87b61191a1">It may come as no surprise to learn that stores employ all kinds of tricks to get you to part ways with your cash, and your brain plays right along. Through psychological tricks, product placement, and even color, stores are designed from the ground up to increase spending. We've talked about the biggest things stores do to manipulate your senses, but here are some of the biggest things to look out for:</p>
- <ul>
- <li data-textannotation-id="cd748c8b681c781cdd728c5e17b5e05f"><strong>Color:</strong> Stores use color to make products attractive and eye-catching, but they also use color on price labels. Red stands out and can encourage taking action, that's why it's commonly associated with sale signage and advertising. When you see red, remember what they're trying to do to your brain with that color. You don't to buy something just because it's on sale.</li>
- <li data-textannotation-id="29c11c0aec305293be282aa91f8fbc3d"><strong>Navigation Roadblocks:</strong> Stores force you to walk around stuff you don't need to find the stuff you are really after. Have a list of what you need before you go in, go straight to it, and imagine it's the only item in the store.</li>
- <li data-textannotation-id="252dc7e4a924d12c2d913861ab118bf5"><strong>The Touch Factor:</strong> Stores place items they want to sell in easy to reach locations and encourage you to touch them. Don't do it! As soon as you pick something up, you're more likely to buy it because your mind suddenly takes ownership of the object. Don't pick anything up and don't play with display items.</li>
- <li data-textannotation-id="05dde4d44056798acff5890759134a64"><strong>Scents and Sounds:</strong> You'll probably hear classic, upbeat tunes when you walk into a store. The upbeat music makes you happy and excited, while playing familiar songs makes you feel comfortable. They also use pleasant smells to put your mind at ease. A happy, comfortable mind at ease is a dangerous combination for your brain when shopping. There's not much you can do to avoid this unless you shop online, but it's good to be aware of it.</li>
- </ul>
- <p data-textannotation-id="1eb4a4df2a670927c5d9e9641ebf9d40">And sure, we can blame the stores all we want, but you won't change how they operate—you can only be aware of how your <a href="http://lifehacker.com/how-stores-manipulate-your-senses-so-you-spend-more-mon-475987594" x-inset="1">brain is falling for their tricks</a>. Even without the stores, <a href="http://lifehacker.com/5968125/how-your-brain-corrupts-your-shopping-choices" x-inset="1">your brain is working against you on its own</a>, thanks to some simple cognitive biases.</p>
- <aside class="referenced-wide referenced-fullwidth js_inset tmpl_referencedGroupFullWidth clearfix core-decorated-inset"> </aside>
- <p data-textannotation-id="89992f1ca493b248eea6ed1772326c46">For example, confirmation bias makes you only believe the information that conforms to your prior beliefs, while you discount everything else. Advertisers appeal to this bias directly by convincing you one item is better than another with imagery and other tricks, regardless of what hard facts might say. Keep your mind open, do your own research, and accept when you're wrong about a product. The Decoy effect is also a commonly used tactic. You think one product is a deal because it's next to a similar product that's priced way higher. Even if it's a product you need, it's probably not as good of a deal as it looks right then and there. Again, always research beforehand and be on the lookout for this common trick to avoid impulse buys.</p>
- <h3 data-textannotation-id="eedde8c384145f2593efc2a15a4d79de"><strong>Make a List of </strong><em><strong>Everything</strong></em><strong> You Own and Do Some Decluttering</strong></h3>
- <p data-textannotation-id="8044cf9aab698fd28931acd90ba96f7a" class="has-media media-640"><span class="img-border"><img width="636" height="358" data-format="jpg" data-asset-url="http://i.kinja-img.com/gawker-media/image/upload/s--mlR3Ku0_--/xrhkwleyurcizy4akiae.jpg" data-chomp-id="xrhkwleyurcizy4akiae" alt="How to Program Your Mind to Stop Buying Crap You Don’t Need" src="http://i.kinja-img.com/gawker-media/image/upload/s--mlR3Ku0_--/xrhkwleyurcizy4akiae.jpg" class="js_annotatable-image cursor-crosshair"/></span></p>
- <p data-textannotation-id="a2a886d841e5aed848cdf7088edde4ea">Now that you know what you're up against, it's time to start changing the way you think. Before you can stop buying crap you don't need, you need to identify what that crap is. The first step is to make a list of <a href="http://lifehacker.com/how-to-defeat-the-urge-to-binge-shop-1468216943" x-inset="1">every single thing you own</a>. <strong>Every. Single. Thing</strong>. This might sound extreme, but you need to gather your data so you can start reprogramming your mind.</p>
- <aside class="referenced-wide referenced-fullwidth js_inset tmpl_referencedGroupFullWidth clearfix core-decorated-inset"> </aside>
- <p data-textannotation-id="bbe57b7aa20b48550e5f66b7c530822c">The purpose of this exercise is twofold: you see what you already have and don't need to ever buy again, and you get to see what you shouldn't have bought in the first place. As you list everything out, separate items into categories. It's extremely important that you are as honest with yourself as possible while you do this. It's also important you actually write this all down or type it all out. Here is the first set of categories to separate everything into:</p>
- <ul>
- <li data-textannotation-id="8d7dc912152eddd0e3d56e28ad79e6f2"><strong>Need:</strong> You absolutely need this item to get by on a day to day basis.</li>
- <li data-textannotation-id="6f60a79627f0746d1f611999251e9f1b"><strong>Sometimes Need:</strong> You don't need this item every day, but you use it on a somewhat regular basis.</li>
- <li data-textannotation-id="54e10b108f95548966b657bd90fdbed4"><strong>Want:</strong> You bought this item because you wanted it, not because you needed it.</li>
- <li data-textannotation-id="26c461a85fbc78651be442e205cac58b"><strong>Crap:</strong> You don't have a good reason why you have it and you already know it needs to go (there's probably a few of these items, at least).</li>
- </ul>
- <p data-textannotation-id="5743cf753f68fd8ee3443cc0f8e815dd">Leave the things you listed as "needs" alone, put your stuff listed as "crap" in a pile or box to go bye-bye, and move your attention back to your "sometimes need" and "want" lists. You need to go back over both of those lists because you probably fudged some of the listings, either subconsciously or intentionally. Now ask yourself these three questions as you go through both the "sometimes need" and "want" lists:</p>
- <ul>
- <li data-textannotation-id="2048d6c0436bd34811442d6df32989a4">When was the last time I used this?</li>
- <li data-textannotation-id="3f4b3686d822171b35e27bf1afde530b">When will I use this again?</li>
- <li data-textannotation-id="63728605cc4fa66f5b225f674d12bbff">Does this item <a href="http://lifehacker.com/declutter-by-asking-one-question-does-this-spark-joy-1651256422">bring you joy</a>?</li>
- </ul>
- <p data-textannotation-id="816cd504161fecc6f3e173779b33d5db">Remember to be honest and adjust your lists accordingly. There's nothing wrong with keeping things you wanted. Material items can <a href="http://lifehacker.com/how-to-buy-happiness-the-purchases-most-likely-to-brin-1681780686">bring happiness to many people</a>, but make sure the items on your "want" list actively provide you joy and are being used. If an item doesn't get much use or doesn't make you happy, add it to the "crap" list.</p>
- <p data-textannotation-id="675103d9c0da55e95f93c53bb019f864">Once you have everything organized, it's time to do some serious decluttering. This listing exercise should get you started, but there are <a href="http://lifehacker.com/5957609/how-to-kick-your-clutter-habit-and-live-in-a-clean-house-once-and-for-all">a lot of other great ideas</a> when it comes to ditching the junk you don't need. Regardless, everything on your "crap" list needs to go. You can donate it, sell it at a yard sale, give it away to people know, whatever you like. Before you get rid of everything, though, take a picture of all your stuff together. Print out or save the picture somewhere. Some of it was probably gifts, but in general, this is all the crap you bought that you don't need. Take a good look and remember it.</p>
- <h3 data-textannotation-id="f15ab0a628b159459f095f04fef851ba"><strong>See How Much Money and Time You Spent on the Stuff You Threw Out</strong></h3>
- <p data-textannotation-id="bc2f55587bf4ab07a1852a8d26217233" class="has-media media-640"><span class="img-border"><img width="636" height="358" data-format="jpg" data-asset-url="http://i.kinja-img.com/gawker-media/image/upload/s--Tacb0tyW--/qodag11euf2npkawkn9v.jpg" data-chomp-id="qodag11euf2npkawkn9v" alt="How to Program Your Mind to Stop Buying Crap You Don’t Need" src="http://i.kinja-img.com/gawker-media/image/upload/s--Tacb0tyW--/qodag11euf2npkawkn9v.jpg" class="js_annotatable-image cursor-crosshair"/></span></p>
- <p data-textannotation-id="95ab4fe30c3ade42a8011966ea54aa0b">Now take a look at your "crap" list again and start calculating how much you spent on all of it. If it was a gift, mark it as $0. Otherwise, figure out the price of the item at the time you bought it. If you got a deal or bought it on sale it's okay to factor that in, but try to be as accurate as possible. Once you have the price for each item, add it all together. Depending on your spending habits this could possibly be in the hundreds to thousands of dollars. Remember the picture you took of all this stuff? Attach the total cost to the picture so you can see both at the same time.</p>
- <p data-textannotation-id="f654efec679064b15826d8ee20bc94e4">With the money cost figured out, you should take a look at the other costs too. Time is a resource just like any other, and it's a finite one. What kind of time did you pour into these things? Consider the time you spent acquiring and using these items, then write it all down. These can be rough estimations, but go ahead and add it all up when you think you've got it. Now attach the total time to same picture as before and think of the other ways you could have spent all that time. This isn't to make you feel bad about yourself, just to deliver information to your brain in an easy-to-understand form. When you look at it all like this, it can open your eyes a little more, and help you think about purchases in the future. You'll look at an item and ask yourself, "Will this just end up in the picture?"</p>
- <h3 data-textannotation-id="6342bf7f15d9eddd21489c23e51ca434"><strong>List Every Non-Material Thing In Your Life that Makes You Happy</strong></h3>
- <p data-textannotation-id="bafeac1c3808e0d2900190979f058b2c" class="has-media media-640"><span class="img-border"><img width="636" height="358" data-format="jpg" data-asset-url="http://i.kinja-img.com/gawker-media/image/upload/s--x9hLbIKJ--/imfc9ybqfw0jmztbhfrh.jpg" data-chomp-id="imfc9ybqfw0jmztbhfrh" alt="How to Program Your Mind to Stop Buying Crap You Don’t Need" src="http://i.kinja-img.com/gawker-media/image/upload/s--x9hLbIKJ--/imfc9ybqfw0jmztbhfrh.jpg" class="js_annotatable-image cursor-crosshair"/></span></p>
- <p data-textannotation-id="4bd8fbaabb33ff1cb5dc93c16e1f83cc">Now it's time to make a different list. While material items may bring plenty of joy, the things in your life that make you happiest probably can't be bought. Get a separate piece of paper or create a new document and list out everything in your life that makes you happy. If you can't buy it, it's eligible for the list. It doesn't matter if it only makes you crack a smile or makes you jump for joy, list it out. </p>
- <p data-textannotation-id="104a646a62ad7a0cfb4e3ff086185fdc"><span>These are probably the things that actually make you want to get out of bed in the morning and keep on keepin' on. Once you have it all down, put it in your purse or wallet. The next time you feel the urge to buy something, whip this list out first and remind yourself why you probably don't need it.</span></p>
- <h3 data-textannotation-id="532cf992ff45d52de501c1a8f80fc152"><strong>Spend Some Time Away from Material Things to Gain Perspective</strong></h3>
- <p data-textannotation-id="64f5c7155ad89bd2835399d33c1ae28a" class="has-media media-640"><span class="img-border"><img width="636" height="358" data-format="jpg" data-asset-url="http://i.kinja-img.com/gawker-media/image/upload/s--6NwBgQLy--/afy7n45jfvsjdmmhonct.jpg" data-chomp-id="afy7n45jfvsjdmmhonct" alt="How to Program Your Mind to Stop Buying Crap You Don’t Need" src="http://i.kinja-img.com/gawker-media/image/upload/s--6NwBgQLy--/afy7n45jfvsjdmmhonct.jpg" class="js_annotatable-image cursor-crosshair"/></span></p>
- <p data-textannotation-id="84554492c487779e921b98fb64222177">If you're having a really hard time with your spending, it can help to get away from material objects completely. When you're constantly surrounded by stuff and have access to buying things at all times, it can be really tough to break the habit. Spend a day in the park enjoying the sights and sounds of the outdoors, go camping with some friends, or hike a trail you haven't been on before. </p>
- <p data-textannotation-id="b44add1c7b690705d672186e3a9604b6">Essentially, you want to show yourself that you don't need your "things" to have a good time. When you realize how much fun you can have without all the trinkets and trivets, you'll start to shut down your desire to buy them. If you can't get really get away right now, just go for a walk without your purse or wallet (but carry your ID). If you can't buy anything, you'll be forced to experience things a different way.</p>
- <h3 data-textannotation-id="98c11bebae0bbcdbe8411df0186d6465"><strong>Develop a Personal "Should I Buy This?" Test</strong></h3>
- <p data-textannotation-id="ff438b878771354bb7f6d065ff50dbb2" class="has-media media-640"><span class="img-border"><img width="636" height="358" data-format="jpg" data-asset-url="http://i.kinja-img.com/gawker-media/image/upload/s--ciqk42G0--/s3pq8vjrvyjgne4lfsod.jpg" data-chomp-id="s3pq8vjrvyjgne4lfsod" alt="How to Program Your Mind to Stop Buying Crap You Don’t Need" src="http://i.kinja-img.com/gawker-media/image/upload/s--ciqk42G0--/s3pq8vjrvyjgne4lfsod.jpg" class="js_annotatable-image cursor-crosshair"/></span></p>
- <p data-textannotation-id="4af04ae83f18d9c37da21527bcd4a290">If you don't have a personal "should I buy this?" test, now's the perfect time to make one. When you find an item you think you need or want, it has to pass all of the questions you have on your test before you can buy it. Here's where you can use all of the data you've gathered so far and put it to really good use. The test should be personalized to your own buying habits, but here are some example questions:</p>
- <ul>
- <li data-textannotation-id="fcfd78b1619bdf0b7330f4b40efb899d">Is this a planned purchase?</li>
- <li data-textannotation-id="c16e7d5feae7cc2c3c6a8dd312ea206f">Will it end up in the "crap" list picture one day?</li>
- <li data-textannotation-id="54d877fdee56080c87508fc9e6402889"><a href="http://lifehacker.com/prevent-clutter-by-asking-yourself-where-items-will-go-1649480461">Where am I going to put it</a>?</li>
- <li data-textannotation-id="59d5245217c84e6b2b2969b3492f2f2d">Have I included this in my budget?</li>
- <li data-textannotation-id="8fe1582808b4d89f5c88c2708744d27d"><em>Why</em> do I want/need it?</li>
- </ul>
- <p data-textannotation-id="0162d779382cdc7de908fc1488af3940">Custom build your test to hit all of your weaknesses. If you make a lot of impulse buys, include questions that address that. If you experience a lot of buyer's remorse, include a lot of questions that make you think about the use of item after you buy it. If buying the latest and greatest technology is your weakness, Joshua Becker at Becoming Minimalist suggests you ask yourself <a target="_blank" href="http://www.becomingminimalist.com/marriage-hacks/">what problem the piece of tech solves</a>. If you can't think of anything it solves or if you already have something that solves it, you don't need it. Be thorough and build a test that you can run through your mind every time you consider buying something.</p>
- <h3 data-textannotation-id="c0ed0882675acc340dcd88e13ca514b3"><strong>Learn to Delay Gratification and Destroy the Urge to Impulse Buy</strong></h3>
- <p data-textannotation-id="1d43712fc5ce8f156e4661cca5750575" class="has-media media-640"><span class="img-border"><img width="636" height="358" data-format="jpg" data-asset-url="http://i.kinja-img.com/gawker-media/image/upload/s--mtob1sjR--/y2ldv5eufb3jcrtfouye.jpg" data-chomp-id="y2ldv5eufb3jcrtfouye" alt="How to Program Your Mind to Stop Buying Crap You Don’t Need" src="http://i.kinja-img.com/gawker-media/image/upload/s--mtob1sjR--/y2ldv5eufb3jcrtfouye.jpg" class="js_annotatable-image cursor-crosshair"/></span></p>
- <p data-textannotation-id="3d8086719c5da749f877629d498ccab9">When it comes to the unnecessary crap we buy, impulse purchases probably make up a good deal of them. We love to feel gratification instantly and impulse buys appeal to that with a rush of excitement with each new purchase. We like to believe that we have control over our impulses all the time, but we really don't, and that's a major problem for the ol' wallet.</p>
- <p data-textannotation-id="620ca9836425e09ec7fa50bfad204665">The key is teaching your brain that it's okay to <a href="http://lifehacker.com/overcome-the-need-for-instant-gratification-by-delaying-1636938356">wait for gratification</a>. You can do this with a simple time out every time you want something. Look at whatever you're thinking of buying, go through your personal "should I buy this?" test, and then walk away for a little while. Planning your purchases ahead is ideal, so the longer you can hold off, the better. Set yourself a reminder to check on the item <a href="http://lifehacker.com/5859632/buyers-remorse-is-inevitable-how-to-make-purchases-you-really-wont-regret">a week or month down the line</a>. When you come back to it, you may find that you don't even want it, just the gratification that would come with it. If you're shopping online, you can do the same thing. Walk away from your desk or put your phone in your pocket and do something else for a little while.</p>
- <p data-textannotation-id="a85d9eb501c898234ac5df2a56c50a13">You can also avoid online impulse purchases by <a href="http://lifehacker.com/5919833/how-to-avoid-impulse-purchases-in-the-internet-shopping-age" x-inset="1">making it harder to do</a>. Block shopping web sites during time periods you know you're at your weakest, or remove all of your saved credit card or Paypal information. You can also <a href="http://lifehacker.com/5569035/practice-the-halt-method-to-curb-impulse-purchases" x-inset="1">practice the "HALT" method</a> when you're shopping online or in a store. Try not to buy things when you're Hungry, Angry, Lonely, or Tired because you're at your weakest state mentally. Last, but not least, the "<a href="http://lifehacker.com/5320196/use-the-stranger-test-to-reduce-impulse-purchases" x-inset="1">stranger test</a>" can help you weed out bad purchases too.</p>
- <aside class="referenced-wide referenced-fullwidth js_inset tmpl_referencedGroupFullWidth clearfix core-decorated-inset"> </aside>
- <p data-textannotation-id="27385752c06848647540ad931892b21e">The last thing you should consider when it comes to impulse buys is "artificial replacement." As Trent Hamm at The Simple Dollar explains, artificial replacement can happen when you start to <a target="_blank" href="http://www.thesimpledollar.com/balancing-spending-and-time-how-time-frugality-can-save-you-lots-of-cash/">reduce the time</a> you get with your main interests:</p>
- <blockquote data-textannotation-id="213e2e816ac88f8d177fb0db0f7fef09">
- <p data-textannotation-id="7b98c5809df24dd04bb65285878c0335">Whenever I consistently cut quality time for my main interests out of my life, I start to long for them. As you saw in that "typical" day, I do make room for spending time with my family, but my other two main interests are absent. If that happens too many days in a row, I start to really miss reading. I start to really miss playing thoughtful board games with friends. What happens after that? <strong>I start to substitute.</strong> When I don't have the opportunity to sit down for an hour or even for half an hour and really get lost in a book, I start looking for an alternative way to fill in the tiny slices of time that I do have. I'll spend money.</p>
- </blockquote>
- <p data-textannotation-id="4b6cc2900ffacd3daef54b13b4caceac">You probably have things in your life that provide plenty of gratification, so don't get caught substituting it with impulse buys. Always make sure you keep yourself happy with plenty of time doing the things you like to do and you won't be subconsciously trying to fill that void with useless crap.</p>
- <h3 data-textannotation-id="aed9b435c4ed23e573c453ceeb34ed18"><strong>Turn the Money You Save Into More Money</strong></h3>
- <p data-textannotation-id="21154394d63f1943d01f2b717aa31115" class="has-media media-640"><span class="img-border"><img width="636" height="358" data-format="jpg" data-asset-url="http://i.kinja-img.com/gawker-media/image/upload/s--4Ajak63w--/atb9qm07fvvg7hqkumkw.jpg" data-chomp-id="atb9qm07fvvg7hqkumkw" alt="How to Program Your Mind to Stop Buying Crap You Don’t Need" src="http://i.kinja-img.com/gawker-media/image/upload/s--4Ajak63w--/atb9qm07fvvg7hqkumkw.jpg" class="js_annotatable-image cursor-crosshair"/></span></p>
- <p data-textannotation-id="6141942e977cc058fd7a0fa06a3f7389">Once you've programmed your mind to stop buying crap you don't need, you'll have some extra cash to play with. Take all that money and start putting it toward your future and things you <em>will</em> need further down the road. You might need <a target="_blank" href="http://twocents.lifehacker.com/how-to-start-saving-for-a-home-down-payment-1541254056">a home</a>, a vehicle, or a way to retire, but none of that can happen until you start planning for it. </p>
- <p data-textannotation-id="90f08afddc08e2c3b45c266f2e6965ec">Start by paying off any debts you already have. Credit cards, student loans, and even car payments can force you to <a href="http://lifehacker.com/how-to-break-the-living-paycheck-to-paycheck-cycle-1445330680">live paycheck to paycheck</a>. Use the <a href="http://lifehacker.com/5940989/pay-off-small-balances-first-for-better-odds-of-eliminating-all-your-debt">snowball method</a> and pay off some small balances to make you feel motivated, then start taking out your debt in full force with the <a href="http://lifehacker.com/how-to-pay-off-your-debt-using-the-stack-method-576070292">stacking method</a>: stop creating new debt, determine which balances have the highest interest rates, and create a payment schedule to pay them off efficiently.</p>
- <p data-textannotation-id="1106cb837deb2b6fc8e28ba98f078c27">With your debts whittled down, you should start an emergency fund. No matter how well you plan things, accidents and health emergencies can still happen. An emergency fund is designed to make those kinds of events more manageable. This type of savings account is strictly for when life throws you a curveball, but you can grow one pretty easily <a target="_blank" href="http://twocents.lifehacker.com/how-to-grow-an-emergency-fund-from-modest-savings-1638409351">with only modest savings</a>.</p>
- <p data-textannotation-id="347c2a36f114a794d559d929da1b15b7">When you've paid off your debt and prepared yourself for troubled times, you can start saving for the big stuff. All that money you're not spending on crap anymore can be saved, invested, and compounded to let you buy comfort and security. If you don't know where to start, talk to a financial planner. Or create a simple, yet effective <a target="_blank" href="http://twocents.lifehacker.com/how-to-build-an-easy-beginner-set-and-forget-investm-1686878594" x-inset="1">"set and forget" investment portfolio</a>. You've worked hard to reprogram your mind, so make sure you reap the benefits for many years to come.</p>
- <aside class="referenced-wide referenced-fullwidth js_inset tmpl_referencedGroupFullWidth clearfix core-decorated-inset"> </aside>
- <p data-textannotation-id="b54d87ffdace50f420c3a6ff0404cbf3"><em><small>Photos by <a target="_blank" href="http://www.shutterstock.com/pic-129762989/stock-vector-consumer.html?src=id&amp;ws=1">cmgirl</a> (Shutterstock), <a target="_blank" href="http://www.shutterstock.com/pic-227832739/stock-vector-hacker-icon-man-in-hoody-with-laptop-flat-isolated-on-dark-background-vector-illustration.html?src=id&amp;ws=1">Macrovector</a> (Shutterstock), <a target="_blank" href="https://www.flickr.com/photos/jetheriot/6186786217">J E Theriot</a>, <a target="_blank" href="https://www.flickr.com/photos/puuikibeach/15289861843">davidd</a>, <a target="_blank" href="https://www.flickr.com/photos/funfilledgeorgie/10922459733">George Redgrave</a>, <a target="_blank" href="https://www.flickr.com/photos/amslerpix/7252002214">David Amsler</a>, <a target="_blank" href="https://www.flickr.com/photos/amalakar/7299820870">Arup Malakar</a>, <a target="_blank" href="https://www.flickr.com/photos/lobsterstew/89644885">J B</a>, <a target="_blank" href="https://www.flickr.com/photos/jakerome/3298702453">jakerome</a>, <a target="_blank" href="http://401kcalculator.org/">401(K) 2012</a>.</small></em></p> \ No newline at end of file
+<div class="post-content entry-content new-annotation"><p class="has-media media-640" data-textannotation-id="58a492029dca5e6a6e481d21b6b2933a"><span class="img-border"><img alt="How to Program Your Mind to Stop Buying Crap You Don’t Need" class="js_annotatable-image cursor-crosshair" data-asset-url="http://i.kinja-img.com/gawker-media/image/upload/s--hqqO9fze--/n1s6c2m6kc07iqdyllj6.jpg" data-chomp-id="n1s6c2m6kc07iqdyllj6" data-format="jpg" height="358" src="http://i.kinja-img.com/gawker-media/image/upload/s--hqqO9fze--/n1s6c2m6kc07iqdyllj6.jpg" width="636"></img></span></p><p class="first-text" data-textannotation-id="a043044f9b3e31fd85568b17e3b1b5f3"><span>We all buy things from time to time that we don't really need. It's okay to appeal to your wants every once in a while, as long as you're in control. If you struggle with clutter, impulse buys, and buyer's remorse, here's how to put your mind in the right place before you even set foot in a store.</span></p>
+
+
+
+
+
+
+
+
+
+
+
+<h3 data-textannotation-id="e51cbbc52eb8c3b33571908351076cf7"><strong>Understand How Your Own Brain Works Against You</strong></h3>
+
+
+
+
+
+
+
+
+
+
+<p class="has-media media-640" data-textannotation-id="268f7702467d33e3b0972dd09f1cf0a6"><span class="img-border"><img alt="How to Program Your Mind to Stop Buying Crap You Don’t Need" class="js_annotatable-image cursor-crosshair" data-asset-url="http://i.kinja-img.com/gawker-media/image/upload/s--QeUTCiuW--/o4dpyrcbiqyfrc3bxx6p.jpg" data-chomp-id="o4dpyrcbiqyfrc3bxx6p" data-format="jpg" height="358" src="http://i.kinja-img.com/gawker-media/image/upload/s--QeUTCiuW--/o4dpyrcbiqyfrc3bxx6p.jpg" width="636"></img></span></p>
+
+
+
+
+
+
+
+
+
+
+<p data-textannotation-id="32604538f84919efff270e87b61191a1">It may come as no surprise to learn that stores employ all kinds of tricks to get you to part ways with your cash, and your brain plays right along. Through psychological tricks, product placement, and even color, stores are designed from the ground up to increase spending. We've talked about the biggest things stores do to manipulate your senses, but here are some of the biggest things to look out for:</p>
+
+
+
+
+
+
+
+
+
+
+<ul><li data-textannotation-id="cd748c8b681c781cdd728c5e17b5e05f"><strong>Color:</strong> Stores use color to make products attractive and eye-catching, but they also use color on price labels. Red stands out and can encourage taking action, that's why it's commonly associated with sale signage and advertising. When you see red, remember what they're trying to do to your brain with that color. You don't to buy something just because it's on sale.</li><li data-textannotation-id="29c11c0aec305293be282aa91f8fbc3d"><strong>Navigation Roadblocks:</strong> Stores force you to walk around stuff you don't need to find the stuff you are really after. Have a list of what you need before you go in, go straight to it, and imagine it's the only item in the store.</li><li data-textannotation-id="252dc7e4a924d12c2d913861ab118bf5"><strong>The Touch Factor:</strong> Stores place items they want to sell in easy to reach locations and encourage you to touch them. Don't do it! As soon as you pick something up, you're more likely to buy it because your mind suddenly takes ownership of the object. Don't pick anything up and don't play with display items.</li><li data-textannotation-id="05dde4d44056798acff5890759134a64"><strong>Scents and Sounds:</strong> You'll probably hear classic, upbeat tunes when you walk into a store. The upbeat music makes you happy and excited, while playing familiar songs makes you feel comfortable. They also use pleasant smells to put your mind at ease. A happy, comfortable mind at ease is a dangerous combination for your brain when shopping. There's not much you can do to avoid this unless you shop online, but it's good to be aware of it.</li></ul><p data-textannotation-id="1eb4a4df2a670927c5d9e9641ebf9d40">And sure, we can blame the stores all we want, but you won't change how they operate—you can only be aware of how your <a href="http://lifehacker.com/how-stores-manipulate-your-senses-so-you-spend-more-mon-475987594" x-inset="1">brain is falling for their tricks</a>. Even without the stores, <a href="http://lifehacker.com/5968125/how-your-brain-corrupts-your-shopping-choices" x-inset="1">your brain is working against you on its own</a>, thanks to some simple cognitive biases.</p>
+
+
+
+
+
+
+
+
+
+
+
+
+<aside class="referenced-wide referenced-fullwidth js_inset tmpl_referencedGroupFullWidth clearfix core-decorated-inset">
+</aside><p data-textannotation-id="89992f1ca493b248eea6ed1772326c46">For example, confirmation bias makes you only believe the information that conforms to your prior beliefs, while you discount everything else. Advertisers appeal to this bias directly by convincing you one item is better than another with imagery and other tricks, regardless of what hard facts might say. Keep your mind open, do your own research, and accept when you're wrong about a product. The Decoy effect is also a commonly used tactic. You think one product is a deal because it's next to a similar product that's priced way higher. Even if it's a product you need, it's probably not as good of a deal as it looks right then and there. Again, always research beforehand and be on the lookout for this common trick to avoid impulse buys.</p>
+
+
+
+
+
+
+
+
+
+
+<h3 data-textannotation-id="eedde8c384145f2593efc2a15a4d79de"><strong>Make a List of </strong><em><strong>Everything</strong></em><strong> You Own and Do Some Decluttering</strong></h3>
+
+
+
+
+
+
+
+
+
+
+<p class="has-media media-640" data-textannotation-id="8044cf9aab698fd28931acd90ba96f7a"><span class="img-border"><img alt="How to Program Your Mind to Stop Buying Crap You Don’t Need" class="js_annotatable-image cursor-crosshair" data-asset-url="http://i.kinja-img.com/gawker-media/image/upload/s--mlR3Ku0_--/xrhkwleyurcizy4akiae.jpg" data-chomp-id="xrhkwleyurcizy4akiae" data-format="jpg" height="358" src="http://i.kinja-img.com/gawker-media/image/upload/s--mlR3Ku0_--/xrhkwleyurcizy4akiae.jpg" width="636"></img></span></p>
+
+
+
+
+
+
+
+
+
+
+<p data-textannotation-id="a2a886d841e5aed848cdf7088edde4ea">Now that you know what you're up against, it's time to start changing the way you think. Before you can stop buying crap you don't need, you need to identify what that crap is. The first step is to make a list of <a href="http://lifehacker.com/how-to-defeat-the-urge-to-binge-shop-1468216943" x-inset="1">every single thing you own</a>. <strong>Every. Single. Thing</strong>. This might sound extreme, but you need to gather your data so you can start reprogramming your mind.</p>
+
+
+
+
+
+
+
+
+
+
+
+
+<aside class="referenced-wide referenced-fullwidth js_inset tmpl_referencedGroupFullWidth clearfix core-decorated-inset">
+</aside><p data-textannotation-id="bbe57b7aa20b48550e5f66b7c530822c">The purpose of this exercise is twofold: you see what you already have and don't need to ever buy again, and you get to see what you shouldn't have bought in the first place. As you list everything out, separate items into categories. It's extremely important that you are as honest with yourself as possible while you do this. It's also important you actually write this all down or type it all out. Here is the first set of categories to separate everything into:</p>
+
+
+
+
+
+
+
+
+
+
+<ul><li data-textannotation-id="8d7dc912152eddd0e3d56e28ad79e6f2"><strong>Need:</strong> You absolutely need this item to get by on a day to day basis.</li><li data-textannotation-id="6f60a79627f0746d1f611999251e9f1b"><strong>Sometimes Need:</strong> You don't need this item every day, but you use it on a somewhat regular basis.</li><li data-textannotation-id="54e10b108f95548966b657bd90fdbed4"><strong>Want:</strong> You bought this item because you wanted it, not because you needed it.</li><li data-textannotation-id="26c461a85fbc78651be442e205cac58b"><strong>Crap:</strong> You don't have a good reason why you have it and you already know it needs to go (there's probably a few of these items, at least).</li></ul><p data-textannotation-id="5743cf753f68fd8ee3443cc0f8e815dd">Leave the things you listed as "needs" alone, put your stuff listed as "crap" in a pile or box to go bye-bye, and move your attention back to your "sometimes need" and "want" lists. You need to go back over both of those lists because you probably fudged some of the listings, either subconsciously or intentionally. Now ask yourself these three questions as you go through both the "sometimes need" and "want" lists:</p>
+
+
+
+
+
+
+
+
+
+
+<ul><li data-textannotation-id="2048d6c0436bd34811442d6df32989a4">When was the last time I used this?</li><li data-textannotation-id="3f4b3686d822171b35e27bf1afde530b">When will I use this again?</li><li data-textannotation-id="63728605cc4fa66f5b225f674d12bbff">Does this item <a href="http://lifehacker.com/declutter-by-asking-one-question-does-this-spark-joy-1651256422">bring you joy</a>?</li></ul><p data-textannotation-id="816cd504161fecc6f3e173779b33d5db">Remember to be honest and adjust your lists accordingly. There's nothing wrong with keeping things you wanted. Material items can <a href="http://lifehacker.com/how-to-buy-happiness-the-purchases-most-likely-to-brin-1681780686">bring happiness to many people</a>, but make sure the items on your "want" list actively provide you joy and are being used. If an item doesn't get much use or doesn't make you happy, add it to the "crap" list.</p>
+
+
+
+
+
+
+
+
+
+
+<p data-textannotation-id="675103d9c0da55e95f93c53bb019f864">Once you have everything organized, it's time to do some serious decluttering. This listing exercise should get you started, but there are <a href="http://lifehacker.com/5957609/how-to-kick-your-clutter-habit-and-live-in-a-clean-house-once-and-for-all">a lot of other great ideas</a> when it comes to ditching the junk you don't need. Regardless, everything on your "crap" list needs to go. You can donate it, sell it at a yard sale, give it away to people know, whatever you like. Before you get rid of everything, though, take a picture of all your stuff together. Print out or save the picture somewhere. Some of it was probably gifts, but in general, this is all the crap you bought that you don't need. Take a good look and remember it.</p>
+
+
+
+
+
+
+
+
+
+
+<h3 data-textannotation-id="f15ab0a628b159459f095f04fef851ba"><strong>See How Much Money and Time You Spent on the Stuff You Threw Out</strong></h3>
+
+
+
+
+
+
+
+
+
+
+<p class="has-media media-640" data-textannotation-id="bc2f55587bf4ab07a1852a8d26217233"><span class="img-border"><img alt="How to Program Your Mind to Stop Buying Crap You Don’t Need" class="js_annotatable-image cursor-crosshair" data-asset-url="http://i.kinja-img.com/gawker-media/image/upload/s--Tacb0tyW--/qodag11euf2npkawkn9v.jpg" data-chomp-id="qodag11euf2npkawkn9v" data-format="jpg" height="358" src="http://i.kinja-img.com/gawker-media/image/upload/s--Tacb0tyW--/qodag11euf2npkawkn9v.jpg" width="636"></img></span></p>
+
+
+
+
+
+
+
+
+
+
+<p data-textannotation-id="95ab4fe30c3ade42a8011966ea54aa0b">Now take a look at your "crap" list again and start calculating how much you spent on all of it. If it was a gift, mark it as $0. Otherwise, figure out the price of the item at the time you bought it. If you got a deal or bought it on sale it's okay to factor that in, but try to be as accurate as possible. Once you have the price for each item, add it all together. Depending on your spending habits this could possibly be in the hundreds to thousands of dollars. Remember the picture you took of all this stuff? Attach the total cost to the picture so you can see both at the same time.</p>
+
+
+
+
+
+
+
+
+
+
+<p data-textannotation-id="f654efec679064b15826d8ee20bc94e4">With the money cost figured out, you should take a look at the other costs too. Time is a resource just like any other, and it's a finite one. What kind of time did you pour into these things? Consider the time you spent acquiring and using these items, then write it all down. These can be rough estimations, but go ahead and add it all up when you think you've got it. Now attach the total time to same picture as before and think of the other ways you could have spent all that time. This isn't to make you feel bad about yourself, just to deliver information to your brain in an easy-to-understand form. When you look at it all like this, it can open your eyes a little more, and help you think about purchases in the future. You'll look at an item and ask yourself, "Will this just end up in the picture?"</p>
+
+
+
+
+
+
+
+
+
+
+<h3 data-textannotation-id="6342bf7f15d9eddd21489c23e51ca434"><strong>List Every Non-Material Thing In Your Life that Makes You Happy</strong></h3>
+
+
+
+
+
+
+
+
+
+
+<p class="has-media media-640" data-textannotation-id="bafeac1c3808e0d2900190979f058b2c"><span class="img-border"><img alt="How to Program Your Mind to Stop Buying Crap You Don’t Need" class="js_annotatable-image cursor-crosshair" data-asset-url="http://i.kinja-img.com/gawker-media/image/upload/s--x9hLbIKJ--/imfc9ybqfw0jmztbhfrh.jpg" data-chomp-id="imfc9ybqfw0jmztbhfrh" data-format="jpg" height="358" src="http://i.kinja-img.com/gawker-media/image/upload/s--x9hLbIKJ--/imfc9ybqfw0jmztbhfrh.jpg" width="636"></img></span></p>
+
+
+
+
+
+
+
+
+
+
+<p data-textannotation-id="4bd8fbaabb33ff1cb5dc93c16e1f83cc">Now it's time to make a different list. While material items may bring plenty of joy, the things in your life that make you happiest probably can't be bought. Get a separate piece of paper or create a new document and list out everything in your life that makes you happy. If you can't buy it, it's eligible for the list. It doesn't matter if it only makes you crack a smile or makes you jump for joy, list it out. </p>
+
+
+
+
+
+
+
+
+
+
+<p data-textannotation-id="104a646a62ad7a0cfb4e3ff086185fdc"><span>These are probably the things that actually make you want to get out of bed in the morning and keep on keepin' on. Once you have it all down, put it in your purse or wallet. The next time you feel the urge to buy something, whip this list out first and remind yourself why you probably don't need it.</span></p>
+
+
+
+
+
+
+
+
+
+
+<h3 data-textannotation-id="532cf992ff45d52de501c1a8f80fc152"><strong>Spend Some Time Away from Material Things to Gain Perspective</strong></h3>
+
+
+
+
+
+
+
+
+
+
+<p class="has-media media-640" data-textannotation-id="64f5c7155ad89bd2835399d33c1ae28a"><span class="img-border"><img alt="How to Program Your Mind to Stop Buying Crap You Don’t Need" class="js_annotatable-image cursor-crosshair" data-asset-url="http://i.kinja-img.com/gawker-media/image/upload/s--6NwBgQLy--/afy7n45jfvsjdmmhonct.jpg" data-chomp-id="afy7n45jfvsjdmmhonct" data-format="jpg" height="358" src="http://i.kinja-img.com/gawker-media/image/upload/s--6NwBgQLy--/afy7n45jfvsjdmmhonct.jpg" width="636"></img></span></p>
+
+
+
+
+
+
+
+
+
+
+<p data-textannotation-id="84554492c487779e921b98fb64222177">If you're having a really hard time with your spending, it can help to get away from material objects completely. When you're constantly surrounded by stuff and have access to buying things at all times, it can be really tough to break the habit. Spend a day in the park enjoying the sights and sounds of the outdoors, go camping with some friends, or hike a trail you haven't been on before. </p>
+
+
+
+
+
+
+
+
+
+
+<p data-textannotation-id="b44add1c7b690705d672186e3a9604b6">Essentially, you want to show yourself that you don't need your "things" to have a good time. When you realize how much fun you can have without all the trinkets and trivets, you'll start to shut down your desire to buy them. If you can't get really get away right now, just go for a walk without your purse or wallet (but carry your ID). If you can't buy anything, you'll be forced to experience things a different way.</p>
+
+
+
+
+
+
+
+
+
+
+<h3 data-textannotation-id="98c11bebae0bbcdbe8411df0186d6465"><strong>Develop a Personal "Should I Buy This?" Test</strong></h3>
+
+
+
+
+
+
+
+
+
+
+<p class="has-media media-640" data-textannotation-id="ff438b878771354bb7f6d065ff50dbb2"><span class="img-border"><img alt="How to Program Your Mind to Stop Buying Crap You Don’t Need" class="js_annotatable-image cursor-crosshair" data-asset-url="http://i.kinja-img.com/gawker-media/image/upload/s--ciqk42G0--/s3pq8vjrvyjgne4lfsod.jpg" data-chomp-id="s3pq8vjrvyjgne4lfsod" data-format="jpg" height="358" src="http://i.kinja-img.com/gawker-media/image/upload/s--ciqk42G0--/s3pq8vjrvyjgne4lfsod.jpg" width="636"></img></span></p>
+
+
+
+
+
+
+
+
+
+
+<p data-textannotation-id="4af04ae83f18d9c37da21527bcd4a290">If you don't have a personal "should I buy this?" test, now's the perfect time to make one. When you find an item you think you need or want, it has to pass all of the questions you have on your test before you can buy it. Here's where you can use all of the data you've gathered so far and put it to really good use. The test should be personalized to your own buying habits, but here are some example questions:</p>
+
+
+
+
+
+
+
+
+
+
+<ul><li data-textannotation-id="fcfd78b1619bdf0b7330f4b40efb899d">Is this a planned purchase?</li><li data-textannotation-id="c16e7d5feae7cc2c3c6a8dd312ea206f">Will it end up in the "crap" list picture one day?</li><li data-textannotation-id="54d877fdee56080c87508fc9e6402889"><a href="http://lifehacker.com/prevent-clutter-by-asking-yourself-where-items-will-go-1649480461">Where am I going to put it</a>?</li><li data-textannotation-id="59d5245217c84e6b2b2969b3492f2f2d">Have I included this in my budget?</li><li data-textannotation-id="8fe1582808b4d89f5c88c2708744d27d"><em>Why</em> do I want/need it?</li></ul><p data-textannotation-id="0162d779382cdc7de908fc1488af3940">Custom build your test to hit all of your weaknesses. If you make a lot of impulse buys, include questions that address that. If you experience a lot of buyer's remorse, include a lot of questions that make you think about the use of item after you buy it. If buying the latest and greatest technology is your weakness, Joshua Becker at Becoming Minimalist suggests you ask yourself <a href="http://www.becomingminimalist.com/marriage-hacks/" target="_blank">what problem the piece of tech solves</a>. If you can't think of anything it solves or if you already have something that solves it, you don't need it. Be thorough and build a test that you can run through your mind every time you consider buying something.</p>
+
+
+
+
+
+
+
+
+
+
+<h3 data-textannotation-id="c0ed0882675acc340dcd88e13ca514b3"><strong>Learn to Delay Gratification and Destroy the Urge to Impulse Buy</strong></h3>
+
+
+
+
+
+
+
+
+
+
+<p class="has-media media-640" data-textannotation-id="1d43712fc5ce8f156e4661cca5750575"><span class="img-border"><img alt="How to Program Your Mind to Stop Buying Crap You Don’t Need" class="js_annotatable-image cursor-crosshair" data-asset-url="http://i.kinja-img.com/gawker-media/image/upload/s--mtob1sjR--/y2ldv5eufb3jcrtfouye.jpg" data-chomp-id="y2ldv5eufb3jcrtfouye" data-format="jpg" height="358" src="http://i.kinja-img.com/gawker-media/image/upload/s--mtob1sjR--/y2ldv5eufb3jcrtfouye.jpg" width="636"></img></span></p>
+
+
+
+
+
+
+
+
+
+
+<p data-textannotation-id="3d8086719c5da749f877629d498ccab9">When it comes to the unnecessary crap we buy, impulse purchases probably make up a good deal of them. We love to feel gratification instantly and impulse buys appeal to that with a rush of excitement with each new purchase. We like to believe that we have control over our impulses all the time, but we really don't, and that's a major problem for the ol' wallet.</p>
+
+
+
+
+
+
+
+
+
+
+<p data-textannotation-id="620ca9836425e09ec7fa50bfad204665">The key is teaching your brain that it's okay to <a href="http://lifehacker.com/overcome-the-need-for-instant-gratification-by-delaying-1636938356">wait for gratification</a>. You can do this with a simple time out every time you want something. Look at whatever you're thinking of buying, go through your personal "should I buy this?" test, and then walk away for a little while. Planning your purchases ahead is ideal, so the longer you can hold off, the better. Set yourself a reminder to check on the item <a href="http://lifehacker.com/5859632/buyers-remorse-is-inevitable-how-to-make-purchases-you-really-wont-regret">a week or month down the line</a>. When you come back to it, you may find that you don't even want it, just the gratification that would come with it. If you're shopping online, you can do the same thing. Walk away from your desk or put your phone in your pocket and do something else for a little while.</p>
+
+
+
+
+
+
+
+
+
+
+<p data-textannotation-id="a85d9eb501c898234ac5df2a56c50a13">You can also avoid online impulse purchases by <a href="http://lifehacker.com/5919833/how-to-avoid-impulse-purchases-in-the-internet-shopping-age" x-inset="1">making it harder to do</a>. Block shopping web sites during time periods you know you're at your weakest, or remove all of your saved credit card or Paypal information. You can also <a href="http://lifehacker.com/5569035/practice-the-halt-method-to-curb-impulse-purchases" x-inset="1">practice the "HALT" method</a> when you're shopping online or in a store. Try not to buy things when you're Hungry, Angry, Lonely, or Tired because you're at your weakest state mentally. Last, but not least, the "<a href="http://lifehacker.com/5320196/use-the-stranger-test-to-reduce-impulse-purchases" x-inset="1">stranger test</a>" can help you weed out bad purchases too.</p>
+
+
+
+
+
+
+
+
+
+
+
+
+<aside class="referenced-wide referenced-fullwidth js_inset tmpl_referencedGroupFullWidth clearfix core-decorated-inset">
+</aside><p data-textannotation-id="27385752c06848647540ad931892b21e">The last thing you should consider when it comes to impulse buys is "artificial replacement." As Trent Hamm at The Simple Dollar explains, artificial replacement can happen when you start to <a href="http://www.thesimpledollar.com/balancing-spending-and-time-how-time-frugality-can-save-you-lots-of-cash/" target="_blank">reduce the time</a> you get with your main interests:</p>
+
+
+
+
+
+
+
+
+
+
+<blockquote data-textannotation-id="213e2e816ac88f8d177fb0db0f7fef09">
+<p data-textannotation-id="7b98c5809df24dd04bb65285878c0335">Whenever I consistently cut quality time for my main interests out of my life, I start to long for them. As you saw in that "typical" day, I do make room for spending time with my family, but my other two main interests are absent. If that happens too many days in a row, I start to really miss reading. I start to really miss playing thoughtful board games with friends. What happens after that? <strong>I start to substitute.</strong> When I don't have the opportunity to sit down for an hour or even for half an hour and really get lost in a book, I start looking for an alternative way to fill in the tiny slices of time that I do have. I'll spend money.</p></blockquote>
+
+
+
+
+
+
+
+
+
+
+<p data-textannotation-id="4b6cc2900ffacd3daef54b13b4caceac">You probably have things in your life that provide plenty of gratification, so don't get caught substituting it with impulse buys. Always make sure you keep yourself happy with plenty of time doing the things you like to do and you won't be subconsciously trying to fill that void with useless crap.</p>
+
+
+
+
+
+
+
+
+
+
+<h3 data-textannotation-id="aed9b435c4ed23e573c453ceeb34ed18"><strong>Turn the Money You Save Into More Money</strong></h3>
+
+
+
+
+
+
+
+
+
+
+<p class="has-media media-640" data-textannotation-id="21154394d63f1943d01f2b717aa31115"><span class="img-border"><img alt="How to Program Your Mind to Stop Buying Crap You Don’t Need" class="js_annotatable-image cursor-crosshair" data-asset-url="http://i.kinja-img.com/gawker-media/image/upload/s--4Ajak63w--/atb9qm07fvvg7hqkumkw.jpg" data-chomp-id="atb9qm07fvvg7hqkumkw" data-format="jpg" height="358" src="http://i.kinja-img.com/gawker-media/image/upload/s--4Ajak63w--/atb9qm07fvvg7hqkumkw.jpg" width="636"></img></span></p>
+
+
+
+
+
+
+
+
+
+
+<p data-textannotation-id="6141942e977cc058fd7a0fa06a3f7389">Once you've programmed your mind to stop buying crap you don't need, you'll have some extra cash to play with. Take all that money and start putting it toward your future and things you <em>will</em> need further down the road. You might need <a href="http://twocents.lifehacker.com/how-to-start-saving-for-a-home-down-payment-1541254056" target="_blank">a home</a>, a vehicle, or a way to retire, but none of that can happen until you start planning for it. </p>
+
+
+
+
+
+
+
+
+
+
+<p data-textannotation-id="90f08afddc08e2c3b45c266f2e6965ec">Start by paying off any debts you already have. Credit cards, student loans, and even car payments can force you to <a href="http://lifehacker.com/how-to-break-the-living-paycheck-to-paycheck-cycle-1445330680">live paycheck to paycheck</a>. Use the <a href="http://lifehacker.com/5940989/pay-off-small-balances-first-for-better-odds-of-eliminating-all-your-debt">snowball method</a> and pay off some small balances to make you feel motivated, then start taking out your debt in full force with the <a href="http://lifehacker.com/how-to-pay-off-your-debt-using-the-stack-method-576070292">stacking method</a>: stop creating new debt, determine which balances have the highest interest rates, and create a payment schedule to pay them off efficiently.</p>
+
+
+
+
+
+
+
+
+
+
+<p data-textannotation-id="1106cb837deb2b6fc8e28ba98f078c27">With your debts whittled down, you should start an emergency fund. No matter how well you plan things, accidents and health emergencies can still happen. An emergency fund is designed to make those kinds of events more manageable. This type of savings account is strictly for when life throws you a curveball, but you can grow one pretty easily <a href="http://twocents.lifehacker.com/how-to-grow-an-emergency-fund-from-modest-savings-1638409351" target="_blank">with only modest savings</a>.</p>
+
+
+
+
+
+
+
+
+
+
+<p data-textannotation-id="347c2a36f114a794d559d929da1b15b7">When you've paid off your debt and prepared yourself for troubled times, you can start saving for the big stuff. All that money you're not spending on crap anymore can be saved, invested, and compounded to let you buy comfort and security. If you don't know where to start, talk to a financial planner. Or create a simple, yet effective <a href="http://twocents.lifehacker.com/how-to-build-an-easy-beginner-set-and-forget-investm-1686878594" target="_blank" x-inset="1">"set and forget" investment portfolio</a>. You've worked hard to reprogram your mind, so make sure you reap the benefits for many years to come.</p>
+
+
+
+
+
+
+
+
+
+
+
+
+<aside class="referenced-wide referenced-fullwidth js_inset tmpl_referencedGroupFullWidth clearfix core-decorated-inset">
+</aside><p data-textannotation-id="b54d87ffdace50f420c3a6ff0404cbf3"><em><small>Photos by <a href="http://www.shutterstock.com/pic-129762989/stock-vector-consumer.html?src=id&amp;ws=1" target="_blank">cmgirl</a> (Shutterstock), <a href="http://www.shutterstock.com/pic-227832739/stock-vector-hacker-icon-man-in-hoody-with-laptop-flat-isolated-on-dark-background-vector-illustration.html?src=id&amp;ws=1" target="_blank">Macrovector</a> (Shutterstock), <a href="https://www.flickr.com/photos/jetheriot/6186786217" target="_blank">J E Theriot</a>, <a href="https://www.flickr.com/photos/puuikibeach/15289861843" target="_blank">davidd</a>, <a href="https://www.flickr.com/photos/funfilledgeorgie/10922459733" target="_blank">George Redgrave</a>, <a href="https://www.flickr.com/photos/amslerpix/7252002214" target="_blank">David Amsler</a>, <a href="https://www.flickr.com/photos/amalakar/7299820870" target="_blank">Arup Malakar</a>, <a href="https://www.flickr.com/photos/lobsterstew/89644885" target="_blank">J B</a>, <a href="https://www.flickr.com/photos/jakerome/3298702453" target="_blank">jakerome</a>, <a href="http://401kcalculator.org/" target="_blank">401(K) 2012</a>.</small></em></p></div> \ No newline at end of file
diff --git a/test/test-pages/lifehacker-working/expected.html b/test/test-pages/lifehacker-working/expected.html
index 7eece77..918b0d9 100644
--- a/test/test-pages/lifehacker-working/expected.html
+++ b/test/test-pages/lifehacker-working/expected.html
@@ -1,76 +1,488 @@
- <div class="post-content entry-content ">
- <p data-textannotation-id="58a492029dca5e6a6e481d21b6b2933a" class="has-media media-640"><span class="img-border"><img width="636" height="358" data-format="jpg" data-asset-url="http://i.kinja-img.com/gawker-media/image/upload/s--hqqO9fze--/n1s6c2m6kc07iqdyllj6.jpg" data-chomp-id="n1s6c2m6kc07iqdyllj6" alt="How to Program Your Mind to Stop Buying Crap You Don’t Need" src="http://i.kinja-img.com/gawker-media/image/upload/s--hqqO9fze--/n1s6c2m6kc07iqdyllj6.jpg"/></span></p>
- <p data-textannotation-id="a043044f9b3e31fd85568b17e3b1b5f3" class="first-text"><span>We all buy things from time to time that we don't really need. It's okay to appeal to your wants every once in a while, as long as you're in control. If you struggle with clutter, impulse buys, and buyer's remorse, here's how to put your mind in the right place before you even set foot in a store.</span></p>
- <h3 data-textannotation-id="e51cbbc52eb8c3b33571908351076cf7"><strong>Understand How Your Own Brain Works Against You</strong></h3>
- <p data-textannotation-id="268f7702467d33e3b0972dd09f1cf0a6" class="has-media media-640"><span class="img-border"><img width="636" height="358" data-format="jpg" data-asset-url="http://i.kinja-img.com/gawker-media/image/upload/s--QeUTCiuW--/o4dpyrcbiqyfrc3bxx6p.jpg" data-chomp-id="o4dpyrcbiqyfrc3bxx6p" alt="How to Program Your Mind to Stop Buying Crap You Don’t Need" src="http://i.kinja-img.com/gawker-media/image/upload/s--QeUTCiuW--/o4dpyrcbiqyfrc3bxx6p.jpg"/></span></p>
- <p data-textannotation-id="32604538f84919efff270e87b61191a1">It may come as no surprise to learn that stores employ all kinds of tricks to get you to part ways with your cash, and your brain plays right along. Through psychological tricks, product placement, and even color, stores are designed from the ground up to increase spending. We've talked about the biggest things stores do to manipulate your senses, but here are some of the biggest things to look out for:</p>
- <ul>
- <li data-textannotation-id="cd748c8b681c781cdd728c5e17b5e05f"><strong>Color:</strong> Stores use color to make products attractive and eye-catching, but they also use color on price labels. Red stands out and can encourage taking action, that's why it's commonly associated with sale signage and advertising. When you see red, remember what they're trying to do to your brain with that color. You don't to buy something just because it's on sale.</li>
- <li data-textannotation-id="29c11c0aec305293be282aa91f8fbc3d"><strong>Navigation Roadblocks:</strong> Stores force you to walk around stuff you don't need to find the stuff you are really after. Have a list of what you need before you go in, go straight to it, and imagine it's the only item in the store.</li>
- <li data-textannotation-id="252dc7e4a924d12c2d913861ab118bf5"><strong>The Touch Factor:</strong> Stores place items they want to sell in easy to reach locations and encourage you to touch them. Don't do it! As soon as you pick something up, you're more likely to buy it because your mind suddenly takes ownership of the object. Don't pick anything up and don't play with display items.</li>
- <li data-textannotation-id="05dde4d44056798acff5890759134a64"><strong>Scents and Sounds:</strong> You'll probably hear classic, upbeat tunes when you walk into a store. The upbeat music makes you happy and excited, while playing familiar songs makes you feel comfortable. They also use pleasant smells to put your mind at ease. A happy, comfortable mind at ease is a dangerous combination for your brain when shopping. There's not much you can do to avoid this unless you shop online, but it's good to be aware of it.</li>
- </ul>
- <p data-textannotation-id="1eb4a4df2a670927c5d9e9641ebf9d40">And sure, we can blame the stores all we want, but you won't change how they operate—you can only be aware of how your <a href="http://lifehacker.com/how-stores-manipulate-your-senses-so-you-spend-more-mon-475987594" x-inset="1">brain is falling for their tricks</a>. Even without the stores, <a href="http://lifehacker.com/5968125/how-your-brain-corrupts-your-shopping-choices" x-inset="1">your brain is working against you on its own</a>, thanks to some simple cognitive biases.</p>
- <aside class="referenced-wide referenced-fullwidth js_inset tmpl_referencedGroupFullWidth clearfix core-decorated-inset"> </aside>
- <p data-textannotation-id="89992f1ca493b248eea6ed1772326c46">For example, confirmation bias makes you only believe the information that conforms to your prior beliefs, while you discount everything else. Advertisers appeal to this bias directly by convincing you one item is better than another with imagery and other tricks, regardless of what hard facts might say. Keep your mind open, do your own research, and accept when you're wrong about a product. The Decoy effect is also a commonly used tactic. You think one product is a deal because it's next to a similar product that's priced way higher. Even if it's a product you need, it's probably not as good of a deal as it looks right then and there. Again, always research beforehand and be on the lookout for this common trick to avoid impulse buys.</p>
- <h3 data-textannotation-id="eedde8c384145f2593efc2a15a4d79de"><strong>Make a List of </strong><em><strong>Everything</strong></em><strong> You Own and Do Some Decluttering</strong></h3>
- <p data-textannotation-id="8044cf9aab698fd28931acd90ba96f7a" class="has-media media-640"><span class="img-border"><img width="636" height="358" data-format="jpg" data-asset-url="http://i.kinja-img.com/gawker-media/image/upload/s--mlR3Ku0_--/xrhkwleyurcizy4akiae.jpg" data-chomp-id="xrhkwleyurcizy4akiae" alt="How to Program Your Mind to Stop Buying Crap You Don’t Need" src="http://i.kinja-img.com/gawker-media/image/upload/s--mlR3Ku0_--/xrhkwleyurcizy4akiae.jpg"/></span></p>
- <p data-textannotation-id="a2a886d841e5aed848cdf7088edde4ea">Now that you know what you're up against, it's time to start changing the way you think. Before you can stop buying crap you don't need, you need to identify what that crap is. The first step is to make a list of <a href="http://lifehacker.com/how-to-defeat-the-urge-to-binge-shop-1468216943" x-inset="1">every single thing you own</a>. <strong>Every. Single. Thing</strong>. This might sound extreme, but you need to gather your data so you can start reprogramming your mind.</p>
- <aside class="referenced-wide referenced-fullwidth js_inset tmpl_referencedGroupFullWidth clearfix core-decorated-inset"> </aside>
- <p data-textannotation-id="bbe57b7aa20b48550e5f66b7c530822c">The purpose of this exercise is twofold: you see what you already have and don't need to ever buy again, and you get to see what you shouldn't have bought in the first place. As you list everything out, separate items into categories. It's extremely important that you are as honest with yourself as possible while you do this. It's also important you actually write this all down or type it all out. Here is the first set of categories to separate everything into:</p>
- <ul>
- <li data-textannotation-id="8d7dc912152eddd0e3d56e28ad79e6f2"><strong>Need:</strong> You absolutely need this item to get by on a day to day basis.</li>
- <li data-textannotation-id="6f60a79627f0746d1f611999251e9f1b"><strong>Sometimes Need:</strong> You don't need this item every day, but you use it on a somewhat regular basis.</li>
- <li data-textannotation-id="54e10b108f95548966b657bd90fdbed4"><strong>Want:</strong> You bought this item because you wanted it, not because you needed it.</li>
- <li data-textannotation-id="26c461a85fbc78651be442e205cac58b"><strong>Crap:</strong> You don't have a good reason why you have it and you already know it needs to go (there's probably a few of these items, at least).</li>
- </ul>
- <p data-textannotation-id="5743cf753f68fd8ee3443cc0f8e815dd">Leave the things you listed as "needs" alone, put your stuff listed as "crap" in a pile or box to go bye-bye, and move your attention back to your "sometimes need" and "want" lists. You need to go back over both of those lists because you probably fudged some of the listings, either subconsciously or intentionally. Now ask yourself these three questions as you go through both the "sometimes need" and "want" lists:</p>
- <ul>
- <li data-textannotation-id="2048d6c0436bd34811442d6df32989a4">When was the last time I used this?</li>
- <li data-textannotation-id="3f4b3686d822171b35e27bf1afde530b">When will I use this again?</li>
- <li data-textannotation-id="63728605cc4fa66f5b225f674d12bbff">Does this item <a href="http://lifehacker.com/declutter-by-asking-one-question-does-this-spark-joy-1651256422">bring you joy</a>?</li>
- </ul>
- <p data-textannotation-id="816cd504161fecc6f3e173779b33d5db">Remember to be honest and adjust your lists accordingly. There's nothing wrong with keeping things you wanted. Material items can <a href="http://lifehacker.com/how-to-buy-happiness-the-purchases-most-likely-to-brin-1681780686">bring happiness to many people</a>, but make sure the items on your "want" list actively provide you joy and are being used. If an item doesn't get much use or doesn't make you happy, add it to the "crap" list.</p>
- <p data-textannotation-id="675103d9c0da55e95f93c53bb019f864">Once you have everything organized, it's time to do some serious decluttering. This listing exercise should get you started, but there are <a href="http://lifehacker.com/5957609/how-to-kick-your-clutter-habit-and-live-in-a-clean-house-once-and-for-all">a lot of other great ideas</a> when it comes to ditching the junk you don't need. Regardless, everything on your "crap" list needs to go. You can donate it, sell it at a yard sale, give it away to people know, whatever you like. Before you get rid of everything, though, take a picture of all your stuff together. Print out or save the picture somewhere. Some of it was probably gifts, but in general, this is all the crap you bought that you don't need. Take a good look and remember it.</p>
- <h3 data-textannotation-id="f15ab0a628b159459f095f04fef851ba"><strong>See How Much Money and Time You Spent on the Stuff You Threw Out</strong></h3>
- <p data-textannotation-id="bc2f55587bf4ab07a1852a8d26217233" class="has-media media-640"><span class="img-border"><img width="636" height="358" data-format="jpg" data-asset-url="http://i.kinja-img.com/gawker-media/image/upload/s--Tacb0tyW--/qodag11euf2npkawkn9v.jpg" data-chomp-id="qodag11euf2npkawkn9v" alt="How to Program Your Mind to Stop Buying Crap You Don’t Need" src="http://i.kinja-img.com/gawker-media/image/upload/s--Tacb0tyW--/qodag11euf2npkawkn9v.jpg"/></span></p>
- <p data-textannotation-id="95ab4fe30c3ade42a8011966ea54aa0b">Now take a look at your "crap" list again and start calculating how much you spent on all of it. If it was a gift, mark it as $0. Otherwise, figure out the price of the item at the time you bought it. If you got a deal or bought it on sale it's okay to factor that in, but try to be as accurate as possible. Once you have the price for each item, add it all together. Depending on your spending habits this could possibly be in the hundreds to thousands of dollars. Remember the picture you took of all this stuff? Attach the total cost to the picture so you can see both at the same time.</p>
- <p data-textannotation-id="f654efec679064b15826d8ee20bc94e4">With the money cost figured out, you should take a look at the other costs too. Time is a resource just like any other, and it's a finite one. What kind of time did you pour into these things? Consider the time you spent acquiring and using these items, then write it all down. These can be rough estimations, but go ahead and add it all up when you think you've got it. Now attach the total time to same picture as before and think of the other ways you could have spent all that time. This isn't to make you feel bad about yourself, just to deliver information to your brain in an easy-to-understand form. When you look at it all like this, it can open your eyes a little more, and help you think about purchases in the future. You'll look at an item and ask yourself, "Will this just end up in the picture?"</p>
- <h3 data-textannotation-id="6342bf7f15d9eddd21489c23e51ca434"><strong>List Every Non-Material Thing In Your Life that Makes You Happy</strong></h3>
- <p data-textannotation-id="bafeac1c3808e0d2900190979f058b2c" class="has-media media-640"><span class="img-border"><img width="636" height="358" data-format="jpg" data-asset-url="http://i.kinja-img.com/gawker-media/image/upload/s--x9hLbIKJ--/imfc9ybqfw0jmztbhfrh.jpg" data-chomp-id="imfc9ybqfw0jmztbhfrh" alt="How to Program Your Mind to Stop Buying Crap You Don’t Need" src="http://i.kinja-img.com/gawker-media/image/upload/s--x9hLbIKJ--/imfc9ybqfw0jmztbhfrh.jpg"/></span></p>
- <p data-textannotation-id="4bd8fbaabb33ff1cb5dc93c16e1f83cc">Now it's time to make a different list. While material items may bring plenty of joy, the things in your life that make you happiest probably can't be bought. Get a separate piece of paper or create a new document and list out everything in your life that makes you happy. If you can't buy it, it's eligible for the list. It doesn't matter if it only makes you crack a smile or makes you jump for joy, list it out. </p>
- <p data-textannotation-id="104a646a62ad7a0cfb4e3ff086185fdc"><span>These are probably the things that actually make you want to get out of bed in the morning and keep on keepin' on. Once you have it all down, put it in your purse or wallet. The next time you feel the urge to buy something, whip this list out first and remind yourself why you probably don't need it.</span></p>
- <h3 data-textannotation-id="532cf992ff45d52de501c1a8f80fc152"><strong>Spend Some Time Away from Material Things to Gain Perspective</strong></h3>
- <p data-textannotation-id="64f5c7155ad89bd2835399d33c1ae28a" class="has-media media-640"><span class="img-border"><img width="636" height="358" data-format="jpg" data-asset-url="http://i.kinja-img.com/gawker-media/image/upload/s--6NwBgQLy--/afy7n45jfvsjdmmhonct.jpg" data-chomp-id="afy7n45jfvsjdmmhonct" alt="How to Program Your Mind to Stop Buying Crap You Don’t Need" src="http://i.kinja-img.com/gawker-media/image/upload/s--6NwBgQLy--/afy7n45jfvsjdmmhonct.jpg"/></span></p>
- <p data-textannotation-id="84554492c487779e921b98fb64222177">If you're having a really hard time with your spending, it can help to get away from material objects completely. When you're constantly surrounded by stuff and have access to buying things at all times, it can be really tough to break the habit. Spend a day in the park enjoying the sights and sounds of the outdoors, go camping with some friends, or hike a trail you haven't been on before. </p>
- <p data-textannotation-id="b44add1c7b690705d672186e3a9604b6">Essentially, you want to show yourself that you don't need your "things" to have a good time. When you realize how much fun you can have without all the trinkets and trivets, you'll start to shut down your desire to buy them. If you can't get really get away right now, just go for a walk without your purse or wallet (but carry your ID). If you can't buy anything, you'll be forced to experience things a different way.</p>
- <h3 data-textannotation-id="98c11bebae0bbcdbe8411df0186d6465"><strong>Develop a Personal "Should I Buy This?" Test</strong></h3>
- <p data-textannotation-id="ff438b878771354bb7f6d065ff50dbb2" class="has-media media-640"><span class="img-border"><img width="636" height="358" data-format="jpg" data-asset-url="http://i.kinja-img.com/gawker-media/image/upload/s--ciqk42G0--/s3pq8vjrvyjgne4lfsod.jpg" data-chomp-id="s3pq8vjrvyjgne4lfsod" alt="How to Program Your Mind to Stop Buying Crap You Don’t Need" src="http://i.kinja-img.com/gawker-media/image/upload/s--ciqk42G0--/s3pq8vjrvyjgne4lfsod.jpg"/></span></p>
- <p data-textannotation-id="4af04ae83f18d9c37da21527bcd4a290">If you don't have a personal "should I buy this?" test, now's the perfect time to make one. When you find an item you think you need or want, it has to pass all of the questions you have on your test before you can buy it. Here's where you can use all of the data you've gathered so far and put it to really good use. The test should be personalized to your own buying habits, but here are some example questions:</p>
- <ul>
- <li data-textannotation-id="fcfd78b1619bdf0b7330f4b40efb899d">Is this a planned purchase?</li>
- <li data-textannotation-id="c16e7d5feae7cc2c3c6a8dd312ea206f">Will it end up in the "crap" list picture one day?</li>
- <li data-textannotation-id="54d877fdee56080c87508fc9e6402889"><a href="http://lifehacker.com/prevent-clutter-by-asking-yourself-where-items-will-go-1649480461">Where am I going to put it</a>?</li>
- <li data-textannotation-id="59d5245217c84e6b2b2969b3492f2f2d">Have I included this in my budget?</li>
- <li data-textannotation-id="8fe1582808b4d89f5c88c2708744d27d"><em>Why</em> do I want/need it?</li>
- </ul>
- <p data-textannotation-id="0162d779382cdc7de908fc1488af3940">Custom build your test to hit all of your weaknesses. If you make a lot of impulse buys, include questions that address that. If you experience a lot of buyer's remorse, include a lot of questions that make you think about the use of item after you buy it. If buying the latest and greatest technology is your weakness, Joshua Becker at Becoming Minimalist suggests you ask yourself <a target="_blank" href="http://www.becomingminimalist.com/marriage-hacks/">what problem the piece of tech solves</a>. If you can't think of anything it solves or if you already have something that solves it, you don't need it. Be thorough and build a test that you can run through your mind every time you consider buying something.</p>
- <h3 data-textannotation-id="c0ed0882675acc340dcd88e13ca514b3"><strong>Learn to Delay Gratification and Destroy the Urge to Impulse Buy</strong></h3>
- <p data-textannotation-id="1d43712fc5ce8f156e4661cca5750575" class="has-media media-640"><span class="img-border"><img width="636" height="358" data-format="jpg" data-asset-url="http://i.kinja-img.com/gawker-media/image/upload/s--mtob1sjR--/y2ldv5eufb3jcrtfouye.jpg" data-chomp-id="y2ldv5eufb3jcrtfouye" alt="How to Program Your Mind to Stop Buying Crap You Don’t Need" src="http://i.kinja-img.com/gawker-media/image/upload/s--mtob1sjR--/y2ldv5eufb3jcrtfouye.jpg"/></span></p>
- <p data-textannotation-id="3d8086719c5da749f877629d498ccab9">When it comes to the unnecessary crap we buy, impulse purchases probably make up a good deal of them. We love to feel gratification instantly and impulse buys appeal to that with a rush of excitement with each new purchase. We like to believe that we have control over our impulses all the time, but we really don't, and that's a major problem for the ol' wallet.</p>
- <p data-textannotation-id="620ca9836425e09ec7fa50bfad204665">The key is teaching your brain that it's okay to <a href="http://lifehacker.com/overcome-the-need-for-instant-gratification-by-delaying-1636938356">wait for gratification</a>. You can do this with a simple time out every time you want something. Look at whatever you're thinking of buying, go through your personal "should I buy this?" test, and then walk away for a little while. Planning your purchases ahead is ideal, so the longer you can hold off, the better. Set yourself a reminder to check on the item <a href="http://lifehacker.com/5859632/buyers-remorse-is-inevitable-how-to-make-purchases-you-really-wont-regret">a week or month down the line</a>. When you come back to it, you may find that you don't even want it, just the gratification that would come with it. If you're shopping online, you can do the same thing. Walk away from your desk or put your phone in your pocket and do something else for a little while.</p>
- <p data-textannotation-id="a85d9eb501c898234ac5df2a56c50a13">You can also avoid online impulse purchases by <a href="http://lifehacker.com/5919833/how-to-avoid-impulse-purchases-in-the-internet-shopping-age" x-inset="1">making it harder to do</a>. Block shopping web sites during time periods you know you're at your weakest, or remove all of your saved credit card or Paypal information. You can also <a href="http://lifehacker.com/5569035/practice-the-halt-method-to-curb-impulse-purchases" x-inset="1">practice the "HALT" method</a> when you're shopping online or in a store. Try not to buy things when you're Hungry, Angry, Lonely, or Tired because you're at your weakest state mentally. Last, but not least, the "<a href="http://lifehacker.com/5320196/use-the-stranger-test-to-reduce-impulse-purchases" x-inset="1">stranger test</a>" can help you weed out bad purchases too.</p>
- <aside class="referenced-wide referenced-fullwidth js_inset tmpl_referencedGroupFullWidth clearfix core-decorated-inset"> </aside>
- <p data-textannotation-id="27385752c06848647540ad931892b21e">The last thing you should consider when it comes to impulse buys is "artificial replacement." As Trent Hamm at The Simple Dollar explains, artificial replacement can happen when you start to <a target="_blank" href="http://www.thesimpledollar.com/balancing-spending-and-time-how-time-frugality-can-save-you-lots-of-cash/">reduce the time</a> you get with your main interests:</p>
- <blockquote data-textannotation-id="213e2e816ac88f8d177fb0db0f7fef09">
- <p data-textannotation-id="7b98c5809df24dd04bb65285878c0335">Whenever I consistently cut quality time for my main interests out of my life, I start to long for them. As you saw in that "typical" day, I do make room for spending time with my family, but my other two main interests are absent. If that happens too many days in a row, I start to really miss reading. I start to really miss playing thoughtful board games with friends. What happens after that? <strong>I start to substitute.</strong> When I don't have the opportunity to sit down for an hour or even for half an hour and really get lost in a book, I start looking for an alternative way to fill in the tiny slices of time that I do have. I'll spend money.</p>
- </blockquote>
- <p data-textannotation-id="4b6cc2900ffacd3daef54b13b4caceac">You probably have things in your life that provide plenty of gratification, so don't get caught substituting it with impulse buys. Always make sure you keep yourself happy with plenty of time doing the things you like to do and you won't be subconsciously trying to fill that void with useless crap.</p>
- <h3 data-textannotation-id="aed9b435c4ed23e573c453ceeb34ed18"><strong>Turn the Money You Save Into More Money</strong></h3>
- <p data-textannotation-id="21154394d63f1943d01f2b717aa31115" class="has-media media-640"><span class="img-border"><img width="636" height="358" data-format="jpg" data-asset-url="http://i.kinja-img.com/gawker-media/image/upload/s--4Ajak63w--/atb9qm07fvvg7hqkumkw.jpg" data-chomp-id="atb9qm07fvvg7hqkumkw" alt="How to Program Your Mind to Stop Buying Crap You Don’t Need" src="http://i.kinja-img.com/gawker-media/image/upload/s--4Ajak63w--/atb9qm07fvvg7hqkumkw.jpg"/></span></p>
- <p data-textannotation-id="6141942e977cc058fd7a0fa06a3f7389">Once you've programmed your mind to stop buying crap you don't need, you'll have some extra cash to play with. Take all that money and start putting it toward your future and things you <em>will</em> need further down the road. You might need <a target="_blank" href="http://twocents.lifehacker.com/how-to-start-saving-for-a-home-down-payment-1541254056">a home</a>, a vehicle, or a way to retire, but none of that can happen until you start planning for it. </p>
- <p data-textannotation-id="90f08afddc08e2c3b45c266f2e6965ec">Start by paying off any debts you already have. Credit cards, student loans, and even car payments can force you to <a href="http://lifehacker.com/how-to-break-the-living-paycheck-to-paycheck-cycle-1445330680">live paycheck to paycheck</a>. Use the <a href="http://lifehacker.com/5940989/pay-off-small-balances-first-for-better-odds-of-eliminating-all-your-debt">snowball method</a> and pay off some small balances to make you feel motivated, then start taking out your debt in full force with the <a href="http://lifehacker.com/how-to-pay-off-your-debt-using-the-stack-method-576070292">stacking method</a>: stop creating new debt, determine which balances have the highest interest rates, and create a payment schedule to pay them off efficiently.</p>
- <p data-textannotation-id="1106cb837deb2b6fc8e28ba98f078c27">With your debts whittled down, you should start an emergency fund. No matter how well you plan things, accidents and health emergencies can still happen. An emergency fund is designed to make those kinds of events more manageable. This type of savings account is strictly for when life throws you a curveball, but you can grow one pretty easily <a target="_blank" href="http://twocents.lifehacker.com/how-to-grow-an-emergency-fund-from-modest-savings-1638409351">with only modest savings</a>.</p>
- <p data-textannotation-id="347c2a36f114a794d559d929da1b15b7">When you've paid off your debt and prepared yourself for troubled times, you can start saving for the big stuff. All that money you're not spending on crap anymore can be saved, invested, and compounded to let you buy comfort and security. If you don't know where to start, talk to a financial planner. Or create a simple, yet effective <a target="_blank" href="http://twocents.lifehacker.com/how-to-build-an-easy-beginner-set-and-forget-investm-1686878594" x-inset="1">"set and forget" investment portfolio</a>. You've worked hard to reprogram your mind, so make sure you reap the benefits for many years to come.</p>
- <aside class="referenced-wide referenced-fullwidth js_inset tmpl_referencedGroupFullWidth clearfix core-decorated-inset"> </aside>
- <p data-textannotation-id="b54d87ffdace50f420c3a6ff0404cbf3"><em><small>Photos by <a target="_blank" href="http://www.shutterstock.com/pic-129762989/stock-vector-consumer.html?src=id&amp;ws=1">cmgirl</a> (Shutterstock), <a target="_blank" href="http://www.shutterstock.com/pic-227832739/stock-vector-hacker-icon-man-in-hoody-with-laptop-flat-isolated-on-dark-background-vector-illustration.html?src=id&amp;ws=1">Macrovector</a> (Shutterstock), <a target="_blank" href="https://www.flickr.com/photos/jetheriot/6186786217">J E Theriot</a>, <a target="_blank" href="https://www.flickr.com/photos/puuikibeach/15289861843">davidd</a>, <a target="_blank" href="https://www.flickr.com/photos/funfilledgeorgie/10922459733">George Redgrave</a>, <a target="_blank" href="https://www.flickr.com/photos/amslerpix/7252002214">David Amsler</a>, <a target="_blank" href="https://www.flickr.com/photos/amalakar/7299820870">Arup Malakar</a>, <a target="_blank" href="https://www.flickr.com/photos/lobsterstew/89644885">J B</a>, <a target="_blank" href="https://www.flickr.com/photos/jakerome/3298702453">jakerome</a>, <a target="_blank" href="http://401kcalculator.org/">401(K) 2012</a>.</small></em></p> \ No newline at end of file
+<div class="post-content entry-content "><p class="has-media media-640" data-textannotation-id="58a492029dca5e6a6e481d21b6b2933a"><span class="img-border"><img alt="How to Program Your Mind to Stop Buying Crap You Don’t Need" data-asset-url="http://i.kinja-img.com/gawker-media/image/upload/s--hqqO9fze--/n1s6c2m6kc07iqdyllj6.jpg" data-chomp-id="n1s6c2m6kc07iqdyllj6" data-format="jpg" height="358" src="http://i.kinja-img.com/gawker-media/image/upload/s--hqqO9fze--/n1s6c2m6kc07iqdyllj6.jpg" width="636"></img></span></p><p class="first-text" data-textannotation-id="a043044f9b3e31fd85568b17e3b1b5f3"><span>We all buy things from time to time that we don't really need. It's okay to appeal to your wants every once in a while, as long as you're in control. If you struggle with clutter, impulse buys, and buyer's remorse, here's how to put your mind in the right place before you even set foot in a store.</span></p>
+
+
+
+
+
+
+
+
+
+
+
+<h3 data-textannotation-id="e51cbbc52eb8c3b33571908351076cf7"><strong>Understand How Your Own Brain Works Against You</strong></h3>
+
+
+
+
+
+
+
+
+
+
+<p class="has-media media-640" data-textannotation-id="268f7702467d33e3b0972dd09f1cf0a6"><span class="img-border"><img alt="How to Program Your Mind to Stop Buying Crap You Don’t Need" data-asset-url="http://i.kinja-img.com/gawker-media/image/upload/s--QeUTCiuW--/o4dpyrcbiqyfrc3bxx6p.jpg" data-chomp-id="o4dpyrcbiqyfrc3bxx6p" data-format="jpg" height="358" src="http://i.kinja-img.com/gawker-media/image/upload/s--QeUTCiuW--/o4dpyrcbiqyfrc3bxx6p.jpg" width="636"></img></span></p>
+
+
+
+
+
+
+
+
+
+
+<p data-textannotation-id="32604538f84919efff270e87b61191a1">It may come as no surprise to learn that stores employ all kinds of tricks to get you to part ways with your cash, and your brain plays right along. Through psychological tricks, product placement, and even color, stores are designed from the ground up to increase spending. We've talked about the biggest things stores do to manipulate your senses, but here are some of the biggest things to look out for:</p>
+
+
+
+
+
+
+
+
+
+
+<ul><li data-textannotation-id="cd748c8b681c781cdd728c5e17b5e05f"><strong>Color:</strong> Stores use color to make products attractive and eye-catching, but they also use color on price labels. Red stands out and can encourage taking action, that's why it's commonly associated with sale signage and advertising. When you see red, remember what they're trying to do to your brain with that color. You don't to buy something just because it's on sale.</li><li data-textannotation-id="29c11c0aec305293be282aa91f8fbc3d"><strong>Navigation Roadblocks:</strong> Stores force you to walk around stuff you don't need to find the stuff you are really after. Have a list of what you need before you go in, go straight to it, and imagine it's the only item in the store.</li><li data-textannotation-id="252dc7e4a924d12c2d913861ab118bf5"><strong>The Touch Factor:</strong> Stores place items they want to sell in easy to reach locations and encourage you to touch them. Don't do it! As soon as you pick something up, you're more likely to buy it because your mind suddenly takes ownership of the object. Don't pick anything up and don't play with display items.</li><li data-textannotation-id="05dde4d44056798acff5890759134a64"><strong>Scents and Sounds:</strong> You'll probably hear classic, upbeat tunes when you walk into a store. The upbeat music makes you happy and excited, while playing familiar songs makes you feel comfortable. They also use pleasant smells to put your mind at ease. A happy, comfortable mind at ease is a dangerous combination for your brain when shopping. There's not much you can do to avoid this unless you shop online, but it's good to be aware of it.</li></ul><p data-textannotation-id="1eb4a4df2a670927c5d9e9641ebf9d40">And sure, we can blame the stores all we want, but you won't change how they operate—you can only be aware of how your <a href="http://lifehacker.com/how-stores-manipulate-your-senses-so-you-spend-more-mon-475987594" x-inset="1">brain is falling for their tricks</a>. Even without the stores, <a href="http://lifehacker.com/5968125/how-your-brain-corrupts-your-shopping-choices" x-inset="1">your brain is working against you on its own</a>, thanks to some simple cognitive biases.</p>
+
+
+
+
+
+
+
+
+
+
+
+
+<aside class="referenced-wide referenced-fullwidth js_inset tmpl_referencedGroupFullWidth clearfix core-decorated-inset">
+</aside><p data-textannotation-id="89992f1ca493b248eea6ed1772326c46">For example, confirmation bias makes you only believe the information that conforms to your prior beliefs, while you discount everything else. Advertisers appeal to this bias directly by convincing you one item is better than another with imagery and other tricks, regardless of what hard facts might say. Keep your mind open, do your own research, and accept when you're wrong about a product. The Decoy effect is also a commonly used tactic. You think one product is a deal because it's next to a similar product that's priced way higher. Even if it's a product you need, it's probably not as good of a deal as it looks right then and there. Again, always research beforehand and be on the lookout for this common trick to avoid impulse buys.</p>
+
+
+
+
+
+
+
+
+
+
+<h3 data-textannotation-id="eedde8c384145f2593efc2a15a4d79de"><strong>Make a List of </strong><em><strong>Everything</strong></em><strong> You Own and Do Some Decluttering</strong></h3>
+
+
+
+
+
+
+
+
+
+
+<p class="has-media media-640" data-textannotation-id="8044cf9aab698fd28931acd90ba96f7a"><span class="img-border"><img alt="How to Program Your Mind to Stop Buying Crap You Don’t Need" data-asset-url="http://i.kinja-img.com/gawker-media/image/upload/s--mlR3Ku0_--/xrhkwleyurcizy4akiae.jpg" data-chomp-id="xrhkwleyurcizy4akiae" data-format="jpg" height="358" src="http://i.kinja-img.com/gawker-media/image/upload/s--mlR3Ku0_--/xrhkwleyurcizy4akiae.jpg" width="636"></img></span></p>
+
+
+
+
+
+
+
+
+
+
+<p data-textannotation-id="a2a886d841e5aed848cdf7088edde4ea">Now that you know what you're up against, it's time to start changing the way you think. Before you can stop buying crap you don't need, you need to identify what that crap is. The first step is to make a list of <a href="http://lifehacker.com/how-to-defeat-the-urge-to-binge-shop-1468216943" x-inset="1">every single thing you own</a>. <strong>Every. Single. Thing</strong>. This might sound extreme, but you need to gather your data so you can start reprogramming your mind.</p>
+
+
+
+
+
+
+
+
+
+
+
+
+<aside class="referenced-wide referenced-fullwidth js_inset tmpl_referencedGroupFullWidth clearfix core-decorated-inset">
+</aside><p data-textannotation-id="bbe57b7aa20b48550e5f66b7c530822c">The purpose of this exercise is twofold: you see what you already have and don't need to ever buy again, and you get to see what you shouldn't have bought in the first place. As you list everything out, separate items into categories. It's extremely important that you are as honest with yourself as possible while you do this. It's also important you actually write this all down or type it all out. Here is the first set of categories to separate everything into:</p>
+
+
+
+
+
+
+
+
+
+
+<ul><li data-textannotation-id="8d7dc912152eddd0e3d56e28ad79e6f2"><strong>Need:</strong> You absolutely need this item to get by on a day to day basis.</li><li data-textannotation-id="6f60a79627f0746d1f611999251e9f1b"><strong>Sometimes Need:</strong> You don't need this item every day, but you use it on a somewhat regular basis.</li><li data-textannotation-id="54e10b108f95548966b657bd90fdbed4"><strong>Want:</strong> You bought this item because you wanted it, not because you needed it.</li><li data-textannotation-id="26c461a85fbc78651be442e205cac58b"><strong>Crap:</strong> You don't have a good reason why you have it and you already know it needs to go (there's probably a few of these items, at least).</li></ul><p data-textannotation-id="5743cf753f68fd8ee3443cc0f8e815dd">Leave the things you listed as "needs" alone, put your stuff listed as "crap" in a pile or box to go bye-bye, and move your attention back to your "sometimes need" and "want" lists. You need to go back over both of those lists because you probably fudged some of the listings, either subconsciously or intentionally. Now ask yourself these three questions as you go through both the "sometimes need" and "want" lists:</p>
+
+
+
+
+
+
+
+
+
+
+<ul><li data-textannotation-id="2048d6c0436bd34811442d6df32989a4">When was the last time I used this?</li><li data-textannotation-id="3f4b3686d822171b35e27bf1afde530b">When will I use this again?</li><li data-textannotation-id="63728605cc4fa66f5b225f674d12bbff">Does this item <a href="http://lifehacker.com/declutter-by-asking-one-question-does-this-spark-joy-1651256422">bring you joy</a>?</li></ul><p data-textannotation-id="816cd504161fecc6f3e173779b33d5db">Remember to be honest and adjust your lists accordingly. There's nothing wrong with keeping things you wanted. Material items can <a href="http://lifehacker.com/how-to-buy-happiness-the-purchases-most-likely-to-brin-1681780686">bring happiness to many people</a>, but make sure the items on your "want" list actively provide you joy and are being used. If an item doesn't get much use or doesn't make you happy, add it to the "crap" list.</p>
+
+
+
+
+
+
+
+
+
+
+<p data-textannotation-id="675103d9c0da55e95f93c53bb019f864">Once you have everything organized, it's time to do some serious decluttering. This listing exercise should get you started, but there are <a href="http://lifehacker.com/5957609/how-to-kick-your-clutter-habit-and-live-in-a-clean-house-once-and-for-all">a lot of other great ideas</a> when it comes to ditching the junk you don't need. Regardless, everything on your "crap" list needs to go. You can donate it, sell it at a yard sale, give it away to people know, whatever you like. Before you get rid of everything, though, take a picture of all your stuff together. Print out or save the picture somewhere. Some of it was probably gifts, but in general, this is all the crap you bought that you don't need. Take a good look and remember it.</p>
+
+
+
+
+
+
+
+
+
+
+<h3 data-textannotation-id="f15ab0a628b159459f095f04fef851ba"><strong>See How Much Money and Time You Spent on the Stuff You Threw Out</strong></h3>
+
+
+
+
+
+
+
+
+
+
+<p class="has-media media-640" data-textannotation-id="bc2f55587bf4ab07a1852a8d26217233"><span class="img-border"><img alt="How to Program Your Mind to Stop Buying Crap You Don’t Need" data-asset-url="http://i.kinja-img.com/gawker-media/image/upload/s--Tacb0tyW--/qodag11euf2npkawkn9v.jpg" data-chomp-id="qodag11euf2npkawkn9v" data-format="jpg" height="358" src="http://i.kinja-img.com/gawker-media/image/upload/s--Tacb0tyW--/qodag11euf2npkawkn9v.jpg" width="636"></img></span></p>
+
+
+
+
+
+
+
+
+
+
+<p data-textannotation-id="95ab4fe30c3ade42a8011966ea54aa0b">Now take a look at your "crap" list again and start calculating how much you spent on all of it. If it was a gift, mark it as $0. Otherwise, figure out the price of the item at the time you bought it. If you got a deal or bought it on sale it's okay to factor that in, but try to be as accurate as possible. Once you have the price for each item, add it all together. Depending on your spending habits this could possibly be in the hundreds to thousands of dollars. Remember the picture you took of all this stuff? Attach the total cost to the picture so you can see both at the same time.</p>
+
+
+
+
+
+
+
+
+
+
+<p data-textannotation-id="f654efec679064b15826d8ee20bc94e4">With the money cost figured out, you should take a look at the other costs too. Time is a resource just like any other, and it's a finite one. What kind of time did you pour into these things? Consider the time you spent acquiring and using these items, then write it all down. These can be rough estimations, but go ahead and add it all up when you think you've got it. Now attach the total time to same picture as before and think of the other ways you could have spent all that time. This isn't to make you feel bad about yourself, just to deliver information to your brain in an easy-to-understand form. When you look at it all like this, it can open your eyes a little more, and help you think about purchases in the future. You'll look at an item and ask yourself, "Will this just end up in the picture?"</p>
+
+
+
+
+
+
+
+
+
+
+<h3 data-textannotation-id="6342bf7f15d9eddd21489c23e51ca434"><strong>List Every Non-Material Thing In Your Life that Makes You Happy</strong></h3>
+
+
+
+
+
+
+
+
+
+
+<p class="has-media media-640" data-textannotation-id="bafeac1c3808e0d2900190979f058b2c"><span class="img-border"><img alt="How to Program Your Mind to Stop Buying Crap You Don’t Need" data-asset-url="http://i.kinja-img.com/gawker-media/image/upload/s--x9hLbIKJ--/imfc9ybqfw0jmztbhfrh.jpg" data-chomp-id="imfc9ybqfw0jmztbhfrh" data-format="jpg" height="358" src="http://i.kinja-img.com/gawker-media/image/upload/s--x9hLbIKJ--/imfc9ybqfw0jmztbhfrh.jpg" width="636"></img></span></p>
+
+
+
+
+
+
+
+
+
+
+<p data-textannotation-id="4bd8fbaabb33ff1cb5dc93c16e1f83cc">Now it's time to make a different list. While material items may bring plenty of joy, the things in your life that make you happiest probably can't be bought. Get a separate piece of paper or create a new document and list out everything in your life that makes you happy. If you can't buy it, it's eligible for the list. It doesn't matter if it only makes you crack a smile or makes you jump for joy, list it out. </p>
+
+
+
+
+
+
+
+
+
+
+<p data-textannotation-id="104a646a62ad7a0cfb4e3ff086185fdc"><span>These are probably the things that actually make you want to get out of bed in the morning and keep on keepin' on. Once you have it all down, put it in your purse or wallet. The next time you feel the urge to buy something, whip this list out first and remind yourself why you probably don't need it.</span></p>
+
+
+
+
+
+
+
+
+
+
+<h3 data-textannotation-id="532cf992ff45d52de501c1a8f80fc152"><strong>Spend Some Time Away from Material Things to Gain Perspective</strong></h3>
+
+
+
+
+
+
+
+
+
+
+<p class="has-media media-640" data-textannotation-id="64f5c7155ad89bd2835399d33c1ae28a"><span class="img-border"><img alt="How to Program Your Mind to Stop Buying Crap You Don’t Need" data-asset-url="http://i.kinja-img.com/gawker-media/image/upload/s--6NwBgQLy--/afy7n45jfvsjdmmhonct.jpg" data-chomp-id="afy7n45jfvsjdmmhonct" data-format="jpg" height="358" src="http://i.kinja-img.com/gawker-media/image/upload/s--6NwBgQLy--/afy7n45jfvsjdmmhonct.jpg" width="636"></img></span></p>
+
+
+
+
+
+
+
+
+
+
+<p data-textannotation-id="84554492c487779e921b98fb64222177">If you're having a really hard time with your spending, it can help to get away from material objects completely. When you're constantly surrounded by stuff and have access to buying things at all times, it can be really tough to break the habit. Spend a day in the park enjoying the sights and sounds of the outdoors, go camping with some friends, or hike a trail you haven't been on before. </p>
+
+
+
+
+
+
+
+
+
+
+<p data-textannotation-id="b44add1c7b690705d672186e3a9604b6">Essentially, you want to show yourself that you don't need your "things" to have a good time. When you realize how much fun you can have without all the trinkets and trivets, you'll start to shut down your desire to buy them. If you can't get really get away right now, just go for a walk without your purse or wallet (but carry your ID). If you can't buy anything, you'll be forced to experience things a different way.</p>
+
+
+
+
+
+
+
+
+
+
+<h3 data-textannotation-id="98c11bebae0bbcdbe8411df0186d6465"><strong>Develop a Personal "Should I Buy This?" Test</strong></h3>
+
+
+
+
+
+
+
+
+
+
+<p class="has-media media-640" data-textannotation-id="ff438b878771354bb7f6d065ff50dbb2"><span class="img-border"><img alt="How to Program Your Mind to Stop Buying Crap You Don’t Need" data-asset-url="http://i.kinja-img.com/gawker-media/image/upload/s--ciqk42G0--/s3pq8vjrvyjgne4lfsod.jpg" data-chomp-id="s3pq8vjrvyjgne4lfsod" data-format="jpg" height="358" src="http://i.kinja-img.com/gawker-media/image/upload/s--ciqk42G0--/s3pq8vjrvyjgne4lfsod.jpg" width="636"></img></span></p>
+
+
+
+
+
+
+
+
+
+
+<p data-textannotation-id="4af04ae83f18d9c37da21527bcd4a290">If you don't have a personal "should I buy this?" test, now's the perfect time to make one. When you find an item you think you need or want, it has to pass all of the questions you have on your test before you can buy it. Here's where you can use all of the data you've gathered so far and put it to really good use. The test should be personalized to your own buying habits, but here are some example questions:</p>
+
+
+
+
+
+
+
+
+
+
+<ul><li data-textannotation-id="fcfd78b1619bdf0b7330f4b40efb899d">Is this a planned purchase?</li><li data-textannotation-id="c16e7d5feae7cc2c3c6a8dd312ea206f">Will it end up in the "crap" list picture one day?</li><li data-textannotation-id="54d877fdee56080c87508fc9e6402889"><a href="http://lifehacker.com/prevent-clutter-by-asking-yourself-where-items-will-go-1649480461">Where am I going to put it</a>?</li><li data-textannotation-id="59d5245217c84e6b2b2969b3492f2f2d">Have I included this in my budget?</li><li data-textannotation-id="8fe1582808b4d89f5c88c2708744d27d"><em>Why</em> do I want/need it?</li></ul><p data-textannotation-id="0162d779382cdc7de908fc1488af3940">Custom build your test to hit all of your weaknesses. If you make a lot of impulse buys, include questions that address that. If you experience a lot of buyer's remorse, include a lot of questions that make you think about the use of item after you buy it. If buying the latest and greatest technology is your weakness, Joshua Becker at Becoming Minimalist suggests you ask yourself <a href="http://www.becomingminimalist.com/marriage-hacks/" target="_blank">what problem the piece of tech solves</a>. If you can't think of anything it solves or if you already have something that solves it, you don't need it. Be thorough and build a test that you can run through your mind every time you consider buying something.</p>
+
+
+
+
+
+
+
+
+
+
+<h3 data-textannotation-id="c0ed0882675acc340dcd88e13ca514b3"><strong>Learn to Delay Gratification and Destroy the Urge to Impulse Buy</strong></h3>
+
+
+
+
+
+
+
+
+
+
+<p class="has-media media-640" data-textannotation-id="1d43712fc5ce8f156e4661cca5750575"><span class="img-border"><img alt="How to Program Your Mind to Stop Buying Crap You Don’t Need" data-asset-url="http://i.kinja-img.com/gawker-media/image/upload/s--mtob1sjR--/y2ldv5eufb3jcrtfouye.jpg" data-chomp-id="y2ldv5eufb3jcrtfouye" data-format="jpg" height="358" src="http://i.kinja-img.com/gawker-media/image/upload/s--mtob1sjR--/y2ldv5eufb3jcrtfouye.jpg" width="636"></img></span></p>
+
+
+
+
+
+
+
+
+
+
+<p data-textannotation-id="3d8086719c5da749f877629d498ccab9">When it comes to the unnecessary crap we buy, impulse purchases probably make up a good deal of them. We love to feel gratification instantly and impulse buys appeal to that with a rush of excitement with each new purchase. We like to believe that we have control over our impulses all the time, but we really don't, and that's a major problem for the ol' wallet.</p>
+
+
+
+
+
+
+
+
+
+
+<p data-textannotation-id="620ca9836425e09ec7fa50bfad204665">The key is teaching your brain that it's okay to <a href="http://lifehacker.com/overcome-the-need-for-instant-gratification-by-delaying-1636938356">wait for gratification</a>. You can do this with a simple time out every time you want something. Look at whatever you're thinking of buying, go through your personal "should I buy this?" test, and then walk away for a little while. Planning your purchases ahead is ideal, so the longer you can hold off, the better. Set yourself a reminder to check on the item <a href="http://lifehacker.com/5859632/buyers-remorse-is-inevitable-how-to-make-purchases-you-really-wont-regret">a week or month down the line</a>. When you come back to it, you may find that you don't even want it, just the gratification that would come with it. If you're shopping online, you can do the same thing. Walk away from your desk or put your phone in your pocket and do something else for a little while.</p>
+
+
+
+
+
+
+
+
+
+
+<p data-textannotation-id="a85d9eb501c898234ac5df2a56c50a13">You can also avoid online impulse purchases by <a href="http://lifehacker.com/5919833/how-to-avoid-impulse-purchases-in-the-internet-shopping-age" x-inset="1">making it harder to do</a>. Block shopping web sites during time periods you know you're at your weakest, or remove all of your saved credit card or Paypal information. You can also <a href="http://lifehacker.com/5569035/practice-the-halt-method-to-curb-impulse-purchases" x-inset="1">practice the "HALT" method</a> when you're shopping online or in a store. Try not to buy things when you're Hungry, Angry, Lonely, or Tired because you're at your weakest state mentally. Last, but not least, the "<a href="http://lifehacker.com/5320196/use-the-stranger-test-to-reduce-impulse-purchases" x-inset="1">stranger test</a>" can help you weed out bad purchases too.</p>
+
+
+
+
+
+
+
+
+
+
+
+
+<aside class="referenced-wide referenced-fullwidth js_inset tmpl_referencedGroupFullWidth clearfix core-decorated-inset">
+</aside><p data-textannotation-id="27385752c06848647540ad931892b21e">The last thing you should consider when it comes to impulse buys is "artificial replacement." As Trent Hamm at The Simple Dollar explains, artificial replacement can happen when you start to <a href="http://www.thesimpledollar.com/balancing-spending-and-time-how-time-frugality-can-save-you-lots-of-cash/" target="_blank">reduce the time</a> you get with your main interests:</p>
+
+
+
+
+
+
+
+
+
+
+<blockquote data-textannotation-id="213e2e816ac88f8d177fb0db0f7fef09">
+<p data-textannotation-id="7b98c5809df24dd04bb65285878c0335">Whenever I consistently cut quality time for my main interests out of my life, I start to long for them. As you saw in that "typical" day, I do make room for spending time with my family, but my other two main interests are absent. If that happens too many days in a row, I start to really miss reading. I start to really miss playing thoughtful board games with friends. What happens after that? <strong>I start to substitute.</strong> When I don't have the opportunity to sit down for an hour or even for half an hour and really get lost in a book, I start looking for an alternative way to fill in the tiny slices of time that I do have. I'll spend money.</p></blockquote>
+
+
+
+
+
+
+
+
+
+
+<p data-textannotation-id="4b6cc2900ffacd3daef54b13b4caceac">You probably have things in your life that provide plenty of gratification, so don't get caught substituting it with impulse buys. Always make sure you keep yourself happy with plenty of time doing the things you like to do and you won't be subconsciously trying to fill that void with useless crap.</p>
+
+
+
+
+
+
+
+
+
+
+<h3 data-textannotation-id="aed9b435c4ed23e573c453ceeb34ed18"><strong>Turn the Money You Save Into More Money</strong></h3>
+
+
+
+
+
+
+
+
+
+
+<p class="has-media media-640" data-textannotation-id="21154394d63f1943d01f2b717aa31115"><span class="img-border"><img alt="How to Program Your Mind to Stop Buying Crap You Don’t Need" data-asset-url="http://i.kinja-img.com/gawker-media/image/upload/s--4Ajak63w--/atb9qm07fvvg7hqkumkw.jpg" data-chomp-id="atb9qm07fvvg7hqkumkw" data-format="jpg" height="358" src="http://i.kinja-img.com/gawker-media/image/upload/s--4Ajak63w--/atb9qm07fvvg7hqkumkw.jpg" width="636"></img></span></p>
+
+
+
+
+
+
+
+
+
+
+<p data-textannotation-id="6141942e977cc058fd7a0fa06a3f7389">Once you've programmed your mind to stop buying crap you don't need, you'll have some extra cash to play with. Take all that money and start putting it toward your future and things you <em>will</em> need further down the road. You might need <a href="http://twocents.lifehacker.com/how-to-start-saving-for-a-home-down-payment-1541254056" target="_blank">a home</a>, a vehicle, or a way to retire, but none of that can happen until you start planning for it. </p>
+
+
+
+
+
+
+
+
+
+
+<p data-textannotation-id="90f08afddc08e2c3b45c266f2e6965ec">Start by paying off any debts you already have. Credit cards, student loans, and even car payments can force you to <a href="http://lifehacker.com/how-to-break-the-living-paycheck-to-paycheck-cycle-1445330680">live paycheck to paycheck</a>. Use the <a href="http://lifehacker.com/5940989/pay-off-small-balances-first-for-better-odds-of-eliminating-all-your-debt">snowball method</a> and pay off some small balances to make you feel motivated, then start taking out your debt in full force with the <a href="http://lifehacker.com/how-to-pay-off-your-debt-using-the-stack-method-576070292">stacking method</a>: stop creating new debt, determine which balances have the highest interest rates, and create a payment schedule to pay them off efficiently.</p>
+
+
+
+
+
+
+
+
+
+
+<p data-textannotation-id="1106cb837deb2b6fc8e28ba98f078c27">With your debts whittled down, you should start an emergency fund. No matter how well you plan things, accidents and health emergencies can still happen. An emergency fund is designed to make those kinds of events more manageable. This type of savings account is strictly for when life throws you a curveball, but you can grow one pretty easily <a href="http://twocents.lifehacker.com/how-to-grow-an-emergency-fund-from-modest-savings-1638409351" target="_blank">with only modest savings</a>.</p>
+
+
+
+
+
+
+
+
+
+
+<p data-textannotation-id="347c2a36f114a794d559d929da1b15b7">When you've paid off your debt and prepared yourself for troubled times, you can start saving for the big stuff. All that money you're not spending on crap anymore can be saved, invested, and compounded to let you buy comfort and security. If you don't know where to start, talk to a financial planner. Or create a simple, yet effective <a href="http://twocents.lifehacker.com/how-to-build-an-easy-beginner-set-and-forget-investm-1686878594" target="_blank" x-inset="1">"set and forget" investment portfolio</a>. You've worked hard to reprogram your mind, so make sure you reap the benefits for many years to come.</p>
+
+
+
+
+
+
+
+
+
+
+
+
+<aside class="referenced-wide referenced-fullwidth js_inset tmpl_referencedGroupFullWidth clearfix core-decorated-inset">
+</aside><p data-textannotation-id="b54d87ffdace50f420c3a6ff0404cbf3"><em><small>Photos by <a href="http://www.shutterstock.com/pic-129762989/stock-vector-consumer.html?src=id&amp;ws=1" target="_blank">cmgirl</a> (Shutterstock), <a href="http://www.shutterstock.com/pic-227832739/stock-vector-hacker-icon-man-in-hoody-with-laptop-flat-isolated-on-dark-background-vector-illustration.html?src=id&amp;ws=1" target="_blank">Macrovector</a> (Shutterstock), <a href="https://www.flickr.com/photos/jetheriot/6186786217" target="_blank">J E Theriot</a>, <a href="https://www.flickr.com/photos/puuikibeach/15289861843" target="_blank">davidd</a>, <a href="https://www.flickr.com/photos/funfilledgeorgie/10922459733" target="_blank">George Redgrave</a>, <a href="https://www.flickr.com/photos/amslerpix/7252002214" target="_blank">David Amsler</a>, <a href="https://www.flickr.com/photos/amalakar/7299820870" target="_blank">Arup Malakar</a>, <a href="https://www.flickr.com/photos/lobsterstew/89644885" target="_blank">J B</a>, <a href="https://www.flickr.com/photos/jakerome/3298702453" target="_blank">jakerome</a>, <a href="http://401kcalculator.org/" target="_blank">401(K) 2012</a>.</small></em></p></div> \ No newline at end of file
diff --git a/test/test-pages/medium-1/expected.html b/test/test-pages/medium-1/expected.html
index d0ef17d..44ca7f0 100644
--- a/test/test-pages/medium-1/expected.html
+++ b/test/test-pages/medium-1/expected.html
@@ -1,119 +1,290 @@
- <div class="section-inner layoutSingleColumn">
- <h4 name="425a" id="425a" data-align="center" class="graf--h4"><em class="markup--em markup--h4-em">Better Student Journalism</em></h4>
- <h4 name="08db" id="08db" class="graf--h4 graf--empty"><br/></h4>
- <p name="d178" id="d178" class="graf--p">We pushed out the first version of the <a href="http://pippinlee.github.io/open-journalism-project/" data-href="http://pippinlee.github.io/open-journalism-project/" class="markup--anchor markup--p-anchor" rel="nofollow">Open Journalism site</a> in January. Our goal is for the site to be a place to teach students what they should know about journalism on the web. It should be fun too.</p>
- <p name="01ed" id="01ed" class="graf--p">Topics like <a href="http://pippinlee.github.io/open-journalism-project/Mapping/" data-href="http://pippinlee.github.io/open-journalism-project/Mapping/" class="markup--anchor markup--p-anchor" rel="nofollow">mapping</a>, <a href="http://pippinlee.github.io/open-journalism-project/Security/" data-href="http://pippinlee.github.io/open-journalism-project/Security/" class="markup--anchor markup--p-anchor" rel="nofollow">security</a>, command line tools, and <a href="http://pippinlee.github.io/open-journalism-project/Open-source/" data-href="http://pippinlee.github.io/open-journalism-project/Open-source/" class="markup--anchor markup--p-anchor" rel="nofollow">open source</a> are all concepts that should be made more accessible, and should be easily understood at a basic level by all journalists. We’re focusing on students because we know student journalism well, and we believe that teaching maturing journalists about the web will provide them with an important lens to view the world with. This is how we got to where we are now.</p>
- <h3 name="0348" id="0348" class="graf--h3">Circa 2011</h3>
- <p name="f923" id="f923" class="graf--p">In late 2011 I sat in the design room of our university’s student newsroom with some of the other editors: Kate Hudson, Brent Rose, and Nicholas Maronese. I was working as the photo editor then—something I loved doing. I was very happy travelling and photographing people while listening to their stories.</p>
- <p name="c9d4" id="c9d4" class="graf--p">Photography was my lucky way of experiencing the many types of people my generation seemed to avoid, as well as many the public spends too much time discussing. One of my habits as a photographer was scouring sites like Flickr to see how others could frame the world in ways I hadn’t previously considered.</p>
- <figure name="06e8" id="06e8" class="graf--figure">
- <div class="aspectRatioPlaceholder is-locked"><img class="graf-image" data-image-id="1*AzYWbe4cZkMMEUbfRjysLQ.png" data-width="1000" data-height="500" data-action="zoom" data-action-value="1*AzYWbe4cZkMMEUbfRjysLQ.png" src="https://d262ilb51hltx0.cloudfront.net/max/800/1*AzYWbe4cZkMMEUbfRjysLQ.png"/></div>
- <figcaption class="imageCaption">topleftpixel.com</figcaption>
- </figure>
- <p name="930f" id="930f" class="graf--p">I started discovering beautiful things the <a href="http://wvs.topleftpixel.com/13/02/06/timelapse-strips-homewood.htm" data-href="http://wvs.topleftpixel.com/13/02/06/timelapse-strips-homewood.htm" class="markup--anchor markup--p-anchor" rel="nofollow">web could do with images</a>: things not possible with print. Just as every generation revolts against walking in the previous generations shoes, I found myself questioning the expectations that I came up against as a photo editor. In our newsroom the expectations were built from an outdated information world. We were expected to fill old shoes.</p>
- <p name="2674" id="2674" class="graf--p">So we sat in our student newsroom—not very happy with what we were doing. Our weekly newspaper had remained essentially unchanged for 40+ years. Each editorial position had the same requirement every year. The <em class="markup--em markup--p-em">big</em> change happened in the 80s when the paper started using colour. We’d also stumbled into having a website, but it was updated just once a week with the release of the newspaper.</p>
- <p name="e498" id="e498" class="graf--p">Information had changed form, but the student newsroom hadn’t, and it was becoming harder to romanticize the dusty newsprint smell coming from the shoes we were handed down from previous generations of editors. It was, we were told, all part of “becoming a journalist.”</p>
- <figure name="12da" id="12da" class="graf--figure">
- <div class="aspectRatioPlaceholder is-locked"><img class="graf-image" data-image-id="1*d0Hp6KlzyIcGHcL6to1sYQ.png" data-width="868" data-height="451" data-action="zoom" data-action-value="1*d0Hp6KlzyIcGHcL6to1sYQ.png" src="https://d262ilb51hltx0.cloudfront.net/max/800/1*d0Hp6KlzyIcGHcL6to1sYQ.png"/></div>
- </figure>
- <h3 name="e2f0" id="e2f0" class="graf--h3">We don’t know what we don’t know</h3>
- <p name="8263" id="8263" class="graf--p">We spent much of the rest of the school year asking “what should we be doing in the newsroom?”, which mainly led us to ask “how do we use the web to tell stories?” It was a straightforward question that led to many more questions about the web: something we knew little about. Out in the real world, traditional journalists were struggling to keep their jobs in a dying print world. They wore the same design of shoes that we were supposed to fill. Being pushed to repeat old, failing strategies and blocked from trying something new scared us.</p>
- <p name="231e" id="231e" class="graf--p">We had questions, so we started doing some research. We talked with student newsrooms in Canada and the United States, and filled too many Google Doc files with notes. Looking at the notes now, they scream of fear. We annotated our notes with naive solutions, often involving scrambled and immature odysseys into the future of online journalism.</p>
- <p name="6ec3" id="6ec3" class="graf--p">There was a lot we didn’t know. We didn’t know <strong class="markup--strong markup--p-strong">how to build a mobile app</strong>. We didn’t know <strong class="markup--strong markup--p-strong">if we should build a mobile app</strong>. We didn’t know <strong class="markup--strong markup--p-strong">how to run a server</strong>. We didn’t know <strong class="markup--strong markup--p-strong">where to go to find a server</strong>. We didn’t know <strong class="markup--strong markup--p-strong">how the web worked</strong>. We didn’t know <strong class="markup--strong markup--p-strong">how people used the web to read news</strong>. We didn’t know <strong class="markup--strong markup--p-strong">what news should be on the web</strong>. If news is just information, what does that even look like?</p>
- <p name="f373" id="f373" class="graf--p">We asked these questions to many students at other papers to get a consensus of what had worked and what hadn’t. They reported similar questions and fears about the web but followed with “print advertising is keeping us afloat so we can’t abandon it”.</p>
- <p name="034b" id="034b" class="graf--p">In other words, we knew that we should be building a newer pair of shoes, but we didn’t know what the function of the shoes should be.</p>
- <h3 name="ea15" id="ea15" class="graf--h3">Common problems in student newsrooms (2011)</h3>
- <p name="a90b" id="a90b" class="graf--p">Our questioning of other student journalists in 15 student newsrooms brought up a few repeating issues.</p>
- <ul class="postList">
- <li name="a586" id="a586" class="graf--li">Lack of mentorship</li>
- <li name="a953" id="a953" class="graf--li">A news process that lacked consideration of the web</li>
- <li name="6286" id="6286" class="graf--li">No editor/position specific to the web</li>
- <li name="04c1" id="04c1" class="graf--li">Little exposure to many of the cool projects being put together by professional newsrooms</li>
- <li name="a1fb" id="a1fb" class="graf--li">Lack of diverse skills within the newsroom. Writers made up 95% of the personnel. Students with other skills were not sought because journalism was seen as “a career with words.” The other 5% were designers, designing words on computers, for print.</li>
- <li name="0be9" id="0be9" class="graf--li">Not enough discussion between the business side and web efforts</li>
- </ul>
- <figure name="79ed" id="79ed" class="graf--figure">
- <div class="aspectRatioPlaceholder is-locked"><img class="graf-image" data-image-id="1*_9KYIFrk_PqWFgptsMDeww.png" data-width="1086" data-height="500" data-action="zoom" data-action-value="1*_9KYIFrk_PqWFgptsMDeww.png" src="https://d262ilb51hltx0.cloudfront.net/max/800/1*_9KYIFrk_PqWFgptsMDeww.png"/></div>
- <figcaption class="imageCaption">From our 2011 research</figcaption>
- </figure>
- <h3 name="8d0c" id="8d0c" class="graf--h3">Common problems in student newsrooms (2013)</h3>
- <p name="3ef6" id="3ef6" class="graf--p">Two years later, we went back and looked at what had changed. We talked to a dozen more newsrooms and weren’t surprised by our findings.</p>
- <ul class="postList">
- <li name="abb1" id="abb1" class="graf--li">Still no mentorship or link to professional newsrooms building stories for the web</li>
- <li name="9250" id="9250" class="graf--li">Very little control of website and technology</li>
- <li name="d822" id="d822" class="graf--li">The lack of exposure that student journalists have to interactive storytelling. While some newsrooms are in touch with what’s happening with the web and journalism, there still exists a huge gap between the student newsroom and its professional counterpart</li>
- <li name="6bf2" id="6bf2" class="graf--li">No time in the current news development cycle for student newsrooms to experiment with the web</li>
- <li name="e62f" id="e62f" class="graf--li">Lack of skill diversity (specifically coding, interaction design, and statistics)</li>
- <li name="f4f0" id="f4f0" class="graf--li">Overly restricted access to student website technology. Changes are primarily visual rather than functional.</li>
- <li name="8b8d" id="8b8d" class="graf--li">Significantly reduced print production of many papers</li>
- <li name="dfe0" id="dfe0" class="graf--li">Computers aren’t set up for experimenting with software and code, and often locked down</li>
- </ul>
- <p name="52cd" id="52cd" class="graf--p">Newsrooms have traditionally been covered in copies of The New York Times or Globe and Mail. Instead newsrooms should try spend at 20 minutes each week going over the coolest/weirdest online storytelling in an effort to expose each other to what is possible. “<a href="http://nytlabs.com/" data-href="http://nytlabs.com/" class="markup--anchor markup--p-anchor" rel="nofollow">Hey, what has the New York Times R&amp;D lab been up to this week?</a>”</p>
- <p name="0142" id="0142" class="graf--p">Instead of having computers that are locked down, try setting aside a few office computers that allow students to play and “break”, or encourage editors to buy their own Macbooks so they’re always able to practice with code and new tools on their own.</p>
- <p name="5d29" id="5d29" class="graf--p">From all this we realized that changing a student newsroom is difficult. It takes patience. It requires that the business and editorial departments of the student newsroom be on the same (web)page. The shoes of the future must be different from the shoes we were given.</p>
- <p name="1ffc" id="1ffc" class="graf--p">We need to rethink how long the new shoe design will be valid. It’s more important that we focus on the process behind making footwear than on actually creating a specific shoe. We shouldn’t be building a shoe to last 40 years. Our footwear design process will allow us to change and adapt as technology evolves. The media landscape will change, so having a newsroom that can change with it will be critical.</p>
- <p name="2888" id="2888" class="graf--p"><strong class="markup--strong markup--p-strong">We are building a shoe machine, not a shoe.</strong> </p>
- <h3 name="9c30" id="9c30" class="graf--h3">A train or light at the end of the tunnel: are student newsrooms changing for the better?</h3>
- <p name="4634" id="4634" class="graf--p">In our 2013 research we found that almost 50% of student newsrooms had created roles specifically for the web. <strong class="markup--strong markup--p-strong">This sounds great, but is still problematic in its current state.</strong> </p>
- <figure name="416f" id="416f" class="graf--figure">
- <div class="aspectRatioPlaceholder is-locked"><img class="graf-image" data-image-id="1*Vh2MpQjqjPkzYJaaWExoVg.png" data-width="624" data-height="560" src="https://d262ilb51hltx0.cloudfront.net/max/800/1*Vh2MpQjqjPkzYJaaWExoVg.png"/></div>
- <figcaption class="imageCaption"><strong class="markup--strong markup--figure-strong">We designed many of these slides to help explain to ourselves what we were doing</strong> </figcaption>
- </figure>
- <p name="39e6" id="39e6" class="graf--p">When a newsroom decides to create a position for the web, it’s often with the intent of having content flow steadily from writers onto the web. This is a big improvement from just uploading stories to the web whenever there is a print issue. <em class="markup--em markup--p-em">However…</em> </p>
- <ol class="postList">
- <li name="91b5" id="91b5" class="graf--li"><strong class="markup--strong markup--li-strong">The handoff</strong>
- <br/>Problems arise because web editors are given roles that absolve the rest of the editors from thinking about the web. All editors should be involved in the process of story development for the web. While it’s a good idea to have one specific editor manage the website, contributors and editors should all play with and learn about the web. Instead of “can you make a computer do XYZ for me?”, we should be saying “can you show me how to make a computer do XYZ?”</li>
- <li name="6448" id="6448" class="graf--li"><strong class="markup--strong markup--li-strong">Not just social media<br/></strong>A web editor could do much more than simply being in charge of the social media accounts for the student paper. Their responsibility could include teaching all other editors to be listening to what’s happening online. The web editor can take advantage of live information to change how the student newsroom reports news in real time.</li>
- <li name="ab30" id="ab30" class="graf--li"><strong class="markup--strong markup--li-strong">Web (interactive) editor<br/></strong>The goal of having a web editor should be for someone to build and tell stories that take full advantage of the web as their medium. Too often the web’s interactivity is not considered when developing the story. The web then ends up as a resting place for print words.</li>
- </ol>
- <p name="e983" id="e983" class="graf--p">Editors at newsrooms are still figuring out how to convince writers of the benefit to having their content online. There’s still a stronger draw to writers seeing their name in print than on the web. Showing writers that their stories can be told in new ways to larger audiences is a convincing argument that the web is a starting point for telling a story, not its graveyard.</p>
- <p name="5c11" id="5c11" class="graf--p">When everyone in the newsroom approaches their website with the intention of using it to explore the web as a medium, they all start to ask “what is possible?” and “what can be done?” You can’t expect students to think in terms of the web if it’s treated as a place for print words to hang out on a web page.</p>
- <p name="4eb1" id="4eb1" class="graf--p">We’re OK with this problem, if we see newsrooms continue to take small steps towards having all their editors involved in the stories for the web.</p>
- <figure name="7aab" id="7aab" class="graf--figure">
- <div class="aspectRatioPlaceholder is-locked"><img class="graf-image" data-image-id="1*2Ln_DmC95Xpz6LzgywkcFQ.png" data-width="1315" data-height="718" data-action="zoom" data-action-value="1*2Ln_DmC95Xpz6LzgywkcFQ.png" src="https://d262ilb51hltx0.cloudfront.net/max/800/1*2Ln_DmC95Xpz6LzgywkcFQ.png"/></div>
- <figcaption class="imageCaption">The current Open Journalism site was a few years in the making. This was an original launch page we use in 2012</figcaption>
- </figure>
- <h3 name="08f5" id="08f5" class="graf--h3">What we know</h3>
- <ul class="postList">
- <li name="f7fe" id="f7fe" class="graf--li"><strong class="markup--strong markup--li-strong">New process</strong>
- <br/>Our rough research has told us newsrooms need to be reorganized. This includes every part of the newsroom’s workflow: from where a story and its information comes from, to thinking of every word, pixel, and interaction the reader will have with your stories. If I was a photo editor that wanted to re-think my process with digital tools in mind, I’d start by asking “how are photo assignments processed and sent out?”, “how do we receive images?”, “what formats do images need to be exported in?”, “what type of screens will the images be viewed on?”, and “how are the designers getting these images?” Making a student newsroom digital isn’t about producing “digital manifestos”, it’s about being curious enough that you’ll want to to continue experimenting with your process until you’ve found one that fits your newsroom’s needs.</li>
- <li name="d757" id="d757" class="graf--li"><strong class="markup--strong markup--li-strong">More (remote) mentorship</strong>
- <br/>Lack of mentorship is still a big problem. <a href="http://www.google.com/get/journalismfellowship/" data-href="http://www.google.com/get/journalismfellowship/" class="markup--anchor markup--li-anchor" rel="nofollow">Google’s fellowship program</a> is great. The fact that it only caters to United States students isn’t. There are only a handful of internships in Canada where students interested in journalism can get experience writing code and building interactive stories. We’re OK with this for now, as we expect internships and mentorship over the next 5 years between professional newsrooms and student newsrooms will only increase. It’s worth noting that some of that mentorship will likely be done remotely.</li>
- <li name="a9b8" id="a9b8" class="graf--li"><strong class="markup--strong markup--li-strong">Changing a newsroom culture</strong>
- <br/>Skill diversity needs to change. We encourage every student newsroom we talk to, to start building a partnership with their school’s Computer Science department. It will take some work, but you’ll find there are many CS undergrads that love playing with web technologies, and using data to tell stories. Changing who is in the newsroom should be one of the first steps newsrooms take to changing how they tell stories. The same goes with getting designers who understand the wonderful interactive elements of the web and students who love statistics and exploring data. Getting students who are amazing at design, data, code, words, and images into one room is one of the coolest experience I’ve had. Everyone benefits from a more diverse newsroom.</li>
- </ul>
- <h3 name="a67e" id="a67e" class="graf--h3">What we don’t know</h3>
- <ul class="postList">
- <li name="7320" id="7320" class="graf--li"><strong class="markup--strong markup--li-strong">Sharing curiosity for the web</strong>
- <br/>We don’t know how to best teach students about the web. It’s not efficient for us to teach coding classes. We do go into newsrooms and get them running their first code exercises, but if someone wants to learn to program, we can only provide the initial push and curiosity. We will be trying out “labs” with a few schools next school year to hopefully get a better idea of how to teach students about the web.</li>
- <li name="8b23" id="8b23" class="graf--li"><strong class="markup--strong markup--li-strong">Business</strong>
- <br/>We don’t know how to convince the business side of student papers that they should invest in the web. At the very least we’re able to explain that having students graduate with their current skill set is painful in the current job market.</li>
- <li name="191e" id="191e" class="graf--li"><strong class="markup--strong markup--li-strong">The future</strong>
- <br/>We don’t know what journalism or the web will be like in 10 years, but we can start encouraging students to keep an open mind about the skills they’ll need. We’re less interested in preparing students for the current newsroom climate, than we are in teaching students to have the ability to learn new tools quickly as they come and go.</li>
- </ul>
- </div>
- <div class="section-inner layoutSingleColumn">
- <h3 name="009a" id="009a" class="graf--h3">What we’re trying to share with others</h3>
- <ul class="postList">
- <li name="8bfa" id="8bfa" class="graf--li"><strong class="markup--strong markup--li-strong">A concise guide to building stories for the web</strong>
- <br/>There are too many options to get started. We hope to provide an opinionated guide that follows both our experiences, research, and observations from trying to teach our peers.</li>
- </ul>
- <p name="8196" id="8196" class="graf--p">Student newsrooms don’t have investors to please. Student newsrooms can change their website every week if they want to try a new design or interaction. As long as students start treating the web as a different medium, and start building stories around that idea, then we’ll know we’re moving forward.</p>
- <h3 name="f6c6" id="f6c6" class="graf--h3">A note to professional news orgs</h3>
- <p name="d8f5" id="d8f5" class="graf--p">We’re also asking professional newsrooms to be more open about their process of developing stories for the web. You play a big part in this. This means writing about it, and sharing code. We need to start building a bridge between student journalism and professional newsrooms.</p>
- <figure name="7ed3" id="7ed3" class="graf--figure">
- <div class="aspectRatioPlaceholder is-locked"><img class="graf-image" data-image-id="1*bXaR_NBJdoHpRc8lUWSsow.png" data-width="686" data-height="400" src="https://d262ilb51hltx0.cloudfront.net/max/800/1*bXaR_NBJdoHpRc8lUWSsow.png"/></div>
- <figcaption class="imageCaption">2012</figcaption>
- </figure>
- <h3 name="ee1b" id="ee1b" class="graf--h3">This is a start</h3>
- <p name="ebf9" id="ebf9" class="graf--p">We going to continue slowly growing the content on <a href="http://pippinlee.github.io/open-journalism-project/" data-href="http://pippinlee.github.io/open-journalism-project/" class="markup--anchor markup--p-anchor" rel="nofollow">Open Journalism</a>. We still consider this the beta version, but expect to polish it, and beef up the content for a real launch at the beginning of the summer.</p>
- <p name="bd44" id="bd44" class="graf--p">We expect to have more original tutorials as well as the beginnings of what a curriculum may look like that a student newsroom can adopt to start guiding their transition to become a web first newsroom. We’re also going to be working with the <a href="http://queensjournal.ca/" data-href="http://queensjournal.ca/" class="markup--anchor markup--p-anchor" rel="nofollow">Queen’s Journal</a> and <a href="http://ubyssey.ca/" data-href="http://ubyssey.ca/" class="markup--anchor markup--p-anchor" rel="nofollow">The Ubyssey</a>next school year to better understand how to make the student newsroom a place for experimenting with telling stories on the web. If this sound like a good idea in your newsroom, we’re still looking to add 1 more school.</p>
- <p name="abd5" id="abd5" class="graf--p">We’re trying out some new shoes. And while they’re not self-lacing, and smell a bit different, we feel lacing up a new pair of kicks can change a lot.</p>
- <figure name="4c68" id="4c68" class="graf--figure">
- <div class="aspectRatioPlaceholder is-locked"><img class="graf-image" data-image-id="1*lulfisQxgSQ209vPHMAifg.png" data-width="950" data-height="534" data-action="zoom" data-action-value="1*lulfisQxgSQ209vPHMAifg.png" src="https://d262ilb51hltx0.cloudfront.net/max/800/1*lulfisQxgSQ209vPHMAifg.png"/></div>
- </figure>
- <p name="2c5c" id="2c5c" class="graf--p"><strong class="markup--strong markup--p-strong">Let’s talk. Let’s listen.</strong> </p>
- <p name="63ec" id="63ec" class="graf--p"><strong class="markup--strong markup--p-strong">We’re still in the early stages of what this project will look like, so if you want to help or have thoughts, let’s talk.</strong> </p>
- <p name="9376" id="9376" class="graf--p"><a href="mailto:[email protected]" data-href="mailto:[email protected]" class="markup--anchor markup--p-anchor" rel="nofollow"><strong class="markup--strong markup--p-strong">[email protected]</strong></a> </p>
- <p name="ea00" id="ea00" class="graf--p graf--last"><em class="markup--em markup--p-em">This isn’t supposed to be a </em> <strong class="markup--strong markup--p-strong"><em class="markup--em markup--p-em">manifesto™©</em>
- </strong><em class="markup--em markup--p-em"> we just think it’s pretty cool to share what we’ve learned so far, and hope you’ll do the same. We’re all in this together.</em> </p> \ No newline at end of file
+<div class="section-inner layoutSingleColumn">
+
+
+ <h4 class="graf--h4" data-align="center" id="425a" name="425a"><em class="markup--em markup--h4-em">Better Student Journalism</em></h4>
+ <p class="graf--p graf--empty" id="a511" name="a511">
+ <br></br></p>
+ <h4 class="graf--h4 graf--empty" id="08db" name="08db"><br></br></h4>
+
+ <p class="graf--p" id="d178" name="d178">We pushed out the first version of the <a class="markup--anchor markup--p-anchor" data-href="http://pippinlee.github.io/open-journalism-project/" href="http://pippinlee.github.io/open-journalism-project/" rel="nofollow">Open Journalism site</a> in January. Our goal is for the
+ site to be a place to teach students what they should know about journalism
+ on the web. It should be fun too.</p>
+ <p class="graf--p" id="01ed" name="01ed">Topics like <a class="markup--anchor markup--p-anchor" data-href="http://pippinlee.github.io/open-journalism-project/Mapping/" href="http://pippinlee.github.io/open-journalism-project/Mapping/" rel="nofollow">mapping</a>, <a class="markup--anchor markup--p-anchor" data-href="http://pippinlee.github.io/open-journalism-project/Security/" href="http://pippinlee.github.io/open-journalism-project/Security/" rel="nofollow">security</a>, command
+ line tools, and <a class="markup--anchor markup--p-anchor" data-href="http://pippinlee.github.io/open-journalism-project/Open-source/" href="http://pippinlee.github.io/open-journalism-project/Open-source/" rel="nofollow">open source</a> are
+ all concepts that should be made more accessible, and should be easily
+ understood at a basic level by all journalists. We’re focusing on students
+ because we know student journalism well, and we believe that teaching maturing
+ journalists about the web will provide them with an important lens to view
+ the world with. This is how we got to where we are now.</p>
+ <h3 class="graf--h3" id="0348" name="0348">Circa 2011</h3>
+ <p class="graf--p" id="f923" name="f923">In late 2011 I sat in the design room of our university’s student newsroom
+ with some of the other editors: Kate Hudson, Brent Rose, and Nicholas Maronese.
+ I was working as the photo editor then—something I loved doing. I was very
+ happy travelling and photographing people while listening to their stories.</p>
+ <p class="graf--p" id="c9d4" name="c9d4">Photography was my lucky way of experiencing the many types of people
+ my generation seemed to avoid, as well as many the public spends too much
+ time discussing. One of my habits as a photographer was scouring sites
+ like Flickr to see how others could frame the world in ways I hadn’t previously
+ considered.</p>
+ <figure class="graf--figure" id="06e8" name="06e8"><div class="aspectRatioPlaceholder is-locked" style="max-width: 700px; max-height: 350px;">
+
+ <img class="graf-image" data-action="zoom" data-action-value="1*AzYWbe4cZkMMEUbfRjysLQ.png" data-height="500" data-image-id="1*AzYWbe4cZkMMEUbfRjysLQ.png" data-width="1000" src="https://d262ilb51hltx0.cloudfront.net/max/800/1*AzYWbe4cZkMMEUbfRjysLQ.png"></img></div>
+ <figcaption class="imageCaption">topleftpixel.com</figcaption></figure><p class="graf--p" id="930f" name="930f">I started discovering beautiful things the <a class="markup--anchor markup--p-anchor" data-href="http://wvs.topleftpixel.com/13/02/06/timelapse-strips-homewood.htm" href="http://wvs.topleftpixel.com/13/02/06/timelapse-strips-homewood.htm" rel="nofollow">web could do with images</a>:
+ things not possible with print. Just as every generation revolts against
+ walking in the previous generations shoes, I found myself questioning the
+ expectations that I came up against as a photo editor. In our newsroom
+ the expectations were built from an outdated information world. We were
+ expected to fill old shoes.</p>
+ <p class="graf--p" id="2674" name="2674">So we sat in our student newsroom—not very happy with what we were doing.
+ Our weekly newspaper had remained essentially unchanged for 40+ years.
+ Each editorial position had the same requirement every year. The <em class="markup--em markup--p-em">big</em> change
+ happened in the 80s when the paper started using colour. We’d also stumbled
+ into having a website, but it was updated just once a week with the release
+ of the newspaper.</p>
+ <p class="graf--p" id="e498" name="e498">Information had changed form, but the student newsroom hadn’t, and it
+ was becoming harder to romanticize the dusty newsprint smell coming from
+ the shoes we were handed down from previous generations of editors. It
+ was, we were told, all part of “becoming a journalist.”</p>
+ <figure class="graf--figure" id="12da" name="12da"><div class="aspectRatioPlaceholder is-locked" style="max-width: 700px; max-height: 364px;">
+
+ <img class="graf-image" data-action="zoom" data-action-value="1*d0Hp6KlzyIcGHcL6to1sYQ.png" data-height="451" data-image-id="1*d0Hp6KlzyIcGHcL6to1sYQ.png" data-width="868" src="https://d262ilb51hltx0.cloudfront.net/max/800/1*d0Hp6KlzyIcGHcL6to1sYQ.png"></img></div>
+ </figure><h3 class="graf--h3" id="e2f0" name="e2f0">We don’t know what we don’t know</h3>
+ <p class="graf--p" id="8263" name="8263">We spent much of the rest of the school year asking “what should we be
+ doing in the newsroom?”, which mainly led us to ask “how do we use the
+ web to tell stories?” It was a straightforward question that led to many
+ more questions about the web: something we knew little about. Out in the
+ real world, traditional journalists were struggling to keep their jobs
+ in a dying print world. They wore the same design of shoes that we were
+ supposed to fill. Being pushed to repeat old, failing strategies and blocked
+ from trying something new scared us.</p>
+ <p class="graf--p" id="231e" name="231e">We had questions, so we started doing some research. We talked with student
+ newsrooms in Canada and the United States, and filled too many Google Doc
+ files with notes. Looking at the notes now, they scream of fear. We annotated
+ our notes with naive solutions, often involving scrambled and immature
+ odysseys into the future of online journalism.</p>
+ <p class="graf--p" id="6ec3" name="6ec3">There was a lot we didn’t know. We didn’t know <strong class="markup--strong markup--p-strong">how to build a mobile app</strong>.
+ We didn’t know <strong class="markup--strong markup--p-strong">if we should build a mobile app</strong>.
+ We didn’t know <strong class="markup--strong markup--p-strong">how to run a server</strong>.
+ We didn’t know <strong class="markup--strong markup--p-strong">where to go to find a server</strong>.
+ We didn’t know <strong class="markup--strong markup--p-strong">how the web worked</strong>.
+ We didn’t know <strong class="markup--strong markup--p-strong">how people used the web to read news</strong>.
+ We didn’t know <strong class="markup--strong markup--p-strong">what news should be on the web</strong>.
+ If news is just information, what does that even look like?</p>
+ <p class="graf--p" id="f373" name="f373">We asked these questions to many students at other papers to get a consensus
+ of what had worked and what hadn’t. They reported similar questions and
+ fears about the web but followed with “print advertising is keeping us
+ afloat so we can’t abandon it”.</p>
+ <p class="graf--p" id="034b" name="034b">In other words, we knew that we should be building a newer pair of shoes,
+ but we didn’t know what the function of the shoes should be.</p>
+ <h3 class="graf--h3" id="ea15" name="ea15">Common problems in student newsrooms (2011)</h3>
+ <p class="graf--p" id="a90b" name="a90b">Our questioning of other student journalists in 15 student newsrooms brought
+ up a few repeating issues.</p>
+ <ul class="postList"><li class="graf--li" id="a586" name="a586">Lack of mentorship</li>
+ <li class="graf--li" id="a953" name="a953">A news process that lacked consideration of the web</li>
+ <li class="graf--li" id="6286" name="6286">No editor/position specific to the web</li>
+ <li class="graf--li" id="04c1" name="04c1">Little exposure to many of the cool projects being put together by professional
+ newsrooms</li>
+ <li class="graf--li" id="a1fb" name="a1fb">Lack of diverse skills within the newsroom. Writers made up 95% of the
+ personnel. Students with other skills were not sought because journalism
+ was seen as “a career with words.” The other 5% were designers, designing
+ words on computers, for print.</li>
+ <li class="graf--li" id="0be9" name="0be9">Not enough discussion between the business side and web efforts</li>
+ </ul><figure class="graf--figure" id="79ed" name="79ed"><div class="aspectRatioPlaceholder is-locked" style="max-width: 700px; max-height: 322px;">
+
+ <img class="graf-image" data-action="zoom" data-action-value="1*_9KYIFrk_PqWFgptsMDeww.png" data-height="500" data-image-id="1*_9KYIFrk_PqWFgptsMDeww.png" data-width="1086" src="https://d262ilb51hltx0.cloudfront.net/max/800/1*_9KYIFrk_PqWFgptsMDeww.png"></img></div>
+ <figcaption class="imageCaption">From our 2011 research</figcaption></figure><h3 class="graf--h3" id="8d0c" name="8d0c">Common problems in student newsrooms (2013)</h3>
+ <p class="graf--p" id="3ef6" name="3ef6">Two years later, we went back and looked at what had changed. We talked
+ to a dozen more newsrooms and weren’t surprised by our findings.</p>
+ <ul class="postList"><li class="graf--li" id="abb1" name="abb1">Still no mentorship or link to professional newsrooms building stories
+ for the web</li>
+ <li class="graf--li" id="9250" name="9250">Very little control of website and technology</li>
+ <li class="graf--li" id="d822" name="d822">The lack of exposure that student journalists have to interactive storytelling.
+ While some newsrooms are in touch with what’s happening with the web and
+ journalism, there still exists a huge gap between the student newsroom
+ and its professional counterpart</li>
+ <li class="graf--li" id="6bf2" name="6bf2">No time in the current news development cycle for student newsrooms to
+ experiment with the web</li>
+ <li class="graf--li" id="e62f" name="e62f">Lack of skill diversity (specifically coding, interaction design, and
+ statistics)</li>
+ <li class="graf--li" id="f4f0" name="f4f0">Overly restricted access to student website technology. Changes are primarily
+ visual rather than functional.</li>
+ <li class="graf--li" id="8b8d" name="8b8d">Significantly reduced print production of many papers</li>
+ <li class="graf--li" id="dfe0" name="dfe0">Computers aren’t set up for experimenting with software and code, and
+ often locked down</li>
+ </ul><p class="graf--p" id="52cd" name="52cd">Newsrooms have traditionally been covered in copies of The New York Times
+ or Globe and Mail. Instead newsrooms should try spend at 20 minutes each
+ week going over the coolest/weirdest online storytelling in an effort to
+ expose each other to what is possible. “<a class="markup--anchor markup--p-anchor" data-href="http://nytlabs.com/" href="http://nytlabs.com/" rel="nofollow">Hey, what has the New York Times R&amp;D lab been up to this week?</a>”</p>
+ <p class="graf--p" id="0142" name="0142">Instead of having computers that are locked down, try setting aside a
+ few office computers that allow students to play and “break”, or encourage
+ editors to buy their own Macbooks so they’re always able to practice with
+ code and new tools on their own.</p>
+ <p class="graf--p" id="5d29" name="5d29">From all this we realized that changing a student newsroom is difficult.
+ It takes patience. It requires that the business and editorial departments
+ of the student newsroom be on the same (web)page. The shoes of the future
+ must be different from the shoes we were given.</p>
+ <p class="graf--p" id="1ffc" name="1ffc">We need to rethink how long the new shoe design will be valid. It’s more
+ important that we focus on the process behind making footwear than on actually
+ creating a specific shoe. We shouldn’t be building a shoe to last 40 years.
+ Our footwear design process will allow us to change and adapt as technology
+ evolves. The media landscape will change, so having a newsroom that can
+ change with it will be critical.</p>
+ <p class="graf--p" id="2888" name="2888"><strong class="markup--strong markup--p-strong">We are building a shoe machine, not a shoe.</strong>
+ </p>
+
+ <h3 class="graf--h3" id="9c30" name="9c30">A train or light at the end of the tunnel: are student newsrooms changing for the better?</h3>
+ <p class="graf--p graf--empty" id="1f98" name="1f98">
+ <br></br></p>
+ <p class="graf--p" id="4634" name="4634">In our 2013 research we found that almost 50% of student newsrooms had
+ created roles specifically for the web. <strong class="markup--strong markup--p-strong">This sounds great, but is still problematic in its current state.</strong>
+ </p>
+ <figure class="graf--figure" id="416f" name="416f"><div class="aspectRatioPlaceholder is-locked" style="max-width: 624px; max-height: 560px;">
+
+ <img class="graf-image" data-height="560" data-image-id="1*Vh2MpQjqjPkzYJaaWExoVg.png" data-width="624" src="https://d262ilb51hltx0.cloudfront.net/max/800/1*Vh2MpQjqjPkzYJaaWExoVg.png"></img></div>
+ <figcaption class="imageCaption"><strong class="markup--strong markup--figure-strong">We designed many of these slides to help explain to ourselves what we were doing</strong>
+ </figcaption></figure><p class="graf--p" id="39e6" name="39e6">When a newsroom decides to create a position for the web, it’s often with
+ the intent of having content flow steadily from writers onto the web. This
+ is a big improvement from just uploading stories to the web whenever there
+ is a print issue. <em class="markup--em markup--p-em">However…</em>
+ </p>
+ <ol class="postList"><li class="graf--li" id="91b5" name="91b5"><strong class="markup--strong markup--li-strong">The handoff</strong>
+ <br></br>Problems arise because web editors are given roles that absolve the rest
+ of the editors from thinking about the web. All editors should be involved
+ in the process of story development for the web. While it’s a good idea
+ to have one specific editor manage the website, contributors and editors
+ should all play with and learn about the web. Instead of “can you make
+ a computer do XYZ for me?”, we should be saying “can you show me how to
+ make a computer do XYZ?”</li>
+ <li class="graf--li" id="6448" name="6448"><strong class="markup--strong markup--li-strong">Not just social media<br></br></strong>A
+ web editor could do much more than simply being in charge of the social
+ media accounts for the student paper. Their responsibility could include
+ teaching all other editors to be listening to what’s happening online.
+ The web editor can take advantage of live information to change how the
+ student newsroom reports news in real time.</li>
+ <li class="graf--li" id="ab30" name="ab30"><strong class="markup--strong markup--li-strong">Web (interactive) editor<br></br></strong>The
+ goal of having a web editor should be for someone to build and tell stories
+ that take full advantage of the web as their medium. Too often the web’s
+ interactivity is not considered when developing the story. The web then
+ ends up as a resting place for print words.</li>
+ </ol><p class="graf--p" id="e983" name="e983">Editors at newsrooms are still figuring out how to convince writers of
+ the benefit to having their content online. There’s still a stronger draw
+ to writers seeing their name in print than on the web. Showing writers
+ that their stories can be told in new ways to larger audiences is a convincing
+ argument that the web is a starting point for telling a story, not its
+ graveyard.</p>
+ <p class="graf--p" id="5c11" name="5c11">When everyone in the newsroom approaches their website with the intention
+ of using it to explore the web as a medium, they all start to ask “what
+ is possible?” and “what can be done?” You can’t expect students to think
+ in terms of the web if it’s treated as a place for print words to hang
+ out on a web page.</p>
+ <p class="graf--p" id="4eb1" name="4eb1">We’re OK with this problem, if we see newsrooms continue to take small
+ steps towards having all their editors involved in the stories for the
+ web.</p>
+ <figure class="graf--figure" id="7aab" name="7aab"><div class="aspectRatioPlaceholder is-locked" style="max-width: 700px; max-height: 382px;">
+
+ <img class="graf-image" data-action="zoom" data-action-value="1*2Ln_DmC95Xpz6LzgywkcFQ.png" data-height="718" data-image-id="1*2Ln_DmC95Xpz6LzgywkcFQ.png" data-width="1315" src="https://d262ilb51hltx0.cloudfront.net/max/800/1*2Ln_DmC95Xpz6LzgywkcFQ.png"></img></div>
+ <figcaption class="imageCaption">The current Open Journalism site was a few years in the making. This was
+ an original launch page we use in 2012</figcaption></figure><h3 class="graf--h3" id="08f5" name="08f5">What we know</h3>
+ <ul class="postList"><li class="graf--li" id="f7fe" name="f7fe"><strong class="markup--strong markup--li-strong">New process</strong>
+ <br></br>Our rough research has told us newsrooms need to be reorganized. This
+ includes every part of the newsroom’s workflow: from where a story and
+ its information comes from, to thinking of every word, pixel, and interaction
+ the reader will have with your stories. If I was a photo editor that wanted
+ to re-think my process with digital tools in mind, I’d start by asking
+ “how are photo assignments processed and sent out?”, “how do we receive
+ images?”, “what formats do images need to be exported in?”, “what type
+ of screens will the images be viewed on?”, and “how are the designers getting
+ these images?” Making a student newsroom digital isn’t about producing
+ “digital manifestos”, it’s about being curious enough that you’ll want
+ to to continue experimenting with your process until you’ve found one that
+ fits your newsroom’s needs.</li>
+ <li class="graf--li" id="d757" name="d757"><strong class="markup--strong markup--li-strong">More (remote) mentorship</strong>
+ <br></br>Lack of mentorship is still a big problem. <a class="markup--anchor markup--li-anchor" data-href="http://www.google.com/get/journalismfellowship/" href="http://www.google.com/get/journalismfellowship/" rel="nofollow">Google’s fellowship program</a> is great. The fact that it
+ only caters to United States students isn’t. There are only a handful of
+ internships in Canada where students interested in journalism can get experience
+ writing code and building interactive stories. We’re OK with this for now,
+ as we expect internships and mentorship over the next 5 years between professional
+ newsrooms and student newsrooms will only increase. It’s worth noting that
+ some of that mentorship will likely be done remotely.</li>
+ <li class="graf--li" id="a9b8" name="a9b8"><strong class="markup--strong markup--li-strong">Changing a newsroom culture</strong>
+ <br></br>Skill diversity needs to change. We encourage every student newsroom we
+ talk to, to start building a partnership with their school’s Computer Science
+ department. It will take some work, but you’ll find there are many CS undergrads
+ that love playing with web technologies, and using data to tell stories.
+ Changing who is in the newsroom should be one of the first steps newsrooms
+ take to changing how they tell stories. The same goes with getting designers
+ who understand the wonderful interactive elements of the web and students
+ who love statistics and exploring data. Getting students who are amazing
+ at design, data, code, words, and images into one room is one of the coolest
+ experience I’ve had. Everyone benefits from a more diverse newsroom.</li>
+ </ul><h3 class="graf--h3" id="a67e" name="a67e">What we don’t know</h3>
+ <ul class="postList"><li class="graf--li" id="7320" name="7320"><strong class="markup--strong markup--li-strong">Sharing curiosity for the web</strong>
+ <br></br>We don’t know how to best teach students about the web. It’s not efficient
+ for us to teach coding classes. We do go into newsrooms and get them running
+ their first code exercises, but if someone wants to learn to program, we
+ can only provide the initial push and curiosity. We will be trying out
+ “labs” with a few schools next school year to hopefully get a better idea
+ of how to teach students about the web.</li>
+ <li class="graf--li" id="8b23" name="8b23"><strong class="markup--strong markup--li-strong">Business</strong>
+ <br></br>We don’t know how to convince the business side of student papers that
+ they should invest in the web. At the very least we’re able to explain
+ that having students graduate with their current skill set is painful in
+ the current job market.</li>
+ <li class="graf--li" id="191e" name="191e"><strong class="markup--strong markup--li-strong">The future</strong>
+ <br></br>We don’t know what journalism or the web will be like in 10 years, but
+ we can start encouraging students to keep an open mind about the skills
+ they’ll need. We’re less interested in preparing students for the current
+ newsroom climate, than we are in teaching students to have the ability
+ to learn new tools quickly as they come and go.</li>
+ </ul></div><div class="section-inner layoutSingleColumn">
+ <h3 class="graf--h3" id="009a" name="009a">What we’re trying to share with others</h3>
+ <ul class="postList"><li class="graf--li" id="8bfa" name="8bfa"><strong class="markup--strong markup--li-strong">A concise guide to building stories for the web</strong>
+ <br></br>There are too many options to get started. We hope to provide an opinionated
+ guide that follows both our experiences, research, and observations from
+ trying to teach our peers.</li>
+ </ul><p class="graf--p" id="8196" name="8196">Student newsrooms don’t have investors to please. Student newsrooms can
+ change their website every week if they want to try a new design or interaction.
+ As long as students start treating the web as a different medium, and start
+ building stories around that idea, then we’ll know we’re moving forward.</p>
+ <h3 class="graf--h3" id="f6c6" name="f6c6">A note to professional news orgs</h3>
+ <p class="graf--p" id="d8f5" name="d8f5">We’re also asking professional newsrooms to be more open about their process
+ of developing stories for the web. You play a big part in this. This means
+ writing about it, and sharing code. We need to start building a bridge
+ between student journalism and professional newsrooms.</p>
+ <figure class="graf--figure" id="7ed3" name="7ed3"><div class="aspectRatioPlaceholder is-locked" style="max-width: 686px; max-height: 400px;">
+
+ <img class="graf-image" data-height="400" data-image-id="1*bXaR_NBJdoHpRc8lUWSsow.png" data-width="686" src="https://d262ilb51hltx0.cloudfront.net/max/800/1*bXaR_NBJdoHpRc8lUWSsow.png"></img></div>
+ <figcaption class="imageCaption">2012</figcaption></figure><h3 class="graf--h3" id="ee1b" name="ee1b">This is a start</h3>
+ <p class="graf--p" id="ebf9" name="ebf9">We going to continue slowly growing the content on <a class="markup--anchor markup--p-anchor" data-href="http://pippinlee.github.io/open-journalism-project/" href="http://pippinlee.github.io/open-journalism-project/" rel="nofollow">Open Journalism</a>. We still consider this the beta version,
+ but expect to polish it, and beef up the content for a real launch at the
+ beginning of the summer.</p>
+ <p class="graf--p" id="bd44" name="bd44">We expect to have more original tutorials as well as the beginnings of
+ what a curriculum may look like that a student newsroom can adopt to start
+ guiding their transition to become a web first newsroom. We’re also going
+ to be working with the <a class="markup--anchor markup--p-anchor" data-href="http://queensjournal.ca/" href="http://queensjournal.ca/" rel="nofollow">Queen’s Journal</a> and
+ <a class="markup--anchor markup--p-anchor" data-href="http://ubyssey.ca/" href="http://ubyssey.ca/" rel="nofollow">The Ubyssey</a>next school year to better understand how to make the student
+ newsroom a place for experimenting with telling stories on the web. If
+ this sound like a good idea in your newsroom, we’re still looking to add
+ 1 more school.</p>
+ <p class="graf--p" id="abd5" name="abd5">We’re trying out some new shoes. And while they’re not self-lacing, and
+ smell a bit different, we feel lacing up a new pair of kicks can change
+ a lot.</p>
+ <figure class="graf--figure" id="4c68" name="4c68"><div class="aspectRatioPlaceholder is-locked" style="max-width: 700px; max-height: 393px;">
+
+ <img class="graf-image" data-action="zoom" data-action-value="1*lulfisQxgSQ209vPHMAifg.png" data-height="534" data-image-id="1*lulfisQxgSQ209vPHMAifg.png" data-width="950" src="https://d262ilb51hltx0.cloudfront.net/max/800/1*lulfisQxgSQ209vPHMAifg.png"></img></div>
+ </figure><p class="graf--p graf--empty" id="c6bf" name="c6bf">
+ <br></br></p>
+ <p class="graf--p" id="2c5c" name="2c5c"><strong class="markup--strong markup--p-strong">Let’s talk. Let’s listen.</strong>
+ </p>
+ <p class="graf--p" id="63ec" name="63ec"><strong class="markup--strong markup--p-strong">We’re still in the early stages of what this project will look like, so if you want to help or have thoughts, let’s talk.</strong>
+ </p>
+ <p class="graf--p" id="9376" name="9376"><a class="markup--anchor markup--p-anchor" data-href="mailto:[email protected]" href="mailto:[email protected]" rel="nofollow"><strong class="markup--strong markup--p-strong">[email protected]</strong></a>
+ </p>
+
+ <p class="graf--p graf--empty" id="1bdf" name="1bdf">
+ <br></br></p>
+ <p class="graf--p graf--last" id="ea00" name="ea00"><em class="markup--em markup--p-em">This isn’t supposed to be a </em>
+ <strong class="markup--strong markup--p-strong"><em class="markup--em markup--p-em">manifesto™©</em>
+ </strong><em class="markup--em markup--p-em"> we just think it’s pretty cool to share what we’ve learned so far, and hope you’ll do the same. We’re all in this together.</em>
+ </p>
+ </div> \ No newline at end of file
diff --git a/test/test-pages/medium-2/expected.html b/test/test-pages/medium-2/expected.html
index ce37358..1e3b1ec 100644
--- a/test/test-pages/medium-2/expected.html
+++ b/test/test-pages/medium-2/expected.html
@@ -1,27 +1 @@
- <div class="section-inner layoutSingleColumn">
- <figure name="4924" id="4924" class="graf--figure graf--first">
- <div class="aspectRatioPlaceholder is-locked"><img class="graf-image" data-image-id="1*eR_J8DurqygbhrwDg-WPnQ.png" data-width="1891" data-height="1280" data-action="zoom" data-action-value="1*eR_J8DurqygbhrwDg-WPnQ.png" src="https://d262ilb51hltx0.cloudfront.net/max/1600/1*eR_J8DurqygbhrwDg-WPnQ.png"/></div>
- <figcaption class="imageCaption">Words need defenders.</figcaption>
- </figure>
- <h3 name="b098" id="b098" class="graf--h3">On Behalf of “Literally”</h3>
- <p name="1a73" id="1a73" class="graf--p">You either are a “literally” abuser or know of one. If you’re anything like me, hearing the word “literally” used incorrectly causes a little piece of your soul to whither and die. Of course I do not mean that literally, I mean that figuratively. An abuser would have said: “Every time a person uses that word, a piece of my soul literally withers and dies.” Which is terribly, horribly wrong.</p>
- <p name="104a" id="104a" class="graf--p">For whatever bizarre reason, people feel the need to use literally as a sort of verbal crutch. They use it to emphasize a point, which is silly because they’re already using an analogy or a metaphor to illustrate said point. For example: “Ugh, I literally tore the house apart looking for my remote control!” No, you literally did not tear apart your house, because it’s still standing. If you’d just told me you “tore your house apart” searching for your remote, I would’ve understood what you meant. No need to add “literally” to the sentence.</p>
- <p name="c2c0" id="c2c0" class="graf--p">Maybe I should define literally.</p>
- <blockquote name="b239" id="b239" class="graf--pullquote pullquote">Literally means actually. When you say something literally happened, you’re describing the scene or situation as it actually happened.</blockquote>
- <p name="a8fd" id="a8fd" class="graf--p">So you should only use literally when you mean it. It should not be used in hyperbole. Example: “That was so funny I literally cried.” Which is possible. Some things are funny enough to elicit tears. Note the example stops with “literally cried.” You cannot <em class="markup--em markup--p-em">literally cry your eyes out</em>. The joke wasn’t so funny your eyes popped out of their sockets.</p>
- <h4 name="165a" id="165a" class="graf--h4">When in Doubt, Leave it Out</h4>
- <p name="e434" id="e434" class="graf--p graf--startsWithDoubleQuote">“I’m so hungry I could eat a horse,” means you’re hungry. You don’t need to say “I’m so hungry I could literally eat a horse.” Because you can’t do that in one sitting, I don’t care how big your stomach is.</p>
- <p name="d88f" id="d88f" class="graf--p graf--startsWithDoubleQuote">“That play was so funny I laughed my head off,” illustrates the play was amusing. You don’t need to say you literally laughed your head off, because then your head would be on the ground and you wouldn’t be able to speak, much less laugh.</p>
- <p name="4bab" id="4bab" class="graf--p graf--startsWithDoubleQuote">“I drove so fast my car was flying,” we get your point: you were speeding. But your car is never going fast enough to fly, so don’t say your car was literally flying.</p>
- <h4 name="f2f0" id="f2f0" class="graf--h4">Insecurities?</h4>
- <p name="1bd7" id="1bd7" class="graf--p">Maybe no one believed a story you told as a child, and you felt the need to prove that it actually happened. <em class="markup--em markup--p-em">No really, mom, I literally climbed the tree. </em>In efforts to prove truth, you used literally to describe something real, however outlandish it seemed. Whatever the reason, now your overuse of literally has become a habit.</p>
- <h4 name="d7c1" id="d7c1" class="graf--h4">Hard Habit to Break?</h4>
- <p name="714b" id="714b" class="graf--p">Abusing literally isn’t as bad a smoking, but it’s still an unhealthy habit (I mean that figuratively). Help is required in order to break it.</p>
- <p name="f929" id="f929" class="graf--p">This is my version of an intervention for literally abusers. I’m not sure how else to do it other than in writing. I know this makes me sound like a know-it-all, and I accept that. But there’s no excuse other than blatant ignorance to misuse the word “literally.” So just stop it.</p>
- <p name="fd19" id="fd19" class="graf--p">Don’t say “Courtney, this post is so snobbish it literally burned up my computer.” Because nothing is that snobbish that it causes computers to combust. Or: “Courtney, your head is so big it literally cannot get through the door.” Because it can, unless it’s one of those tiny doors from <em class="markup--em markup--p-em">Alice in Wonderland</em> and I need to eat a mushroom to make my whole body smaller.</p>
- <h4 name="fe12" id="fe12" class="graf--h4">No One’s Perfect</h4>
- <p name="7ff8" id="7ff8" class="graf--p">And I’m not saying I am. I’m trying to restore meaning to a word that’s lost meaning. I’m standing up for literally. It’s a good word when used correctly. People are butchering it and destroying it every day (figuratively speaking) and the massacre needs to stop. Just as there’s a coalition of people against the use of certain fonts (like <a href="http://bancomicsans.com/main/?page_id=2" data-href="http://bancomicsans.com/main/?page_id=2" class="markup--anchor markup--p-anchor" rel="nofollow">Comic Sans</a> and <a href="https://www.facebook.com/group.php?gid=14448723154" data-href="https://www.facebook.com/group.php?gid=14448723154" class="markup--anchor markup--p-anchor" rel="nofollow">Papyrus</a>), so should there be a coalition of people against the abuse of literally.</p>
- <h4 name="049e" id="049e" class="graf--h4">Saying it to Irritate?</h4>
- <p name="9381" id="9381" class="graf--p">Do you misuse the word “literally” just to annoy your know-it-all or grammar police friends/acquaintances/total strangers? If so, why? Doing so would be like me going outside when it’s freezing, wearing nothing but a pair of shorts and t-shirt in hopes of making you cold by just looking at me. Who suffers more?</p>
- <h4 name="3e52" id="3e52" class="graf--h4">Graphical Representation</h4>
- <p name="b57e" id="b57e" class="graf--p graf--last">Matthew Inman of “The Oatmeal” wrote a comic about literally. Abusers and defenders alike <a href="http://theoatmeal.com/comics/literally" data-href="http://theoatmeal.com/comics/literally" class="markup--anchor markup--p-anchor" rel="nofollow">should check it out</a>. It’s clear this whole craze about literally is driving a lot of us nuts. You literally abusers are killing off pieces of our souls. You must be stopped, or the world will be lost to meaninglessness forever. Figuratively speaking.</p> \ No newline at end of file
+<div class="section-inner layoutSingleColumn"><figure class="graf--figure graf--first" id="4924" name="4924"><div class="aspectRatioPlaceholder is-locked" style="max-width: 700px; max-height: 474px;"><img class="graf-image" data-action="zoom" data-action-value="1*eR_J8DurqygbhrwDg-WPnQ.png" data-height="1280" data-image-id="1*eR_J8DurqygbhrwDg-WPnQ.png" data-width="1891" src="https://d262ilb51hltx0.cloudfront.net/max/1600/1*eR_J8DurqygbhrwDg-WPnQ.png"></img></div><figcaption class="imageCaption">Words need defenders.</figcaption></figure><h3 class="graf--h3" id="b098" name="b098">On Behalf of “Literally”</h3><p class="graf--p" id="1a73" name="1a73">You either are a “literally” abuser or know of one. If you’re anything like me, hearing the word “literally” used incorrectly causes a little piece of your soul to whither and die. Of course I do not mean that literally, I mean that figuratively. An abuser would have said: “Every time a person uses that word, a piece of my soul literally withers and dies.” Which is terribly, horribly wrong.</p><p class="graf--p" id="104a" name="104a">For whatever bizarre reason, people feel the need to use literally as a sort of verbal crutch. They use it to emphasize a point, which is silly because they’re already using an analogy or a metaphor to illustrate said point. For example: “Ugh, I literally tore the house apart looking for my remote control!” No, you literally did not tear apart your house, because it’s still standing. If you’d just told me you “tore your house apart” searching for your remote, I would’ve understood what you meant. No need to add “literally” to the sentence.</p><p class="graf--p" id="c2c0" name="c2c0">Maybe I should define literally.</p><blockquote class="graf--pullquote pullquote" id="b239" name="b239">Literally means actually. When you say something literally happened, you’re describing the scene or situation as it actually happened.</blockquote><p class="graf--p" id="a8fd" name="a8fd">So you should only use literally when you mean it. It should not be used in hyperbole. Example: “That was so funny I literally cried.” Which is possible. Some things are funny enough to elicit tears. Note the example stops with “literally cried.” You cannot <em class="markup--em markup--p-em">literally cry your eyes out</em>. The joke wasn’t so funny your eyes popped out of their sockets.</p><h4 class="graf--h4" id="165a" name="165a">When in Doubt, Leave it Out</h4><p class="graf--p graf--startsWithDoubleQuote" id="e434" name="e434">“I’m so hungry I could eat a horse,” means you’re hungry. You don’t need to say “I’m so hungry I could literally eat a horse.” Because you can’t do that in one sitting, I don’t care how big your stomach is.</p><p class="graf--p graf--startsWithDoubleQuote" id="d88f" name="d88f">“That play was so funny I laughed my head off,” illustrates the play was amusing. You don’t need to say you literally laughed your head off, because then your head would be on the ground and you wouldn’t be able to speak, much less laugh.</p><p class="graf--p graf--startsWithDoubleQuote" id="4bab" name="4bab">“I drove so fast my car was flying,” we get your point: you were speeding. But your car is never going fast enough to fly, so don’t say your car was literally flying.</p><h4 class="graf--h4" id="f2f0" name="f2f0">Insecurities?</h4><p class="graf--p" id="1bd7" name="1bd7">Maybe no one believed a story you told as a child, and you felt the need to prove that it actually happened. <em class="markup--em markup--p-em">No really, mom, I literally climbed the tree. </em>In efforts to prove truth, you used literally to describe something real, however outlandish it seemed. Whatever the reason, now your overuse of literally has become a habit.</p><h4 class="graf--h4" id="d7c1" name="d7c1">Hard Habit to Break?</h4><p class="graf--p" id="714b" name="714b">Abusing literally isn’t as bad a smoking, but it’s still an unhealthy habit (I mean that figuratively). Help is required in order to break it.</p><p class="graf--p" id="f929" name="f929">This is my version of an intervention for literally abusers. I’m not sure how else to do it other than in writing. I know this makes me sound like a know-it-all, and I accept that. But there’s no excuse other than blatant ignorance to misuse the word “literally.” So just stop it.</p><p class="graf--p" id="fd19" name="fd19">Don’t say “Courtney, this post is so snobbish it literally burned up my computer.” Because nothing is that snobbish that it causes computers to combust. Or: “Courtney, your head is so big it literally cannot get through the door.” Because it can, unless it’s one of those tiny doors from <em class="markup--em markup--p-em">Alice in Wonderland</em> and I need to eat a mushroom to make my whole body smaller.</p><h4 class="graf--h4" id="fe12" name="fe12">No One’s Perfect</h4><p class="graf--p" id="7ff8" name="7ff8">And I’m not saying I am. I’m trying to restore meaning to a word that’s lost meaning. I’m standing up for literally. It’s a good word when used correctly. People are butchering it and destroying it every day (figuratively speaking) and the massacre needs to stop. Just as there’s a coalition of people against the use of certain fonts (like <a class="markup--anchor markup--p-anchor" data-href="http://bancomicsans.com/main/?page_id=2" href="http://bancomicsans.com/main/?page_id=2" rel="nofollow">Comic Sans</a> and <a class="markup--anchor markup--p-anchor" data-href="https://www.facebook.com/group.php?gid=14448723154" href="https://www.facebook.com/group.php?gid=14448723154" rel="nofollow">Papyrus</a>), so should there be a coalition of people against the abuse of literally.</p><h4 class="graf--h4" id="049e" name="049e">Saying it to Irritate?</h4><p class="graf--p" id="9381" name="9381">Do you misuse the word “literally” just to annoy your know-it-all or grammar police friends/acquaintances/total strangers? If so, why? Doing so would be like me going outside when it’s freezing, wearing nothing but a pair of shorts and t-shirt in hopes of making you cold by just looking at me. Who suffers more?</p><h4 class="graf--h4" id="3e52" name="3e52">Graphical Representation</h4><p class="graf--p graf--last" id="b57e" name="b57e">Matthew Inman of “The Oatmeal” wrote a comic about literally. Abusers and defenders alike <a class="markup--anchor markup--p-anchor" data-href="http://theoatmeal.com/comics/literally" href="http://theoatmeal.com/comics/literally" rel="nofollow">should check it out</a>. It’s clear this whole craze about literally is driving a lot of us nuts. You literally abusers are killing off pieces of our souls. You must be stopped, or the world will be lost to meaninglessness forever. Figuratively speaking.</p></div> \ No newline at end of file
diff --git a/test/test-pages/missing-paragraphs/expected.html b/test/test-pages/missing-paragraphs/expected.html
index 0d002b2..44e7b16 100644
--- a/test/test-pages/missing-paragraphs/expected.html
+++ b/test/test-pages/missing-paragraphs/expected.html
@@ -1,4 +1,37 @@
- <p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.</p>
- <h2>Secondary header</h2>
- <p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.</p>
- <h2>Secondary header</h2> \ No newline at end of file
+<div>
+
+
+
+ <p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy
+ eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam
+ voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet
+ clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit
+ amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam
+ nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat,
+ sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum.
+ Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor
+ sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed
+ diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat,
+ sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum.
+ Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor
+ sit amet.</p>
+
+<h2>Secondary header</h2>
+
+ <p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy
+ eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam
+ voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet
+ clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit
+ amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam
+ nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat,
+ sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum.
+ Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor
+ sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed
+ diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat,
+ sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum.
+ Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor
+ sit amet.</p>
+
+<h2>Secondary header</h2>
+
+ </div> \ No newline at end of file
diff --git a/test/test-pages/mozilla-1/expected.html b/test/test-pages/mozilla-1/expected.html
index 5d57295..89af93d 100644
--- a/test/test-pages/mozilla-1/expected.html
+++ b/test/test-pages/mozilla-1/expected.html
@@ -1,57 +1,118 @@
- <div role="main" id="main-content">
- <section id="intro">
+<div>
+ <section id="intro">
+ <div class="container">
+
+
+ <p class="lead">It’s easier than ever to personalize Firefox and make it work the way
+ you do.
+ <br class="wide-br"></br>No other browser gives you so much choice and flexibility.</p>
+ <div class="animation-wrapper" id="flexible-top-animation">
+ <img alt="" class="fallback"
+ src="http://mozorg.cdn.mozilla.net/media/img/firefox/desktop/customize/animations/flexible-top-fallback.c960365ba781.png"></img>
+ </div>
+ </div>
+ </section>
+ <section class="ga-section" data-ga-label="Designed to be redesigned" id="designed">
+ <div class="container">
+ <div id="designed-copy">
+ <h2>Designed to <br class="wide-br"></br>be redesigned</h2>
+
+ <p>Get fast and easy access to the features you use most in the new menu.
+ Open the “Customize” panel to add, move or remove any button you want.
+ Keep your favorite features — add-ons, private browsing, Sync and more
+ — one quick click away.</p>
+ <img alt="" class="js " data-high-res="true"
+ data-high-res-src="http://mozorg.cdn.mozilla.net/media/img/firefox/desktop/customize/designed-redesigned-high-res.6efd60766484.png"
+ data-processed="false"
+ data-src="http://mozorg.cdn.mozilla.net/media/img/firefox/desktop/customize/designed-redesigned.fbd3ee9402e6.png"
+ id="designed-mobile" src=""></img></div>
+ <div class="animation-wrapper" id="flexible-bottom-animation">
+ <img alt="" class="fallback"
+ src="http://mozorg.cdn.mozilla.net/media/img/firefox/desktop/customize/animations/flexible-bottom-fallback.cafd48a3d0a4.png"></img>
+ </div>
+ </div>
+ </section>
+ <section class="ga-section" data-ga-label="More ways to customize" id="customize">
+ </section>
+ <div id="customizers-wrapper">
+ <section aria-labelledby="customize-themes" class="customizer active" id="themes" role="tabpanel">
<div class="container">
- <p class="lead">It’s easier than ever to personalize Firefox and make it work the way you do.
- <br class="wide-br"/>No other browser gives you so much choice and flexibility.</p>
- <div class="animation-wrapper" id="flexible-top-animation"><img src="http://mozorg.cdn.mozilla.net/media/img/firefox/desktop/customize/animations/flexible-top-fallback.c960365ba781.png" class="fallback" alt=""/></div>
+ <div class="customizer-copy">
+ <h3>Themes</h3>
+
+ <p class="lead">Make Firefox match your style. Choose from thousands of themes and dress
+ up your browser with a single click.</p>
+ <p>
+ <button aria-controls="theme-demo" id="theme-yellow" type="button">Preview yellow theme</button>
+ <button aria-controls="theme-demo" id="theme-green" type="button">Preview green theme</button>
+ <button aria-controls="theme-demo" id="theme-blue" type="button">Preview blue theme</button>
+ <button aria-controls="theme-demo" class="selected" id="theme-red" type="button">Preview red
+ theme
+ </button>
+ </p>
+ <a class="more" href="https://addons.mozilla.org/firefox/themes/" rel="external">Try it now</a>
+
+ <br></br><a class="more" href="https://support.mozilla.org/kb/use-themes-change-look-of-firefox"
+ rel="external">Learn more</a>
+
+ </div>
+ <a class="next show-customizer" href="#add-ons" role="button">Next</a>
+
+ <div class="customizer-visual">
+ <img alt="Preview of the currently selected theme" id="theme-demo"
+ src="http://mozorg.cdn.mozilla.net/media/img/firefox/desktop/customize/theme-red.61611c5734ab.png"></img>
+ </div>
</div>
</section>
- <section id="designed" class="ga-section" data-ga-label="Designed to be redesigned">
+ <section aria-labelledby="customize-addons" class="customizer" id="add-ons" role="tabpanel">
<div class="container">
- <div id="designed-copy">
- <h2>Designed to <br class="wide-br"/>be redesigned</h2>
- <p>Get fast and easy access to the features you use most in the new menu. Open the “Customize” panel to add, move or remove any button you want. Keep your favorite features — add-ons, private browsing, Sync and more — one quick click away.</p><img class="js " src="" data-processed="false" data-src="//mozorg.cdn.mozilla.net/media/img/firefox/desktop/customize/designed-redesigned.fbd3ee9402e6.png" data-high-res="true" data-high-res-src="//mozorg.cdn.mozilla.net/media/img/firefox/desktop/customize/designed-redesigned-high-res.6efd60766484.png" alt="" id="designed-mobile"/></div>
- <div class="animation-wrapper" id="flexible-bottom-animation"><img src="http://mozorg.cdn.mozilla.net/media/img/firefox/desktop/customize/animations/flexible-bottom-fallback.cafd48a3d0a4.png" class="fallback" alt=""/></div>
+ <div class="customizer-copy">
+ <h3>Add-ons</h3>
+ <a class="next show-customizer" href="#awesome-bar" role="button">Next</a>
+
+ <p class="lead">Add-ons are like apps that you install to add features to Firefox. They
+ let you compare prices, check the weather, listen to music, send a tweet
+ and more.</p>
+ <ul>
+ <li>Read the latest news &amp; blogs</li>
+ <li>Manage your downloads</li>
+ <li>Watch videos &amp; view photos</li>
+ </ul>
+ <a class="more" href="https://addons.mozilla.org/firefox/extensions/?sort=featured" rel="external">Here
+ are a few of our favorites</a>
+
+ <br></br><a class="more"
+ href="https://support.mozilla.org/kb/find-and-install-add-ons-add-features-to-firefox"
+ rel="external">Learn more</a>
+
+ </div>
+
+ <div class="customizer-visual">
+ <img alt=""
+ src="http://mozorg.cdn.mozilla.net/media/img/firefox/desktop/customize/add-ons.63a4b761f822.png"></img>
+ </div>
</div>
</section>
- <section id="customize" class="ga-section" data-ga-label="More ways to customize"> </section>
- <div id="customizers-wrapper">
- <section class="customizer active" id="themes" role="tabpanel" aria-labelledby="customize-themes">
- <div class="container">
- <div class="customizer-copy">
- <h3>Themes</h3>
- <p class="lead">Make Firefox match your style. Choose from thousands of themes and dress up your browser with a single click.</p>
- <p id="themes-thumbs">
- <button type="button" aria-controls="theme-demo" id="theme-yellow">Preview yellow theme</button>
- <button type="button" aria-controls="theme-demo" id="theme-green">Preview green theme</button>
- <button type="button" aria-controls="theme-demo" id="theme-blue">Preview blue theme</button>
- <button type="button" aria-controls="theme-demo" id="theme-red" class="selected">Preview red theme</button>
- </p><a class="more" rel="external" href="https://addons.mozilla.org/firefox/themes/">Try it now</a>
- <br/><a class="more" rel="external" href="https://support.mozilla.org/kb/use-themes-change-look-of-firefox">Learn more</a></div><a class="next show-customizer" href="#add-ons" role="button">Next</a>
- <div class="customizer-visual"><img id="theme-demo" src="http://mozorg.cdn.mozilla.net/media/img/firefox/desktop/customize/theme-red.61611c5734ab.png" alt="Preview of the currently selected theme"/></div>
- </div>
- </section>
- <section class="customizer" id="add-ons" role="tabpanel" aria-labelledby="customize-addons">
- <div class="container">
- <div class="customizer-copy">
- <h3>Add-ons</h3><a class="next show-customizer" href="#awesome-bar" role="button">Next</a>
- <p class="lead">Add-ons are like apps that you install to add features to Firefox. They let you compare prices, check the weather, listen to music, send a tweet and more.</p>
- <ul>
- <li>Read the latest news &amp; blogs</li>
- <li>Manage your downloads</li>
- <li>Watch videos &amp; view photos</li>
- </ul><a class="more" rel="external" href="https://addons.mozilla.org/firefox/extensions/?sort=featured">Here are a few of our favorites</a>
- <br/><a class="more" rel="external" href="https://support.mozilla.org/kb/find-and-install-add-ons-add-features-to-firefox">Learn more</a></div>
- <div class="customizer-visual"><img src="http://mozorg.cdn.mozilla.net/media/img/firefox/desktop/customize/add-ons.63a4b761f822.png" alt=""/></div>
+ <section aria-labelledby="customize-awesomebar" class="customizer" id="awesome-bar" role="tabpanel">
+ <div class="container">
+ <div class="customizer-copy">
+ <h3>Awesome Bar</h3>
+ <a class="next show-customizer" href="#themes" role="button">Next</a>
+
+ <p class="lead">The Awesome Bar learns as you browse to make your version of Firefox unique.
+ Find and return to your favorite sites without having to remember a URL.</p>
+ <a class="more"
+ href="https://support.mozilla.org/kb/awesome-bar-find-your-bookmarks-history-and-tabs"
+ rel="external">See what it can do for you</a>
</div>
- </section>
- <section class="customizer" id="awesome-bar" role="tabpanel" aria-labelledby="customize-awesomebar">
- <div class="container">
- <div class="customizer-copy">
- <h3>Awesome Bar</h3><a class="next show-customizer" href="#themes" role="button">Next</a>
- <p class="lead">The Awesome Bar learns as you browse to make your version of Firefox unique. Find and return to your favorite sites without having to remember a URL.</p><a class="more" rel="external" href="https://support.mozilla.org/kb/awesome-bar-find-your-bookmarks-history-and-tabs">See what it can do for you</a></div>
- <div class="customizer-visual"><img src="http://mozorg.cdn.mozilla.net/media/img/firefox/desktop/customize/awesome-bar.437df162126c.png" alt="Firefox Awesome Bar"/></div>
+ <div class="customizer-visual">
+ <img alt="Firefox Awesome Bar"
+ src="http://mozorg.cdn.mozilla.net/media/img/firefox/desktop/customize/awesome-bar.437df162126c.png"></img>
</div>
- </section>
- </div>
- <section id="sync" class="ga-section" data-ga-label="Keep your Firefox in Sync"> </section> \ No newline at end of file
+ </div>
+ </section>
+ </div>
+
+ <section class="ga-section" data-ga-label="Keep your Firefox in Sync" id="sync">
+ </section>
+</div> \ No newline at end of file
diff --git a/test/test-pages/mozilla-2/expected.html b/test/test-pages/mozilla-2/expected.html
index 5135a8b..7a14801 100644
--- a/test/test-pages/mozilla-2/expected.html
+++ b/test/test-pages/mozilla-2/expected.html
@@ -1,52 +1,77 @@
- <div role="main" class="sync-reminder">
- <section class="intro container">
- <header>
- <p>Get to know the features that make it the most complete browser for building the Web.</p>
- </header>
- <ul class="features">
- <li class="feature">
- <a href="https://www.youtube.com/watch?v=1R9_WdXwUsE" rel="external" class="video-play"> <img src="http://mozorg.cdn.mozilla.net/media/img/firefox/firstrun/dev/feature-webide.16763db341cb.jpg" alt="Screenshot" class="screenshot"/> </a>
- <h2>WebIDE</h2>
- <p>Develop, deploy and debug Firefox OS apps directly in your browser, or on a Firefox OS device, with this tool that replaces App Manager.</p> <a href="https://developer.mozilla.org/docs/Tools/WebIDE" rel="external" class="more">Learn more about WebIDE</a> </li>
- <li class="feature">
- <a href="https://www.youtube.com/watch?v=eH0R10Ga4Hs" rel="external" class="video-play"> <img src="http://mozorg.cdn.mozilla.net/media/img/firefox/firstrun/dev/feature-valence.251f9def4d8d.jpg" alt="Screenshot" class="screenshot"/> </a>
- <h2>Valence</h2>
- <p>Develop and debug your apps across multiple browsers and devices with this powerful extension that comes pre-installed with Firefox Developer Edition.</p> <a href="https://developer.mozilla.org/docs/Tools/Firefox_Tools_Adapter" rel="external" class="more">Learn more about Valence</a> </li>
- </ul>
- <div class="notice">
- <h4>Important: Sync your new profile</h4>
- <p> Developer Edition comes with a new profile so you can run it alongside other versions of Firefox. To access your bookmarks, browsing history and more, you need to sync the profile with your existing Firefox Account, or create a new one. <a href="https://support.mozilla.org/kb/recover-lost-bookmarks-firefox-developer-edition" rel="external" class="more">Learn more</a> </p>
- </div>
- </section>
- <section class="more-features">
- <div class="container">
- <header>
- <h2>Features and tools</h2> </header>
- <ul class="features">
- <li class="feature">
- <a href="https://www.youtube.com/watch?v=eQqNfkqIJdw" rel="external" class="video-play"> <img src="http://mozorg.cdn.mozilla.net/media/img/firefox/firstrun/dev/feature-inspector.c791bf1f1a59.jpg" alt="Screenshot" class="screenshot"/> </a>
- <h2>Page Inspector</h2>
- <p>Examine the HTML and CSS of any Web page and easily modify the structure and layout of a page.</p> <a href="https://developer.mozilla.org/docs/Tools/Page_Inspector" rel="external" class="more">Learn more about Page Inspector</a> </li>
- <li class="feature">
- <a href="https://www.youtube.com/watch?v=iEDk8o9ehlw" rel="external" class="video-play"> <img src="http://mozorg.cdn.mozilla.net/media/img/firefox/firstrun/dev/feature-console.42666aaf6d03.jpg" alt="Screenshot" class="screenshot"/> </a>
- <h2>Web Console</h2>
- <p>See logged information associated with a Web page and use Web Console to interact with Web pages using JavaScript.</p> <a href="https://developer.mozilla.org/docs/Tools/Web_Console" rel="external" class="more">Learn more about Web Console</a> </li>
- <li class="feature">
- <a href="https://www.youtube.com/watch?v=OS4AxYFLCIE" rel="external" class="video-play"> <img src="http://mozorg.cdn.mozilla.net/media/img/firefox/firstrun/dev/feature-debugger.02ed86fb0c9f.jpg" alt="Screenshot" class="screenshot"/> </a>
- <h2>JavaScript Debugger</h2>
- <p>Step through JavaScript code and examine or modify its state to help track down bugs.</p> <a href="https://developer.mozilla.org/docs/Tools/Debugger" rel="external" class="more">Learn more about JavaScript Debugger</a> </li>
- <li class="feature">
- <a href="https://www.youtube.com/watch?v=w4zSG53Qlbk" rel="external" class="video-play"> <img src="http://mozorg.cdn.mozilla.net/media/img/firefox/firstrun/dev/feature-network.740d6082b3f6.jpg" alt="Screenshot" class="screenshot"/> </a>
- <h2>Network Monitor</h2>
- <p>See all the network requests your browser makes, how long each request takes and details of each request.</p> <a href="https://developer.mozilla.org/docs/Tools/Network_Monitor" rel="external" class="more">Learn more about Network Monitor</a> </li>
- <li class="feature">
- <a href="https://www.youtube.com/watch?v=R_qDaLQ8ghg" rel="external" class="video-play"> <img src="http://mozorg.cdn.mozilla.net/media/img/firefox/firstrun/dev/feature-webaudio.a10ebc48d017.jpg" alt="Screenshot" class="screenshot"/> </a>
- <h2>Web Audio Editor</h2>
- <p>Inspect and interact with Web Audio API in real time to ensure that all audio nodes are connected in the way you expect.</p> <a href="https://developer.mozilla.org/docs/Tools/Web_Audio_Editor" rel="external" class="more">Learn more about Web Audio Editor</a> </li>
- <li class="feature">
- <a href="https://www.youtube.com/watch?v=3kdBvvIZIqU" rel="external" class="video-play"> <img src="http://mozorg.cdn.mozilla.net/media/img/firefox/firstrun/dev/feature-style-editor.87c5d2017506.jpg" alt="Screenshot" class="screenshot"/> </a>
- <h2>Style Editor</h2>
- <p>View and edit CSS styles associated with a Web page, create new ones and apply existing CSS stylesheets to any page.</p> <a href="https://developer.mozilla.org/docs/Tools/Style_Editor" rel="external" class="more">Learn more about Style Editor</a> </li>
- </ul>
- </div>
- </section> \ No newline at end of file
+<div><section class="intro container"><header>
+ <p>Get to know the features that make it the most complete browser for building the Web.</p>
+ </header><ul class="features"><li class="feature">
+ <a class="video-play" href="https://www.youtube.com/watch?v=1R9_WdXwUsE" rel="external">
+ <img alt="Screenshot" class="screenshot" src="//mozorg.cdn.mozilla.net/media/img/firefox/firstrun/dev/feature-webide.16763db341cb.jpg"></img></a>
+ <h2>WebIDE</h2>
+ <p>Develop, deploy and debug Firefox OS apps directly in your browser, or on a Firefox OS device, with this tool that replaces App Manager.</p>
+ <a class="more" href="https://developer.mozilla.org/docs/Tools/WebIDE" rel="external">Learn more about WebIDE</a>
+
+ </li>
+ <li class="feature">
+ <a class="video-play" href="https://www.youtube.com/watch?v=eH0R10Ga4Hs" rel="external">
+ <img alt="Screenshot" class="screenshot" src="//mozorg.cdn.mozilla.net/media/img/firefox/firstrun/dev/feature-valence.251f9def4d8d.jpg"></img></a>
+ <h2>Valence</h2>
+ <p>Develop and debug your apps across multiple browsers and devices with this powerful extension that comes pre-installed with Firefox Developer Edition.</p>
+ <a class="more" href="https://developer.mozilla.org/docs/Tools/Firefox_Tools_Adapter" rel="external">Learn more about Valence</a>
+
+ </li>
+ </ul><div class="notice">
+ <h4>Important: Sync your new profile</h4>
+ <p>
+ Developer Edition comes with a new profile so you can run it alongside other versions of Firefox. To access your bookmarks, browsing history and more, you need to sync the profile with your existing Firefox Account, or create a new one.
+ <a class="more" href="https://support.mozilla.org/kb/recover-lost-bookmarks-firefox-developer-edition" rel="external">Learn more</a>
+ </p>
+ </div>
+ </section><section class="more-features"><div class="container">
+ <header><h2>Features and tools</h2>
+ </header><ul class="features"><li class="feature">
+ <a class="video-play" href="https://www.youtube.com/watch?v=eQqNfkqIJdw" rel="external">
+ <img alt="Screenshot" class="screenshot" src="//mozorg.cdn.mozilla.net/media/img/firefox/firstrun/dev/feature-inspector.c791bf1f1a59.jpg"></img></a>
+ <h2>Page Inspector</h2>
+ <p>Examine the HTML and CSS of any Web page and easily modify the structure and layout of a page.</p>
+ <a class="more" href="https://developer.mozilla.org/docs/Tools/Page_Inspector" rel="external">Learn more about Page Inspector</a>
+
+ </li>
+ <li class="feature">
+ <a class="video-play" href="https://www.youtube.com/watch?v=iEDk8o9ehlw" rel="external">
+ <img alt="Screenshot" class="screenshot" src="//mozorg.cdn.mozilla.net/media/img/firefox/firstrun/dev/feature-console.42666aaf6d03.jpg"></img></a>
+ <h2>Web Console</h2>
+ <p>See logged information associated with a Web page and use Web Console to interact with Web pages using JavaScript.</p>
+ <a class="more" href="https://developer.mozilla.org/docs/Tools/Web_Console" rel="external">Learn more about Web Console</a>
+
+ </li>
+ <li class="feature">
+ <a class="video-play" href="https://www.youtube.com/watch?v=OS4AxYFLCIE" rel="external">
+ <img alt="Screenshot" class="screenshot" src="//mozorg.cdn.mozilla.net/media/img/firefox/firstrun/dev/feature-debugger.02ed86fb0c9f.jpg"></img></a>
+ <h2>JavaScript Debugger</h2>
+ <p>Step through JavaScript code and examine or modify its state to help track down bugs.</p>
+ <a class="more" href="https://developer.mozilla.org/docs/Tools/Debugger" rel="external">Learn more about JavaScript Debugger</a>
+
+ </li>
+ <li class="feature">
+ <a class="video-play" href="https://www.youtube.com/watch?v=w4zSG53Qlbk" rel="external">
+ <img alt="Screenshot" class="screenshot" src="//mozorg.cdn.mozilla.net/media/img/firefox/firstrun/dev/feature-network.740d6082b3f6.jpg"></img></a>
+ <h2>Network Monitor</h2>
+ <p>See all the network requests your browser makes, how long each request takes and details of each request.</p>
+ <a class="more" href="https://developer.mozilla.org/docs/Tools/Network_Monitor" rel="external">Learn more about Network Monitor</a>
+
+ </li>
+ <li class="feature">
+ <a class="video-play" href="https://www.youtube.com/watch?v=R_qDaLQ8ghg" rel="external">
+ <img alt="Screenshot" class="screenshot" src="//mozorg.cdn.mozilla.net/media/img/firefox/firstrun/dev/feature-webaudio.a10ebc48d017.jpg"></img></a>
+ <h2>Web Audio Editor</h2>
+ <p>Inspect and interact with Web Audio API in real time to ensure that all audio nodes are connected in the way you expect.</p>
+ <a class="more" href="https://developer.mozilla.org/docs/Tools/Web_Audio_Editor" rel="external">Learn more about Web Audio Editor</a>
+
+ </li>
+ <li class="feature">
+ <a class="video-play" href="https://www.youtube.com/watch?v=3kdBvvIZIqU" rel="external">
+ <img alt="Screenshot" class="screenshot" src="//mozorg.cdn.mozilla.net/media/img/firefox/firstrun/dev/feature-style-editor.87c5d2017506.jpg"></img></a>
+ <h2>Style Editor</h2>
+ <p>View and edit CSS styles associated with a Web page, create new ones and apply existing CSS stylesheets to any page.</p>
+ <a class="more" href="https://developer.mozilla.org/docs/Tools/Style_Editor" rel="external">Learn more about Style Editor</a>
+
+ </li>
+ </ul></div>
+ </section></div> \ No newline at end of file
diff --git a/test/test-pages/remove-extra-brs/expected.html b/test/test-pages/remove-extra-brs/expected.html
index 87daa8a..3766c0f 100644
--- a/test/test-pages/remove-extra-brs/expected.html
+++ b/test/test-pages/remove-extra-brs/expected.html
@@ -1,10 +1,16 @@
- <div>
- <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
- <p>
- <p>Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
- </p>
- <p>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
- </div>
- <div>
- <p>Tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
- <p>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p> \ No newline at end of file
+<div>
+ <br></br><p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
+ tempor incididunt ut labore et dolore magna aliqua.</p>
+ <p><p>Ut enim ad minim veniam,
+ quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
+ consequat.</p><p>Duis aute irure dolor in reprehenderit in voluptate velit esse
+ cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
+ proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
+ </p></div><div>
+ <p>Tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
+ quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
+ consequat.</p>
+ <p>Duis aute irure dolor in reprehenderit in voluptate velit esse
+ cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
+ proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
+ </div> \ No newline at end of file
generated by cgit v1.2.3 (git 2.25.1) at 2024-07-08 16:38:25 +0000