Week 10
Discussion and commentary about website project:
This was a very interesting and productive class and I enjoyed honing my web design techniques. I was attempting to design a personal website that I could use to refer to later and which could help showcase my talent in a future job search. I had never used or designed a 3 column site before, and thought I would try. I wanted to keep the navigation on the left, because I find that to be the most prominent and almost expected place.
Color/ texture:
Originally I had wanted to do something with a parchment or paper textured background and maybe have a faint coffee stain over part of the page (almost like a water mark but the outline of a cup bottom and in a coffee or tea color but not too dark). I found that with my CSS coding the background image would not look right as it would stop at the footer but continue on the side columns. I decided that rather than completely change my coding I would go for another, simpler look. Also I found I would have to spend so much time in a graphic editor trying to get the texture for the background and coffee stain right, and I just didn’t have that kind of time.
I really like muted, earth tone colors so I went with greens and browns. I also through in a little complementary purple as it would stand out and add another dimension to the website. I used both the color scheme generator from well styled (http://www.wellstyled.com/tools/colorscheme2/index-en.html) and colors on the web (http://colorsontheweb.com) to pick colors that would look nice together. I kept this color scheme in my banner and added a bit of texture by using the Papyrus font and giving it a slightly three dimensional look with a drop shadow. This really helped to make the page not seem so flat. I think I would have liked to design a banner with some book graphics/ images, but again I found I was needing to spend so much time using a graphic design program which I was not comfortable doing anything in other than basic image resizing and text modifications.
Typography:
For the most part I wanted the text to be in a common font that was easy to read online. I went with a sans-serif for my smaller text in the paragraphs specifying Veranda then Arial and then general sans-serif. I wanted my H1 and H2 and H3 to stand out a bit so I specified Comic Sans MS first. This is supposed to be a widely supported font and as it also doesn’t use serifs it blends well with the paragraph font. As already mentioned I used Papyrus as my font choice in my banner. I really like that font as it reminds me of old texts and was tempted to use it throughout my website. However I don’t know how widely supported it is, and It is not easy to read in smaller sizes, especially on a computer screen. I settled for showcasing it in my banner, and it works well there.
Images:
I wanted to have some images to draw the attention as my pages have so much text. I own the photo of me with a Florida Scrub Jay so I used that, and I went to several free image sites looking for images. I finally chose some from Stock.xchng (www.sxc.hu). The ones I chose were free and had no special requirements other than they like a link back to the website from which they came (I put the link in my first page footer).
Scripts:
I did end up using some JavaScript items in my site. I imbedded a meebo widget which allows someone to leave a chat message or if I am logged in, we can chat live. I had seen this tool before and wanted to see how it worked. I also imbedded worldcat search boxes on some of my resource pages so a visitor can search for books I mention in libraries. Finally I used JavaScript for my navigation menu. I had tried to write the CSS coding for fly out menus but I could not get it to work in Internet Explorer. I found the site www.opencube.com which offers a free trial test of its quick menu tool. I found a nice expanding tree menu that works well, but the trial may end soon and I may get pop-ups saying that it is not paid for. I may end up eventually finding another source for the JavaScript menu. The major problem I foresee with the Script menu is that if I want to add a page, I have to completely redo my navigation menu. This could be a major problem if I get a script from a site which rotates which menus it offers freely. I may have to completely change the look.
Lessons learned:
I learned about some wonderful resources for web design in this class and will need to spend more time learning about CSS and JavaScript so I can utilize these more effectively in future websites. I attempted to use Dreamweaver to design this website, but am not comfortable enough with all the wonderful things it can do, so I found I spent most of my time editing the HTML code. In the future I need to spend some time playing with and reading tutorials so I can take advantage of Dreamweaver. The same thing goes for the graphic editor I am using. Gimp is working well for me, but I can only do basic things and have not been successful trying to design graphic banners with images and background images or textures using it. I can resize images easily and can create a text based banner image, but I need to learn more about the program.
When our class had a presentation session where folks showed their work in progress, I found myself being quite jealous of those with Macs using the Mac program iweb. The two folks who used it said it was so easy to drag and drop images and rotate them and give them special effects like drop shadows or curling edges. It seemed that it was a much easier tool to use than Dreamweaver.
This was a wonderful class, full of information and resources. I learned quite a bit and also learned how much more I have to learn. It is clearly an ongoing work in progress to design and maintain any website. Not only does one need to have skills in using many different software programs and understand multiple different coding techniques (at least rudimentary) but one must stay on –top of current trends. As fashions go in and out, hip designers need to go with the flow. Simple and classy websites will always work especially if their content keeps drawing visitors back (see W3Schools: http://www.w3schools.com/default.asp). However, savvy web surfers are often looking for and expect the latest innovations. If you are designing a website for a young, hip audience you need to be aware of the trends and use them effectively (see 2Advanced Studios http://2advanced.com/).
