tutorials

Spring 2007
course
navigation

Ryan's Web Design

Before the midterm I finished the website for the Integrated Management Systems Group and uploaded it both to my cs directory here, and will be updating it to the registered imsgllc.net domain within a week.

Quick trip through my semester so far

I began the semester by playing with basic HTML and using another business website's front page, and the results were less than satisfactory. While it was a valiant first effort, I think I would have been much better served working immediately from a pre-designed layout, which I would do later with much better results. CSS especially I think is much better learned through adapting pre-designed layouts as both Jim and Patrick mentioned but which I ignored for the first week.
So the third week I finally found a pre-designed layout from Open Source Web Design and attempted to adapt it for the Dolan Consulting website with mixed results. While it looks great on my computer as seen here, the entire page broke apart when viewed on Jim's computer due to my use of pixels and absolute positioning for every element on the page. I really did enjoy this layout though, adapted from the grapes theme, and I really enjoyed the title and the colors, thought obviously I would have been much better served not using absolute positioning.
The fourth week, sadly, was a week where I really faltered in my progress and didn't do nearly enough work as I needed to, and really should have. I tried adapting some simple navigation and information and tried to do all the CSS from scratch, but found it incredibly, incredibly difficult. It was also made much worse by the fact that I had not used anything but absolute positioning before.

IMSG

So the fifth week I decided to use the idea put forth by Patrick to first make the website in basic HTML with working navigation laid out and all of the content inserted, as you can see here. The navigation on this page was laid out by my dad and modified heavily by myself. My dad had all of the sections as individual pages, and I worked with him to combine the original eight sections into the five listed on the page above. He wrote all the information for the pages, but I really had it set in my mind that I wanted to have several sections on each page grouped under common themes, such as About Us, Services, etc. I tried to do this but my dad seemed to think the navigation we worked out was fine, so I left it as it was. However, talking to both Jim and Patrick this week it seemed we agreed that the pages could be further condensed and also be made much clearer by doing so. And rather than linking to each section within a page, Patrick and Jim seemed to think that was unnecessary considering the amount of information on the pages, and in retrospect I really agree with them. I just had my sights set early on upon doing the site like that, which is a good example of not considering the necessity of something before you decide on using it.
The sixth week I adapted another layout, hisdog, to the main page, and the seventh week I changed the color of the in-page links and applied the style to the entire website. I used this style really only because it appealed to me, and I enjoyed the floating links and header and really enjoyed the colors, as well. Adapting the layout to having sub-page links was fairly easy as I just added another class within the list and played with the colors. One difficult thing was not being able to put lists within lists, and although this was a misunderstanding I did quite a bit of work around it, creating a class of indented lists within a list and having to leave the sub-page links as elements within the overall navigation rather than give them their own list within the navigation.
But the biggest thing both Jim and Patrick said was that the navigation had to be changed around quite a bit for it to make sense and also to keep things in the same physical place, rather than being switched around whenever the user changes the page. So without the links for different sections of a page, I think changing the navigation around made a lot of sense. So I've added little boxes within the navigation and also a better color scheme to better identify which page you're on. I've also played around with the footer a bit since Tuesday and moved around the logo. And finally, I've kept the ::navigation:: thing which was on the top of the nav, I'm not sure why but I feel like it adds a bit to the page. Although, I did consider placing the "website!" text atop the page, as well.
Overall I'm just-below satisfied with the website, with that extra week or two of hard work, which weeks 4 and 6 could have been, the site would have been much, much better. So for future projects, I think I need to make sure to get a specific site or project rolling early on so I can just keep adding to it week after week and come out with a finished product at the end, or rather one I can be proud of. I've put up the complete directory of my Web-Tutorial folder on CS, which has each week's work in a folder and the final website, starting from index.html, into a tar.