123CUSS

Principles of Beautiful Web Design

Many people think designing a web or weblog is a technical task, akin to programming. This is not the case. Keep it simple. The most important is design elements should not overshadow the information on the page. A web site need to be laid out in a way that pleases the eye, is easy to read, and emphasizes the important parts of information. There are some simple keys to keep in mind when playing with web design. By following some simple points, anyone should be able to create a visually pleasing design and take one step closer to fame. Okay, it’s not that simple, and talent and experience do matter, but anyone can turn their home page into something prettier within mere minutes.

By Matt Silverman @mashable.com

The best part is, you don’t have to be a designer or a programmer to create a great looking blog, but you should know where to find the right resources, and how to align your blog’s design with its purpose.
  • Learn Some HTML. A basic understanding of the web’s nuts and bolts will allow you to make custom design tweaks, fix template problems, and format your posts more precisely.
  • Find the Right Template. Many free design resources that are easy to plug right into your platform of choice.
  • Layout. The key to good blog design is to strike a balance between content and clutter. Think about utility and user experience when choosing your layout and number of column.
  • Be a Layout Sleuth. It’s possible that you might be able to use a template from any lovely blog design for your own blog.
  • Make It Your Own. Use your blog’s back-end bells and whistles, in combination with your new HTML knowledge, to add your own brand to the design.
  • Go Minimalist. If you’re not design-minded, Minimalist themes often use neutral colors, clean layouts, and lots of white space, making them ideal for easy customization.
  • Further reading

By Collis @psd.tutplus.com

Web design can be deceptively difficult, as it involves achieving a design that is both usable and pleasing, delivers information and builds brand, is technically sound and visually coherent. I’ve put together my 9 principles for good Web design.
  • Precedence (Guiding the eye). When navigating a good design, the user should be led around the screen by the designer. Manipulate position, color, contrast, size, and design elements to achieve precedence.
  • Spacing. Empty space seemed wasteful. In fact the opposite is true. Spacing makes things clearer. Consider use of line spacing, padding, and white space.
  • Navigation. Buttons to travel around a site should be easy to find beside the text of a button should be pretty clear. In a larger site, you might make use of bread crumb trails, sub-headings and a site map.
  • Design to build. Consider things like effect on resizing screen, vertical alignment, and using pure CSS buttons.
  • Typography. Make sure your text sizes are consistent, large enough to be read. Spacing between lines and away from other objects is important to consider. Small columns of text work much better. Justified text tends to create weird gaps which isn’t nice for your eye when reading.
  • Usability. Try to adhere some standard conventions e.g underlined text is expected to be a link.
  • Alignment. Aligning makes your design more ordered. Try to keep things consistently placed on a page, and you may also wish to base your designs on a specific grid.
  • Clarity (Sharpness). Cleaning up shapes, lines, and boxes if you’re creating them in Photoshop, and make sure any text is created using the appropriate anti-aliasing setting.
  • Consistency. Everything should be themed. Heading sizes, font choices, coloring, button styles, spacing, design elements, illustration styles, photo choices, etc.
  • Go Minimalist. If you’re not design-minded, Minimalist themes often use neutral colors, clean layouts, and lots of white space, making them ideal for easy customization.
  • Further reading

By Emily Gonsalves @artblog.emilygnsalves.com

  • Balance. Symmetry tends to create stillness and results in a more static, controlled composition. Asymmetry can give a sense of unrestrained energy.
  • Contrast. Can be between: shape/form, volume, size, value/colour, position, or direction of items.
  • Emphasis. Used to focus the attention of the viewer and add interest.
  • Positive/Negative. Excessive positive space prevents the viewer from focusing and important elements can be overlooked. Excessive negative space can result in a product which appears unfinished or unusually plain.
  • Repetition. Encompasses rhythm and patterns.
  • Movement/Direction. Diagonals tend to create visual movement, as they encourage eye movement in a particular direction.
  • Gestalt/Unity. Grids create a sense of unity and structure. Grouping creates a sense of unity and harmony.
  • Further reading

By Juul Coolen @noupe.com

  • Balance. Ensure the design does not tip to one side or the other.
  • Grid. Columns and spacing improve readability, making a page’s content easier to absorb on the eye.
  • Color. Black and white convey chic and professional, while red makes certain elements stand out and keeps the design from looking dull.
  • Graphics. Great design doesn’t need fancy graphics. But poor graphics will definitely hurt a design.
  • Typography. Web typography is handicapped due to our lack of complete control over the appearance of type on the Web.
  • White space. White space gives text some breathing room and spatial peace.
  • Connection. When a design is inconsistent, its unity can be lost on the user.
  • Further reading

From book 'The Principles of Beautiful Web Design' by Jason Beaird

  • Layout and Composition. An awareness of design relies heavily on understanding the spatial relationships that exists between the individual component of a design.
  • Color. Perhaps the most mysterious of design is the topic of color selection. For creating harmonious color combinations, anybody can choose a set of colors that work well together to complement the overall message of a website.
  • Texture. An aspect that is often overlooked. Texture is the key to create stand out designs. Use of points, lines and shapes to communicate and support your site's message.
  • Typography. The important of typography is self-evident. Type is everywhere, and understanding the mechanics of written language is essential for any visual designer.
  • Imagery. The necessary companions to any well-designed site are the images and illustrations that grace its pages. Finding the right image, learning the basics of cropping, masking, borders, and file formats before we take the final step in our simple design.
Article By : 54BLOGGER
Permalink : http://www.fiveforblogger.com/2011/01/principles-of-beautiful-web-design.html
Cahya Maulana
Sabtu, April 20, 2013
1 komentar
Share
More

« Previous

Next »

Beranda

1 komentar:

  1. Great article, Thanks for putting together this rundown! I regularly tune into this writer’s circle Facebook group. https://seo.app/uWnq4gBhZ Some super wonderful member posted a bit ago about a platform called INK for All. Has anyone worked with it?

    BalasHapus

Principles of Beautiful Web Design