City Standards:
In an effort to create a
user friendly, intuitive web site for all prospective browsers of
our web site, we must stick to some simple web design principles.
Please read through Design Principles, Good VS. Bad Design, Graphic
Definitions, Typography, City Guidelines, District Guidelines, and
the tutorials.
Design Principles
There are
four basic principles that are fundamental to creating
sites that create a focal point, are attractive, and
are easy to use.
Contrast
Contrasting
elements guide the eyes around the page, creates a
hierarchy of information, and enables the user to skim for
information.
Provide
contrast and create a focal point by:
-
Reduce
the size of buttons - put them in a subordinate
position
-
Use
stronger colors to make stronger arguments
-
Make
sure your background and text have a strong contrast
Alignment
Alignment
means that items on the page are lined up with each other,
thereby creating strong
lines within a page to make it more organized and visually
appealing. This one principle will radically change
the appearance of your page. Strong alignment helps
to guide the user's eye, making it easier to browse. Try
drawing lines across your design and see if your design supports
strong lines in it.
Repetition
The concept of
repetition is that throughout a project certain elements are
repeated that tie in all the disparate parts together.
Consider repeating the
following elements to polish the appearance of your site:
- color
2 or 3 main
colors is best
- fonts
2 fonts, one for
your headings
(serif ok) and one for your body (sans serif) is usually
best
- graphics
simple small .jpg's
(photos) are best, sometimes a .gif (cartoon looking
- solid, no blending colors) is necessary - Make sure
they serve a purpose and watch your load times!
|
- layout
watch for a
horizontal scroll (no no) and make sure that the most
important information can be seen in an opening window
760x425 for the average user
- navigation
you want your
navigation to repeat throughout your pages in the same
location - don't make your user have to think! Let
them concentrate on your content and not how to
navigate your site
|
Proximity
The principle of proximity refers to the relationships that items
develop when they are close together.
.
-
Close proximity
helps the user identify items that go together
-
Allow white space
to help you make your point - be careful, you don't want unnecessary
vertical scrolling either - think of pieces in a puzzle and how
they fit
-
Group items that
belong together
-
Be sure to use
<br> (shift + enter) instead of <p> (enter) when
adding contents under a title. You can see this under all
headings on this page.
|
