• Share
  • Email
  • Embed
  • Like
  • Save
  • Private Content
Compulsory Design Guidelines

Compulsory Design Guidelines



Kiran Raj have been distribute Basic Designing Guidelines for every one..

Kiran Raj have been distribute Basic Designing Guidelines for every one..



Total Views
Views on SlideShare
Embed Views



0 Embeds 0

No embeds



Upload Details

Uploaded via as Adobe PDF

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
Post Comment
Edit your comment

    Compulsory Design Guidelines Compulsory Design Guidelines Document Transcript

    • SEO – Designing Basic Guidelines 1. Content should be equally balanced on both sides of the page: When users enter a website, their focus first starts at the top left of the page and hovers there before slowly tracking to the right. Contrary to what many think, the web user is focused more on the text of the page, rather than images or graphics. This is where balance comes into place. Balance will not only make your page more visually appealing, but it will make your page easier to read and items easier to find. A good layout will help the objects on your page to flow. 2. Build simpler pages: Clean your website up by removing all the unnecessary visual elements. This will allow important items to stand out. Leave some white space on the page. The illusion of space is visually pleasing, as well as easier to navigate. Otherwise, your visitor will not get the information we are providing him and may leave in hurry. • Color is the big subject. As soon as you add more than one color to a page, you make the other colors look different. On the web, though, you should usually avoid using too many colors on one page. Even if they are complementary, it will look garish. Use the color of the country’s flag is very good and it is general practice. • Space plays an important role as you can create all sorts of illusions with the amount of space you put between your objects, and where you put it: design is often as much knowing where to put something as it is knowing what to put there. If you make things overlap, or example, the covered things appear to be at the 'back' while the uncovered ones are at the 'front'. • Emphasis can be used if you want to make part of the page stand out from all the rest. Grouping everything together and then moving one thing a significant distance away from them will make it a focal point, as will making it a different shape from the others, or a different color. • Line The directions of your lines will give a mood to your design: as a rule, horizontal lines are calmer, vertical lines are moderately active, and jagged or diagonal lines are very active. If you were designing an austere financial news site, then, you'd use horizontal lines, while a fun site for kids would be full of lines going in all sorts of directions.
    • 3. Font Size to consider: The size and type of font needs to be considered and try to use simpler and easy available fonts. San-serif fonts such as Arial and Verdana are popular choices for on-screen reading. The font size should be no smaller than 10 points and no larger than 14 points. 4. Keep clean background: The background textures and colors you choose have the ability to gauge the overall appeal of the website. Lots of texture and graphics in the background can be distracting, and the more texture you add to the background, the less noticeable your text and images become. 5. Choosing graphics for pages: Below are some instances where we can use graphics to enhance the look and feel of pages: • Logo – Logo is your brand recognition and it adds visual appeal to your web pages. • Title bars – The title bar lets your visitors know which page they are on. • Horizontal rules – Graphic lines are often used to separate categories or sections of a webpage. • Background images – Are used to add visual appeal or make a web site easier to navigate. • Photos – Personalize a website and make it inviting. • Navigation icons, such as `home' and 'back' enhance a page because they are familiar and users anticipate seeing them. 6. Navigation should be considered: Create a toolbar with links that are easy to navigate. CSS plays an important rule here for creating the toolbar in an area that makes sense. Going with the norm will create a sense of familiarity and facilitate the ease of navigation. And don't forget a link to your homepage. It's often forgotten but very important to point your users to your home page. 7. Readability of text on the page: You have great copy, but are you displaying it effectively? Make your pages easy to read. Break up blocks of text and create short paragraphs. • Consider the key points on each page and create headings and subheadings.
    • • Only use one or two fonts. Select one font for your headings and subheadings and another for the body text. • Highlight key words and phrases by bolding or using a different color. Be careful when selecting colors, and don't use every color in the rainbow. Many, such as yellow and pink, don't stand out well if you've selected a white or black background. 8. Scrolling: People do not like to scroll Horizontal, so it is necessary not to have horizontal scrolling. Vertical scrolling is ok if you have to have it, but consider moving larger blocks of information to another page and providing links. So if you've got to have a scrolling page, try to keep all your important information above the fold. 9. Quick Page Load: We all get impatient when it takes more than 5 seconds to connect to a website. Users want to make contact, and make it quick. Ensure that your pages load as quickly as possible. Eliminate unnecessary graphics, especially flash graphics...they can be time hogs. 10. Google Ads Format: Google Adsense Format can be used as per the content’s placement over the page and purpose of the website. So, it is very difficult to define in advance. Below is the format of ads: https://www.google.com/adsense/static/en_US/AdFormats.html 11. Bread Crumb: Generally, we place the bread crumb in the content area at the top. For example, http://www.greatdad.com. 12. Heading text (h1) will require to search crawl 13. Use only gif and jpg images 14. Try to compress images with the help of designer 15. Hypertext should highlight differently (color, weight, decoration etc.) 16. Need to stand out object who help to grab conversion ratio 17. 3 or 2 frame layout always looks good 18. Logo should require minimum 25px height 19. Only website logo should bigger then other logo 20. Check accessibility of page 21. Avoid unnecessary comments on page
    • 22. Define doctype on the page 23. Try to develop website in table less environments 24. Always define type to javascript 25. Make sure W3C principles for nesting tables and div 26. Maintain the typography and datatype in HTML, Clientfiles, Serverfiles, Images and folders 27. Maintain folders structure 28. Don’t use hidden tags 29. If flash necessary make sure about object tag 30. Flash not be increase from 40k, use loader if necessary 31. Avoid use of inline style and on page script 32. Alternate text and title useful for any website 33. Rights and legal agreements need to display on bottom of the page 34. Help, sitemap and FAQ require for better navigation and understanding concept of application 35. Tag line