commit a59cfab74abe616c83540dc229c6d92778ef5367
parent 18e3111add1fef0412863a7fd361e8690a4b8013
Author: Jake Bauer <jbauer@paritybit.ca>
Date: Mon, 20 Jan 2020 23:53:56 -0500
Draft of redesign blog post
Diffstat:
1 file changed, 54 insertions(+), 0 deletions(-)
diff --git a/pages/blog/website-redesign.md b/pages/blog/website-redesign.md
@@ -0,0 +1,54 @@
+## Redesigning paritybit.ca
+
+[//]: # ""
+
+[//]: # "main.min.css"
+
+[//]: #
+
+<div class="byline">
+<b>Written By:</b> Jake Bauer |
+ <b>Posted:</b> [DATE] |
+ <b>Last Updated:</b> [DATE]
+</div>
+
+### What I Did
+
+Added regions with <header> <nav> <main> <footer> thanks to http://wave.webaim.org/ and using https://www.w3.org/WAI/tutorials/page-structure/regions/ as reference.
+
+Left underlines in links in text so that they are easier to differentiate other
+than relying on boldness and colour.
+
+Making sure to choose colours with a minimum contrast ratio of 4.5:1 but aiming
+for 7:1.
+
+Checking the colourscheme using colourblind filters (toptal).
+
+Changing the layout of the site so that it scales a lot better between different
+screen sizes. Also bringing in the width so that it's easier to follow the text
+with your eyes.
+
+Using descriptive links instead of "click here" or "this".
+
+Making fonts larger so it's easier for people on mobile and on desktop to read.
+
+Optimising page loading times by shrinking images (pngcompressor.com), minifying
+CSS, keeping requests down to a minimum (except where embedding images would
+make an html document larger thereby teachnically making it worse for someone
+who is browsing in pure-text mode).
+
+Obsessively checking the site with contrast checkers, colourblind filters,
+accesisbility checkers, and schema validators.
+
+Dark and light modes using pure css, no javascript.
+
+### References
+
+[](https://www.w3.org/WAI/fundamentals/accessibility-intro/)
+[](https://webaim.org/resources/contrastchecker/)
+[](https://anybrowser.org/campaign/)
+[](https://www150.statcan.gc.ca/n1/pub/11-627-m/11-627-m2017008-eng.htm)
+[](http://romeo.elsevier.com/accessibility_checklist/)
+[](https://contrast-finder.tanaguru.com/)
+[](https://www.w3.org/WAI/tutorials/page-structure/regions/)
+[](https://www.w3schools.com/css)