Embed Size (px)
DESCRIPTION
Website design is a never ending, there is innumerable number of websites and hardly can you compare one website with other in terms of design, images and color combinations. Ever wondered how a design can be so unique, no it’s not unique it’s only that you cannot find your drop of water in the large ocean. But Internet world has grown to such a large extent with majors like Google, yahoo and MSN, that original content and Technology is always appreciated.
Citation preview
Web Design -
A SEO and UX Perspective
Why we need this session?This session outlines some guidelines that we
should adopt during design and development phase.
Suggested practices will reduce the time and efforts taken to develop SEO friendly websites
It will also reduce the burdens of resources engaged in SEO and development or maintenance.
Before you read this session you need to be familiar with SEO. Please use this as a reference. http://moz.com/beginners-guide-to-seo
Copyright © GMR Web Team
Copyright © GMR Web Team
Components of A WebsiteCSSURLLogoHeader & FooterNavigationSite BannerSession ID
LinksImagesMETA DataHeaders (H1, H2)CanonicalizationRedirects
(301/302)Query Forms
Copyright © GMR Web Team
CSS (Cascading Style Sheets) Requirements
Website should use minimum CSS Maximum Number of CSS <= 4No inline stylesCross browser compatibilityCross platform compatibility (Win, iOS,
Android)W3C Validated CSS
Copyright © GMR Web Team
URL
Copyright © GMR Web Team
URL Continued.Depth – Number of subfolders (less than four)Width – Number of characters (no problem)Subdomains 0r Subfolders?
Subfolders are better as subdomains are considered a different website by Google
Page Names – Descriptive (keyword rich)No underscores (use hyphen [-] instead)If dynamic URLs are mandatory, keep number of
variables used in query string to less than fourUse extension less URLs (wherever possible)
Copyright © GMR Web Team
LogoClear placementNo H1 on logoLogo file name should be descriptiveLogo should have accurate ALT textUniform logo across platforms (web, social,
offline)
Copyright © GMR Web Team
Header and FooterDesigned with user’s preferences in mind. Put links like “About Us”, “Contact Us” here
rather than using in main navigation.Place Social Icons in both Header and FooterPut Significant Page URLs in FooterUse Copyright, Privacy, Terms etc. in Footer
Copyright © GMR Web Team
NavigationConvenient for visitors. Crucial information on home page. Important information and navigation
controls visible without scrollEvery page should be reachable from at least
one static text linkLink depth should not be more than three. Avoid Script based navigation
Copyright © GMR Web Team
BannerLightweightImages should have proper descriptionAll slides should link to relevant pageDynamic banners (if possible), so that we can
change it frequently without much efforts
Copyright © GMR Web Team
Session IdShould not appear in URL (causes duplicate
content)Session IDs are best kept in cookies rather
than URLsSession IDs can prevent link value from being
passed to page if included in URL
Copyright © GMR Web Team
LinksProper inter-linkingDescriptive and Relevant Anchor TextAll links covered in HTML/XML SitemapRefer to all practices for SEO Friendly URLs
Copyright © GMR Web Team
ImagesGood to include high quality images on websiteImages should be optimized Should have relevant ALT & Title attributeInclude Height and width attributeLow image size (30 to 120kb, resolution 72dpi)Use Image compression or CSS Sprite for
optimizationChoose a descriptive image file namePut all your images in a folder called ‘images’
Copyright © GMR Web Team
META DataTitle (up to 60 characters)Description (up to 150 characters)Keywords – No ranking benefits (but suggested
use)
Most important factor for SERPsMake sure to develop a mechanism to add META
details on all web pages of the site. Inclusion of Facebook Open Graph, Twitter
Cards, and Google+ publisher attributesUse Schema Attributes
Copyright © GMR Web Team
Headers (H1, H2)Very important for rankingOnly one H1 per page (use primary keyword)H2 as per page contentNo H1 on Logo
Copyright © GMR Web Team
CanonicalizationImportant aspect from SEO point of view. Google assumes abc.com, www.abc.com and
http://abc.com as different URLsUse “rel=canonical” wherever required
Redirects (301/302)URL redirects impact the performance of
websites. All permanent redirection should be 301302 should be used for temporary redirectionIn case of redesign, preserve URLs
Copyright © GMR Web Team
AccessibilityPage access - Make sure that the robot.txt file
isn't accidentally blocking important pagesBlock inappropriate pages – Some pages
should not be indexed, for example incomplete pages or confidential pages
404 errors - try to reduce the amount of 404 errors to a minimum
Site speed - Faster is better.Mobile accessibility - Google recommends a
responsive design.
Copyright © GMR Web Team
Some Do’s and Don’sDo’s
Have valid HTMLUse 301 redirects for moved pagesUse custom 404 errors for missing pagesKeep CSS in external include filesBlock indexing of tags/ categories in blogs
Don’tsRequire cookies to serve important contentAllow broken linksUse images, Flash, or JavaScript to display important textMake content only accessible through forms or other
elements that require human action
Copyright © GMR Web Team
Extra ReadingWeb design guidelines:
https://support.google.com/businesssitebuilder/answer/1657560?hl=en
Design and Content Guidelines: https://support.google.com/webmasters/answer/35769?hl=en#1
Technical guidelines: https://support.google.com/webmasters/answer/35769?hl=en#2
Copyright © GMR Web Team
