Websites Look the Same

Have you noticed it? almost every site we visit today follows a very similar design. Sure, they change the colors and the fonts, but overall they are the same.
Usually they have a navigation bar at the top with their logo in on the left hand side and links on the right.
If they are a particularly large or complex organization, they might have another navagation bar on top of their normal one, following the same pattern.
Then, a lot of the times there will be an image underneath with big text proclaming a statement.
Next to the text there is usually a call to action button.
This lay out applies to so many websites we see on the internet. Some of the elements might not be in the exact same place, but you get the point.

Come see our
operations

Join Now

These Are  Literally the Same…

These two companies are diometrically oposed, yet their websites are virtually the same. The web is a boundless medium, and yet sites follow the same patterns.
Is this really the best we can do? Can’t the web be more creative and different than massproduced boilerplate templates? 

Creativity and thought should be applied to websites.

Websites provide an oportunity to showcase what’s unique about your (brand’s) identity and philisophy. If you have the same website as the competition, you’re effectivly saying your the same as them. This requires the disipline of graphic design.
scroll down to view examples

Okay, but are they usable?

Those website were really different, inovative, and creative. However, what if your bank's website was designed like that. It would be impossible to quickly find the information you need.

What about simple information?

Even finding simple information can be difficult. Websites today are often flooded with useless information on pages that are supposed to answer a singular question. On this website, you have to scroll through two whole page heights of fluff content before getting to the "6 steps."

Websites’ information must be immediately legible.

Many crucial event’s in our lives are dictated by what we’ve learned or done through the web. That places a lot of power in the hands of website creators. To avoid causing real consequences in peoples lives, designers must use the disipline of information architecture to create helpful expereinces.

What about this?

This website looks great, it showcases information clearly while still being visually distinctive.

However, what if you have trouble with your vision?

Suddenly

It’s a lot harder to read the text if you’re eyes can’t pick out the difference between the white and the light pink.

What if you couldn’t see at all?

There is a whole sub expertise about designing website that are easily legible to everyone, regardless of how well their senses work.
It’s crucial for websites to correctly implement this technology. Otherwise you’re creating a system that seriously disadvantages a whole segment of the population.

What about all of the different device form factors?

Websites can show up on almost everything, from the smallest of watches to the biggest of TVs. Each site needs to be responsivly stretch and shrink to keep up it’s legibility for each size. Resize this page for an example of a non responsive website.

What about slow networks?

In general taking just 2 seconds to load can drive away traffic. Even more important, not everyone has access to fast internet speeds; it could take hours to load content. Websites must be optimized  to show up immediatly.

How will people across the world view my site?

Websites’ content and design need to be well researched to avoid offending or hurting people. Many times designers will create something that works for their culture but will mean something horrible in others.

How will people find my website?

Search engine optimization is it’s own whole industry. It involes nuanced techniques to create sites that will rank highly on search engines.

This

(and more)

graphic design – interaction design – information design – content management systems – infrastructure design – developer tools – accessibility experts – responsive design –  marketing – user experience – business to business negotiation – behavioral experts – branding – digital strategy – networking – cybersecurity – content strategy – DNS – SEO – cultural experts – analytics – GPDR compliance – legal experts – SSL – backups – AMP integration – testing suites – animators – sustainability – optimization – open graph – color management – meta tags – version control – photography – asset licensing – compression algorithms – http standards – html standards – lots of standards – webGL – frameworks – reactive rendering – server side rendering – progressive web apps – inspiration – css – html – javascript – c – polyfills – market research – device testing – illustration – open source code – ethics – history – servers – energy – software as a service – code – no code platforms – hosting providers – continuous integration – browsers – canvas – node js – npm – modules – application programing interfaces –  RSA – ad blockers – extensions – iframes – XSS attacks – public keys – private keys – design systems

What makes a website?