Building A Successful Web Site

What makes a good web site in the modern world?

This discussion was created from a talk on Building A Successful Web Site during YES week , for NACET , June 18, 2014.

Presented by Darryl Brown of 2b design and development

Provide Value

Why would anyone come to your site? You must provide value to your users.

value:

  • Give your users something they can actually use!
  • Make it relevant to your topic.
  • Value is the ultimate SEO tool.
good
www.mcmillanrunning.com
bad
rense.com/

Be Purposeful

Define your purpose. What are you trying to accomplish?

Your purpose should inform all major design decisions.

Define:

  • what the site is about and
  • how should you interact with it
good
www.google.com
bad
themagicofbaltimore.co.uk

Prioritize Visually

Narrow goals on each page.

Strongly consider a "call to action", which forces you to prioritize.

Focus:

  • One main concept is ideal and
  • Make priorities visually obvious using size, color, and graphics. Avoid equal weight of priorities.
good
www.crazyegg.com/
bad
www.arngren.net

Content is King

Designers often make the design most important. This is...bad.

The design priority should be the content of the site: the text, images, videos, functionality.

It does not imply boring!

design:

  • Make subtle design elements
  • Favor simplicity
good
www.craigslist.com
bad
www.pennyjuice.com

Great Usability

What is usability? Making the site easy, simple, and functional.

Throughout your site:

  • Be consistent! Do not change the link colors or menu. Keep a strong, consistent design vocabulary for your entire site.
  • Type must contrast (pleasantly) with background. Check your contrast at this site.
  • Few (one?) main concepts per page.
  • Functionally correct.
  • Don't make people register up front. Present substantial functionality before requiring registration.
good
youtube.com
bad
www.libertyvan.com

Make Web Pages Scannable.

Web users do not read, they scan web pages.

scannability:

  • Use headers to differentiate topics.
  • Use bold and emphasis to draw attention to key phrases and ideas.
  • Use lists whenever appropriate to break the flow and draw attention to key items.
  • Important stuff first. The first two paragraphs are essential on a web page. These must contain the most important information that your visitors are looking for.
good
www.amazon.com
bad
cavs.mit.edu/

Use Responsive Design

Designs respond to the screen size they are viewed on.

Screen are getting bigger,

Old standard width was 960 pixels.

In fact, in january 2013, over 80% of all screens were larger than 1024 pixels x 768 pixels. w3 schools browser display statistics

And, screens are getting smaller

mobile browsing is climbing - almost doubling last 12 months. from smartinsights.com
2012 / 2013 web stats
good
this site!
bad
trendlines.ca

Alternatively, separate designs

Create different designs for all major device sizes.

Costly and not robust.

Search Engine Awareness

Search engines are the gateways to the web. You must cater to those engines.

SEA minimums:

  • Provide value to your users. Content and functionality that provides value is the best long term SEA principle.
  • Use text for text. Using images or flash or other graphics for text will defeat search engines.
  • Content defines search terms. Using meta tag keywords is not sufficient and is becoming obsolete. You must have content on your site that is relevant.
  • Schema data. Google (and others) use schema data which identify parts of your content as specific types of data, e.g. organization name, phone number, address, etc.
  • Responsive design. Google (and others) expect sites to be mobile friendly and penalize you for not adhering to that.

Biggest Mistakes

Excerpted directly from webpagesthatsuck.com

  • Believing people care about you and your website.
  • A man from Mars can't figure out what your website is about in less than four seconds.
  • Contrast (http://www.checkmycolours.com/).
  • Using design elements that get in the way of the sale.
  • Navigational failure.
  • Site lacks MUST HAVE Content.
  • Too much material on one page.

Thanks!

Presented by Darryl Brown of 2b design and development

Please enter the letters as they are shown in the image above.
Letters are not case-sensitive.

/ design@2bdesign.us / 928-255-8884 /
Flagstaff, AZ, 86001


2b design & development | Web Apps & Web Design | Flagstaff, AZ
login