Overview
musify is a free chord symbol writing tool for web pages. It can display jazz chord symbols, simple figured bass, functional harmonic analysis and basic macro analysis symbols.
You type in some text using some easy to learn symbols, and musify formats it in a way that looks like a chord symbol on a web page. You can choose to host the tool yourself: or use the online editor.
Who is this for?
If you're a musician, it means that you can display chords on a web-page without having to remember lots of codes to format them properly. It should be handy for short snippets or chord transcriptions.
Also, if you make tutorials on the Internet, it lessens the use of images, making your tutorial more accessible to anyone who uses the World Wide Web.
musify ought to be able to do most things: a totally biased but good example is on my descriptive harmony guide, which uses the PHP version.
A more random example; take the chord notation of Steve Coleman's Games. Although it's on the Internet for educational use, it cannot be accessed by everyone who uses the Internet, since it's an image. musify widens the scope a bit. Here are the chords to the first eight bars of the song: all minor chords are shown with a minus sign.
44 C E7⁄G♯ | A- B | B♭- | G♭add♭9 | F- | E | Aadd♭9 | A♭no 3rd(♭9, ♯11)
Here is a screenshot of this page in W3M:
Anyone using a text browser is now able to read the chords of the piece, even if they cannot access the image of the score.
Usage considerations
The correct display of characters depends on the font you use and the capabilities of your web browser.
For best results use a Unicode font and a browser that has good CSS3 support.
For educational use, the PHP form is more stable as it relies less on the user's browser capabilities. Most non-graphical browsers and older browsers may not be able to handle JavaScript correctly. But of course your web server must support PHP!
For local versions, the JavaScript form should be fine. If you want to use both (as the documentation on this site does), you can use a noscript block to hold the PHP version:
<span class="musify">G7 | C</span>
<noscript><p><?php echo musify('G7 | C');?></p></noscript>and in your stylesheet, set the musify class not to display.
span.musify {display: none;}The musify.js file sets the display property of .musify to inline-block
, so it will display the span if JavaScript is enabled, and hide it not.
Because musify is made for web pages, you can modify the font used to display your music. There are a few ways of doing this: but in my opinion, the easiest way is to make your web page as normal, but if you're using PHP, ensure that you've wrapped the PHP block in an element with a musify class:
<span class="musify"><?php echo musify('G7 | C');?></span>then in the stylesheet for your page, add a musify class and set your fonts and sizes.
.musify { font-family: "Century Schoolbook L", serif; font-size: 1.5em; }Depending on the font you use, the time signatures/figured notation may be mis-aligned. You can tweak margin-right property for the timden class in musify.css if it doesn't look quite right. Make the negative number larger to shift the denominator to the left.
If you need the chords aligned, you could use a table and enter the chords in each cell: although technically this would not be correct for most forms of Western music since they are based on lines and not grids. Another idea is to use a mono-spaced font, since each character has exactly the same width.