Web Design Commandments for Every Project

Do you have a set of rules when it comes to website design? There are a few rules that apply to almost all web design projects-let’s call them”web design offers”.

No matter the size or size of the site, these rules are the basis of good Design. If you follow these basic guidelines and make them part of your thinking for every project you start, you will avoid many pitfalls that designers may experience!

1. You will be consistent

Unified design is easy to use and understand design. User commitments and actions as well as graphics must be similar in appearance and use in a single Design.

This means that buttons have the same color and use the same hover states so that users know how to interact, headers are the same size and use the same font throughout the theme, and elements like colors follow a recognizable and brand-associated Palette.

Other visual elements must also follow a consistent style with a plan of style and use for elements such as symbols or photographs, videos or illustrations. The design should have a voice that is used to copy blocks and fits the overall aesthetic.

All of these consistent elements contribute to the overall ease of use and make the design as simple as possible for users.

2. You have to use Spaces

It is not necessary to stuff each element in the space above the parchment. Use spaces to set pace and flow, create visual hierarchies, and help users move through the Design.

If the content is good, you will scroll.

And spaces can actually help promote this user action by dragging the eye across the screen.

Spaces are even more important, because smaller screen sizes. Extra space around the elements can help create separation and make reading easier. (Think about the usefulness of a little more space when you can press the buttons effortlessly.)

Not sure where to include spaces in the theme? Start here:

  • To add buttons or other interactive elements
  • Like Linespacing between type lines for easy reading
  • Between elements if tings are difficult to distinguish, such as Packaging on photos embedded in text blocks
  • In form fields so you can easily type on mobile screens
  • For each Item, which Users should focus on

3. You have to use a Grid

A grid is the basis of the user experience. When designing with a grid, the final site is more accurate, more consistent, and the elements are arranged in a visually significant order.

The grids are both horizontal and vertical, although the best-known web design grid may be the 12-column vertical grid for aligning elements.

The grid is something you only see in the design process, and if you’re struggling to find placements for items or create an organized plan, a grid can be a total lifesaver.

4. Do not forget about user models

Users do things a certain way and expect certain things from their design. To be as successful as possible, Design needs to use generally accepted user models (recurring solutions to design problems) so that people know exactly how Design works.

Common user models include:

  • Order of information in forms, starting with a name or Email and ending with “send”
  • Placement of Navigation menus
  • Location and clickable type of shopping cart icon for ecommerce
  • How notifications work
  • Icons for search and Chat, among others
  • UI Design Patterns has a long list of user patterns for all types of design situations.

5. You Similarity in UI Actions to use

Each element of a website design should work like any other element of the same type. These elements must also have a visual identity so that users know at a glance what they are and what they do.

There are so many UI actions that can be integrated into a Design that adherence to the similarity principle is a must. Grouping visual elements and actions so they are visually identifiable helps create a better overall experience for users.

6. You must use Typography well

You don’t need to be a master typographer, but it really helps.

A lot of what makes a good Design is rooted in legibility and readability. And these concepts depend on how you choose and use fonts.

If in doubt, opt for simple font pairs such as Serif and sans Serif. Step back from the Design and check that the lettering is remotely readable. Then look at the lettering on a small screen, for example on a phone screen, to make sure it is easy to read at a glance.

Try using type in a contrasting environment, for example light Type on a dark background or Dark type on a light background, so that each word is easy to read.

7. You Retina Screens – do not forget

Even the smallest screens can reproduce elements and images almost to the pixel.

You need to think about how you handle images, icons and other elements so that everything looks good, regardless of the size of the screen. If possible, using a vector format can be the ideal solution, which is why SVG is becoming more and more popular.

If you do not have an image with the resolution for common screen sizes, do not use it. No image is better than a bad or pixelated image.

8. You have to be honest

Your design should match your small business, information or brand and be transparent about what you do. Don’t steal Design or image, don’t stuff dummy keywords to increase traffic, and pay attention to who and what your content is about.

With so much web clutter, users want to interact with authentic designs. Inciting users to do something or sign up for a product or service, or simply misleading them about a topic or information, should violate their personal code Of ethics. Do not accept projects that expect this from the design.

9. You Accessibility is not ignore it

The Web should be able to be used by as many people as possible. And while it may seem difficult to make sure the Design is accessible, it’s not as complicated as you think.

Google has an excellent guide on website accessibility that it defines as follows:

Many of the principles of good design, such as size, contrast and space, contribute to overall accessibility.

WebAIM has a checklist as well as other tools to help you determine if your design is accessible. The checklist includes four areas of accessibility: is the Design perceptible, usable, understandable and robust?

10. You will react

This should be pretty natural in 2018, but your site needs to react. This includes everything from text to images, buttons and the entire Framework.

Each design should work on any device. Period.


A strong set of rules can help you get into a design project faster and work more consistently. Note that none of these commandments tell you what a project should look like; they are rooted in the theory of how you sketch and create each website.

Do you have any additional web design rules to add these bids? Let us know what you are up to on social media. Just be sure to mark design Shack!

Related Posts

Leave a Reply

Your email address will not be published. Required fields are marked *