When it comes to building a website…many begin with ambitious visions…but often end up disappointed…with a website, that falls short of their initial ‘Grand ideas’.
A good website is more than just a ‘Logo’ and ‘Pages filled with content’.
Let’s create a website … that not only looks professional and … sticks to the best practices … but also tells your message…the right way.
This step-by-step guide will walk you smoothly through the entire process. Though each step involved has great depth in it, I have tried to be concise to keep the focus on our ultimate goal – a Perfect Website.
Disclaimer – No knowledge of coding required 🙂
On This Page
Before
Start - step by step
After
On This Page
Before
Start - step by step
After
Why WordPress?
Please note: Here we are talking about wordpress.org not wordpress.com.
No limitations on monetization
Ease of use
Easy to use, even for those who don’t have coding experience.
New to WordPress? Take some time and get little familiar with it.
Learning something new always takes time, what matters is…how user-friendly it is once you start exploring and how quickly you adjust with it.
Cost-efficiency
WordPress itself is free to use.
Vast library of free themes and plugins, significantly reduces the initial cost of building and maintaining a website.
While free versions offer a lot, there are tons of paid themes and plugins available if you need to push the boundaries further.
Community support
Versatility
WordPress is an incredibly powerful platform that can do a lot of things!
You can create anything….from simple blogs to complex e-commerce sites, business websites, portfolios, event management systems, appointment schedulers, forums, and a lot more.
Core advantages
Understand the 'Purpose' and 'Audience'
May not sound super important, but not doing so may end up in an outcome….totally not matching to your expectations.
Imagine a site for kids just full of text with no engaging images or an informative blog with bad navigation structure.
Design, content, layout – these all depend on the purpose.
Even domain name and extension are picked based on what you want your website to do. Different extensions match different purposes.
Underline the main goal…may it be to sell products or services, to generate leads, to spread awareness, to give information, to entertain, to showcase your art or to increase brand awareness.
Understand your target audience. Target audience potentially impacts the design and further promotion strategies.
Required basic expenditure
Unavoidable expenditures while building a self-hosted website are….’Domain name’ and ‘Hosting’.
If you are on a low budget, only these two expenses will do the work. WordPress has lots of free themes and plugins…so you can build a perfect site at no other extra cost.
No doubt if you need to extend the functionality and security, as your idea or business grows bigger, investment on pro plugins and theme will surely benefit.
SSL is one more expense head, still, as many hosting companies include complementary free SSL certificate…we will not count it here.
All such free/premium requirements, we will discuss in their own sections.
Tip: If your budget allows a few additional expenditures upfront...go for the selected considering your future requirements. This will save considerable time and effort in implementing them later on.
Domain registration
First step where excitement is at its peak :).
Can go for any reputed domain registrar (a company that sells domain names). Popular registrars are GoDaddy, Bluehost, Namecheap, and many others.
Choose a name that aligns with your purpose.
Domain name should be simple, short (if possible), easy to type and most importantly…easy to remember. Avoid hyphens, double letters and numbers (unless part of your brand).
Consider a few key points before registering a domain.
Domain extension: While registering a domain, choosing the right extension is important. .com is widely used and often preferred. But depending on your website’s purpose, a different extension might be more suitable.
SSL: Some registrars offer free SSL for the first year along with domain name or can be purchased at extra cost. Its renewal may or may not be free. Vary as per the registrar.
Most of the hosting companies also offer free SSL along with a hosting plan. If I have to choose from, will go for SSL offered by a hosting.
Domain Privacy Protection: Given for free by few registrars, paid one are also available. Check as per your requirements.
Do you want hosting with the same company? If yes, check if their hosting plans suit your budget and requirements.
Register domain for how many years? Most of the times there are promotional offers on registering domain for multiple years…say like first year free.
If thinking to take benefit of taking free domain that comes with hosting, compare the cost effectiveness if the domain is registered separately. Be sure to check renewal cost in both cases.
What is domain renewal?
When you initially register a domain, it's typically for a specific duration, commonly one year or its multiples. To keep ownership and control of that domain, you need to renew it before it expires.
There is a redemption period of nearly 30 to 45 days, after the domain expiration date. This is a period in which it is possible to renew a domain at normal charge or with redemptions fees. Depends on the registrar’s policies. Always, better to renew before expiration.
If not renewed even in grace period, that domain becomes publicly available. Someone else will be able to register that and eventually you will lose it.
Is domain renewal cost, same as registration cost?
No. In most of the cases, domains are renewed at normal prices. Promotions or discounts applied at the time of first registration, do not apply at renewal.
Website hosting
This step might give a feeling that website making needs a lot of technical knowledge. It isn’t so. Absolutely fine if not finding yourself familiar with words like inodes, databases, PHP version etc.
Of course, to create and maintain a professional site, some understanding is required. A lot of help is openly available today. Patiently tackling each step will take you through the process smoothly.
Now…back to topic.
There are various types of web hosting, like shared, managed WordPress, VPS, dedicated and cloud.
From my point of view, later ones like dedicated hosting, despite having many advantages, are really costly for a beginner.
Few of the factors I feel should be compared for sure are:
- How many websites and subdomains are allowed
- Storage Space
- Bandwidth
- Auto backup
- Free SSL
- Any limit on creating domain email address ( generally unlimited or limited to more than enough count )
- If domain comes free with hosting
- If hosting has ‘1-click WordPress install’. Generally all big players have this.
A reputed host generally offers a good package with decent includes. In case required, the plan can be upgraded or switched.
Tip: Choose the plan as per your need and budget, not because of the promotional offer.
Don't forget to check the renewal terms and prices of the plan. Most of the times, discounted prices are for the first year only. Some of the initially free inclusions, like domain, may incur charges at renewal.
Connect domain to hosting
Once you buy a domain and hosting…you will need to connect your domain to the server. Not a tough job.
Users can access your website by typing in your domain name. All assets, such as images, text, and code, need to be stored on the hosting. Your website won’t show up until these two work together.
Hosting companies provide clear guides. In case of any issue, their support teams are generally very helpful.
If you have registered a domain and hosting with the same company, you might not need to connect them separately. Many hosting providers automatically link your domain to your hosting account during the setup process.
Create email address with domain name
A professional email address that aligns with your website’s domain, is an important part of branding.
It adds credibility and makes it easier for people to trust communications received from your side.
You can create specific addresses for various purposes like admin@yourwebsite.com, info@yourwebsite.com, sell@yourwebsite.com or contact@yourwebsite.com.
Having separate email addresses for different purposes helps keep things organized.
Install WordPress
Most of the hosting provide 1 click WordPress install. This makes it a quick and easy process.
If you have gone for managed WordPress hosting, you will get it pre installed.
As location of one click install button / app may vary as per the hosting company, will not go in detail for any one hosting. Multiple guides are available as per the host. The process is nearly same for all.
Will focus on things those may need to specify at the time of install. Like,
Directory: Whether WordPress should be installed in the root directory or a subdirectory. Take a moment and decide beforehand.
Generally, for smaller sites or when WordPress is the primary focus installing it in root directory is well accepted.
Admin Credentials: Set up the username, password, and email for the admin account.
Site Name & Description: Add if you have text ready. This can be changed in settings anytime.
Database details: Check for the field asking for database prefix. Make sure to give your own prefix.
Choose theme
Most time consuming and brainstorming step. Take your time, a hurried decision might cost you both time and money later.
Without extending the discussion, I will summarize major focus points.
Preferred page or website builder
If you have a preference for a specific builder, go for a theme built with that. Builder is the one that has major role in deciding your experience of building a website.
Free or Paid
Free themes are available on wordpress.org and many other platforms. Many hosting companies also offer their free builder and themes.
If the free theme suits your needs, well and good.
But, when we look at it overall, paid themes have much more to offer, and most important, those come with timely support, in case any query.
Generally, for paid themes there is a one time fee and license renewal only if support is needed. Updates are free. Depends. Check terms.
Premium themes may be bloated considering our requirements, but we can tweak those in comparison to free themes, which generally have limited customization scope (not always :)).
Fit for purpose
Go for a theme that fits for your purpose. Nice if you could find a theme that accommodates your requirements ( and content ) by default.
Support for required functionalities
Check if the theme supports all important functionalities you need, say like…multilingual plugin, woo commerce if you need a shop, appointment scheduler etc.
Ease of customization
Generally all themes have well extended customization ability starting from minor like changing colors, fonts etc. Confirm, if you have something specific in mind.
You can connect with theme authors for pre-install/pre-purchase query, so don’t hesitate to use that option.
Tip: If going for a paid theme, don't forget to check 'Auto renew' option (depends on platform). Decide if - to keep it on or off temporarily.
Can I change the WordPress theme anytime later?
Yes, you can, but there are certain things to consider.
Posts: These will get accommodated as per design of a new theme.
Pages: As theme changes page/website builder may change. Premium themes have elements built for specific builders. Styles to those elements are mostly via theme.
When you change the theme, the page may look out of shape. You may need to add content manually in new theme elements.
Widgets: You will lose these if via theme.
Specific functionalities: If via theme, will not work.
Third party plugin compatibility: If the new theme is also compatible with that plugin, will work as per tweaks / options in the new theme.
Install and activate theme
Can be installed via WordPress dashboard /cPanel/FTP.
Via WordPress dashboard is the simplest way.
- Log in to your WordPress Admin area
- Go to : Appearance > Themes
- Click ‘Add New’
- Click ‘Upload Theme’
- Browse for the installable theme in a .zip format.
- Click ‘Install Now’.
- Once theme is uploaded, it will give message like ‘Theme installed successfully’ and link to activate the theme.
- Click ‘Activate’.
Install required plugins
If the theme needs certain required, recommended plugins, it will add a note on the dashboard to install those plugins.
Generally, themes support one click bulk install for all plugins at once. Proceed as per notice.
There may be some plugins, you should prefer though recommended by theme or not, like security plugin, cache plugin and SEO plugin.
Avoid activating cache / minify plugin by the time you are working on customization. Keep it temporarily disabled after checking compatibility.
Basic required settings
Will enlist only important ones, which are better if done at start.
Check other settings too if possible (WP Admin Menu > Settings). We can set/change these all anytime if required.
Permalink structure
Permalink is nothing but a URL of a page. Very important to set before your site is up.
WordPress offers various formats for permalink. Preferred format? Who will not like a well readable, self explanatory link? That will please both – humans and machines.
Changing link structure later when your site is up for a decent period, can affect current links and in turn could harm SEO.
If change is unavoidable, you could use redirects to minimize the impact, but better choose a URL structure thoughtfully at start only and try to stick with it.
Media settings
Three important settings under media. Set as per your needs.
Image sizes: WordPress will automatically make copies of the image you upload, as per these specified sizes. Set your preferred sizes or keep default.
Don’t want to create multiple images? just set 0 in all size fields and save.
Organize my uploads into month- and year-based folders : Thinking to ‘OFF’ image organize into folders? think twice.
If by chance your media library grows bigger with the time, it may create various kinds of issues later.
Generate JPEG files in addition to WebP : Your choice :).
Import demo data
Themes do not carry data like text and images with them. This needs to be imported separately.
Generally themes do provide demo data and in most cases, support one click demo data import (at least paid ones offer this nowadays). Just check the theme guide once.
Is it compulsory to import demo data? No, but surely helpful.
That will give you an exact visualization of your page, and then you can just replace text and images with yours. That makes customization easy.
Many things like setting home and post page, creating menus, adding widgets at desired widget areas are done automatically if demo import is opted.
Later we can just delete the unnecessary elements and pages.
Few themes have all these install and import steps under one tab. Depends on the theme, but the process is nearly the same for all.
Tip: If you are importing theme demo data, make sure you have all recommended, required plugins installed before hitting import button.
Many things like custom posts (e.g portfolio, product pages), widgets which are plugin entity will fail to import otherwise.
I already have post, pages on my site. Will those get deleted if I import new theme's demo data?
Nope. If you are importing new data, old data remains where it is.
If you have pages by similar names, say like home, about, contact....new pages will get imported, but their URL will be different with some number suffix.
It will not impact both old pages and URL of old pages. Still don't miss to keep backup of your data.
Add coming soon page
By the time, website is ready to publish, you can display the coming soon page.
A launch date timer, short info or a subscribe form, whatever suits your purpose, can be a part of it.
Any ‘Coming Soon’ plugin will do the work.
Start Customization
This may vary as per theme. But in general, two broad areas can be marked.
Global Settings
Global settings are those which get applied all over the website.
Available via customizer or page/website builder.
Better to set basic fonts, colors at once rather than specifying those for individual elements. So if anytime later, you feel like trying a different font or color combination, that could be done easily.
Take advantage of one click change, offered by a theme or builder.
No doubt, few elements require to be differently set. Small proportion is manageable.
On-page settings
Builders offer settings for both, individual pages and elements on the page. While using these settings, try to keep symmetry in all pages.
Follow the same layout may it be full-width or boxed. Blog posts / articles can be an exception, just keep same layout for all posts
Another example is space at top and bottom of the page and individual section. Make sure it is uniformly maintained.
This suggestion may sound childish but many times you will notice, no uniform spacings are maintained. This unknowingly harms the crispiness of the page.
Editing Website Content
Now, let’s start actual content editing. As locations, methods to change content vary as per theme and builders refer to the theme guide once.
Add Logo
Favorite part of everybody and mostly we start from this. Make sure not to upload too big or too small logo images.
Create Home and Blog Page
If you have imported demo content, you will be having these. No need to create manually.
Check if home and blog page are set, if not, assign those under ‘WP admin menu > Settings > Reading’
Set Header / Menu / Footer
As the title suggests, set header and footer and menu. Add clickable social icons if design permits.
Hero Area
Hero area decides the site’s first impression. Make sure it isn’t too heavy to load and doesn’t contain unnecessary, irrelevant information.
So many times, we can see, random images are rotated in a slider for nothing. Even a static hero area with the website’s key message is absolutely fine.
What matters is…it should be impactful.
Properly place CTA
CTA are important for conversions.
Conversion can be of any kind like making users buy your product or service, subscribe to your newsletter, try something free you have to offer or even to check more of your portfolio.
Images
If you are creating a business website, try to use real images. Random people doing handshakes, pretending like having a boardroom meeting, don’t connect users with your business.
Avoid too many images. Use only where design demands it.
When use of stock photos is unavoidable, take some time to get relevant images. Make sure to check their licenses.
Create / Edit other required pages
Create other required pages like about, contact etc. If demo import already has required pages created, just edit the content.
Not just home page, other pages are equally important. Like, with an effective ‘About’ page, you can make users relate to your story or mission.
Design Aesthetics
As we have already talked, a good webpage isn’t a page stuffed with info.
It should be easy to use and pleasing to the eyes. Every tiny detail, from the font size to the color scheme contributes to a grand impression.
Color Scheme
Obviously, colors are chosen according to a brand or purpose. Colors possess the remarkable ability to evoke specific emotions. So, go for the right color scheme.
Excessive use of colors, I personally feel is annoying and distracts visitors. Use colors on key elements that expect user attention.
Ensure adequate contrast, so text can be read easily.
Typography (Fonts)
Range of fonts to choose from…select a well readable font.
For font size, no golden rule, but SEO says bigger font size is a winner. Min 16px, which is a browser default. But that doesn’t always go with design and purpose. Decide the font size that suits your purpose.
Maintain hierarchy of font sizes, like larger font sizes for main headings, smaller to secondary headings and body text.
Alignments / Padding - Margin Consistency
Consistent spacing is a must for a clean look.
Make sure content is properly aligned. Check if padding, margins to sections are consistent all over the site.
Use of White Space
Adequate white space is a must. Clean, well organized layout makes it simple for users to find what they need.
Navigation Structure
Don’t ignore menus. Proper navigation structure will promote users to browser through your site.
Can be in any form…main menu, breadcrumb, copyright section menu, quick links in footer or links at the start of the page about what page contains. Aim is to make the user’s stay easy.
Interactive Elements
Try to include interactive elements. Encourage users for active participation.
It can be anything from buttons with hovers to feedback forms. Animations, scroll effects and sliders add a life to the page, but try not to overdo. Maintain uniformity.
Mobile Responsiveness
Hefty number of visitors access the websites via mobiles. ‘Mobile-first’ is the recommended approach when it comes to website building.
Undoubtedly, non-responsive sites are considered outdated…but improper responsiveness carries the same risk.
SEO ranking and conversion rates, both heavily depend on how your site works on small screen devices. Poor experience… and you may lose a user and a potential customer.
Nowadays, readymade WordPress themes are responsive by default. Theme’s layout automatically adapts to various screen sizes and contain other essentials like mobile friendly navigation.
From your side make sure to load properly sized images for smaller devices. Unnecessarily loading larger images increases loading time. Adjust font sizes.
Builders offer extensive control over settings like show or hide elements, adjusting padding, margin etc. as per device. Use these wherever required.
SEO & Website Optimization
Vast topic with immense importance. Really not sure how to limit this in a few words. Instead of what & how will just mention key points that surely need your attention.
Website optimization
Check general overall performance of the website like user experience for all screen sizes, uniform rendering on all browsers and site speed.
On-page SEO
Strategies and techniques to apply directly within individual web pages and are under your control. Few to name are:
- Meta tags and descriptions
- Winning content
- Relevant Keywords
- Multimedia optimization
- Permalink structure
- Internal linking
- Page loading speed
- Mobile optimization
- Structured data markup
PageSpeed Insights
Check PageSpeed Insights for each page. That will analyze your link and provide suggestions for both mobile and desktop.
Analytics & Search console
Both are invaluable tools. Site’s performance, visibility in search engines, visitor’s statistics and much more to offer.
Cache / Minify
PageSpeed Insight will also suggest you this.
Choose any plugin that fits in your requirements and compatible with your theme.
Minify options needs to used carefully, that may break your site layout. You may not notice instantly if cache plugin is on. Make sure to clear cache.
SEO plugin
Go for SEO plugin of your choice. Yoast is the popular one. Such plugins help a lot in on-page SEO.
Publish
All set to go? Deactivate and delete coming soon plugin.
You are live!
After Publish
Website launching is just a start of the journey. Long term success of a website depends on consistent maintenance and continuous improvements.
Here are the key considerations:
Keep backup
Never miss this. Hosting does keep auto backup, but make sure to keep own periodic backup of everything like theme, child theme, database and images.
Any backup plugin will help. If possible, download a copy of the backup to your local system.
Ensure security / Keep everything updated
Security plugins will add an extra layer of security.
Keep themes and plugins updated. Delete extra themes, plugins which you are not using.
Analyze and Improve
There are various means to analyze the site and improve accordingly like…analytics, search console, customer or user feedback.
Keep adding fresh content
Search engines like updated content. Make sure to add something new or update the old content as and where required.
This is my first comprehensive post. I believe, website making can’t be confined to some fixed steps. What I have taken is a more common approach. It’s a journey that varies for each individual. I’d love to hear your thoughts and suggestions for improvement.
Social Integration
We all are aware of the impact of social media right from our daily lives to business. Don’t need any words to explain its importance.
Still here are few if we need to highlight its benefits in relation to website building:
Trust Building: Straightforward way to make people believe in you. Testimonials, social media feeds on your webpage adds credibility.
Promotion / Expansion: Allowing users to share your content brings in new users.
Real time updates: Keeping users updated about recent developments, announcements, and offers, in turn keeps them connected with you.
What are different ways to add social media on a webpage?