<!DOCTYPE html>
< html lang = "en" >
< head >
< title > (POST) Why I Switched Fonts< / title >
< link rel = "icon" type = "image/x-icon" href = "../images/favicon.webp" >
< link rel = 'stylesheet' type = 'text/css' href = "../style.css" >
< meta charset = "utf-8" / >
< meta name = "viewport" content = "width=device-width, initial-scale=1.0" >
< / head >
< body >
< a style = "text-decoration: none;" href = "../" >
< pre class = "main-header" >
_______ _ _ _______ __ __ _______ _______ __ _
|______ | | |______ \_/ |_____| |_____| | \ |
______| |_____| | | | | | | | \_|
< / pre >
< / a >
< hr / > < p > < a href = "../" > sf.cu< / a > > < a style = "color:#bd93f9" href = "../blog/" > Blog< / a > > < a style = "color:#bd93f9" href = "." > < svg class = "posts" xmlns = "http://www.w3.org/2000/svg" viewBox = "0 0 24 24" > < path fill = "currentColor" d = "m11.307 4l-6 16h2.137l1.875-5h6.363l1.875 5h2.137l-6-16h-2.387zm-1.239 9L12.5 6.515L14.932 13h-4.864z" / > < / svg > Why I Switched Fonts< / a > < / p >
< h1 > < svg class = "titles" xmlns = "http://www.w3.org/2000/svg" viewBox = "0 0 24 24" > < path fill = "currentColor" d = "m11.307 4l-6 16h2.137l1.875-5h6.363l1.875 5h2.137l-6-16h-2.387zm-1.239 9L12.5 6.515L14.932 13h-4.864z" / > < / svg > Why I Switched Fonts< / h1 >
< p style = "font-size:110%" > Posted on: < strong > 4 August 2023< / strong > < / p > < p style = "font-size:110%" > Reading time: < strong > < strong > 1 min< / strong > < p style = "font-size:110%" > < / strong > Category: < a style = "color:#ff79c6" href = "../blog/software/" > < svg class = "posts" xmlns = "http://www.w3.org/2000/svg" width = "16" height = "16" viewBox = "0 0 24 24" > < path fill = "currentColor" d = "M14 18.32A7.06 7.06 0 0 1 11.28 16H3V4h18v2.26a7.08 7.08 0 0 1 2 2.15V4a2 2 0 0 0-2-2H3a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h7v2H8v2h8v-2h-2Z" / > < path fill = "currentColor" d = "M17 6a6 6 0 1 0 6 6a6 6 0 0 0-6-6Zm0 7.5a1.5 1.5 0 1 1 1.5-1.5a1.5 1.5 0 0 1-1.5 1.5Z" / > < / svg > < strong > Software< / strong > < / a > < / p >
< p > This post is just a quick update to announce a hard decision that I have made. I have switched the font on this website from < a href = "https://www.jetbrains.com/lp/mono/" > JetBrains Mono< / a > to < a href = "https://en.wikipedia.org/wiki/Courier_(typeface)" > Courier New< / a > . This change was made because I feel like JetBrains Mono looks more fitting in a terminal because it looks janky on a website. Courier New is a monospace font but still maintains the feeling and look I want from my website.< / p >
< p > This change has had an unintended benefit. Previously, my website's homepage weighed around 50KB in size which is spectacular. However, what I did not realize was that around 40KB were being taken up by JetBrains Mono. By switching to a default typeface, my website now weighs a shockingly low 12KB. If you would like to view the full GTMetrix report, < a href = "website-report.pdf" > do so here.< / a > < / p >
< p > < a href = "mailto:sufyaan@counterhawks.com?subject=Why%20I%20Switched%20Fonts" > >>> Reply To Me< / a > < / p >
< p > < a href = "font.pdf" > >>> Download PDF< / a > < / p >
< p style = "text-align:center;" > < a href = "../uses/" style = "color:#bd93f9" > < svg class = "footer-posts" xmlns = "http://www.w3.org/2000/svg" viewBox = "0 0 48 48" > < mask id = "ipSLeftOne0" > < path fill = "#fff" stroke = "#fff" stroke-linejoin = "round" stroke-width = "4" d = "M30 36L18 24l12-12v24Z" / > < / mask > < path fill = "currentColor" d = "M0 0h48v48H0z" mask = "url(#ipSLeftOne0)" / > < / svg > Previous Post< / a > - < a style = "color:#bd93f9" href = "../svg/" > Next Post< / a > < svg class = "footer-posts" xmlns = "http://www.w3.org/2000/svg" viewBox = "0 0 48 48" > < mask id = "ipSRightOne0" > < path fill = "#fff" stroke = "#fff" stroke-linejoin = "round" stroke-width = "4" d = "m20 12l12 12l-12 12V12Z" / > < / mask > < path fill = "#bd93f9" d = "M0 0h48v48H0z" mask = "url(#ipSRightOne0)" / > < / svg > < / p >
< hr / >
< footer >
< p class = "footer-text" > < a style = "color:#bd93f9" href = "../blog" > blog< / a > - < a style = "color:#ffb86c" href = "../about" > about< / a > - < a style = "color:#f1fa8c" href = "../portfolio" > portfolio< / a > - < a style = "color:#ff5555" href = "../links" > links< / a > < / p >
< p class = "footer-text" style = "font-size:80%" > < a href = "../" > sufyaan.me< / a > < / p > < p class = "footer-text" style = "font-size:65%" > < a style = "color:#aaaaaa" href = "../sitemap" > Site Map< / a > < / p >
< / footer >
