Translate

Sunday, September 22, 2013

how to build a website in html and css step by step


WHAT YOU SHOULD KNOW?

Lets begin! First you will need to know what your website is about. 
Determining what will be the content of your websites is an important step before starting anything else.
NOTE:
*NO CONTENT = NO IDEA -> NO WEB PAGES -> NO WEBSITES..

I will give you step by step approach in what it takes for beginners, a pro, web designers to build a website.

Lets Go! 

Step1: Lets Draft a Plan for Your Website


1-Lets determine what type of website  you be working on.
        Make a pick from the following:
* Personal site,            
* educational site,
* e-commerce site,        
* company sites,
* social networking site,  
* file sharing site,
* forum sites,                
* blog and online sites,
* search engine sites,      

2. Now its time to start drafting a plan for your website.
        Revise,Revise until  final draft is done!

Step2: Choose Your Site Name and Layout


1- Decide your site name,domain name
Example: www.mysite.com

2- Choose a hosting company to check if your domain is not already taken.
     Example of hosting companies: 
* www.Godaddy.com      
*  www.Justhost.com
* www. Hostgator.com   

With HOSTGATOR:
  GET 25% OFF by using coupon code: "waycheaper" 
  OR $9.95 by using coupon code: "cheaperfor"

*  www.Hostmonster.com
* www.Ipage.com         
*  www.Bluehost.com 
3- How many pages will you need for the website?

4- Decide the general Layout of your site.


Step3:  Files ( images, videos, notes)

1- Important Note : If  you are not designing the website yourself,  you will need to give all of the following items to the designer.

* Images:
Make a list of images for your website. Images are important because they bring the site to life!

* Videos: 
Most websites such as educational, news use videos to target audience. However, some sites instead like to use slideshow to replace videos. So feel free to choose what you prefer for your site.

*Audio:
Some sites use audio such as radio, music,  audio effects.etc...

Step4: The Coding/Programming Part. 


Websites pages are written in an specific language called HTML ( hyper-text markup language),which is a set of markup tag such as <p> paragraph</p>. 

Web browsers such Google Chrome, Safari, Firefox, Opera, Internet Explorer convert HTML Code into web pages which can be readable. 

 Despite html, Designers have to use CSS (Cascading style sheet)  language ,which brings life to webpages.It allows designer to add color, images, boxes. videos, text formatting, etc.

In Addition,designers use JS (JavaScript)  a scripting language for the web that allows the pages to be more dynamic and interactive.

What you should use:  HTML + CSS + JAVASCRIPT = WEBSITES

Once you are completed with the coding part of the site, Its time for the world to see your website!

Step5: PUT YOUR SITE ONLINE UNDER YOUR DOMAIN NAME


           Now, its time to upload your web pages! This is done with an FTP client.
FTP (File transfer protocol) allows you to upload your files to your public_html file directory.Some FTP clients are FileZilla, SmartFTP.
NOTE: You will have to register a ftp account with the hosting company before transferring files.

Remember:
           When you bought your domain name,  you or the designer was able to add a domain plan that various by companies. Some company charges $8 to $15 per month to host you site.  You  have to choose a plan that you prefer and once purchased, it will take 24 to 48 hours for your domain name to propagate. Then you will need upload your file through your ftp client you created earlier.

USE COUPON CODE ON HOSTGATOR.

"waycheaper" and Get 25% OFF for new hosting. or "cheaperfor" and Get 9.94% OFF.


NOTE:
For beginners, these steps can be frustrating but don't let it be the reason to quit.. You can do it !:)

Step6: YOU ARE ALIVE ON THE INTERNET.

Note:
You website is now online and the world is ready to see it.

Note: These are the basic steps in what it takes to create and publish a website.
However, there is more to know so feel free to do some extra research on your own.
There is always more learn...

Congratulations!

Hope this was helpful for you;)