Doc.SEO
After setup new PI website, Improve SEO parameters are important, before start work on your website SEO, you should know improve SEO on Google and other search engines , required weeks and months.
You improve your website SEO for help to search engines to make better result for users, you must improve your services on your website for your users. Your added contents is important parameter on SEO, You must add new content and don't copy other website contents on your website, However add new contents by Specified Harmony
Now We Recommend some settings and options for improve your SEO on PI websites
You need create account on some Social Networks, And share all new updates on your official account, And add twitter / facebook / Google + share icon on all of your pages
Twitter Create twitter account by your website info mail, and your domain name and twitter should be same, after it start twit all new updates on your account By page link and tag , And add your twitter account link on website footer.
Facebook You should create page on facebook, Logout from your account and got to this page and build new page and user : https://www.facebook.com/pages/create/ , after register you should improve your account and change your account name to your domain. After that add your Facebook account link on website footer.
Google + Make google account by your domain name ( or domain name and some change like : piengine.dev ) and start Google + , After that add your Google + account link on website footer.
Others Make account by your name on LinkedIn, Pinterest, Delicious, Youtube is important.
Your website with and without www should redirects to the same page. Edit and add this lines on your PI .htaccess
# Set Pi application environment, valid values: production, debug, development
#SetEnv APPLICATION_ENV production
# Enable runtime rewriting engine
RewriteEngine On
RewriteCond %{HTTP_HOST} !^www\.YOURWEBSITE\.com$ [NC]
RewriteRule ^(.*)$ http://www.YOURWEBSITE.com/$1 [R=301,L]
Pi support this option, Just enjoy it
Primary robots.txt available on your installed PI, you just need update it by your needed Allow and Disallow parts , here you can see example by link to sitemap XML
User-agent: *
Disallow: /cgi-bin/
Disallow: /tmp/
Disallow: /asset/
Disallow: /script/
Disallow: /static/
Disallow: /upload/
User-agent: Mediapartners-Google
Allow: /
User-agent: Adsbot-Google
Allow: /
User-agent: Googlebot-Image
Allow: /
User-agent: Googlebot-Mobile
Allow: /
Sitemap: http://www.YOURWEBSITELINK.com/sitemap.xml
Link to your sitemap.xml on your robots.txt is very important And after install Pi and make first sitemap.xml, you should update your robots.txt.
You can also check google robots.txt : http://www.google.com/robots.txt
You should make sitemap.xml for your website and put it on your website root. and your sitemap link should be : http://www.YOURWEBSITELINK.com/sitemap.xml For build sitemap you can use some methods:
- Build it manual
- Use sitemap module on PI
- Use online service for build it
your title contains should be between 10 and 70 characters.
your meta description contains should be between 70 and 160 characters (spaces included).
Meta keywords are used to indicate keywords that are relevant to your website's content. Because search engine spammers have abused this tag, however, it provides little to no benefit to your search rankings.
You can safely avoid the use of this tag for new web pages. For existing web pages, make sure the meta keywords do not appear to be spammy.
You should use H1 to H6 tags on your website. its very important.
- H1 : your h1 tag should be your website title by link to your homepage and used on all your website pages. just use one H1 tag in each page and put it in header
- H2 : Add 4 or more h2 tag ( 4 h2 is good ) on your homepage
- h3 : You need about 8-10 h3 tags on your homepage
- H4, H5, H6 : After add H1, H2, H3 tags, if you have more important titles use H4 to H6 tags
This is good example code for H1 title on your PI theme :
<h1><a href="<?php echo Pi::url('www'); ?>" title="<?php echo $this->escape($sitename); ?>"><?php echo $this->escape($sitename); ?></a></h1>
Use same Keywords on Title , Meta Description and H tags, For example :
- Title : Pi Engine for web and mobile
- Meta Description : Pi Engine is a role oriented application development engine for web and mobile
- H1 : Pi Engine , H2 : web , H2 : mobile
At this example Pi Engine , web and mobile are Consistency Keywords
All of your <img> image tags should be use full url and alt tag by text (alt="Image Title")
<img src="Http://www.yourimage.com" alt="Image Title" />
And all of your <a> link tags should be use full url and title tag by text (title="Link Title")
<a href="Http://www.yourlink.com" title="Link Title">Link Title</a>
It good if your website have blog. you can use PI modules ( rename artilce or news modules ) or use other blog services, your blog URL should be one of this link types :
- 1- http://blog.yourwebsite.com
- 2- http://www.yourwebsite.com/blog ( Supported by PI cloned modules )
Your website need favicon.ico, Use PI favicon.ico or build your favicon.ico
Your PI website have 404 Error Page , You can customize it on your theme
Use Microformats on your theme and content, read more on : https://en.wikipedia.org/wiki/Microformat And Google have some good articles about it :
- About microformats : https://support.google.com/webmasters/answer/146897?hl=en
- About microdata : https://support.google.com/webmasters/answer/176035?hl=en
- About RDFa : https://support.google.com/webmasters/answer/146898?hl=en
Specifically use below codes :
-
rel="nofollow"For all external links, exmaple :<a rel="nofollow" title="Google" href="http://google.com">Google</a> -
rel="tag"For all tags ( Tag words ) -
rel="license"For your copyright link, exmaple :<a rel="license" href="http://www.pialog.org" title="Pi Engine" >Powered by Pi Engine</a>
You can add Dublin Core tags on your website head, sample codes are :
<meta property="dc:title" lang="<?php echo $locale; ?>" content="YOUR_HOMEPAGE_TITLE">
<meta property="dc:publisher" content="<?php echo $this->escape($sitename); ?>">
<meta property="dc:subject" lang="<?php echo $locale; ?>" content="<?php echo $this->escape($slogan); ?>">
<meta property="dc:description" lang="<?php echo $locale; ?>" content="<?php echo echo $this->meta('description');; ?>">
<meta property="dc:type" content="Text">
<meta property="dc:language" content="<?php echo $locale; ?>">
<link rel="DC.relation" href="<?php echo Pi::url('www'); ?>">
<link rel="DC.relation" hreflang="<?php echo $locale; ?>" href="<?php echo Pi::url('www'); ?>">
Note : HTML5 still doesn't support some extra tag names on meta like <meta name="dc:title" content="Pi Engine" lang="en"> if you use HTML5, you can use above codes, But if you use other version you can use below codes too, if you use below codes on HTML5 DOCTYPE you have some error on check validation
// Dublin Core title
$this->headMeta($sitename, 'dc:title', 'name', array(
'lang' => $locale));
// Dublin Core subject
$this->headMeta($slogan, 'dc:subject', 'name', array(
'lang' => $locale));
// Dublin Core description
$this->headMeta('YOUR_DESCRIPTION', 'dc:description', 'name', array(
'lang' => $locale));
// Dublin Core type
$this->headMeta('text', 'dc:type', 'name');
// Dublin Core publisher
$this->headMeta($sitename, 'dc:publisher', 'name');
// Dublin Core language
$this->headMeta($locale, 'dc:language', 'name');
// Dublin Core relation
$this->headLink(array(
'rel' => 'DC.relation',
'href' => Pi::url('www')),
'PREPEND');
// Dublin Core language relation
$this->headLink(array(
'rel' => 'DC.relation',
'hreflang' => $locale,
'href' => Pi::url('www')),
'PREPEND');
You can add your GEO tags, find your position by google map.
// Geospatial information
$this->headMeta('YOUR_Latitude; YOUR_Longitude', 'ICBM');
$this->headMeta('YOUR_Latitude; YOUR_Longitude', 'geo.position');
$this->headMeta('YOUR_Address', 'geo.placename');
$this->headMeta('YOUR_REGION', 'geo.region');
Build your apple icons and put theme on your theme image folder and use this code, You need 4 icons by this names and size
- touch-icon-iphone.png 57x57
- touch-icon-ipad.png 72x72
- touch-icon-iphone-retina.png 114x114
- touch-icon-ipad-retina.png 114x114
// Apple icon for iphone
$this->headLink(array(
'rel' => 'apple-touch-icon',
'href' => $this->assetTheme('image/touch-icon-iphone.png')),
'PREPEND');
// Apple icon for ipad
$this->headLink(array(
'rel' => 'apple-touch-icon',
'sizes' => '72x72',
'href' => $this->assetTheme('image/touch-icon-ipad.png')),
'PREPEND');
// Apple icon for iphone retina
$this->headLink(array(
'rel' => 'apple-touch-icon',
'sizes' => '114x114',
'href' => $this->assetTheme('image/touch-icon-iphone-retina.png')),
'PREPEND');
// Apple icon for ipad retina
$this->headLink(array(
'rel' => 'apple-touch-icon',
'sizes' => '114x114',
'href' => $this->assetTheme('image/touch-icon-ipad-retina.png')),
'PREPEND');
Make sure your theme head have Meta Viewport Tag
// Meta Viewport Tag
$this->headMeta('width=device-width, initial-scale=1.0', 'viewport');
Your need mobile support css, PI bootstrap support it, if you use bootstrap on your theme just use :
$this->bootstrap('css/bootstrap-responsive.min.css');
If you need custom css file you can add it by same code :
$this->css(
$this->assetTheme('css/mobile.css'),
array('media' => "only screen and (max-width: 768px)")
);
Your need print support css too, Make print css file and link it on your theme :
$this->css(
$this->assetTheme('css/print.css'),
array('media' => "print")
);
Valid your website on : http://validator.w3.org
Build Google Analytics account and put your ID on PI General setting -> GA account option
Build Google Webmaster account and verify it on your website, and you need to add your sitemap.xml on google webmaster and check some settings
Structured data helps Google understand the content on your site, which can be used to display rich snippets in search results. read more about it here : https://support.google.com/webmasters/answer/99170?hl=en and here : http://schema.org/docs/gs.html
