×

READY FOR A NEW CAREER?

But not sure where to start? Find out if a tech career is right for you.

TAKE THE 3-MINUTE QUIZ

How Do You Make a Website? 4 Basic Steps For Getting Your Site Online

Get Our Free Ultimate Guide to Coding for Beginners

Get Our Free Ultimate Guide to Coding for Beginners

Make a plan for learning the tech skills you need to land a new job with this 60+ page FREE ebook!

The term “website” covers a ton of ground and can include everything from a few pages of static text to complicated web applications like Facebook, Netflix, or Amazon, but—no matter how humble or grand a site might be—the basic principles behind creating a website remain the same. We’ve rounded up the four key steps at the heart of making any website so you can know what to expect when it’s time to take a crack at making your own.

Planning Your Website

Before any of the tech jargon, design chops, or programming skills related to making a website come into play, your site has to take shape as a solid idea. Having a clear understanding of your site’s mission will help inform your design, content, and structural choices later on, so step one is to get that mission nailed down. Bust out a whiteboard, open a Google doc, grab a pen and paper, or use whatever other tools you’re comfortable brainstorming with and consider the following:

What is the purpose of your website and who is it for?

According to web and graphic designer Crissy Bogusz, “a website can only be successfully planned once the expected audience is studied, which then determines how the site should function.”

So, is the website for a business hoping to connect with customers online and alert them to upcoming events and sales? Is it a fansite for a TV show looking to provide a forum for members of a fan community? Is it a website for a non-profit or charitable organization trying to attract donations or volunteers? Understanding who you’re trying to attract is key to determining what your site will look like and how it will work.

Similarly, Bogusz says it’s a smart idea to get a feel for what successful websites serving similar audiences are doing. Are there certain forms, layout choices, or keywords that seem to be a universal standard? By knowing what works on other sites—and what your target audience expects—you’ll be able to balance originality with enough familiarity that users will feel confident in your website.

How will your visitors use the website and how will your website benefit from user traffic?

“If you’re not successful at engaging your audience, then your traffic (visits to your website) becomes irrelevant,” Bogusz says. “Users who engage with your site’s content and make return visits will sign up for your emails and newsletters, share your content on social media and other online platforms, and buy your products.”

Using the examples above, if you’re making a business website consider asking users to add themselves to an email list in order to receive updates and coupons, which the business can then use as leads for future sales. If it’s a fan site, a message board or chat room can allow users to interact, connect with one another, and turn the site into a pillar of the fan community. If you’re creating a site for a charitable organization, you can build forms into the site that allow users to make donations or sign up for volunteer opportunities.

But, Bogusz says, it’s also critical to balance these kind of features with what you know about your specific target audience. If you know your audience has a short attention span, consider strategies like limiting the colors you use as a way to minimize distractions and relying more on images than blocks of text to relay information. If your audience isn’t particularly tech savvy, think about including a lot of navigation buttons, explainers, and FAQs.

Getting a sense of how you plan to maximize traffic and how you’re going to interact with that traffic will be a big part of moving on to . . .

Designing Your Website

After you have a clear idea of your website’s function and target audience, the design phase involves planning out how the site will be arranged and what it will look like. Web design is the art of creating the aesthetics and usability of a website—making sure that a site is not only pleasing to the eye, but that the layout also makes sense and is easy for people to use when visiting from their computers, tablets, or smartphones. Web design can be its own specific career path, but—when you’re taking a stab at your first website—you’ll probably be designing it AND developing it yourself (more on developing a website below).

In order to design your website, you’ll use tools like Photoshop (an industry standard image editing program) and Webflow (a software program commonly used for web design) to create a mockup of how the finished site will look. You’ll choose fonts, color schemes, and page layouts, decide which content goes on which page, and make a general sitemap—a list of all of your website’s pages—that you can refer to when you move on to coding the site and getting it live and online.

Making Your Website  

This is the part where your ideas and mockups get turned into the real, digital product—the step where you actually “make” (or develop) your website. Web development is the process that takes place following web design, and—like design—can be its own dedicated tech career path.

In order to develop a website you’ll need to use a programming language (or languages) to code the site’s pages—meaning you’ll need to create instructions that a computer can follow to display your website on your users’ screens. There are two main ways this can be done—one is through hand-coding a site from scratch. The other is to use a content management system like WordPress.

If you choose to hand-code your website, HTML (HyperText Markup Language), CSS (Cascading Style Sheets), and JavaScript are just three of the many programming languages you can use, and they’re a solid trio for getting started.

HTML is a primary coding language used to make web pages. While it is possible to hand-code a website without using HTML, HTML is a universal standard that can be understood by all web browsers—applications like Safari, Firefox, and Google Chrome, which are used on computers, tablets, and smartphones to view and interact with websites. HTML is used to define the parts of a web page (paragraphs, headlines, embedded video content, forms, etc.) to the browsers that visit them. Those browsers then take a site’s HTML content and translate it into what you see on your screen.

After your site’s page structures are defined with HTML, its cousin language CSS can be used to specify each web page’s style—page layouts, colors, and fonts are all determined with CSS. Finally, Javascript adds interactive elements on a site, like pop-up ads, slideshows, search field autocompletes, and other web features that change without refreshing a page.

As mentioned above, another option for making your website is to use a content management system (CMS) like WordPress (the industry standard CMS). Content management systems are software applications that help web developers create digital content, publish that content, and manage it once it’s online. The main difference between using a CMS like WordPress and hand-coding is that a CMS lets you bypass the need to edit and reupload each page of a website every time you’re adding, removing, or changing content (more on uploading pages below).

A CMS like WordPress operates through a graphical user interface (GUI)—a series of menus and control panels that allow you to choose options for your site and enter content through forms and text editors. Through a CMS interface you can theoretically develop an entire site without coding, but you’ll also be limited to the templates and options offered by the CMS. Once you get to a point where you want to customize a site past the point of what the CMS’ default choices offer, you’ll need to rely on coding to take your site to that next level.   

Hosting Your Website

Whether you’ve hand-coded the pages of your website or put the whole thing together through WordPress, you’ll need to get your content on the internet in order for your website to be live, searchable through search engines like Google, and viewable through web browsers. This is done through a process called web hosting.

Web hosting involves securing a domain name (the user-friendly address of your website, like Skillcrush.com), paying for a web hosting service that will provide online storage for your website’s content, and uploading that content to the hosting company’s servers (the computers that store your content online).

As far as domain names go, first you’ll need to pick one that is appropriate for your site. Of course, many names will already be taken, so use a domain name registry like Whois to look for names that are still available. Once you’ve found one you can use, you’ll have to register the name, which you can pay to do for a small fee through a domain registrar (which is often included as a service from your web hosting company).

Hosting companies—as mentioned above—store your site’s pages, images, and other assets, and assist with your website setup process for a fee. Finally, your developed site pages—whether files that you’ve hand-coded or pages you’ve developed through a CMS—are uploaded to the hosting company through a program called a file transfer protocol (FTP) client. FTP clients are separate programs you’ll need to install on your computer, and they range from free to paid. Once your content is uploaded, your website will be live, online, and ready to be viewed and used by other people—in other words, you’ll have officially made a website.

infographic

Get Our Free Ultimate Guide to Coding for Beginners

Get Our Free Ultimate Guide to Coding for Beginners

Make a plan for learning the tech skills you need to land a new job with this 60+ page FREE ebook!

Your email address will not be published.

Cancel

0 comments

Want more articles like this?

Sign up to get the most recent tech news, tips and career advice.