16 May 2019

How To Build a Website from Scratch (Beginners Guide)

Building a Website from Scratch is Actually Easy!

Once you have chosen your website creation tool of choice, you then need to figure out how to use the thing. In this article, we’ll explore how to create a website from scratch.

This is designed as a step by step guide for someone just starting out in the online space. I’ll cover everything so that all you need to do is follow the guide.

As a complete beginner using a website builder is advisable. This will make the whole process of creating a website so much easier. For this example I have chosen Wix and WordPress, however in the end I decided that WordPress was a little bit complex for complete beginners, and would advise Wix. I’ll explain why…

Ok I’ll have to admit, after owning and creating websites for years I was a bit of a WordPress snob. Wix just seemed to be a bit naff. But I have completely changed my mind today, sorry WordPress! Wix is so easy for beginners to get up and running inside just a few minutes. The whole process is completely streamlined – I’m now a Wix fan.

Before You Get Started

It’s a good idea to own a domain name or buy one for your new website. This will be your online presence. I never made this a step in the process; because you don’t actually need a domain name to get started with Wix, which is awesome.

Both Wix and WordPress.com guide you to purchase a domain name, however if you are feeling adventurous then you could even snag a completely free domain name and point it to your WordPress or Wix website.

Recommended: 10 Ways to Get A Free Domain Name (In Less than 1 Minute!)

[/vc_column_text][/vc_column][/vc_row]

Setting Up A Website With Wix

BEST FOR – Complete beginners who want to get up and running quickly

All you need to get up and running with Wix is an email address and an idea, simple.

STEP 1

Head over to Wix.com and hit “Get Started”.

One great thing about Wix.com is that you can sign up in seconds with your Facebook or Google accounts. Alternatively you can input your details to create your account (which takes a few seconds longer).

You’ll then be taken to a fill in the blanks style questionnaire

STEP 2

Fill in the blanks on the questionnaire to let Wix know more about the type of website you are creating – the answers appear as a prefilled dropdown so it’s really easy to follow.

STEP 3

If you’re a complete beginner then the “Let Wix ADI Create a Website for You” is free and makes life so much easier. Simply hit the “Start Now” button (on the left) to be guided through the process from creation to publishing your website in minutes (literally).

You’ll then be asked a few questions about your blog or website. I chose a “Health Food Blog”, however you can fill in a few keywords and select the type of website that best suits your project or organisation.

STEP 4

Decide what features you want on your website. If you are not sure you can skip this part for now. However, I’d advise selecting a few features that you think that you might use from the available options which are as follows:

  • Live Chat
  • Online Store (eCommerce solution)
  • Bookings
  • Video
  • Events
  • Instagram Feed
  • Paid Plans
  • Subscribe Form
  • Music
  • Bandsintown (display upcoming bands in your area)

I chose the following features for my blog – subscribe form, paid plans, Instagram feed and bookings. However, if you want to display videos or sell tickets to an event then you might choose the features “Video” and “Events”.  You can even sell online plans and programs, which is pretty neat.

STEP 5

The intuitive questionnaire will populate your website with some relevant content and you can select the right template to fit your needs. All you have to do is select the type of theme you want and select from the displayed choices (my options are shown below).

The theme options are fairly limited with Wix.

STEP 6

You can easily edit the theme by hovering over areas and pressing the “edit” button (shown in the image below)

When editing your website design, you’ll see a panel appear on the left hand side of the page that will allow you to change the text and images.

Pros

✔ You get a FREE Wix domain name

✔ There is an option to use your own domain

✔ Creating and publishing a site is free and easy

✔ Questionnaire style web creation makes the process fun

✔ Set up a feature rich website in minutes (seriously, it’s that easy!)

✔ Great features like live chat, bookings etc…

Cons

✘ Limited scope for customizing templates

✘ Wix advert displayed on free options

✘ Bandwidth is limited

Setting up a website on WordPress.com

BEST FOR – More competent website owners or small businesses

Creating a website with WordPress is not as straightforward as Wix. You’ll require a domain name to get started. You can get one from WordPress.com easily; however bear in mind that you’ll need to pay for the DNS service. Even if you have your own domain name, WordPress.com wants paid for you to have the privilege of using your own domain host.

Transferring your domain to WordPress.com or purchasing a domain name from them seems to be their preference. If you are happy to host your domain name with WordPress.com then the process is straight forward.

Creating a WordPress website is a great option if you want to scale your business up in the future. There are unlimited options and additional plugins that you can get to upgrade your WordPress website. I’d suggest going for a .com domain name extension and taking the time to learn WordPress (or employing someone to upgrade your theme) if you are serious about your online presence.

STEP 1

Go over to WordPress.com and hit the pink “Get Started” Button.

STEP 2

Create your account using your email address, create a new username and a secure password. Unfortunately you can’t sign up with Facebook or Google like you can with Wix.

STEP 3

Pick the type of website that you want to create from the following 4 options:

I decided to choose a food blog as I want to write about raw living foods and share recipes. However, you might want to choose a professional portfolio site, if for example you are a Graphic Designer or Photographer.

STEP 4

This is where your domain name comes in. You have three options, you can either choose to buy a new domain name, transfer your domain name to WordPress.com or map your domain to your WordPress.com (which costs $14.50)

STEP 5

Choose a theme by clicking on “Themes” down the left hand side menu. There are a great number of themes to choose from. To find a theme that suits you then use the search bar (where it says “business”) and enter keywords relevant to your theme to narrow the search.

There are both free and premium themes to choose from and you can toggle between both (depending on your preferences). Your theme will decide the look and feel for your business, and can be changed at a later date with ease.

STEP 6

Customize your theme by hitting the customize button on the top of the page. Here you can change the title of the page down the left hand side menu. You can also many other aspects of your website appearance.

STEP 7

By default your website homepage will show your latest blog post, to change the website to a static homepage instead (With content of your choosing).

To create a static homepage create a new page (from the menu on the left).

Then call this page “home” and set to a “static” page type

STEP 8

The entire website can be customized further for example you can change the colors of the site by choosing colors and backgrounds on the menu.

Then you can choose a color scheme that matches your brand

Your WordPress website can be tweaked over time, keeping the blog content intact.

Pros

✔ Easy to upgrade to a feature rich professional WordPress website on your own hosting if you should choose to at a later date

✔ Great for adding in blog content in the WordPress CMS area

✔ Lots of plugins

✔ Content can be downloaded at any point

✔ Lots of templates to choose from

✔ More customizable website options

Cons

✘ No completely free option

✘ You’ll need to buy or own a domain name

✘ The interface is hard to use for a beginner

✘ If you use a domain name you own you’ll still be charged an extra $14.15 per year to keep your domain name on your current DNS/ domain name hosting provider.

✘ Time consuming & confusing

✘ No Facebook or Google signup option

In Conclusion

If you are looking for a TRULY simple way to get up and running then Wix is your best option. The whole process is streamlined and perfect for beginners. However if you want to get more indepth and are not baffled and bewildered by the huge amount of customizable features, then WordPress is the best option. To get WordPress looking like you want can take days or weeks. However, Wix can be up and running within a few minutes – so defintetly the more convenient option.

Share this
16 May 2019

15 Places to Learn to Code for Free in 2019

There are lots of places where you can learn to code for free. With the boom in using website builders, people are turning to learning code to build and enhance their websites even more. People who know code already, are in a similar profession or are professionals, have been creating resources for many years in order to help others.

If you’ve never looked at web design or web development before, free coding resources can be a great go to, or at least a starting point. Once you’ve got to grips with the basics, you can find more in-depth courses to further your journey. Learning code does take a reasonable amount of time and effort, and you’ve got to want to learn it. Like most things, if you’re not interested, you’re probably going to struggle at the first step.

Who can learn to code?

Anyone can learn to code if they want to. Sometimes it’s worth considering what types of people might benefit more from coding in the long run. Let’s start with a few simple questions to establish if you’re the right person to learn code and make use of our free coding resources.

  • Do you enjoy web development, or the technical theory behind web development?
  • Would you like to be able to turn an application or website idea into something real?
  • Do you write content for a blog and therefore care about the quality and user friendliness of your site?

If you’ve answered yes to any of the above then it’s probably worth you learning code. Although it might seem daunting at first, it can actually be really fun and very rewarding.

You don’t need to be a computer geek to learn how to code. Coding can be done by anyone who has the thirst and desire to learn it. You can make mobile apps, websites and software, no matter who you are! And who knows, you may even turn it into a career or start your very own business.

Why should I learn how to code?

Learning how to code can reduce your overall costs if you are thinking about or currently hire a programmer or developer. In fact, if you become an expert in the field, not only could you save money, you could make money too!

Even if you just learn the basics of coding you could make a big difference to your site or business. Having the bare bone knowledge can often lead to more without even realising it.

Because coding is so popular, the amount of resources available can be overwhelming. That’s why I’ve put together some credible free coding resources for you. I’ll show you where to go (and what for), allowing you to decide the best route for your coding adventure.

Online Courses

1. Codecademy

Codecadmey is like a giant online free coding boot camp. The community at Codecadmey is absolutely massive and is an ideal spot for beginners to jump right in. When you’re learning a new skill, it can often be very useful to have access to a community whereby you can ask questions and discuss ideas. Codecadmey provides this on an extremely large scale with literally millions of users worldwide.

Codecademy is free which is why it’s listed here. Unlike many other companies, you don’t need to have a subscription to learn from Codecademy. One of my favourite features of Codecademy is that you don’t need any kind of software to begin coding. Their easy to use interface is built into their website so everything can be done in your browser.

Codecademy covers the following coding languages:

  • HTML
  • CSS
  • Sass
  • JavaScript
  • Rails
  • Ruby
  • SQL

(And much, much more).

2. Coursera

Coursera offers a large online library of free coding courses. All of the courses available are 100% free which is a great opportunity for anyone wanting to learn coding.

Coursera’s courses aren’t just run by anyone, they’re put together by leading universities and companies in the industry. Although it’s just as valuable to learn new skills from people who use them on a day to day basis, some people find it reassuring when there’s a big name behind the education.

If you want to obtain a Coursera verified certificate to ‘prove’ your coding skills, you’ll need to pay for it. The certificates range from $30+ and can go up to $100. Although this may seem a little steep, if you consider how much it would be to actually go to university of learn from leaders in the industry, it’s very reasonable.

Coursera doesn’t just offer your basic coding languages. They do cover HTML, CSS, JavaScript etc. but they also go far beyond this. There’s specific specialised courses available too (which you do need to pay for).

3. Udemy

Udemy isn’t solely focussed on coding languages but they do offer courses on these. You can access a wide range of in-depth courses through Udemy’s library. Whether you want to improve on existing coding knowledge or learn new skills, Udemy offers it all. From game development to software development, creating apps to testing them, there’s plenty to sink your teeth into.

Courses allow you to learn at your own pace, and will save your ‘history’ so you can come back to it at any point. There are both paid and free courses available, from web development to data science (and more).

Udemy courses can actually be created by anyone, so they don’t necessarily represent the ‘standard’ in any particular topic. Each course has a list of reviews from actual users, so you can judge whether the course is right for you or not. I’d recommend checking out the reviews before you start one!

4. Free Code Camp

Another free coding boot camp, Free Code Camp has a wide and established curriculum to teach from. All of the projects available allow users to work with hands on experience. What I love about this coding resource is the community behind it. There are millions of other users willing to support and help each other which is lovely to see in this day and age.

Free Code Camp doesn’t just teach you coding languages. It offers a lot more, such as being able to apply said coding to real world scenarios. You can build projects and take part in them with others as well as getting a certification at the end of it.

For example, they will actually prepare you for your developer job interview! How cool is that? Free Code Camp is a non profit organisation offering accessible coding to anyone.

YouTube Channels

5. DevTips

DevTips is one of Travis Neilson’s YouTube channels, who specialises in ‘making things for human people’. The YouTube channel focuses on web design and web development and sometimes offers live Q & As.

DevTips provides weekly shows for those that want to be inspired. The channel opens up opportunities for people to learn development and programming together. Watchers can get involved during the shows, creating a community aspect on a weekly basis. Shows start at 8:00 PM (GMT) every Friday.

6. Coder’s Guide

YouTube channel Coder’s Guide provides a video series on coding languages like JavaScript, HTML and CSS. You’ll find a range of videos from quick learning to in-depth courses, job interview preparation and more.

Neil Rowe offers up some easy to follow video tutorials for anyone wanting to learn coding and web development. He shows you step by step what to do and how to do it. What’s nice is that Neil himself will respond to comments on his videos, answer questions, and get involved in conversations.

7. LearnCode.academy

LearnCode.academy’s YouTube channel is regularly updated. As well as offering free coding videos to help you learn, they also provide tips and tricks to making the best website.

The YouTube channel covers web development tutorials, web design tutorials and more. Some of the languages that are covered are HTML, CSS, JavaScript, CSS Layouts, Responsive Design, and React.js.

HTML & CSS

8. Learn CSS Layout

Learn CSS Layout is ideal if you know the basics of HTML and CSS to begin with. If you don’t have the basic knowledge, you can use some of the other resources I’ve mentioned in this guide to get you started.

It will teach you the best ways and fundamentals of setting up a website in terms of layout. This is going to be valuable know-how when you start creating your own website, and useful for ensuring your site is mobile-friendly.

9. Mozilla Developer Network

The Mozilla Developer Network provides free HTML and CSS documentation to anyone and everyone. They provide tutorials for a selection of topics, from beginner to expert skill levels.

The idea behind the Mozilla Developer Network is to provide articles about Mozilla code. Whether you want to download it or build it, you’ll need to know how the code works. Topics also cover add-ons for Mozilla apps.

10. HTML Dog

HTML dog has some great beginner HTML tutorials (like this one). They also cover CSS tutorials and appeal to beginners and advanced users alike.

HTML dog is a useful resource for anything HTML, CSS, or JavaScript. These languages cover the basics of web development and web design and provide a useful stepping stone into the world of development and programming.

Git

11. Try Git

Created by Code School, Try Git pretty much does what it says on the tin. You can try out your Git knowledge (if you have prior experience) or simply experiment with Git.

12. Git Immersion

This is the place to go if you’ve never used Git before. Git Immersion offers its users a guided tour into the world of Git, setting you up with the basic knowledge.

Coding Blogs

13. Tuts+

Tuts+ offers loads of coding tutorials which can be pretty helpful if you’re looking for something specific. They do have courses too, but these are paid for.

Tuts+ has over 1200 video courses, 250 eBooks, and almost 30,000 tutorials. You can use your newly founded knowledge and skills and make use of Envato Elements. Here you’ll have access to thousands of website templates and themes, designs, and almost half a million photos.

14. David Walsh

David Walsh is a senior developer at Mozilla. His blog (with other contributors aside from himself) offers demos, tutorials, and how-to guides.

David’s blog covers popular topics including .htaccess, CSS, WordPress, SEO, JavaScript, HTML5, and lots more. His blog offers news related to the web development world, alongside incredible demos and feature discussions.

15. CSS Tricks

There’s a whole bunch of stuff on CSS on the CSS Tricks blog. They’ve got loads of resources as well as covering other subjects like JavaScript and PHP. When owner, Chris, started the blog in 2007, he was mostly writing about CSS. It occurred to him that HTML and JavaScript were being mentioned a lot as they both form the basis of creating websites.

Because the blog was made on WordPress, Chris found himself talking about WordPress too, so the name quickly became desolate as he now covers a large range of topics.

CSS-Tricks mainly focuses on building websites and everything else that goes with it. The blog have permanent staff writers as well as guest authors who all offer a different perspective within their content.

Share this

UKWebHostReview.com - Best Web Hosting Comparison