Understanding The Architecture For Website Design
In my previous article, I have talked about some of the components of website design. I also talked about some of the factors that you need to consider when you want to create themes that will engage your audience. In this article, I will be looking at some of the factors that should be considered when it comes to the architecture for website design. Follow me as we will look at this in this article.
Basically, the goals of this article is to:
- To differentiate between a variety of web hosting options available
- To set up a basic website using wordpress.org
- To create an attractive layout for the pages of your site
Identify types of hosting setups and providers:
#1 Shared Hosting: this is where your website shares a server with many other users. These websites and users don’t share information, but they are physically stored in the same server. This is usually the most affordable solution.
#2 Dedicated Server: this is the opposite of shared hosting. Your website is hosted on a private server. This allows for more server options and also can help the server (and therefore, the website) handle more traffic.
#3 Cloud Hosting: instead of resting on one server only, the website is hosted in the “cloud,” which means it is spread across several different servers. This is ideal for large sites or to decrease website downtime. Even if one server goes down, because there are copies of the website across different servers, it is likely to never crash or not load.
#4 CMS-Specific Hosting: some hosting providers offer shared hosting, but groups the websites into clusters based on the CMS they are using. This can ensure the server caters to that CMS’ needs, leading to better scaling, security and up times.
Benefits of some hosting options:
- More security: Dedicated servers and CMS-specific hosting are usually more secure
- Affordability: Shared hosting is usually the most affordable
- More support: Dedicated and CMS-specific hosting usually get the most support
- Less downtime: All but shared hosting usually have less downtime
- Cost: Any hosting option, other than simple shared hosting, is usually more expensive. Cloud and dedicated hosting are the most expensive.
- Specific requirements: The hosting provider may require a specific CMS, website size, monthly traffic, or other requirements for a specific hosting plan.
There are roughly two types of CMS: cloud-hosted platforms like wordpress.com, and self-hosted platforms like wordpress.org.
The differences between wordpress.com and wordpress.org websites include:
- WordPress.org websites use the WordPress.org CMS, which is installed onto a website that is self-hosted on its own domain. Users need to buy and set up their own hosting and domain. This is better for professional sites that want to have their own domain that isn’t hosted on WordPress.com.
- WordPress.com websites are free and run on WordPress servers, and their domains are usually something like websitename.wordpress.com. Users can pay to have their own domain (e.g. website.com), but free hosting will still require ads on their site. This is easier to set up for beginners.
About 25% of all websites are built on WordPress.
#1 Buy a domain
Buy a domain and hosting plan from a provider like HostGator, Bluehost, or GoDaddy.
#2 Install WordPress
Install WordPress onto the website using a service from the hosting provider (some will do it for free), or by downloading it from WordPress.org and upload it using FTP or a File Manager. It is free to download.
#3 Get WordPress Plugin
3.Get your WordPress login, which you will get during the setup process through your hosting provider and WordPress. Make sure you keep a written record of it somewhere.
You can now use WordPress in the backend of the site by logging in at yourwebsite.com/wp-admin.
#5 Install Theme
Install the desired theme (website layout/design), using one of the free ones in the Appearance section of WordPress. You can also buy a theme at a marketplace like ThemeForest. This gives you a zip file, which you then upload in its entirety into the WordPress under Appearance: Themes: Install Theme.
#6 Add plugins
Add plugins. You can search under Plugins to find applicable plugins, but some recommended ones are Yoast SEO for basic SEO, a Google Analytics one, social bookmarking (e.g. AddtoAny), and a contact form plugin. If you want to rant your site in google so you can work at our Best Web Design Company to compete your competitor.
#7 Format Plugins
Format plugins and themes as needed for your website.
#8 Write content
Write the website content and modify any settings as needed, such as the desired URL slugs.
#9 Setup Google Analytics
Set up Google Analytics and Google Search Console for website tracking. Verify by adding a line of code in WordPress or by logging into a hosting provider, if applicable, during the setup process.
Tweak and test website as you go!
Creating a Layout for your website
A WordPress theme is a set of code and design files that create the overall look and feel of your website. There are several free and paid themes available but often free themes will include undesirable hidden code, links, or ads, so paid is best.
There are different types of themes based on their purpose. These include:
- Service-based, like plumbing
Screenshots shown are:
A.Customizing at the theme level
B.Where the preview button is on the edit page in WordPress to preview changes
C.Previewing what DMI’s website looks like on a mobile phone using Screenfly
To see how a change to your website looks before it’s published live, use Appearance: Customize: [Your Theme] in WordPress to view changes at the site-wide, theme level. To go there directly, go to https:/YOURDOMAIN.com/wp-admin/customize.php.
You can also preview changes on pages by clicking “Preview” in the edit screen.
Use a service like Screenfly to see how your live website looks across multiple devices. http://quirktools.com/screenfly/.
You should test mobile, tablet, and desktop in a variety of different models (iPhone, Android, Mac, PC, etc.).
- Find reputable sources of WordPress themes by looking for highly-rated theme sites that have a good reputation. Examples include ThemeForest, ElegantThemes, and TemplateMonster.
- Test themes to determine their usability across multiple devices by looking at theme demos that are offered on the theme information landing page.
- Be able to view themes on multiple devices. If you already have a theme installed on your site, you can use the WordPress preview feature in the backend (/wp-admin, under appearance and themes), to preview themes and changes to layout before saving and publishing.