1. The “Quick Change” Method of Web Design

2. Create Your Design Create and cut up the graphics for your web site. Create a masterstyle sheet. Name it “plainmasterstylesheet.html. Create your Cascading Style Sheet (CSS) file. Attach your html file to the css file.

3. plainmasterstylesheet.html

4. Create a JavaScript Include File Create a JavaScript (.js) file or utilize our blank_includes.js.

5. Create a JavaScript Include File Create a JavaScript (.js) file or utilize our blank_includes.js.

6. Create a JavaScript Include File Paste the HTML code from your plainmasterstylesheet.html into the include file.

7. Create a JavaScript Include File Line up the code for ease of reading.

8. Create a JavaScript Include File Add htmlcode+= “ to the beginning of each line of code. Add ‘; to the end of each line of code.

9. Create a JavaScript Include File Add full URL address to each src= and href= code.

10. Create a JavaScript Include File Add a back slash to each single quote in the embedded functions to keep the single quotes from ending the document.write () function prematurely.

11. Create a JavaScript Include File Copy the Pre-Load images code from the plainmasterstylesheet.html file.

12. Create a JavaScript Include File Paste the Pre-Load images code into the include file.

13. Create a JavaScript Include File Give the source code full URL addresses.

14. Create Master Style Sheet Copy your plainmasterstylesheet.html and rename it masterstylesheet.html. Delete out the common elements of the web site from the page that were placed into the includes.js file.

15. Create Master Style Sheet Be sure to delete out any rollover code generated by your authoring tool in the header section.

16. Create Master Style Sheet Add the Java Script function code to each of the locations where you deleted common HTML elements. Rename function to the function listed in the include file.

17. Create Master Style Sheet Add the include pointer code into the header section of your masterstylesheet.html file. The src= needs to be a full URL address.

18. Upload Files to Your Web Site Move all the files to your web site. Test the site to make sure the.js file is working properly and the masterstylesheet.html file is getting all the information it needs to properly build the page.

19. Start Creating Your Web Pages Copy the masterstylesheet.html page. Rename the page. Move it into the proper file in your web site structure. Start adding content!

20. Switching a Web Site’s Design is as Easy as… 1.Create a new web design. 2.Follow the steps of this tutorial for the new look. 3.Replace all the old graphic files,.css file, and the includes.js file with the new ones.

21. Questions?