Musician Web Design 101

Musician-Web-Design-101

A Quick Note: This is Part I of a 3 part series. 

Look, It’s 2015. You need a website. But web design is this big, complicated, scary thing that you don’t know how to do, right? Don’t worry, you don’t need to pay tons of money to put your website up. I’ll walk you through how to make your own awesome website.

Why You Need a Website

Your website is like your storefront. I know we’re not supposed to judge books by their covers, but if you don’t have a cover at all, then there’s SO MUCH JUDGEMENT. If you have a killer website that features great photos and audio of you, people are more likely to hire you.

Having a website puts all your information in one spot, and directs people searching for you to the stuff you want them to see. This way, when someone says, “Can I hear a recording of you?” you can direct them to your site without having to send them files directly. And they won’t stumble on that video of you auditioning for a Kraft Mac n Cheese commercial when you were 12. At least not right away.

What You Need Before You Start

Before we start messing around with themes and fonts and even domain names, we need to get all your content together. There’s no point in having a website if there’s nothing on it. Here’s where to start.

Photos

People will want to see what you look like (remember: JUDGEMENT). Scour Facebook for all the best photos of you. Look for photos that are action shots of you playing, or just represent you well. If you don’t have any good photos of yourself, don’t worry. I’ll bet you have a friend who just started a photography business with their first and middle names. Talk to them about doing a photoshoot. Maybe you could trade services, or you can shell out a little money. It’ll be worth it, I promise.

Audio

You are a musician after all. This is the most important part. Gather any recordings you’ve done in the past few years. If you don’t have anything workable, you could try taking a free recording session, just to get the finished recording. Remember, this is the most important part, these recordings need to sound great.

Video

This is optional, but a nice touch since it combines audio with being able to see you live. If you’ve got some videos on YouTube already, grab those links, or maybe you could upload the videos from your recital. If you don’t have a video that you feel 100% about putting up, skip it. It’s better to have no video than to have video of your high school marching band practice shot on a Motorola Razr.

Bio

These always feel weird to write, don’t they? You have to talk in the third person, and you have to really make yourself sound good. Don’t get shy. The person reading this needs to know that you can handle the gig, whatever that may be. Be honest, be bold. Talk about cool gigs that you’ve done, your education, or any other relevant details.

Buying a Domain

This is the address that people type in to find your site, so make it as easy to remember as possible. The best possible option is just yourname.com. When someone searches for you they’ll find you immediately. If yourname.com isn’t available, you could try adding your middle initial, or a couple other options.

  • Try getting yournamemusic.com or yournameyourinstrument.com. For example: brandonshawmusic.com or brandonshawbass.com. There’s advantages to each of these. Having your instrument in the domain makes it clear what your main thing is. Leaving it as “music” leaves it open to a few possibilities within music, so think about what you might want to do with music in the next few years.
  • You probably shouldn’t go for yourname.net .org .biz or anything else. That requires an extra step for people to remember ( yes, I realize that this site is .co, that’s intentional).

Many website hosting services offer a free domain for 1 year when you sign up. Speaking of, keep reading.

What Service Should You Use?

There are tons of different services out there such as Squarespace or Wix that let you easily build a website. These platforms are awesome, but they  are more expensive. Squarespace will run you about $16 a month. The way I’m about to show you will run you about $4 a month.  By putting in a little elbow grease and building a site with WordPress, you can make your site for less money, and have more customization options.

WordPress

There’s 2 different types of WordPress. The first is wordpress.com. This site allows you to start a blog for free and get going right away. The downside is that there’s much less customization, and your website will be yourname.wordpress.com. That’s not exactly professional. Unless your last name is actually WordPress, then that’s perfect.

The second type is wordpress.org. This allows you to create a self-hosted blog. This means that you are responsible for storing all the files yourself and making your domain name point to it. It also means that you can add tons of customizations through the thousands of free or paid themes and plugins. WordPress makes up for about 19% of the top 10 million websites. I’m no mathemagician, but that’s a lot of WordPress sites.

How much does all of this cost? Installing and using the self hosted version of WordPress is completely free. The thing you do need to pay for is hosting, because you gotta store your files somewhere.

Let’s Do This

You ready to build your website? Rather than just tell you what to do, I’ve decided to show you each step of the way. I already have a website built, so I decided to build one for my friend Nate. I’ll walk you through every step of the process as I built his site, and you can follow along building yours.

Step 1: Buy Your Domain and Hosting

Yes, that’s technically 2 steps, but you can do them both at once. As far as hosting goes, I recommend Bluehost. They have great prices, great customer support, ridiculously easy WordPress installation, unlimited storage and unlimited domains. So if you decided a year from now that you want to make a site for your band, you can just add on a domain to your existing account. Also, when you sign up, you get a free domain name.

Click here to go to bluehost to sign up for your hosting and your free domain name.

Step 2: How To Install WordPress

So you’ve got your domain and your hosting setup right?

Great, here’s all you have to do:

Go to bluehost.com, click on home, then cPanel. The cPanel is kind of like your main dashboard for your hosting account. Once you’re there click on “one click installs” under mojo marketplace.

Web 1

After a minute of loading, click on WordPress.

Web 2

Click on “start a brand new install”

Web 3

Select your domain from the drop down menu. Click “Check domain”. Select the “www” version of your domain.

Check the box that says you’re overwriting.

Click on advanced options. name your site, and make your login info here. This will be the name and password you use to go in and make any changes to your site. Also make sure “create a new database for this installation” is checked.  Check the terms and conditions box, and click install.

Screen Shot 2013-12-12 at 11.27.00 Dec12

Now go type in your domain in a browser, your website is up!

Now I know what you’re thinking, “Hello World? This is stupid.” It’s the default post that WordPress automatically puts up. Any time you want to make changes to your site, you can go to Your domain.com/wp-login.php to sign in and take care of business.

Here’s what it looks like after you login:

Web 5

Step 3: Picking and Installing a Theme

There are thousands of free WordPress themes available online, as well as many thousands of paid ones. Paid themes are cool, but we’re building this site on the cheap, remember? If you’re searching for a free theme, here’s a couple of places to start:

WordPress.org

FabThemes

You could also just google “free wordpress themes” and an adjective.

As you’re selecting your theme, let me say this. Don’t get too caught up in all the bells and whistles. The main point of your website is to feature the content on it. Your photos, audio, videos and bio should stand out as the most important thing here. No one is going to go to your site and say, “Oh wow, this guy has a such fancy animations, I’m going to call him for gigs!” or “Oh wow, this site is responsive? I must have him on my next tour.”

Picking a theme is fun, but your content is the most important thing.

In talking to Nate, he wanted his site to be extremely minimal. He wanted one great photo of him to front and center, and for the content to be displayed over that. This is a really cool approach, but if you go this route, know that you have to have an absolutely fantastic picture of you, because you only get one.

Based on what Nate wanted, I chose a theme named Helix.

Installing

To install a new theme, login to your site (yourdomain.com/wp-login.php) and click on appearance>themes in the left side bar. If you click “Add new” you can search all of the themes that are available on wordpress.org. These are good and you can install them directly from there, but I downloaded the .zip file directly from the site.

Web 6

I uploaded the .zip file and clicked “install”, then click “activate”.

Now go refresh your site. Pretty cool, right?

“Options framework” was a required plugin for this theme to work, so I clicked on plugins on the left hand column, clicked on “add new” and searched for it. Then I clicked “install now” and then “activate” (more on plugins later).

 

Wrap Up

So you’ve successfully compiled all of your photos, audio and videos, written your bio, got your hosting set up, and installed WordPress at yourname.com. Congratulations, this is a huge step forward! The next post will show you how to set up your individual pages and upload the content that you’ve compiled. If you have any questions or have found this helpful at all, please let me know in the comments.

 

Ready to move on to Part II? Click here.


________________________________________________________________

In the interest of being upfront and honest: this post has an affiliate link to Bluehost, and at no cost to you, I will earn a commission if you decide to purchase. Please understand that I’m recommending Bluehost based on my great experience with them. Please don’t spend any money unless you’re really going to build a website. If you do build a website and wanted to go through my link, that would be awesome, thank you.  

Photo credit: Robert S. Donovan