paritybit.ca

Unnamed repository; edit this file 'description' to name the repository.
Log | Files | Refs | README | LICENSE

commit 5cc813f418e971b172618caa5a35144489bf3622
parent ff9a5ff3690911ac773d47a271c96baa46f529de
Author: Jake Bauer <jbauer@paritybit.ca>
Date:   Fri, 28 Feb 2020 22:16:26 -0500

Publish new blog post

Diffstat:
Mpages/blog.md | 1+
Apages/blog/logo-redesign.md | 81+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
Mpages/home.md | 4++--
Mpublic/feeds/blog-feed.xml | 81+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
Mpublic/feeds/sitewide-feed.xml | 81+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
Mpublic/sitemap.xml | 1+
6 files changed, 247 insertions(+), 2 deletions(-)

diff --git a/pages/blog.md b/pages/blog.md @@ -16,6 +16,7 @@ thoughts and ideas. You can find links to other blogs that I follow on my ### 2020 <ul> + <li>2020-02-28 <a href="blog/logo-redesign">Redesigning My Website's Logo</a></li> <li>2020-02-24 <a href="blog/making-my-own-vim-statusline">Making My Own Vim Statusline</a></li> <li>2020-02-14 <a href="blog/urxvt-to-st">Switching from urxvt to st</a></li> <li>2020-02-06 <a href="blog/website-redesign">Making My Website More Accessible</a></li> diff --git a/pages/blog/logo-redesign.md b/pages/blog/logo-redesign.md @@ -0,0 +1,81 @@ +## Redesigning My Website's Logo + +[//]: # "I got tired of the way my old logo looked so when my website redesign was complete I endeavoured to completely redesign my logo. I wanted a logo that was simple and clean looking..." + +[//]: # "main.min.css" + +[//]: # + +<div class="byline"> +<b>Written By:</b> Jake Bauer | + <b>Posted:</b> 2020-02-28 | + <b>Last Updated:</b> 2020-02-28 +</div> + +I got tired of the way my old logo looked so when my website redesign was +complete I endeavoured to completely redesign my logo. I wanted a logo that was +simple and clean looking but also supported being extended through adding +different symbols which represent whichever paritybit site one is visiting. I +also wanted it to be simple and clear enough that it could be recognizable at +many different sizes which is important for a logo which will also be used as a +favicon. A simple logo is also easier to print on mugs and t-shirts ;) + +I used [Inkscape](https://inkscape.org/) to create my logo. Inkscape is a +cross-platform, FLOSS vector graphics editor which I found to be intuitive to +use. It was important that the master copy of my logo be in SVG format so that +it can be scaled to many sizes without becoming pixellated. + +After some work, trials, and revisions, I arrived at the following base logo +design: +<figure> + <a href="/img/logo-256.png"><img src="/img/logo-256.png" + alt="The new logo's base design."/></a> +</figure> +Compare that to the old logo: +<figure> + <a href="/img/old-logo.png"><img src="/img/old-logo.png" + alt="The old paritybit.ca logo."/></a> +</figure> +I liked the colour scheme from my old logo so I decided to keep that. The yellow +circle part of the base design is the spot where I put symbols or emblems to +differentiate one paritybit.ca site or service from another. Take a look below +at the logos for this website and [git.paritybit.ca](https://git.paritybit.ca) +respectively: +<figure> + <a href="/img/logo-main-256.png"><img src="/img/logo-main-256.png" + alt="The new logo design for this website."/></a> +</figure> +<figure> + <a href="/img/logo-git-256.png"><img src="/img/logo-git-256.png" + alt="The new logo design for git.paritybit.ca."/></a> +</figure> +It took me a long time to decide on an appropriate symbol to represent my +website as a whole. I tried some designs related to parity bits similar to my +old logo but none of them felt right. While doing something completely +unrelated, the [glider emblem](http://www.catb.org/hacker-emblem/faqs.html) +popped into my mind and I immediately felt that it would be the perfect symbol +to incorporate into my site's logo. I feel this "hacker emblem" represents the +general values that I want this site to encourage and promote. Particularly, the +values of collaboration and openness. + +In addition, this logo doesn't just represent paritybit.ca; I also use the logo +with the glider as my profile picture across the Internet. It's become a +personal emblem that represents me _and_ my website. + +Luckily, coming up with a design for the git.paritybit.ca logo was much easier. +The licensing information of the Git Logo and the place from where I obtained it +are all detailed in the README of the [paritybit.ca git +repository](https://git.sr.ht/~jbauer/paritybit.ca) +([mirror](https://git.paritybit.ca/jbauer/paritybit.ca)). The SVG files for +these logos are also in the repository under the `build/` directory. + +Finally, in order to make sure that my logo looked good on every platform, I +used a service called [Real Favicon +Generator](https://realfavicongenerator.net/) which takes a logo and generates +the required files, sizes, and formats to make the image appear properly on +every platform. This way, my logo will look good in the browser, on the home +screen of an Android or iOS phone, and even on a MacBook Pro's touch bar. I +highly recommend this service for checking and generating favicons for every +platform. It saved a lot of manual work. + +Happy hacking! diff --git a/pages/home.md b/pages/home.md @@ -20,6 +20,8 @@ page](/about). src="/img/feed-icon.png" width="15" height="15" alt="Click for RSS Feed"/> </a> </div> +2020-02-28 <a class="feed-item" href="blog/logo-redesign">New Blog Post: Redesigning My Website's Logo</a> + 2020-02-24 <a class="feed-item" href="blog/making-my-own-vim-statusline">New Blog Post: Making My Own Vim Statusline</a> 2020-02-14 <a class="feed-item" href="blog/urxvt-to-st">New Blog Post: Switching from urxvt to st</a> @@ -38,8 +40,6 @@ page](/about). 2019-12-20 <a class="feed-item" href="blog/difficulty-of-privacy-education">New Blog Post: The Difficulty of Educating People About Online Privacy</a> -2019-11-26 <a class="feed-item" href="guides/using-rm-with-trash">New Guide: Using the "rm" Command with Trash</a> - ### What is a Parity Bit? It is a bit (in the 1's and 0's sense) used in checking for errors in digital diff --git a/public/feeds/blog-feed.xml b/public/feeds/blog-feed.xml @@ -7,6 +7,87 @@ <description>The latest blog posts from paritybit.ca. </description> <item> + <title>New Blog Post: Redesigning My Website's Logo</title> + <link>https://www.paritybit.ca/blog/logo-redesign</link> + <guid>https://www.paritybit.ca/blog/logo-redesign</guid> + <pubDate>Fri, 28 Feb 2020 22:13:08 -0500</pubDate> + <description><![CDATA[<h2>Redesigning My Website's Logo</h2> + +<div class="byline"> +<b>Written By:</b> Jake Bauer | + <b>Posted:</b> 2020-02-28 | + <b>Last Updated:</b> 2020-02-28 +</div> + +<p>I got tired of the way my old logo looked so when my website redesign was +complete I endeavoured to completely redesign my logo. I wanted a logo that was +simple and clean looking but also supported being extended through adding +different symbols which represent whichever paritybit site one is visiting. I +also wanted it to be simple and clear enough that it could be recognizable at +many different sizes which is important for a logo which will also be used as a +favicon. A simple logo is also easier to print on mugs and t-shirts ;)</p> + +<p>I used <a href="https://inkscape.org/">Inkscape</a> to create my logo. Inkscape is a +cross-platform, FLOSS vector graphics editor which I found to be intuitive to +use. It was important that the master copy of my logo be in SVG format so that +it can be scaled to many sizes without becoming pixellated.</p> + +<p>After some work, trials, and revisions, I arrived at the following base logo +design: +<figure> + <a href="/img/logo-256.png"><img src="/img/logo-256.png" + alt="The new logo's base design."/></a> +</figure> +Compare that to the old logo: +<figure> + <a href="/img/old-logo.png"><img src="/img/old-logo.png" + alt="The old paritybit.ca logo."/></a> +</figure> +I liked the colour scheme from my old logo so I decided to keep that. The yellow +circle part of the base design is the spot where I put symbols or emblems to +differentiate one paritybit.ca site or service from another. Take a look below +at the logos for this website and <a href="https://git.paritybit.ca">git.paritybit.ca</a> +respectively: +<figure> + <a href="/img/logo-main-256.png"><img src="/img/logo-main-256.png" + alt="The new logo design for this website."/></a> +</figure> +<figure> + <a href="/img/logo-git-256.png"><img src="/img/logo-git-256.png" + alt="The new logo design for git.paritybit.ca."/></a> +</figure> +It took me a long time to decide on an appropriate symbol to represent my +website as a whole. I tried some designs related to parity bits similar to my +old logo but none of them felt right. While doing something completely +unrelated, the <a href="http://www.catb.org/hacker-emblem/faqs.html">glider emblem</a> +popped into my mind and I immediately felt that it would be the perfect symbol +to incorporate into my site's logo. I feel this "hacker emblem" represents the +general values that I want this site to encourage and promote. Particularly, the +values of collaboration and openness.</p> + +<p>In addition, this logo doesn't just represent paritybit.ca; I also use the logo +with the glider as my profile picture across the Internet. It's become a +personal emblem that represents me <em>and</em> my website.</p> + +<p>Luckily, coming up with a design for the git.paritybit.ca logo was much easier. +The licensing information of the Git Logo and the place from where I obtained it +are all detailed in the README of the <a href="https://git.sr.ht/~jbauer/paritybit.ca">paritybit.ca git +repository</a> +(<a href="https://git.paritybit.ca/jbauer/paritybit.ca">mirror</a>). The SVG files for +these logos are also in the repository under the <code>build/</code> directory.</p> + +<p>Finally, in order to make sure that my logo looked good on every platform, I +used a service called <a href="https://realfavicongenerator.net/">Real Favicon +Generator</a> which takes a logo and generates +the required files, sizes, and formats to make the image appear properly on +every platform. This way, my logo will look good in the browser, on the home +screen of an Android or iOS phone, and even on a MacBook Pro's touch bar. I +highly recommend this service for checking and generating favicons for every +platform. It saved a lot of manual work.</p> + +<p>Happy hacking!</p>]]></description> +</item> +<item> <title>New Blog Post: Making My Own Vim Statusline</title> <link>https://www.paritybit.ca/blog/making-my-own-vim-statusline</link> <guid>https://www.paritybit.ca/blog/making-my-own-vim-statusline</guid> diff --git a/public/feeds/sitewide-feed.xml b/public/feeds/sitewide-feed.xml @@ -7,6 +7,87 @@ <description>The feed that covers all notable additions, updates, announcements, and other changes for the entire paritybit.ca website.</description> <item> + <title>New Blog Post: Redesigning My Website's Logo</title> + <link>https://www.paritybit.ca/blog/logo-redesign</link> + <guid>https://www.paritybit.ca/blog/logo-redesign</guid> + <pubDate>Fri, 28 Feb 2020 22:13:08 -0500</pubDate> + <description><![CDATA[<h2>Redesigning My Website's Logo</h2> + +<div class="byline"> +<b>Written By:</b> Jake Bauer | + <b>Posted:</b> 2020-02-28 | + <b>Last Updated:</b> 2020-02-28 +</div> + +<p>I got tired of the way my old logo looked so when my website redesign was +complete I endeavoured to completely redesign my logo. I wanted a logo that was +simple and clean looking but also supported being extended through adding +different symbols which represent whichever paritybit site one is visiting. I +also wanted it to be simple and clear enough that it could be recognizable at +many different sizes which is important for a logo which will also be used as a +favicon. A simple logo is also easier to print on mugs and t-shirts ;)</p> + +<p>I used <a href="https://inkscape.org/">Inkscape</a> to create my logo. Inkscape is a +cross-platform, FLOSS vector graphics editor which I found to be intuitive to +use. It was important that the master copy of my logo be in SVG format so that +it can be scaled to many sizes without becoming pixellated.</p> + +<p>After some work, trials, and revisions, I arrived at the following base logo +design: +<figure> + <a href="/img/logo-256.png"><img src="/img/logo-256.png" + alt="The new logo's base design."/></a> +</figure> +Compare that to the old logo: +<figure> + <a href="/img/old-logo.png"><img src="/img/old-logo.png" + alt="The old paritybit.ca logo."/></a> +</figure> +I liked the colour scheme from my old logo so I decided to keep that. The yellow +circle part of the base design is the spot where I put symbols or emblems to +differentiate one paritybit.ca site or service from another. Take a look below +at the logos for this website and <a href="https://git.paritybit.ca">git.paritybit.ca</a> +respectively: +<figure> + <a href="/img/logo-main-256.png"><img src="/img/logo-main-256.png" + alt="The new logo design for this website."/></a> +</figure> +<figure> + <a href="/img/logo-git-256.png"><img src="/img/logo-git-256.png" + alt="The new logo design for git.paritybit.ca."/></a> +</figure> +It took me a long time to decide on an appropriate symbol to represent my +website as a whole. I tried some designs related to parity bits similar to my +old logo but none of them felt right. While doing something completely +unrelated, the <a href="http://www.catb.org/hacker-emblem/faqs.html">glider emblem</a> +popped into my mind and I immediately felt that it would be the perfect symbol +to incorporate into my site's logo. I feel this "hacker emblem" represents the +general values that I want this site to encourage and promote. Particularly, the +values of collaboration and openness.</p> + +<p>In addition, this logo doesn't just represent paritybit.ca; I also use the logo +with the glider as my profile picture across the Internet. It's become a +personal emblem that represents me <em>and</em> my website.</p> + +<p>Luckily, coming up with a design for the git.paritybit.ca logo was much easier. +The licensing information of the Git Logo and the place from where I obtained it +are all detailed in the README of the <a href="https://git.sr.ht/~jbauer/paritybit.ca">paritybit.ca git +repository</a> +(<a href="https://git.paritybit.ca/jbauer/paritybit.ca">mirror</a>). The SVG files for +these logos are also in the repository under the <code>build/</code> directory.</p> + +<p>Finally, in order to make sure that my logo looked good on every platform, I +used a service called <a href="https://realfavicongenerator.net/">Real Favicon +Generator</a> which takes a logo and generates +the required files, sizes, and formats to make the image appear properly on +every platform. This way, my logo will look good in the browser, on the home +screen of an Android or iOS phone, and even on a MacBook Pro's touch bar. I +highly recommend this service for checking and generating favicons for every +platform. It saved a lot of manual work.</p> + +<p>Happy hacking!</p>]]></description> +</item> +<item> <title>New Blog Post: Making My Own Vim Statusline</title> <link>https://www.paritybit.ca/blog/making-my-own-vim-statusline</link> <guid>https://www.paritybit.ca/blog/making-my-own-vim-statusline</guid> diff --git a/public/sitemap.xml b/public/sitemap.xml @@ -3,6 +3,7 @@ <url><loc>https://www.paritybit.ca</loc></url> <url><loc>https://www.paritybit.ca/home</loc></url> <url><loc>https://www.paritybit.ca/blog</loc></url> + <url><loc>https://www.paritybit.ca/blog/logo-redesign</loc></url> <url><loc>https://www.paritybit.ca/blog/making-my-own-vim-statusline</loc></url> <url><loc>https://www.paritybit.ca/blog/urxvt-to-st</loc></url> <url><loc>https://www.paritybit.ca/blog/website-redesign</loc></url>