Explore more topics
  • 1

    Use font size scales with pleasant proportions such as a 3:4 scale.

  • 2

    Try to keep paragraphs no wider than 60 characters in width for readability. Also a minimum font size of 14 pixels is a good idea.

  • 3

    Be wary of line-height. Try to use a line-height of about 1.1 for headings and 1.5 for paragraph text.

  • 4

    Beautify your URL's to assist in search engine optimization and to improve navigation clarity.

  • 5

    Split large forms into wizard form with steps and clear labeling. This tip can be taken into larger context under the idea of "progressive disclosure"

  • 6

    Most users scan web page content versus reading everything on the page so make sure your page is scannable. Contrast in type helps.

  • 7

    Think about people with poor vision when designing your site. Get the print/background color combination right, and don't use text on top of images.

    Lily L
  • 8

    Download speeds are critical to keep the visitor interested. Don't overload your site with huge page files, as not everybody has superfast broadband.

  • Have a good web design tip to add?
    Sign in easily using Facebook or Google.
  • 9

    Ensure that the reader can see everything on the screen at once, without the need to scroll down or across.

    Lily L
  • 10

    Don't risk losing customers: they may not have the most up-to-date version of Flash installed. Consider which version is needed to make your site work

    Lily L
  • 11

    Ensure that your site is user friendly by getting an independent user to test out all navigation functions before it goes live.

    Lily L
  • 12

    Embrace the constraints of the user's system. eg. iPad, mobile, desktop, TV, etc.

  • 13

    It may make sense to design for mobile first before the desktop version. The limited space in mobile helps prioritize what should be shown.

  • 14

    Think outside-in over inside-out. Not what we (the company) needs from the user but what the user needs to do to accomplish their task. Make it easy!

  • 15

    Only use an icon when it's well known, otherwise use text or text with an icon.

  • 16

    For design inspiration follow the work of other designers in magazines and on websites such as Dribbble.com.

  • Finding any of these web design tips useful?
    Click on the icon to vote tips up.
  • 17

    If you are new to web design or are looking to save time recreating common UI elements have a look at Bootstrap from Twitter.

  • 18

    Work on multiple web design projects at once with varied requirements, colors, layout, etc in order to expand your perspectives and creativity.

  • 19

    If you're stuck, try to readjust your attitude / approach to your design in order to bring in a different perspective. Analyze what you want to change

  • 20

    Add on-page hints and calls to action for users to notice and perform in order to help them achieve their goals.

  • 21

    A good starting point towards responsive images is the CSS max-width: 100%;

  • 22

    When using @media queries in responsive design, use min-width instead of max-width and design for mobile first in case the @media tag is unsupported.

  • 23

    Don't use generic @media breakpoints like 1024px in responsive design. Instead use break points that align strongly with your content.

  • 24

    Build on other website designs.

  • Web Design Tips

    Web Design Tips

    Promoted Resource
    Dribbble.com: Show and Tell for Designers
  • 25

    Table grid lines should be minimized.

  • 26

    If you're new to design check out the book "The Non-Designer's Design Book" by Robin Williams for a great introduction.

  • 27

    CRAP - Contrast, Repetition, Alignment, Proximity.

  • 28

    Attention spans online are short so make sure your site's functionality is both seamless and fast whenever it can be.

  • 29

    Keep disruptive items such as dialog boxes and full page refreshes to a minimum in order to maintain a user's focus and train of thought.

  • 30

    Generally speaking, there are three types of users: those who want to digest information, those looking for solutions and those who want to create.

  • 31

    Be conscious of the balance between features and user experience.

  • 32

    It's good to have an image with a quality alt attribute as well as a value-added external link per page for SEO and user experience purposes.

  • Sign up on Wizgig to:
    Suggest new topics · Add tips · Comment · Vote
  • 33

    Revisit your footer and make sure you're using the space wisely. A footer can be a great place for company links, marketing things and social media.

  • 34

    You can use Google Analytics to track your own custom events with the _gaq.push() call. eg. Logging client side Javascript errors.

  • 35

    Improve your own browsing speed on the Internet by switching your network adapter to use Google's public DNS servers. It's free and easy.

  • 36

    Secure your site traffic by switching to HTTPS. Educated users will over time be more reluctant to type in any revealing information over HTTP.

  • 37

    Be wary of browser market share trends. Different browsers support varying levels of technology.

  • 38

    Make sure you have a balanced color scheme in place. There are some good online tools you can use to make a scheme, such as Adobe's kuler.

  • 39

    Split your global CSS file in two if it contains a lot of big data URI's. One for styles, the other for data URI's. Aggressively cache data URI's.

  • 40

    Avoid CAPTCHAs at all costs. There are alternative solutions out there, such as the Honeypot Trap or math questions, which can block 99.9% of spam.

  • 41

    Google is always fresh-content-hungry. The fresher your content the higher your site is ranked.

  • 42

    As a web surfer, the first thing i do if a splash screen pops up is LEAVE the web site im on. Don't use them if you want people to stay on your site.

  • 43

    Video playlists are great but auto-play isn't. I want time to read comments and the option to play the next video myself.

  • 44

    Try to avoid pure black in general. For body text, rather than simply use dark gray, switch to a saturated, dark color such as blue or green.

  • 45

    Use a responsive design if your website is light weight otherwise split a desktop and mobile version with links to each other.

  • 46

    Similar to a favicon, iOS devices support an Apple touch icon meta tag that displays as an iOS dashboard icon whenever someone bookmarks a page.

  • 47

    Base your site templates / layout off of a responsive grid framework.

  • 48

    Write W3C compliant code based on your declared doctype for problem free sites.

  • 49

    Keep it simple. The easier a website is to update, the more likely it is that you'll keep content fresh and therefore attract loyal followers.

  • 50

    The web site is not a place people go to read it is for information! Keep it short and to the point.