Evolving Website Design

For the first part of my 20-year career as a designer, I had nothing to do with websites. The web, at first, was something weird to me. It seemed too technical and clunky to use before browsers existed. The urge to design websites hit me around 2000 when graphic websites became more mainstream. Once I started to learn about HTML and coding, it became all-consuming. I wanted to learn as much as possible about how to apply my years of graphic design to this new frontier. 

Before delving into websites, my designs usually ended up printed or I worked on a project that would start and have due date–when it was over–on to the next project. It was a wake up call when I would learn something new about the web and a few months later find it was already obsolete. I realized very quickly that I had to change my perspective. Web design and technology was always going to change and evolve at a rapid pace and I had to evolve with it and accept continuous change, just like the web.

These constant changes in programming and functionality affected the way websites were designed in many ways. For example, when I learned HTML image based websites were the norm. This meant we could build sites with all the fonts we wanted because most of the copy users saw were actual images. No selectable type meant no font problems. One drawback was that when copy changes were required there was no easy way to do them. You couldn’t correct a typo with a simple stroke of your keyboard… you had to change the entire image.

Also, Flash websites that were a feast to the eyes were what everybody wanted at the time. Nowadays Flash is a touchy subject for many because it is not open source. You have to download a program to be able to see Flash or it does not work. For more on this subject see here.

Then, search engines like Google and Yahoo! started to gain a larger foothold, deciding which websites were found by users and which weren’t. The use of web crawlers that identified copy and searched for keywords, was what made them relevant. Obviously, clients wanted to be relevant. Being found was more important to the bottom line than looking good. At this point, image-only websites became obsolete because no one could find them in web searches. What good would a beautiful site do if no one could find it?

The post-Google website was big on content. This content needed to be inside the HTML code as selectable text to be seen by web crawlers. An easy way to find out if something is “selectable text” is to use your cursor to select the copy on a website, if you can easily select, copy and paste that text anywhere, that means it is selectable text. This restricted tremendously what you could or could not do as far as design on a website. Remember that HTML was created to exchange primarily data through the web now it had to evolve to do much more than that.

Another struggle for web designers as well as developers was the competing browsers that were trying to get a foothold in the industry. Anyone remember NetScape? Yes, that one did not make it. For a long time after NetScape, Internet Explorer was the dominating browser, but then came competition from Firefox, Opera, Safari and nowadays Chrome. Different browsers have different rendering capabilities for websites. This meant that as a web designer/developer you to make sure your website will work in different browsers or it may look broken. To see a timeline of how websites went up and down in popularity here is a good Infographic example.

Some browsers, especially IE6 (see this story about Why Geeks Hate IE6), need to be upgraded to see all the new capabilities. Users with old computers and outdated browsers often get annoyed about this, but there is no helping the fact that technology’s rapid change is responsible. The reality is, if you don’t upgrade your hardware as well as your software, you will be left behind. New software will not work with older computers because they do not have the processing power the software needs to run correctly. To combat this, I am trying to keep recycling my computer every 2 years. I sell it on Craig’s list before it completely looses its value and then invest on a newer model. It is not cheap, but if technology is the business you are in then there is no way around it.

In early 2000’s, a lot more was changing in the web and it was not just about content or design. The web took a radical move toward interactivity rather than being just a way to get information. Sharing and collaboration within the web was a driving force of the Web 2.0 movement and this also changed the visual tone of websites by changing from static to dynamic formats. I found this story by Ben Hunt interesting because he touches on other aspects of Web 2.0 that I am not discussing here (the push towards the open sharing of information). But, when it comes to design, the Web 2.0 look was defined as “clean.” It was based more on functionality. The design seemed simple but it did a lot more and everyone can agree that when simple things work, it is a great achievement.

The need for dynamic websites opened the door to the need of better content management systems or CMS. Up to around 2005, if you wanted to use a content management system you had to pay a lot of money to use the technology. The old standard money making road map for technology corporations was to build software and then release it to the users creating revenue when they bought upgrades. When web 2.0 open source opened the collaboration door, it created a way to develop free software. There was a race for the next best no-cost open source CMS. This open source business model collapsed many technology companies during the dot com bubble. They could not change fast enough and thus disappeared. The new open source CMS systems that were created with the help of their communities of developers have evolved to the more stable systems we use today like WordPress, Drupal, and Joomla, among many others.

As you can see the shifts between different browsers, the dynamic nature of newer websites and the CMS systems that were also vying for attention created a tug of war that designers and developers had to navigate. Making websites work and look correctly during all this upheaval was challenging and while it was very exciting, you also needed to deliver good working websites to your clients. This made everyone very cautious with the use of fonts. They were one of the top reasons websites would look broken. During this time the most used font family was sans-serif and the most used sans-serif font was Helvetica (or Arial if you were in a PC). I mean, it became a love affair with this font, so much so they even made a movie about Helvetica! After a few years of designing websites using only Helvetica, every web designer was hungry for more variety and we all wanted to open the floodgates of typography.

This need for fonts created a few Font Delivery Services. These services allow you to use a library of fonts by just adding some code to your website. Some of these services charge a monthly fee. TypeKit is one of the best in my opinion, created in 2008 by some of the best minds in the business. It was such a good service that Adobe acquired TypeKit in 2011. There are other services like Google Web Fonts, which is free, and actually allows you to download the font to your computer. You can use the font through the font management program from Extensis called Suitcase Fusion, which adds the font to your library. This is very convenient for designers because you not only can design your website while looking at the actual fonts you will use online, but also allows you to continue the look into the rest of the branding for your client.

Today, I am happy to say things are a bit more leveled off from those early days of competing technologies. Now the battle of the social media powerhouses is taking over and god knows what else is in the horizon for the web.

I realize even more so than before that embracing change is never easy and being innovative in rapidly changing technology is a challenge we all face. The web is the epicenter of this rapid change. It is continually evolving. Web designers can anticipate this to a point and create websites that are made to evolve and change. A website should give clients a visually appealing design without compromising the user experience and the functionality the website was intended to do in the first place. Always build flexibility into your web plan for upcoming upgrades, redesigns and changes in direction. A good way to do this is to plan websites in Phases. This allows changes to happen inside a general plan without the need for a complete overhaul. Every company should realize that they may have to update their website every 3-5 years to stay competitive, sometimes even sooner. Remember, web design trends rise in popularity and fade to obscurity just as fast as pop culture’s favorite reality stars. So keep it classy and clean for as long as possible…then update.