38472_Feat

Changing Your Code's Typeface With Input

‌‌
If you’re working with code all day, I’m sure you’re already used to seeing the same monospaced font for everything. Wouldn't it be cool if you could change the font of your code so that your HTML and CSS are more pleasing to your eye? Lucky for you that it's definitely possible. Font Bureau released a font for code called Input back in August 2014. According to Input’s website, “Input is a flexible system of fonts design specifically for code by David Jonathon Ross. It offers both monospaced and proportional fonts, all with a large range of widths, weights and styles for richer code formatting." First, you should understand why code looks the way that it does. Code is usually presented as with a monospaced font since all characters will have the same fixed width. What makes Input interesting is that they offer, in the same typeface, the option to choose between monospaced fonts and proportional fonts. Monospaced fonts make sure that every single character takes up the same amount of space. So a period will be the same width as the letter "M". You can see this in the graphic below. Proportional fonts only take up as much room as they need to, which is what we're used to. Seeing code in this way could be a little jarring at first, since so many of us might associate monospaced fonts with code. What’s really neat is through Input's Interactive Preview it’s possible to set the font exactly how you’d like it to display and then download Input with those exact settings. You can even choose how you prefer specific letterforms to look.  There are alternates available for "a", "g", "i", "l", "0", "*", and "{}". It's amazing that you can really choose your exact preferences. Input is free for personal and private use, like your own coding, but if you’d like to use it on anything public, like prints or a website, then you’ll need to pay for it. Keep in mind that Input is still a new development and there still are some kinks that need to be worked out. However, there are some workarounds available for some of the know issues. Using proportional fonts isn’t necessarily a new idea. I’ve found articles dating back 2+ years of people using a proportional font in some of their text editors. However, some text editors still don’t support proportional fonts. Before you download this, there’s a simple way to see if you’d even like a proportional font. The monospaced versions of Input are also a nice change too. Even if you'd just like to change a couple characters to make your coding more pleasant, downloading Input would be worth your time. Since you're able to choose serif or sans serif, then you'd be able specify that you'd like your tags to all be serif and your content to all be sans serif. Imagine how much easier that could make your code to read! Choosing a lighter weight font for our comments could help you out as well. Input will also let you adjust line spacing, through it's built-in line spacing even if your text editor won't let you change it. If you have Sublime Text or Brackets (which are both free and available for Windows and Mac), you can change the font of your code to something like Verdana just to try out the proportional font. All you need to do is get a quick look at your text editor's documentation to see if it's possible to change the font, or look for instructions to change it.