website design Archives | Middle Class Dad

When I started my site in 2016, I knew nothing about how to build a website from scratch. So I put together this ultimate guide to show you what I learned: To build a website, find a great hosting company that is fast & reliable, use WordPress.org, select a memorable & simple URL, and start with a free theme & plugins until you have a good understanding of how a website functions. Then, learn the basics of SEO to get traffic & begin to focus on monetizing that traffic. I think you'll agree with me that before you learn how to build a website from scratch, it seems very intimidating. Where do you start? What are the steps involved and are they easy to learn? Is it expensive? Do I need to know coding? Should I hire someone? However, some of the choices and options can be a bit overwhelming. So in this comprehensive guide, I'm going to show you how to build a website from scratch step by step. Let's dive in! How do you build a website for free? In short, if you want your very own website (ie: www.jeffswebsite.com) you can't do that completely for free. But I can show you how to build a website from scratch step by step at a very low cost. Totally free sites are usually branded (ie: www.jeffswebsite.blogger.com or www.jeffswebsite.wordpress.com). Those look more like hobby sites than real professional websites. But to not have it branded you will have to pay for web hosting and domain name registration. Minimally that would cost you upwards of $100/year. If you do have to go with a completely free site, I would go with Blogger, Wordpress.com (Wordpress.org is where you pay for your own domain) or Wix (read this comparison of lead generation platforms). Bear in mind that you are trading credibility and professionalism for cost though, as it can be much harder to get traffic, get noticed or be taken seriously if you don't have your own branded website. So I highly recommend following my how to build a website from scratch step by step guide below to get the website you've always dreamed of at a rock bottom price! What is the first step in building a website? First, let's review the steps involved in how to build a website from scratch: First, you need to pick a domain name (the URL or website address of your site) Then you need to decide on which hosting company to use (this is the company responsible for getting and keeping your site up on the web from a technical standpoint) Then you need to decide what "theme" to use (assuming you plan on using the program/platform Wordpress to build your site) - Wordpress is the free software most people use to build their site as it's very easy and intuitive. If that's what you're using, you'll need a "theme" which is essentially the design and layout for your site. Unlike Wordpress, Wix gives users a bit more design-based freedom, as makeawebsitehub explains in their review, but it can depend on whether you want most of the work to be done for you by a preset. Then you'll need to install some "plugins" to make your site more SEO (Seach engine optimization) friendly and a little more functional for you. These are essentially mini-apps you quickly and easily install. Many are free but there are some paid ones, but to just get going, you can stick with the free ones for the moment. So for your domain name, don't be surprised if your first choice is already taken! There's a lot of websites out there and there's a lot of folks who register (buy) website names that they think could be popular so they can later sell them (imagine if you registered www.apple.com back when Al Gore first invented the internet? You'd be rich!). So your first website design step is just to Google the web address you are thinking of and see what comes up. If a website does come up, I would move to your next choice for URL. Sure you could make that site an offer to buy the name, but it's probably easier just to think of a new one. How to pick a domain name for your blog Your domain will become your brand, so while I don't want you to get stuck in analysis paralysis for weeks, I do want you to consider the following: A .com address is 100 times better than .net (or most other types) But if you are an educational site or a non-profit, a .org or .edu site is probably the better way to go Don't use hyphens in the web address (ideally not in your brand name/logo too - it's just way too easy for people to get confused and not find you and sure you could be like T-Mobile and have tmobile.com redirect to T-Mobile.com but what a pain!) Make sure your web address rolls off the tongue smoothly Try not to use two words together that end & begin with the same letter (people will be unsure if they need to use that letter twice. ie: is it www.blueend.com or www.bluend.com?) Make sure your web address is easy to spell (ie: www.supercalifragilisticexpialidocious.com is guaranteed to never get traffic) Don't use words with multiple spelling possibilities (ie: too, two, to, etc - you'll be constantly reminding folks which one it is) Don't use a web address that is too long (the shorter the easier to remember) Ideally, your web address would exactly match the brand name for your business (an issue which was specifically a challenge for me as I had to add the word "new" to the start of my address since my brand name URL was taken (albeit after I created my Facebook page which was the first thing I did before launching my blog) 10 Tips to Create Trust with Your Website or Bloghttps://t.co/MQSpkrF4JC#trust #blog pic.twitter.com/jDIFFLJZOV — Vicky (@FridaysWVicky) October 5, 2016 What if the domain name I want is taken? So once you've got a name that you like that meets those criteria and doesn't show up on Google, we need to verify if it's currently registered (it's entirely possible to register it but not build a website on it). You can enter your chosen name using this free link Name Cheap. It will tell you if the domain has been registered or not. If it's registered, it's best to go back to the drawing board and come up with a new name. If it's not registered, you can register it with them for under 10 bucks! Another easy way to do that is to skip ahead to find a web hosting company as they all will do that search for you quickly, easily and free. What should I look for in a hosting service? In looking for a web hosting company, I literally looked for months, read lots of reviews and cross-referenced the companies I was considering on sites like Yelp. You can read greater detail on my search on my page at Website Tools I Love, but I came away selecting Siteground and have been very happy ever since. They aren't who I use now that my sites have grown in traffic as they are a little expensive for their bigger plans. But they are perfect for starting off with. I have not had any time of my site being down, and every time I have needed their help (not due to issues on their end), they have solved my issues in minutes using live chat; even late night. When you click the link, you'll then want to select the "Sign Up" button. If you're just getting started, as I am, you'll want the $3.95/mo plan. Bear in mind almost all web hosting companies show you a price by the month, but most bill you 12 (or more) months at a time. I find this irritating as most don't actually offer monthly billing, but it's so widespread it's not worth worrying about. This is a "shared hosting" plan, meaning your website and countless others all share a server at the host's tech center. Non-shared hosting, typically called "dedicated hosting" means that only you are on that server and they are much more expensive plans. If you grow to the size of Google, that's where you'll end up, but for now, a shared plan is just fine. How to set up a website on Siteground At this point you'll be asked to create an account, enter payment info and select if you want 12 or more months. Siteground is rock bottom at their $3.95/month price, so they don't offer price breaks to go longer. However, at month 13 the price likely jumps up to $6-8/month. So selecting the 24 or 36-month options is a good way to lock in the low price. The proven power of .com over the alternatives Eventually, you'll come to a window that asks you to choose a domain. The default domain will be .com but a dropdown menu does offer you the alternatives. As I said above, while it might be tempting to select www.juicesbyjeff.net if www.juicesbyjeff.com is taken, just know that people often remember the name more than the ending, so you will potentially be sending a lot of people to that other guy's site. One thing that internet gurus like Pat Flynn sometimes do is add an HQ to the end (ie: his site www.securityguardtrainingHQ.com) Most likely www.securityguardtraining.com was probably taken when he created that site so rather than create a whole new name, he opted to just add the HQ to the end of it. So if you intend your site to be the ultimate resource for a particular category/niche (ie: a headquarters), and your chosen name is taken, consider using HQ at the end of it. Which is the best free website builder? Wordpress is what I use and what I recommend. It's also used more often than any other platform on the planet for websites. Yes if you're Elon Musk, you can afford a team of developers to make your sites from scratch. But for those of us in the real world, Wordpress (the .org version) is the way to go. It's free, easy and most hosting companies install it for you with 1 click. Siteground has a lot of tutorials if you need help: How to Install WordPress How to Create a WordPress Site How to Install WordPress Themes Once you've got your domain name, it will ask you to download and install Wordpress. Once that's done, it's time for a theme! Your simple website builder journey is well on its way! How to find a good WordPress theme A theme is simply a template that you use as a framework to build your website. Free vs Premium WordPress Themes (Pros and Cons) https://t.co/hh2Lw7OXPp #blogging #wordpress pic.twitter.com/eCgNrBU9Y1 — Samuel Emmanuel (@realsammyE) October 4, 2016 Let's use a car analogy. Siteground (or the host you choose) is the make of car (ie: Chevy). Wordpress is the model of car is the model of car you choose (ie: Impala) The theme is simply the options: paint color, interior color, and options which determine how the end result will look and function. There's a lot of free themes out there and a lot of paid ones. Being on a shoestring budget when I started my site, I went with one of the free themes from aThemes and have been very happy. I literally looked at close to 100 themes. Then I physically tried about a dozen before selecting the Astrid (also the name of my oldest daughter!) theme for my site. I also opted for a free one because I saw so many I didn't like I wasn't convinced that by paying for it, I would be happy with it. But these days, I do use a paid theme for this website. If you love the look of my site, I use a theme called Acabado (I use it on all my websites). It's super-fast (yes, these definitely can affect the speed of your website). I get it for free for being a member of Income School's blogging course Project 24 (click to learn more on their site). But you can buy Acabado itself for just $50/year or $99 for a lifetime license. Just click that link to learn more about it on their site. And that's it! One quick comment about themes! Look for ones that say "responsive". This means it will automatically change to reflect if it's being viewed on a phone, tablet or desktop. Each is different and what looks good on one might not look good on another. These days phones are responsible for 50% (or more) of most online viewing, so getting a theme that looks good on mobile is crucial! Which is the BEST theme for SEO? I can tell you that according to the extremely knowledgeable Brandon Gaille, the best theme from an SEO standpoint is Newspaper 7, which is a paid theme. I looked at that one, but wanted something a little more unique, but who knows? Maybe I'll switch in the future. But no matter what you do, I do recommend listening to Brandon's podcast as it WILL help you have a better website. Check out all my blog and podcast recommendations. If you need help getting your website optimized once you have it going, my suggestions can be invaluable. How to install a WordPress theme Once you have found a theme you like you'll buy (if it's a paid theme) and download that theme. Now we need to upload that theme into your Wordpress. So simply go to the menu on your dashboard (the back end technical part of your Wordpress site; not to be confused with the control panel which is more of a general host setup page). There's a long list of menu options along the left side and about halfway down is one called "Appearance". If you hover over that a few options pop out to the side. Just select the "Themes" option: Then simply hit the "Add New" button on the next screen which in turn will take you to the next screen where you'll hit the "upload" button. Now you'll hit the "browse" button and find where that downloaded theme is so we can upload it. My screenshots are on a PC and if that's what you're using them chances are the file is in your "downloads" folder as seen here: Just hit the "Install Now" button and you're good to go! How to activate or preview your Wordpress theme The last how to build a website from scratch step is simply to activate the theme which makes it go live. Not 100% sure you'll like it? While you can always switch themes, you can also just hit the "Live Preview" button too. Great for those with a fear of commitment! There are a number of customization steps you can take once your theme is installed. Every one is a little different. There are literally thousands to choose from. Thus it doesn't make sense for me to try and guide you through most of those (things like widgets, footers, sidebars, etc). Suffice to say if you aren't able to figure it out, your theme company doesn't offer tutorials and you don't see anything on YouTube, comment or email me here and I'll be happy to help. What is SEO and how does it help a website? So I've mentioned SEO here a couple of times and if you're new to web building or internet marketing, you may not know much about it. As I said above, it stands for "search engine optimization". Essentially it means making what you post on your website as "friendly" as possible for search engines like Google and Yahoo and Bing to find. The better you optimize, the closer to that 1st page on Google your posts will get. And we all know most folks don't go past page 2 or 3 if they even get that far. The closer to the #1 spot on page one you get, the more people will see and likely click on your posts. This will drive exponentially more people to your site. If you are selling anything, using ads or even just affiliate links, that means more money in your pocket! Now I am not an SEO genius. The 2 podcasting guys I've already mentioned, Brandon and Pat, will serve you well. They dig into that much deeper than we will get here. But we will cover some basics, so that's why I wanted to make sure everyone understood what it was. I cover all of the SEO steps I take and how I do it all for free in my comprehensive post on DIY SEO Tools, so once you've followed my how to build a website from scratch step by step guide, I highly recommend you take a moment and review that post. I also LOVE Neil Patel and you can learn a lot from him! Don't get stuck in analysis paralysis! OK, so I know I've covered a lot so far and if you truly are new to this, you may not be 100% yet on the above steps. Fear not! I tweak my site every day as I read tips, or see others doing something different. The real key is to keep going and NOT let fear keep you from getting started. As Calvin Wayman said on a podcast I listened to today on the always fantastic EOFire: "DONE IS BETTER THAN PERFECT" You don't have to be an expert web designer to get going. You can learn how to build a website from scratch step by step as you go and make improvements along the way. And as you start to generate an income you can also hire web designers to help make improvements. It's also important to be realistic - in the initial days and weeks of your blog, most of your visitors will be your immediate friends and family. You won't be ranking yet on Google enough to show up in searches. So, it's not like a less than optimal website is going to be showing up for tens of thousands of visitors. I'd much rather you get a mediocre website up and running than wait two years for it to be "perfect" only to realize you should have started much sooner. Your website will always be a work in progress, so just get started! What pages should a website have? Posts are one-off written blog posts or commentary articles and you'll likely be continuously writing new ones. Pages are static things that are always up and generally stay the same (ie: an "about me" page or a "contact us" page, etc.) You will want a page like the above 2 I mentioned and maybe several more. To create a page, first, simply go to the menu on your dashboard (the back end technical part of your Wordpress site). There's a long list of menu options along the left side and about halfway down is one called "Pages". If you hover over that a few options pop out to the side. Just select the "Add new" option: How many categories should a blog have? A blog needs categories so you can keep different types of posts organized. Minimally, I'd say you need 3, but you might have up to 20. If you do have that many, however, I would recommend only having up to 5 show up in your main menu navigation and many of the others can be sub-categories. For example, a blog on auto repair might have categories for: Foreign Cars Domestic Cars Interior Fixes Exterior Fixes Mechanical Fixes On your main side menu, select "categories" which appears under the Posts section. Then you'll create as many categories as you wish. You'll add a name (not too long if you plan on having it appear in your main navigation menu). The "slug" is simply the part of the URL that is unique to that page (ie: www.jeffswebsite.com/slug). If you wish, you can have it be a sub-category under another "parent" category. For example on my website under personal finance, I have sub-categories for taxes and also for real estate. Those categories apply to personal finance but are very specific in scope. Or anything along those lines; you get the idea. 3-5 primary categories are about right, but each category can have subcategories. How do you write an About Me Bio? Now you literally have a blank canvas. Let's assume you want to first create an About Me page. Put "About Me" in the blank title bar towards the top. Then write a little something about yourself in the large text block below. This doesn't need to be epic, but if you are presenting yourself as an expert in your field, you do want it to be convincing to readers that you have the expertise, so do include relevant work history, accolades, or relevant stats. For instance, Brandon Gaille, who I mentioned before, is quick to point out that he's started a few million dollar businesses and his website gets over a million visitors a month. Since (among other things) he sells his services as an internet marketer, that's a very high caliber background and a compelling "About Me"! Follow these steps to create a page for the About Me page, a Contact Me page and consider a Start Here page which can be great if you cover a lot of ground which could be potentially confusing for new visitors. You can read more about the importance and set up of a great Start Here page on Brandon's blog HERE. How do I create a menu bar in WordPress? Like any great restaurant, you need a menu to let your customers know what the best options are. The menu is the navigation bar at the top of your site. Here's my menu bar: If you have multiple categories within your niche like I do, it's a great way to keep stuff a little separate. So for my site, if someone is a single dad interested in personal finance, they aren't sifting through posts about marriage - could be a sore subject! So let's create a menu! First, simply go back to the menu on your dashboard. There's a long list of menu options along the left side and about 2/3 down is one called "Appearance". If you hover over that a few options pop out to the side (or if you click on the word Appearance they drop below it). Just select the "Menus" option: Then select PRIMARY from the drop down. If you don't see that, just hit "create a new menu". Now along the left is a listing of all your pages, posts (which is likely a very small list at this point) & categories. Using your categories as your menu titles is the easiest way to manage your content. You could add a specific page or post and rename it to the category title you want on your menu. But then every time you write a new post in that category, you'll have to manually add it to your menu drop down. If you use categories, every time you write a new post, if you assign it to that category, it gets added to the menu automatically! Thus just select the main categories and add those to your menu. As you add pages, posts or categories, if you want some to appear as submenus of your main menu pages, you can literally just click on them (once you've added them to your menu) and scoot them over to the right a little so they nest the way you see in the above picture. Also, know that at any time you can click and drag them in a different order. You can also remove any of these pages from your menu at any time. To remove, click the little arrow at the top right of your page on the menu you want to delete. Then click "remove" at the bottom left of the expanded window. How do I add plugins to my WordPress site? Now it's time to add some plugins, as I mentioned at the outset. These are just little mini apps that improve the functionality of your website. There are literally tens of thousands out there, many free but some for purchase. You can't build a great website without at least a few of these, so as you go along and develop your site you can explore some paid options for your specific needs, but for now, these are the free ones I like and use on my site: Yoast (helps with SEO) Google Analytics for WordPress (helps with SEO) - some themes have this built-in MailChimp for WordPress (for use IF you use MailChimp to handle your email list management) Sharebar (allows visitors to quickly and easily share pics on your site to their favorite social networks like Facebook, etc) WordPress Database Backup (having your site automatically backed up is crucial in case it goes down and you need to reload everything you had on it. I set mine for daily backups and it simply emails me the file) To install these (notice the above are not links), you'll simply go back to the menu on your dashboard. There's a long list of menu options along the left side and about 2/3 down is one called "Plugins". If you hover over that a few options pop out to the side. Just select the "Add New" option: Now simply cut and paste the exact plug in names (one at a time) into the search bar What plugins do I need for WordPress? You may well notice that there are many similarly named plugins. I do suggest checking out others and not just taking my word for anything, but in considering others make sure you look at the reviews. I avoid anything with no reviews or below a 4-star rating. Even then I still look, particularly at the negative reviews, as their issues may pertain to you too and even a highly rated plugin might not be right for you or might not be compatible with other plugins you use. Typically the ones I recommend will be the 1st one up since they will be an exact match. Also, check to see how recently the plugin was updated. A plugin updated 2 years ago instantly tells me that it's dated. A dated plugin means it might not work with the next Wordpress update. Or minimally it means there's likely not great support if you have a technical issue. Now you just need to install the plugin: And lastly you need to then activate the plugin: How do I write a blog post? At this point, you have used the best website tools and have learned how to build a website from scratch. But you don't have any content (ie: writing) on there yet other than maybe your About Me or Contact Me pages. Fear not as unless you have shared your URL with family or friends, no one is looking at it (yet) other than you. There are a few schools of thought pertaining to how much content you need when you officially launch/announce your site. Here are my thoughts: How much content you need depends on what your blog is about. For instance, a page on car repair probably should have more than just 1 post as there are so many different areas to write about, or a website about politics would also likely have multiple pages & posts. A basic blog really just needs 1 great post about your topic. After all, if you go to a website it has to be REALLY compelling for you to want to dig into older posts, and almost no one will see your site initially, so why "waste" great content? So start with one amazing post and then build from there. Do have at least 5 posts written and formatted as a draft (ie: not published) when you do your launch. That way you're not immediately stressing about writing more. How often do you post? The general rule of thumb is minimally 1-2 times per week, but I think being consistent is better than posting frequently but getting burnt out or running out of steam. A common scenario to avoid would be cranking out a dozen posts in the first couple of weeks and then fizzling out to nothing and having your site just sitting there languishing with nothing new to say. Anyone who does manage to find your site won't stay long and definitely won't sign up for your email list and they will think it's an old abandoned site. So no matter how often you post, even if it's only twice a month; stick to that schedule! I post every Monday and every Thursday pretty much like clockwork! If my website eventually monetizes to the point where I can quit my nine to five, you can bet I'll probably up that, but for now, I think that works. It keeps my viewers engaged enough and is manageable for me. Write your posts trying to balance being authentically "you". But also consider keyword research (ie: what keywords and phrases are being searched for on Google and other search engines). Also, consider how to write in a compelling style that makes readers not only want to stay on your website but also dig deeper. When bloggers dive deeper, readers stay on your site longer and share your stuff on social media. Ultimately that drives more traffic to your site. People reading and sharing your stuff is ultimately why you wanted to learn how to build a website from scratch, right? There's also a wealth of info already out there about what is called copywriting (ie: writing for your blog or sales copy). I've already mentioned Brandon Gaille a few times and his site should be your first stop in digger deeper into how to write successful copy. But I also really like Ray Edwards! Optimizing keywords is probably the most important SEO technique that you need to apply and watch out when you're building your website. Sometimes it can be very difficult for website owners who are not very familiar with the SEO process. Developing content and link building strategies that grow your audience, build your brand, and increase your SEO and revenue is crucial for your business. Did we cover everything you wanted to know about how to build a website from scratch? In this extensive post, I walked you through everything you need to know about how to build a website from scratch. We looked at hosting, platforms, themes, plugins, costs and even what to write about. You now should know everything you need to know about how to build a website from scratch and get going today! Any tips, suggestions or questions on how to build a website? Photo credits (that aren't mine): Web Building Blocks - https://www.flickr.com/photos/bgarry/ Phone in hand - https://unsplash.com/@gilleslambert Website Construction – https://www.flickr.com/photos/medithit/ Multi-tasking guy – https://www.flickr.com/photos/ryantron/