Add blog

_config.yml

@@ -25,9 +25,13 @@ sass:
     sass_dir: _sass
 collections_dir: collections
 collections:
+  posts:
+    permalink: /blog/:year/:month/:day/:title
   evergreen:
     output: true
     permalink: /:name
+  authors:
+    permalink: /blog/authors/:name
 
 # Build settings
 markdown: kramdown

_includes/footer.html

@@ -1,5 +1,5 @@
 <hr class="m-5" />
 
-<p><em><strong>Privacy Guides</strong> is a socially motivated website that provides information for protecting your data security and privacy. Never trust any company with your privacy, always encrypt.</em></p>
+<p><em><strong>Privacy Guides</strong> is a socially motivated website that provides information for protecting your data security and privacy.</em></p>
 
 <p><i class="fab fa-creative-commons fa-fw"></i><i class="fab fa-creative-commons-by fa-fw"></i><i class="fab fa-creative-commons-nc fa-fw"></i> Unless otherwise noted, the content of this website is licensed under a <a href="http://creativecommons.org/licenses/by-nc/4.0/">Creative Commons Attribution-NonCommercial 4.0 International License</a>. <span class="text-muted">The underlying source code used to format and display this content is not licensed for third-party use unless otherwise noted.</span></p>

_includes/nav.html

@@ -1,6 +1,8 @@
 <nav class="navbar navbar-expand-lg navbar-light bg-light">
   <div class="container">
-    <h1><a class="navbar-brand" href="/"><img src="/assets/img/layout/privacy-guides-logo.png" alt="{{ site.title }}" width="243" height="32" /></a></h1>
+    <a class="navbar-brand" href="/">
+      <h1 class="text-hide" style="background-image: url('/assets/img/layout/privacy-guides-logo.png'); width: 243px; height: 32px; background-size: contain;">Privacy Guides</h1>
+    </a>
     <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarTogglerDemo02" aria-controls="navbarTogglerDemo02" aria-expanded="false" aria-label="Toggle navigation">
       <span class="navbar-toggler-icon"></span>
     </button>
@@ -11,13 +13,7 @@
           <a class="nav-link" href="/">Home</a>
         </li>
         <li class="nav-item">
-          <a class="nav-link" href="/#homeserverinfo">Connect</a>
-        </li>
-        <li class="nav-item">
-          <a class="nav-link" href="/#contact">Contact</a>
-        </li>
-        <li class="nav-item">
-          <a class="nav-link" href="/privacy/">Privacy</a>
+          <a class="nav-link" href="/blog/">Blog</a>
         </li>
       </ul>
     </div>

_layouts/post.html

@@ -0,0 +1,25 @@
+---
+layout: default
+---
+
+<div class="p-5 mb-3 bg-white"{%- if page.cover -%} style="background-image: url(/assets/img/blog/{{ page.cover }}); background-size: cover;"{%- endif -%}>
+  <div class="container">
+    <div class="post-cover">
+      <div class="inner d-flex flex-column align-self-end" style="min-height: 300px;">
+        <div class="mt-auto">
+          <h1 class="post-title display-4">{{ page.title }}</h1>
+        </div>
+        <div class="mt-5">
+          <p class="post-info">Jonah Aragon | {{ page.date | date: "%b %-d, %Y" }}</p>
+        </div>
+      </div>
+    </div>
+  </div>
+</div>
+<div class="container my-5">
+  {{ content }}
+  {% if page.canonical or page.cover_src_publisher %}<hr class="m-5" />
+  {% if page.cover_src_publisher %}<p><em>Cover photo: <a href="{{ page.cover_src }}">{{ page.cover_src_publisher }}</a>. Used with permission.</em></p>{% endif %}
+  {% if page.canonical %}<p><em>This post was originally published on <a href="{{ page.canonical }}">{% if page.canonical_publisher %}{{ page.canonical_publisher }}{% else %}{{ page.canonical }}{% endif %}</a> and has been syndicated here with the permission of the author or publication.</em>{% endif %}</p>{% endif %}
+  {% include footer.html %}
+</div>

assets/css/app.scss

@@ -25,3 +25,13 @@ h1, h2, h3, h4 {
 
 // import /_sass/bootstrap.scss
 @import "bootstrap";
+
+.post-info, .post-title {
+  background-color: theme-color("secondary");
+  color: theme-color("light");
+  display: inline;
+  padding: $spacer;
+  /* Needs prefixing */
+  -webkit-box-decoration-break: clone;
+  box-decoration-break: clone;
+}

blog.html

@@ -0,0 +1,23 @@
+---
+layout: page
+title: Blog
+permalink: /blog/
+---
+
+<div class="blog mt-5">
+  <div class="row">
+  {% for post in site.posts %}
+    <div class="col-6">
+      <a href="{{ post.url | prepend: site.baseurl }}" class="text-decoration-none">
+        <div class="card bg-secondary" {%- if post.cover -%} style="background-image: linear-gradient(to bottom, rgba(40, 50, 63, 0.3), rgba(40, 50, 63, 0.9)), url(/assets/img/blog/{{ post.cover }}); background-size: cover;"{%- endif -%}>
+          <div class="card-body d-flex flex-column align-self-end" style="min-height: 300px;">
+            <h2 class="card-title mt-auto text-light">{{ post.title }}</h2>
+            <p class="card-text text-light">{{ post.excerpt }} <strong>Continue Reading...</strong></p>
+            <p class="card-text"><small class="text-light">{{ post.author }} - {{ post.date | date: "%b %-d, %Y" }}</small></p>
+          </div>
+        </div>
+      </a>
+    </div>
+  {% endfor %}
+  </div>
+</div>

collections/_posts/2019-10-05-understanding-vpns.md

@@ -0,0 +1,63 @@
+---
+title: Understanding VPNs
+author: Jonah Aragon
+cover: understanding-vpns-cover.jpg
+cover_src: 'https://unsplash.com/@freeche'
+cover_src_publisher: Kvistholt Photography
+canonical: 'https://blog.privacytools.io/understanding-vpns/'
+canonical_publisher: the PrivacyTools Blog
+layout: post
+excerpt: A VPN is a tool that secures your internet connection from attackers on your network...
+---
+
+<p class="lead">A <strong>VPN</strong> — or <strong>Virtual Private Network</strong> — is a tool that secures your internet connection from attackers on your network. But before I explain how that all works, let's talk about the internet without them.</p>
+
+Your Internet Service Provider (ISP) can see everything you do online. Well, nearly everything: When websites use HTTPS (or TLS, or SSL. these terms are often used interchangeably when referring to website encryption), indicated by the padlock in your web browser, your ISP cannot see exactly what you're doing on the website. So, they usually can't see what specific pages you look at or what you type in to forms. However, they can still see what websites you're visiting (domains and IP addresses).
+
+That sounds bad, right? But that’s not even the worst part! (I know, right?) Not only can your ISP see what you’re doing online, they can (and do) insert ads into websites, sell your browsing history (which is now legal in the US), restrict access to some websites, and do other awful stuff, because <mark>your ISP complete control over your Internet connection</mark>.
+
+Furthermore, this doesn't only happen at your home. Every network you connect to—your cellular network, your Wi-Fi at work, the internet at Starbucks—has their own ISP that will be able to read your data.
+
+Fortunately, more and more websites are beginning to use HTTPS, thanks to free certificates from Let's Encrypt and Cloudflare. But many sites still don't (at least by default), and even HTTPS doesn't solve the problem that your ISP can see the websites you're visiting.
+
+## How VPNs can protect us
+
+Luckily, you can hide all this information from your ISP using a VPN. Instead of letting your ISP see all the websites you visit, VPNs only let them see that you are connected (using an **encrypted** connection) to the VPN provider's servers.
+
+*Basically, instead of connecting directly to the Internet, you connect to one of your VPN providers’ servers, which connects you to the Internet.*
+
+So, `you <----> Internet` becomes `you <----> VPN <----> Internet` and your ISP can only see the `you <----> VPN` part.
+
+## More ways VPNs can protect us
+
+So VPNs are pretty handy, but hiding your traffic from your ISP isn't the only advantage a VPN provides.
+
+Did you know that if you’re on a public Wi-Fi network, <mark>anyone connected to the same network can see as much as your ISP can</mark>? Obviously, this isn’t an issue at home, unless you have very creepy neighbors and an open Wi-Fi network. However, it is a problem in public places with Wi-Fi, such as cafés.
+
+Because your connection to the VPN is **encrypted** and it’s the only active connection on your device, that creepy guy with the laptop sitting in the corner is no longer a threat to your Internet connection. Like the ISP, the only thing he'd be able to see is that single connection to your VPN.
+
+So, is that all? Not yet. There’s still one big advantage. Websites that you’re connected to can see this (usually) near-unique identifier called an **IP address**. But when you use a VPN the websites don’t see your IP address, they see one of the VPN server's IP addresses.
+
+This also provides an added side-benefit: Most VPN providers have servers in many countries, thus you can make it appear to websites as if you’re browsing from a completely different country (which apart from privacy is useful due to some content and services being available only to specific regions, like Netflix and Hulu).
+
+But even if you use a different IP address than your “normal” one,  isn’t it still personally identifiable? Nope. Many people use the same  server, letting the websites you visit see only that you’re using the  same VPN as many other people.
+
+## Drawbacks of a VPN
+
+But VPNs aren't all powerful tools to protect your privacy. In fact, there are a number of glaring issues that should not be overlooked when making the decision to use one.
+
+Most importantly, using a VPN only *shifts* the power to view your traffic from your ISP to the VPN provider itself. That means that all the traffic your ISP used to be able to see, your VPN provider will still be able to. Therefore, choosing a trustworthy VPN is important. Many will be able to find a provider that they can trust more than their ISP, but some may not.
+
+Using a commercial VPN provider is almost like entrusting your data to a black box. There are no ways to verify claims like "no logging", you just need to take them at their word. Some providers will work harder than others to validate their claims for you—by releasing audits of their policies and code for example—, but at the end of the day it ultimately comes down to trust.
+
+Finally, using a VPN will not make you anonymous in any way. Your VPN provider or especially dedicated attackers will be able to trace a connection back to you fairly trivially. Your VPN provider will also likely have a money trail leading back to you.
+
+## So what?
+
+If you're looking for perfect anonymity, there are better options. Software like the Tor Browser provides privacy and anonymity *by design*, whereas VPNs provide privacy based on trust alone. You cannot rely on "no logging" claims to protect you.
+
+If you just need protection on a public Wi-Fi network, from your ISP, or just from copyright warnings in the mail, a VPN might be the solution for you.
+
+PrivacyTools's [VPN Providers](https://www.privacytools.io/providers/vpn/) page lists some recommendations and reasonings for privacy-respecting and trustworthy VPN providers.
+
+Wondering what exactly makes a VPN choice good or bad? We've published a guide on some of the criteria we use to evaluate VPN providers. Looking into the details of any VPN provider you choose will help you make a more fully informed decision about who you trust your internet traffic to.