close
Shot by

5 golden rules of ethical web design (& how to apply them)

In this sponsored blog post by our friends at Readymag, learn how to practice ethical design communication in your web designs by applying 5 simple rules.

Every design decision is made on behalf of end-users. At Readymag, we believe that designing for the web — a medium for communication and a social space at the same time — it’s our responsibility to think carefully about how our choices impact the person on the other end of the conversation. Even a small, seemingly insignificant design decision can have far-reaching consequences, and good etiquette can help us carve paths to better futures for everyone.

Ethical design communication refers to the practice of conveying honest information in a way that's not misleading.

Ethical design communication refers to the practice of conveying honest information, in a way that’s not intended to be misleading. In this article, learn 5 rules of modern etiquette to follow as a web designer, based on our educational pop-it Debris of Attention.

The Debris of Attention editorial animation web readymag
Shot Link

The Debris of Attention

by Tatiana Egoshina for Readymag

The Debris of Attention is a playful web project on archaic web gimmicks: intrusive pop-ups and sidebars, floating menu bars, font hostility, etc. It gathers some of these annoying website characteristics and offers visitors to free the page from them b...

View on Dribbble

1. Focus on the message

If the goal of your web page is to convey information (brand stories, special offers, announcements, etc.), then focusing on the clarity of your message is of utmost importance. Your goal here is to help users focus on relevant information instead of distracting them.

Some of the most common examples of ignorant or malicious attempts to shift your flow include:

  • Intrusive pop-ups and sidebars
  • Floating menu bars
  • Splash pages
  • Hidden elements


D20ffc370c653d2db699fac76f122b2d


2. Keep your layout neat

A good web design layout should provide a lively, balanced flow of information — but careless spacing of letters, lines, and words can tear this fabric apart. Some common examples of bad web layout include:

  • Fonts are too small or difficult to read.
  • Text is underlined without a link.
  • Tiny click targets — please, be friendly to users.
Design mobile layouts faster desktop layout automatic auto ux design readymag interface mobile
Shot Link

Design mobile layouts faster

by Stas Aki for Readymag

For the Mobile version of your projects you can now choose from three types of mobile layout: Auto layout (arranges all widgets in a single column, each will fit the viewport width), Fit to mobile (resizes all widgets proportionately to fill the mobile ...

View on Dribbble

3. Choose user-friendly fonts

Using too many fonts on the same website decreases cognitive fluency. This means users will find it difficult to understand what they’re looking at. Script fonts (or “hand-drawn” looking fonts) are hard to read, decreasing ease of use for visitors and potentially pushing them away.

4. Avoid animation hell

More often than not, online junk attacks are backed up with a significant amount of dark pattern firepower — including nudity, flashy animations, and hidden close buttons. Flickering lights may trigger seizures in users with epilepsy.

Web content can avoid this risk by not blinking or flashing too rapidly. The defined threshold is no more than three flashes per second. Here you’ll find more tips on how to make your website more accessible.

5. Make it easy to navigate

Make your page a clean and navigable river, instead of a swamp. A common example of bad navigation includes stepped menus: options can quickly become overwhelming, making users frustrated and motivating them to go elsewhere.


93e4eefa96e26fb97ca7e9d608b0a04f


Practice ethical design communication in your web designs

Living in a world subject to ethical imperatives requires an empathetic approach and focused effort for development. Morality is not a set of rules to be learned, but a way to think of and perceive the world. Some dilemmas don’t have straightforward or clear-cut solutions. With that in mind, try out Readymag to create your own website — without coding.


Readymag This piece was written by the team at Readymag, the browser-based tool for designing outstanding websites. Readymag has no layout limitations, an intuitive interface, 3000+ integrated fonts, and the functionality to build everything from landing pages to editorials to animated presentations.

Find more Process stories on our blog Courtside. Have a suggestion? Contact stories@dribbble.com.


Previous
Next