So you want a website but aren’t sure if how to learn web designing step by step is possible?
Where do you start?
Is it expensive? Do I need to know coding?
These questions and dozens of others pop into our heads at just the thought of building a website.
I understand wanting a website of your very own. Not just a Facebook page or a blogger.com site or even a wordpress branded site, but your very own.
I hear you! My website is almost 2 years old. Thus I can attest that it is actually pretty easy to do from a technical standpoint. 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 learn web designing step by step.
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 learn web designing step by step at a very low cost.
But to not have it branded (ie: www.jeffswebsite.blogger.com or www.jeffswebsite.wordpress.com) you will have to pay for web hosting and domain name registration. Minimally that would cost you upwards of $100/year.
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 learn web designing step by step guide below to get the website you’ve always dreamed of at a rock bottom price!
So where do you start in making YOUR website?
First let’s review the steps involved in any simple website builder system:
- 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 a 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.
- 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 select your URL
- 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)
— Vicky (@FridaysWVicky) October 5, 2016
Is your chosen URL already 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 Check Domain.
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.
Another easy way to do that is to skip ahead to finding a web hosting company as they all will do that search for you quickly, easily and free.
How to learn web designing step by step – Selecting a web hosting company
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.
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.
Creating a Siteground account to get your website started!
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:
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 learn web designing step by step – Selecting a WordPress theme
A theme is simply a template that you use as a framework to build your website.
— 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.
As my site grows I may upgrade to the paid version or I may eventually switch themes (which you can do at any time).
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 are 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 theme for SEO?
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 learn web designing step by step – Installing your 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 screen shots 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 learn web designing step by step – Activating or previewing the theme
Last 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, side bars, 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 comprehenive post on DIY SEO Tools, so once you’ve followed my how to learn web designing 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 be 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.
“DONE IS BETTER THAN PERFECT”
You don’t have to be an expert web designer to get going.
You can learn web designing 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. Thus 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!
How to learn web designing step by step – Next step: Add pages!
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 to learn web designing step by step – Next step: Create 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 is about right, but each category can have sub categories.
How to learn web designing step by step – Next step: Most Important Pages!
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 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 those 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 to learn web designing step by step – Next step: Your Menu!
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 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 in 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 to learn web designing step by step – Next step: Plugins!
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:
- All in One SEO Pack (helps with SEO)
- Google Analytics for WordPress (helps with SEO)
- Google XML Sitemaps (helps with SEO)
- 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)
- WordPress Editorial Calendar – Great for scheduling posts to automatically post in the future and you can see your calendar daily, weekly or monthly at a glance
- WP Word Count – The optimal word count for most blog posts is around 2500 words. This handy plug in simply lets you know the word count of all your posts (published and drafts)
- SumoMe – Has some free and some paid options. I am currently only using the free ones, but as my site begins to monetize more, I will likely purchase some of their premium features as I really like the free stuff. The free options I currently use are – Google Analytics, Share (makes it easy for viewers to share your posts on social media), Image Sharer (makes it easy for viewers to share your images on social media), Smart Bar (an email opt-in bar that floats at the top of the website), Highlighter (allows viewers to simply click and drag over any text and instantly Tweet it to Twitter).
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
How to choose the best plugins
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 to learn web designing step by step –Writing great content
At this point you have used the best website tools and have the basics of a great website. 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 you 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 folks dig deeper, they stay on your site longer and share your stuff on social media. Ultimately that drives more traffic to your site.
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!
I may follow this post up with my own thoughts on email list providers, writing, researching keywords, making a post authentic but SEO friendly, but for now, I think we’re done with how to learn web designing step by step.
Did we cover everything you wanted to know about how to learn web designing step by step?
Any tips, suggestions or questions on how to build a website?
If you like this post, please consider sharing on Facebook, because if it helped you, it just might help someone else!