Monday, April 27, 2009

Journal 61: Templates

Today, I found out that I need to export my sites from now on...i found this out by the fact dreamweaver refused to let me create a new page from a template...hella annoying.

Also, Right Away, Great Captain is a great artist that is TOTALLY worth checking out...brings to mind Modest Mouse. Brett Dennen and Good Old War are also amazing.

Now that I've gushed about my latest discoveries, I'm gonna go do work son!

Journal 57-60: The last hoorah

1) What assignment was the most beneficial for you and why?

So over the course of this semester, we have done several very large projects. The one that helped me the most would probably have to be the Killer Web Design module. Not only was it a little refresher on CSS, it made me think about what makes good and bad design.

2) What assignment was the least beneficial for you and why? How could it be changed to be more helpful or be replaced by something that will be useful?

I have a decent amount of experience with web authoring before this class. With that said, the first two modules of this semester were of little benefit to me. I'm not saying those modules should be changed in any way, because honestly, that's how I learned how to code myself. I was just a little ahead of the curve.

3) What have you learned over the course of this semester? How will it help you outside of this class?

Over the course of this semester, the main thing I learned is that content should never take a back seat to design. Content is why someone goes to your site...not its aesthetics. There is a healthy balance between content and design...and when one strikes that balance, it's a beautiful thing.

4) What are three new-to-you, helpful pieces of advice, tips, or strategies you got from our last two readings?

See number 4...also, A List Apart is my homepage now.

5) How would you define the role and purpose of a web author?

A web author is the person that brings you information in an aesthetically and intellectually pleasing manner.

Tuesday, April 21, 2009

Journal 56: Sweet (semi) success!

So today, I made a template for the site...no more having to change links and such EVERY TIME I made a change...I wish I had learned how to do this at the beginning of my project...lots of time could and should have been saved.

Also AFS NEEDS TO DIE LEARN TO WORK PROPERLY!!!!

I spent the better part of 24 logged hours trying to figure out what the hell sam hill was wrong with my permissions settings in AFS that made it so that nobody but me could see my fracking pages...I don't even know what I did...it seems as if it happened over nite. >:@

Off to write a paper!!

Monday, April 13, 2009

Journal 53-5: Readings Wrap Up

So over the weekend, I had another meeting with PC...and now the site is going to look 20,000 times different...the only thing we really kept was the basic layout (minus the independent scrolling...that was just dumb on my part) and that was because I really didn't feel like changing the CSS which I have slaved over for the past month. I did work out a logo which is really nice, and the color scheme looks really good. We also went in and decided on the font choices (PC had the nerve to ask if Comic Sans MD would work...yes, he really went there) Also, I got some really good material for the final identity doc. PC wants to keep the conservative identity while looking contemporary (so obviously, comic sans would be the best font choice)...so I get to play around with that...all in all, a very productive weekend...this project should be a blast!

Now, for the in-class stuff:

  1. Who's visiting the site?


  2. Existing and potential members of GHBC as well as people looking for information about the Church or GHBC related activities.

  3. What does she what to know?


  4. Information about the church. Specifically where it is, how to contact the church and any activities the church is a part of or sponsors. Also, after the site has been built, there will be a place devoted to streaming and downloading audio content of weekly sermons.

  5. What does he want to do?


  6. Most likely, if the user is a returning visitor, they will be looking for updates on current church events, the pastor's blog, and the weekly sermons. If they are a new visitor, they will be looking for information about the church, it's beliefs, service times, and possibly a sample of PC's preaching.

  7. With these in mind, what potential questions/tasks will you have for your users on Wednesday? List at least five possibilities.


  8. Were you able to successfully navigate the site to information you were interested in?
    What is your take on the left nav column in combination with the cross element? Was there any interferance? What did you think of the photo gallery?



Now with that out of the way, I have to do some major scrambling since I have to redesign a whole site by wed...

>:/

Wednesday, April 08, 2009

Journal 52: Photoshop stuff

So today, I started the first of 2 logos...it's supposed to be semi-photorealistic...it's gonna be great...now, off to take a French test

Monday, April 06, 2009

Journal 45-51: Module 4....the Thinking behind My site

Part of what made Albert Einstein the great thinker that he was stemmed from his ability to ask almost childishly simple questions that were maddeningly complex (most notably, “What is time?”)…and his ability to answer those questions. Following this example, perhaps the most fundamental question about a website for a designer is this: Why am I building this site? It seems simple, but upon further reflection, the answer may not be so much. This one question, to be answered properly, brings up numerous others to be answered first: What is the purpose for this site? Who do I want to address? Who are the main users? In this write-up, I will attempt to answer these questions and then delve into an analysis of my design for this module.

Good Hart Bible Church (GHBC) has a proud history stretching back for over a century, but until recently, there was a period where we were losing members and frankly, becoming a little dormant. About 7 years ago, however, Pastor Gary Compton came in and began reshaping this beautiful church from the inside. We are proud to say now that we have increased our average attendance by at least 300%. We are becoming very active in our community with new ministries, a Sunday school program for both adults and children and an addition to our building almost doubling its size. There still is, however a feeling in the community that GHBC is “that old church house out in Good Hart.” With this website, among other things, GHBC hopes to change that perception. Big things are happening at GHBC, it’s time we told the world about it.

The purpose of this site is to help members and potential members of GHBC to connect each other and with the Church itself, obtain information about the Church, Church related events and Ministries run out of GHBC as well as increase awareness of the new GHBC in the community. By including several forms including a contact form and a prayer request form, GHBC hopes to become more accessible to its members and the surrounding community. Also, the contact information of GHBC is readily available in the footer of every page, further extending the accessibility of GHBC to the community at large which is paramount for a successful church.

With this site, GHBC hopes to address its members, potential members and the community as a whole. GHBC believes that it is of the utmost importance to have its doors wide open to any and everyone that needs its services. While this is a well-known fact to many, it may be hard for one to contact GHBC if they do not know where to look. GHBC is not the most well known church in the area and having a website with contact information readily presented and an in-depth explanation of who we are and our beliefs is the most clear answer to these problems.

With this said, however, the main users will most likely be the members of GHBC itself and those hoping to contact us or find information for church services and events. The main demographic that I expect will use the site are people ranging from late teens to early 50's in the lower-middle to middle class. Good Hart is not very close to any major cities, and therefore users will most likely have slower connection speeds. Also, due to the economic standing of the main demographic, there will most likely be older computers and technology which means slower machines and smaller computer displays.

So now with the question of why answered, answering how the page is put together would be the logical next step: The first thing the user sees is the banner at the top of the page clearly informing the visitor where they are. Next is the navigation bar with links the user, new or returning, may find useful. To the left, there is a div with service times, a link to Google maps where the user can obtain directions to the church, links to the contact and prayer request forms as well as a link to the page about the pastor (which are still under construction). There is also the address, the phone number and an email address of the church in the footer.

As for the content, on the homepage, there is a 3-column system in place. The left column, as mentioned, has service information and other important links. The middle column is the where the most important information appears with a general welcome for new and returning users followed by pertinent information and announcements. The right column is more for human interests with a preview and link to a daily devotional, the pastor’s blog and perhaps small clips of news. The second page I built for this module is the photo gallery. Its layout is almost identical to the homepage. The banner, navigation bar, left column, footer and background image are all the same. The only change is the area where the middle and right columns would be. This area, while identical in size, has transformed into a gallery of thumbnail images. When the user clicks on an image, they see the full-size picture pop onto the screen via a JavaScript called Lightbox.

The layout of the homepage itself is very simple. Many users will most likely be older and less apt to dealing with a visually complex site (most of the congregation is in its thirties). Along with this is the contingency mentioned earlier that many users will be using slow internet connections on older machines. As a result, I designed the website to be as simple as possible. There is only one image on the homepage and it is relatively small in file-size. The rest of the content is mostly text-based, rendering the page friendly to slower machines and text-based browsers. Along with the streamlined content, I have made it so that the user does not have to scroll down the page. The two columns with information scroll independently. Because I have no solid information as to what screen sizes my user base will be using, I compiled the page with percentages rather than finite pixels. This allows for a relatively elastic site that can perform on most screen sizes. With such a simple and universal layout, I have greatly reduced the chance for confusion and frustrations.

Possibly the best result of the simple layout is that it is not overwhelming to the user upon arrival. I have seen too many sites to count that bombarded the user with navigation, too many bright colors and graphics scattered all over the place. This site is practically the opposite. There is one image on the homepage, there are relatively few links, but still enough to navigate the site efficiently and possibly most significantly, the colors do not look like I grabbed random crayons out of a box to decide the color scheme. I chose neutral earthy colors (more about this later) and an overall color scheme that is soft to the eye.

The main reason I was able to do all of this comes from the fact that I used CSS, or Cascading Style Sheets to design what I had constructed in HTML. In days past, people would build their site entirely in HTML with design attributes written in-line. This was a hassle for obvious reasons in that every time a change was made, if one wanted the site to look consistent, they had to go back in and change every single attribute that had the same property. Things could fall through the cracks very easily…and little details that look wrong can ruin a web site. Enter CSS. CSS allows for consistency across the board and it also makes it harder for one to miss small details. Fonts, indents, margins and colors on text only have to be defined once in a CSS sheet rather than all throughout a document. Something new CSS allows is that it allows the author to define line widths, which makes it that, much easier to make columns rather than the older table method. In short, CSS allows for a cleaner HTML document and changing the look of web sites faster and more consistent.

When designing a site, one must keep in mind that not all people are fortunate enough to have full function of everything it requires to fully access a web site. In the article “Understanding Disabilities When Designing a Web Site” Leona Tomlinson presents some guidelines I incorporated into my site to ensure full access. I ensured my link text was as descriptive as possible as well as made my page titles descriptive but not overly verbose. I also plan on making succinct alt text on the images once they are ready to be put into the site and titles and headlines will be descriptive. I will not be using images of text and all the text is re-sizable. My color scheme has relatively high contrast and my design will be consistent from page to page seeing as I will be incorporating a template for my site.

I also am taking into some guidelines from “User-Centered Design and Web Development” by the Society for Technical Communication (STC). The first guideline the author mentions is to make the memory load of the site as low as possible. I accomplished this by only including one image on the homepage and putting a script into the gallery that makes the images preload. I am also making information “highly accessible” with drop-down menus in the navigation bar and the quick links in the left column. This enables the user to find wanted information while not overwhelming them with links. Perhaps the most important guideline I incorporated from the STC was making the site “interesting but uncluttered.” Again, there is only one image on the homepage and the color scheme of the site stems off of the background causing the user to be drawn into the site and because I made the rest of the site is text-based and fits into 2 columns, it is uncluttered.

And now for the color scheme: as I mentioned earlier, I am going for a relaxing feel where the user can feel comfortable and at home when on the site. With only 3 colors, the user is not bombarded with a sensory overload upon entering the site and by making the major color white with complimenting shades of green, gray and brown, the site gives off a natural, organic tone. In Photoshop, I put a blur effect, a transparent white overlay and a Gaussian blur on the edges. The result is an image with muted colors and no definite ending of the image. This creates a dreamlike tone to the site causing the user to relax and feel at ease. And by using the predominant colors of the image for the color scheme on the site, I am able to create a visual intrigue causing the user to become subconsciously drawn farther into the site.

Jouranl 44: Classroom Shenanigans

So in mod 4, I learned quite a bit about myself, making a website and how percentage heights are worse than I ever could have realized...ugh

About myself:

  • I can write a 5 page, single spaced paper in approx 6 hours

  • I can fill a giant div with multiple pictures of M&M's

  • I enjoy web design

  • I can learn a new application (Lightbox) in 20 minutes

  • I am acutally better with CSS than I ever thought possible

  • The Spartans are in the national championship tonite!!!!!!!!!



About making a website:

  • Percentage height is probably the most annoying thing ever

  • Testing for different computers and browsers and screen sizes feels endless and is tedious

  • Lightbox is awesome

  • CSS makes it a bitch pain in the ass butt to make columns line up side by side on a site

  • A horizontal nav bar is created with a list that is displayed in-line



About percentage heights:

  • So you know that feeling when you're having a dream and you're being chased by a monster but all you can do is sit there and suck your thumb?

  • nuff said