TECHSPLORATION : HOW TO BUILD A WEBSITE PART 1

Last Updated:11/17/2020

No templates here! Learn how to build your website with code!



Hello! We’re back and hope you guys are having a fine day. Today we will be sharing with y'all how to create a simple website using Brackets. We will be creating one from scratch and showing you a few styles you can use. So without further ado let’s get started. 


Make sure to download Brackets first. 


  1. What’s great about Brackets is that as you make edits you can see the website change and compile so you can quickly see the changes you made. We will be coding in HTML as that’s how webpages are created.  
  2. So go ahead and create an HTML file under File -> New.  
  3. Now what you have is a blank page and what we want is just to have the webpage say: “Hello Welcome to my Website” We will first need to create a doctype and the HTML and body. Just like this: 

<!DOCTYPE html>

<html>

<body>

  <header>

    <h1>Hello Welcome to my Website</h1> 

  </header>

</body>

</html>



  1. Now, this is where you can get creative and add your unique work to it. You can add a paragraph to it or even change font color using this line of code: 

<h1><font color = "red">Hello Welcome to my Website</fontfont></h1>

  1. Of course, you want to see the changes. On the bracket, you should see a sideways lightning bolt on the top left. It should say “Live Preview” Click on it and your web page should open in a browser. 

WELCOME TO MY WEB PAGE 

  1. Now, this is just the surface of how gettings started with making web pages. If you would like to learn more let us know and we will expand more in hyperlinking, creating buttons, adding images, and many more. 

A few may ask why not just use tools that create websites. Using websites like Squarespace, Wix,  or Weebly, and many others. These tools are great but at times you are limited by the format of the web page or the functions but with you coding it, you can do whatever you want and how you want to. 





Back to Publications