Progressive Enhancement vs Graceful Degradation
December 19th, 2011 | by DavidSo, it’s Christmas and you just got that big 42″ Hi Def Tv with the 3D option. So a couple weeks go by and you’re noticing the 3D just isn’t cutting it. The picture isn’t as sharp and the 3d just doesn’t pop like it did when it’s new. So you call up the company that made the tv and you ask that since you’re TV is still under warranty that you’d like to have the 3d repaired. They tell you that they’d be happy to fix the tv free of charge, but you’ll have re-wrap the tv and ship it directly to the manufacturer, paying for the shipping and handling yourself. By the time it’s over you might end up spending a 100 dollars and be out of a TV for 2 or 3 weeks! Well instead of getting the work done you decide the 3D just isn’t worth the hassle. You’re still able to enjoy the movie in glorious HD and besides it was eating up too much money in batteries for those so-so 3D glasses.
The World Wide Web kinda works like this when it comes to the latest and greatest vs. the tried and true. It’s a good practice as a designer to build in functionality so that as time goes on your work can still be presented in it’s best light, even if it’s not the latest technology. A great example of this would be the text shadow option in css. Some day this will be standard on all browsers. For the moment you need to insert something called a “Web kit” that tells a specific browser what to do. A careful designer would be sure to include a back up should the technology not be available on an older set up. By using good html structure a beautifully designed css website can still function when all of it’s bells and whistles are removed. It’s important that this built in structure remain intact in order to anchor the website just in case a browser has failed to update to the latest version. Other wise your website might just end up being a huge paper weight.
This subject is pretty important. With the advent of mobile web devises it’s never been more critical that designers pay attention to how their website looks in different medias. A website might look amazing in firefox on a laptop monitor but it might fall apart in Internet Explorer on somebodies old xp desktop computer. A designer needs to pay careful attention to how his website will react in almost every environment.
Responsive web design can anticipate these size discrepancies, and depending on the size of the media, restructure the appearance of the website with special css commands that adjusts it’s layout to better suite your device. Sometimes a restaurant will want to emphasize a special deal they are having. Or maybe they’ll want relevant information like a phone number to appear in a big bold font when searching on a mobile device. This can have an astronomical effect on the usefulness of the website and can pay for itself by bringing more business to a business.
To compete in today’s economy it’s absolutely essential that a website cater to as many of those mobile customers as possible. The future of the web is in the palm of your hand, literally. Mobile devices in conjunction with tablet devices are redefining the way we see the web.
Typography is a funny thing. Most of us don’t notice it and very few of know what it is. When it’s bad typography we have a funny feeling that something isn’t right, but we can’t quite put our finger on it. Typography, whether we like it or not, is with us almost every day and everywhere we go. If you’re reading this than you are experiencing some form of typography.
What most people don’t realize is that typography is the subtle art that gives grace to design. It’s that essential ingredient that communicates the intent of the writer by the placement of the text. Web designers and bloggers have unconsciously contributed to bad typography for years, without many resources to implement good print design practices.
Sure designers have used JPGs and proprietary software such as Flash to design at a higher level of quality, but it’s often come at the cost of accessibility and download speed. These days designers have more options with the introduction of the @font-face rule. This allows designers to pick from any font and embed it into the website.
This practice has opened up a whole other can of worms. Using the @font-face rule exposes a font to being downloaded illegally, thus creating an illegal distribution of copyrighted materials. Many free fonts are available that allow for this kind of access. Some high end font foundries will “host” the font and protect it from being downloaded illegally. The options for the designer are now limitless, but with bad practices being in place for so long is it possible for good typography to ever proliferate the web?
If you aren’t aware of it yet, I’ve got a new website up promoting my graphic design business at www.dimlightgraphics.com. I spent a few hours researching which color scheme I wanted to use. I didn’t consciously think about the meaning of those colors, I simply chose the colors that resonated the most with me. But let’s talk about those choices for just a moment.
www.precisionintermedia.com talks a little bit about the colors I’ve chosen:
“Psychology of Color: Gray
Gray is most associated with the practical, timeless, middle-of-the-road, solid things in life. Too much gray leads to feeling mostly nothing; but a bit of gray will add that rock solid feeling to your product. Some shades of gray are associated with old age, death, taxes, depression or a lost sense of direction. Silver is an off-shoot of gray and often associated with giving a helping hand, strong character (sterling in-fact!). ”
and…
“Psychology of Color: Orange
The most flamboyant color on the planet! It’s the color tied most this fun times, happy and energetic days, warmth and organic products. It is also associated with ambition. There is nothing even remotely calm associated with this color. Orange is associated with a new dawn in attitude.”
It’s true that I do have “ambition” and that I’m trying convey “practical and timeless” with my design. So in a way my choices were right on the money considering my intentions. I knew I didn’t want to use red because I’m not a pushy person and green, a color that symbolizes greed, wasn’t my first choice either. Blue is a nice color but I wanted something that was strong and blue didn’t seem to convey that to me. Again the timeless aspect of gray was a quality that I was looking for, so I was happy with that choice.
I did have a friend look at my website and his first impression was, “It’s too dark. The website you built for me is brighter and feels good.” I could understand his perspective. I felt if I made the website look like his then it wouldn’t create the right tone for what I wanted to convey. His website was designed to be inviting, open and friendly. The color scheme is blue and white (it can viewed at www.lobaczchiropractic.com). With my website I wanted to convey a serious “you can trust me” tone. “Practical and timeless” seems to fit that pretty well.
Color is not an exact science. My friend’s perspective of “Dim light Graphics” being too dark is a gut reaction and maybe his opinion is absolutely right. But again he could be completely wrong. That’s the thing about color, it’s subjective. Black in our country can represent morning while the very opposite color can convey the same thing in other parts of the world.
Color has a lot of power and can be used very effectively. It is wise to at least spend some time considering color before committing to any permanent color scheme.
There was a time when the capacity of expression within the internet medium dictated the creativity that was allowed to propagate. The complexity of programing html to reflect advertising and graphic design aesthetics proved to be too big of a chore for most html programmers. Most users simply wanted their content, to read the news and forward a funny picture. The dynamics have quickly shifted to a more personal experience aimed at integrating the lives of the user to their ever changing content needs. Our lives have become saturated with the constant pulse of new content. With that content comes advertising and the need to become aesthetically pleasing. Gone are the days of florescent green backgrounds with stark black type. Today’s internet is a much better user experience with websites designed in the tradition of print design. No longer must a designer be restricted by endlessly embedded tables, he is free to use css coding language to create manageable designs that facilitate the ongoing needs of content providers. They say content is king, but in all reality we know our focus is easily manipulated with “eye-candy”. So it’s no surprise that art directing on the web has become so important in recent years. Not all websites needs to be flashy and eye catching to be considered “high art”. Some websites can manipulate subtle elements of design to expertly express art direction. Either way designers now have the choice to limit their pallet or go full tilt with lush and creative designs, and that is a good thing.
Web Design II – Bonus Blog “Goals for this class”
August 23rd, 2011 | by DavidYes… yes.. Two blogs in one day. This can only mean one thing! It’s an assignment!
In this blog I’m going to write about the Goals I’d like to accomplish in this class. After taking web design last semester I feel pretty good about my basic HTML/CSS knowledge. So in this class I hope to really start to cement everything I do know and fill in any missing gaps. I’m still having trouble debugging Internet Explorer websites and customizing content management websites without the aid of a “What You See is What You get” program has been difficult. I’d also like to integrate more javascript/flash into my designs to really give my websites a nice final touch. www.dimlightgraphics.com uses Javascript to display a looping array of images. However when I view the same website on internet explorer the design seems to crumble.
Speaking of Content Management Websites, I’d like to become more fluent in drupal -adding new plug ins and getting familiar with those. I’ve tried using things like “Joomla” but haven’t quite got the hand of it. I’m having difficulty with the concept of “views” and how to customize those. I’m working with a client right now and he’d like a specific way to display some images. I haven’t quite figured that out yet. Looking forward to shoring up my abilities this year.
I’ve just started taking my second webdesign class and this blog is my first assignment. I was supposed to mention how I chose www.strawmancomics.com for my personal website domain. I also have www.dimlightgraphics.com, which is the name of my graphic design website. I chose www.strawmancomics.com because when I was promoting my comic book “Straw Man” I need a website to promote the character. strawman.com was taken and I didn’t like the sounds of “strawmancomic.com” as much. I could have gone with www.dimlightcomics.com but I wanted something that was more versatile, using the dimlight name. www.davidbranstetter.com is out of the question because of the difficulty of spelling.
davidbran.com is still available and may be worth considering.
When it comes to hosting I like to have an account that’s affordable, hosts more than one site, and has automatic install features. Godaddy seems to fit all these demands. Throw in top notch customer support and you’ve got a winner.
I was using a lot of free server spaces for a while and decided that I needed to get serious about building a website. I felt that I needed a website without pop up ads. It needed to be fast and I didn’t want to join a message board to get it. A friend of mine suggested godaddy and was pleased with the service.
We make assumptions in life that if you do x you will get y. It’s something ingrained in us from an early age. It may have to do with our grandparents work ethic carrying over from our parents till our present day. In a world of fast moving technology you may feel like you’re always chasing the “dream job” rabbit.
I know when I was getting close to graduating high school in 1999 that I had no idea what I’d do to earn a living. My dad started his own business that was moderately successful, but my impression of that was I needed to think outside of the working man mentality to find employment that embraced the future. By that I mean, I know that artists in the traditional sense do not make a lot of money. I felt that my artistic tendencies was the reasonable skill that I had. So I took it upon myself to pursue a education in the liberal arts. It was a few years into receiving my education that I finally stumbled across a skill set that seemed to fit my personality. I had determined that I would be a Graphic Designer. Graphic Designers were the working man’s artist. A Graphic Designer could bring home a decent wage.
For the first time I felt as if my own feelings about myself had been validated. I felt as if the calling I knew to be true was in fact proven. The years were slipping by faster than I could keep up but I made an especially valiant effort to complete my degree.
Finally degreed and married, life was where I wanted to be. The only exception was that I didn’t have the Job yet. I knew that this sort of thing didn’t happen over night, so I waited patiently. I thought I got a break early on working for a cattle magazine. A job that required driving an hour a half for barely minimum wage. It was prestigious and it was a great experience, but the pay just didn’t cut it. I quickly seized a local job that paid 50 cents more an hour and was virtually across the street from my home. I stayed with that company for a few years until the work completely dried up.
So here I am plenty experienced and highly motivated to succeed, especially with a new baby. With the old job quickly drying up and another mouth the feed quickly on the horizon I did what any sensible father would do. I got a job at an office box store. After two weeks of enduring one of the worst working experience I’ve ever had I decided to quit. Within a month I had lost three jobs.
My thought was, “I’m better than this” I should be able to make more money than what I am. I should enjoy my work. I should not be viewed as the incompetent new guy. I have three years experience in the print industry, I have a four year degree, I have legitimate artistic talent, why can’t I get paid for it?
So with a heavy heart I decided that the best option for my family was to become an independent contractor and a self-employed graphic designer/illustrator. I felt that I might have better luck if I put my fate into my own hands. After all, who will believe in me better than me? I know what I’m capable of! I may not word it just right on a resume but I know what I can do!
At first it felt like a great decision. I was watching the baby, saving money on sitters, and I was working on the side. I was also going to school to learn how to do web design. It seemed as if people were constantly asking if I could do that kind of work. In fact it appeared as if I was getting more jobs with frequency. But as time lingered on we discovered that the work was not coming in regularly. Even though our daughter is pretty good at staying quiet, I felt it was unprofessional to take her to network meetings. I neeeded to act like a professional in order to get professional clients. So that has limited my ability to network, which was one of the components to our success.
My wife is now wanting me to be able to bring home most of the household income. I don’t blame her either. I want to be able to feel like the degrees and education that I’ve pursued has been worth it. As I look at the employment opportunities in Evansville it appears as if none of them are suited towards our needs. I will be freelancing this summer and hoping that the business picks up steam. If not, it appears as if we no choice but to start looking outside of Evansville for work. It pains me to say that because in the last few years Evansville has become my home. It has always been my intention to stay here as long as possible.
We will see where things go from here. I will post updates on how things are going from time to time.
–David
I apologize for not continuing to blog the last three with regular updates. It’s still my intention to continue blogging in one form or another, I had become overwhelmed with more pressing matters.
Ok… The subject at hand is SEO. What is SEO? It stand for Search Engine Optimization. You’ll hear a lot of internet salesmen push around words like SEO Optimization and Search Engine Visibility. This is simply describing the process that most websites should undergo to be found by your favorite Search Engine like, Google, Yahoo, and Alta Vista Bing.
This can be achieved in two ways. There is the organic search results that are often referred to as “white hat” tactics and underhanded methods referred to as “black hat” tactics. Black hat methods will try to circumnavigate the natural and organic processes that search engines utilize to deliver relevant search results. When a website is caught doing this it is often banned from search results all together. This may seem harsh and unfair and it has often incurred the anger of webmasters who lose traffic altogether from their website. I believe Google’s stance on this issue is completely fair. By removing websites that don’t play by the rules and not letting paid advertising to effect ranking status, they effectively level the playing field.
This gives the opportunity for truly relevant search results to arrive without diluting the water with information that is redundant and self-serving. Even if it’s unfair to a “big” website to suddenly have the wool pulled from underneath them, they still benefit from Google’s practices. (I’m referring to the same webmaster who uses the internet to find “the best Chinese restaurant within a 3-mile radius”) It’s important to preserve the purity of “group think” because it can often pick the best that’s out there and narrow the decision making pile for the user. Saving time and money is what the web is about and if those principles are violated it destroys it’s usability.
Alistapart.com says creating a website without SEO is like “whispering in the wind”. It may not be for everybody but there is a definite use for it on the web. I really can’t think of any disadvantages of hiring someone, other than the cost that it may incur. I often think of things in reverse, like “how much potential business would this cost me if I did NOT hire an SEO expert.”
I recently worked with Raymond Edge from REdge Tech Solutions http://redgetechsolutions.com/ and he was a true professional. He knows what he’s doing and he’s excited about doing it. I got to witness first hand all the thought and effort it takes to improve a websites visibility, and it was totally worth it.
Improving website visibility may seem like a lot of hassle. You may be thinking that it seems like it’s a lot effort for something intangible. The results, though, often speak from themselves when it comes to increased profits and traffic increases. Like anything in life the more effort you put into something the better the results.
In thinking about today’s blog I needed to consider several different point of views to arrive at a summary of ideas. Deciding on a purpose is always important before beginning a journey. If you were to drive around aimlessly and decided to randomly stop at the grocery store and then get your hair cut, you might end up with spoiled groceries.
As a person who is used to designing for print media it’s hard to change one’s point of view about the nature of design. If you first consider your purpose you will always end up with better results. Thinking about the purpose of web design will give me (the designer) a path that leads to better communication.
Here are a few quotes about web design:
“Web design is the creation of digital environments that facilitate and encourage human activity; reflect or adapt to individual voices and content; and change gracefully over time while always retaining their identity.” http://www.alistapart.com/articles/understandingwebdesign
and two more from another site…
“…if you care about your craft and your ideas, you’ll take the extra time, perhaps working late into the night, as we all have, and add the touches that you know will make your work really shine.”
“Let the complexity be in the simplicity—a design is not useful when it’s perceived to be complex. A design should be useful, simple, and straightforward—let the complexity shine through via simplicity.”
http://www.alistapart.com/articles/designisinthedetails
This shows the necessity of clear navigation…
You must always be able to answer the following questions:
- Where am I? (Present)
- Where can I go? (Future)
- Where have I been? (Past)
http://www.alistapart.com/articles/whereami/
Where are we going?
Design must be flexible as technology changes.
“HTML is already becoming a no-man’s land: presentation is shifting into stylesheets, and structure is moving into XML.”
http://www.alistapart.com/articles/infoexperience/
The two videos below actually demonstrate the need for considering other points of view when designing. Handicapped users are just as important to consider when developing a website.
These were my first reactions to the video:
I can see that it can be very frustrating to come across a website and not getting any relevant information from it. But just like in the open market place you will always gravitate towards better customer service. I don’t think that Target is participating in open discrimination. I think they’re not used to competing at a level that Wal-Mart is. In the end Wal-Mart knows that every one of it’s dollars are valuable and they do everything they can to keep customers. Should Target be sued for being bad at business? I don’t think so. If Target was the ONLY place to get a life sustaining item, then yes I could see a case for discrimination.
This video documents new technologies that are emerging that allow for greater web accessibility. I think it’s great that customer demand is pushing for newer approaches to using the web. The video argues that eventually, hands free typing, may be a reality. The keyboard, a device that the majority of users access the web with, will soon be seen as a handicap accessible device for the vocally impaired. Technology becomes the great equalizer.
To summarize, the designer must effectively balance purposed design with navigation that considers all of it’s audience members. The effective communicator will guide his audience to the information he needs to present in a pleasant and direct way.