Wednesday, November 20, 2013

Instructional Website

For my Instructional Website project, I created a website explaining the use of Google Docs and spreadsheets.  I began by defining Google Docs, comparing differences between Google Sheets and Microsoft Excel, and also provided a general overview of Google Docs versus Microsoft Office.  Beyond examining these subjects, my objective was to create a website that would provide detailed instructions on how to create a new Google Docs spreadsheet, and how to use functions and insert graphs in Sheets.  I wanted to make a visually appealing website, free from frustrating contrast issues between background and text.  I also wanted to ensure my website was intuitive and easy to navigate.  Here is a screen capture showing my homepage:


Because of the website experience I have gained from career, along with the training videos I watched on Lynda.com and the previous Dreamweaver assignments in this course, I really didn't encounter any obstacles during this assignment.  Although I felt prepared, it was still a lot of work.  I estimate that I spent approximately 4 hours working on this site.  The only two issues I experienced were:
  1. My Website Background - I wanted to add a visually appealing background, without it being too distracting.  After a quick Google search, I found a website offering free backgrounds for download.  I download a background and inserted into my CSS code to change it from the plain, solid color background.  It worked fine previewing it in Dreamweaver, but once I uploaded it to my U of A web server the background stopped working and reverted to the solid color.   I had to edit the HTML on each of my web pages and remove the default color setting that was entered from the Dreamweaver template.  Once I deleted the HTML code, the CSS code took over and placed my background image on each page.
  2. Uploading my Website - I was grateful for my general understand of FTP and public_html folders because of the issue I ran into after uploading my website to the U of A server.  I had selected all of the files for my website, and transferred them to my U of A server using a FTP client on my Mac laptop.  I opened a browser and navigated to my site, but some of my pages were showing a 505 error message.  After clicking around for a bit to see the extent of the issues with my page, I went back to my FTP client to look at the files on the server.  I realized that a few of the pages didn't upload into the public_html folder for some reason.  Some had been saved to the root directory folder, while others were placed into the public_html folder properly.  I moved the orphaned files from root into public_html and everything started working properly.  
The main thing I learned during this project was a much deeper understanding of Dreamweaver.  As I mentioned earlier, I've had experience with HTML coding in my career as well as previous college courses when I was working on my B.S. degree in Information Systems.  However, I had never really used Dreamweaver because I had either worked directly with HTML code, or on websites that were already created and used normal text editors to modify those.  I'm glad to have a good understanding of Dreamweaver as well as more knowledge of external CSS.  A lot of the training videos on Dreamweaver that I had watched on Lynda.com really paid off during these projects.  I don't know of any additional Dreamweaver features that I would like to learn that were not covered during these projects.  It is an extremely powerful software tool, so I'm sure there are many features that I don't even realize yet.  But for now, I feel like I learned everything I needed to learn to accomplish my goals.  

No comments:

Post a Comment