crypto-trend-following/index.html at master · ajfryer/crypto-trend-following · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta http-equiv="X-UA-Compatible" content="ie=edge" />
    <title>Crypto Trend Following</title>
    <link rel="shortcut icon" href="#" />
    <link rel="icon" type="image/png" sizes="32x32" href="img/favicon.ico" />
    <link
      href="https://fonts.googleapis.com/css?family=IBM+Plex+Sans:100,200,300,400,500,600,700&display=swap"
      rel="stylesheet"
    />
    <link
      rel="stylesheet"
      href="https://cdnjs.cloudflare.com/ajax/libs/normalize/8.0.1/normalize.min.css"
      integrity="sha512-NhSC1YmyruXifcj/KFRWoC561YpHpc5Jtzgvbuzx5VozKpWvQ+4nXhPdFgmx8xqexRcpAglTj9sIBWINXa8x5w=="
      crossorigin="anonymous"
    />
    <link href="css/index.css" rel="stylesheet" />
  </head>
  <body id="body">
    <nav class="invisible" id="nav">
      <div class="content">
        <a class="brand" href="#body">
          <img src="img/logo.svg" alt="CTF logo" />
          CTF
        </a>
        <a href="#footer">About</a>
        <a href="app.html" class="button get-started-button">Get Started</a>
      </div>
    </nav>

    <header>
      <div class="content">
        <div class="img">
          <img
            src="img/header.svg"
            alt="header image. illustration of trend following"
          />
        </div>
        <div class="txt">
          <h1>
            <span
              >Crypto<br />
              Trend Following</span
            ><br />
            Do more than HODL
          </h1>
          <p class="valueprop">
            Simulate hedge-fund-like Trend Following strategies on popular
            crypto coins
            <span>- for free.</span><br />
          </p>
          <a
            href="app.html"
            class="button get-started-button"
            name="get-started-button"
            >Get Started</a
          >
        </div>
      </div>
    </header>

    <section id="value">
      <div class="content">
        <div class="img">
          <img src="img/value.svg" alt="" />
        </div>
        <div class="txt">
          <h2>
            100% HODL isn't for everyone
          </h2>
          <p>
            You know crypto markets boom and bust - You Hold On for Dear Life.
            But did you know you could diversify your HODL?
          </p>
          <p>
            Unlike HODL, Trend Following strategies actively manage risk. They
            invest more when prices trend calmly, and less when they don't.
          </p>
          <p>
            Because they perform differently, HODL and Trend Following
            strategies can diversify each other.
          </p>
          <p>
            <span>
              Diversification can smooth your returns and make your overall
              portfolio less susceptible to booms and busts.
            </span>
          </p>
        </div>
      </div>
    </section>

    <section id="proof">
      <div class="content">
        <div class="img">
          <img src="img/proof.svg" alt="" />
        </div>
        <div class="txt">
          <h2>
            Large Funds Use Trend Following
          </h2>
          <p>
            For decades, multi-billion dollar funds have diversified their
            portfolios with trend following strategies.
          </p>

          <p>
            They start with a diverse universe of many markets. They trend
            follow on every market they can find.
          </p>

          <p>
            Each day, they invest more in markets with stable trends and less
            money in markets with volatile non-trends.
          </p>
          <p>
            <span>
              Over time, their goal is to own big trends and nothing else. You
              can use Trend Following on coins in your crypto portfolio!
            </span>
          </p>
        </div>
      </div>
    </section>

    <section id="call-to-action">
      <div class="content">
        <h2>
          How does this site work?
        </h2>
        <div class="cards">
          <div class="card">
            <img src="img/step-1.svg" alt="" />
            <h3>1. Click Get Started</h3>
            <p>
              Crypto Trend Following is a free site that calculates a trend
              following for you. This site doesn't manage money for you. Click
              Get Started to configure your own strategy.
            </p>
          </div>
          <div class="card">
            <img src="img/step-2.svg" alt="" />
            <h3>2. Easy Customization</h3>
            <p>
              Customize the "Trend Speed", "volatility", "leverage", and
              "shorting" of your trend following strategy. If you aren't sure
              what to choose, click the "Starter Strategy" button.
            </p>
          </div>
          <div class="card">
            <img src="img/step-3.svg" alt="" />
            <h3>3. Great as a Diversifier, too!</h3>
            <p>
              Trend Following doesn't have to be 100% of your crypto portfolio
              because it can help diversify your existing portfolio. Add as
              little or as much Trend Following as you want.
            </p>
          </div>
        </div>
        <a href="app.html" class="button">Get Started</a>
      </div>
    </section>

    <footer id="footer">
      <div class="content">
        <h2>2020 Crypto Trend Following</h2>

        <section>
          <h3>Aknowledgements</h3>
          <hr />
          <p>
            This is a free site powered by the terrific
            <a href="https://www.alphavantage.co/">alphaVantage api!</a> They
            provide all the market data and I recommend everyone support them!
          </p>

          <p>
            home page illustrations are derivatives of
            <a href="https://undraw.co/">undraw illustrations!</a> This is an
            amazing resource and I highly recommend everyone support this
            awesome project.
          </p>
        </section>

        <section>
          <h3>Contact</h3>
          <hr />
          <p>
            Want a new coin added? Want to discuss the strategy? Want to work
            together? Want to chat about something else?
            <a href="mailto:alex.jeffrey.fryer@gmail.com">Email Me</a>
          </p>
        </section>

        <section>
          <h3>Disclosure</h3>
          <hr />
          <p>
            This site doesn't manage money for you. It is just a mathematical
            simulation of a hypothetical trading strategy. If you choose to
            execute a strategy like anything you see on this site, please
            understand that you may lose all your money. Unless you are working
            with a professional, all trading you do is always at your own risk.
            We don't claim that any data on this site is correct. It has not
            been audited. But we are trying really hard to put out quality work.
            Please get in touch for more details.
          </p>
        </section>
      </div>
    </footer>
    <script
      src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.min.js"
      integrity="sha512-bLT0Qm9VnAYZDflyKcBaQ2gg0hSYNQrJ8RilYldYQ1FxQYoCLtUjuuRuZo+fjqhx/qtq/1itJ0C2ejDxltZVFg=="
      crossorigin="anonymous"
    ></script>
    <script src="js/index.js"></script>
  </body>
</html>