5/11/11

How to Build and Develop a Website

Building a website can be a complex process. In order to design a site, even if you are using a content management system (CMS), some knowledge of HTML and/or CSS and graphics creation is almost a must. However, not everyone has this type of expertise. Websites can still be built using basic tools and templates, even if you don't know much about coding or creating graphics. You can build and develop your own website using free HTML editors, graphics tools and pre-made templates.
    • 1

      Choose and download a free Web template to start your site. You can find many free templates on sites such as OSWD and freewebtemplates. A pre-made template contains all the images and HTML/CSS code you need to operate your site, and you can customize anything you want by replacing any images with ones you create, and any of the text. (Be sure to check for any copyright placement requirements by the template creators.)

    • 2

      Download a free HTML editing application such as PageBreeze or Aptana Studio. These programs will allow you to edit the HTML files of your site so you can replace images and text.

    • 3

      Open the HTML program of your choice, then use it to open the "index.html" file. The index file is the first page that anyone will see when visiting your site, so it's a good idea to build this page first. You don't need to pay attention to much of the code unless you plan to make extensive changes to the template. If you already know what pages you want on your site, create the hyperlinks in the menu, which should already be there for you to edit. For example, you can create a new hyperlink on your menu to go to your "About" page, which would look like this: <a href="www.yoursitehere.com/about.html">About Me</a>

    • 4

      Create any additional pages as necessary. An easy way to create new Web pages is to simply make copies of the index.html file, rename them and edit them appropriately. For example, make a duplicate of "index.html," name it "about.html," then use your HTML editor to change the information accordingly. By using this method, you can also avoid having to redo the menu hyperlinks on each page if you already filled them in.

    • 5

      Replace any images with images of your own by using a free online image editor such as Pixlr or Splashup. To replace an image, simply create a new image document that is the exact size as the one that already exists. (To get its dimensions, find the image within the "Images" folder, right-click on it and click "Properties.") Save the file to your "Images" folder to upload later. If you don't want to replace the image link in the site's HTML, just replace the first image so it has the same name. For example, if you have "logo.jpg" and you want to replace it with your own, call your image "logo.jpg" and replace the existing image.

    • 6

      Evaluate your site to make sure you have included everything you need on every page. You can look through the code in an HTML editor, but also in a Web browser by double-clicking the HTML file, or by right-clicking it, selecting "Open With" and clicking your Web browser. Make sure that you have included your hyperlinks on every page, that your images have been replaced (if applicable), that your site's content has been typed correctly on every page and that any additional information displays correctly.

  • No comments: