Sebenarnya ini pengalaman Angular/SEO saya.
Anda harus melakukan banyak perubahan!!
1) Menghapus # dari url
app.config(['$locationProvider', function ($locationProvider) {
$locationProvider.html5Mode({
enabled: true,
requireBase: false
});
}]);
2) Tinjau Perutean MVC Anda
Sampai sekarang mungkin Anda memiliki satu HomeController untuk mengembalikan index.cshtml dan mem-boot Aplikasi Angular Anda.
Setelah menghapus # dari perutean Angular, Anda harus menyetel MapRoute untuk semua rute Anda.
Karena dalam situasi ini pertama kali Anda mencobanya untuk mengunjungi rute seperti www.site.com/any_route Aplikasi Angular belum dimuat sehingga mencoba mendapatkan halaman dari MVC Routing. Namun setelah itu $routeProvider menjalankan tugasnya.
3) Gunakan variabel MVC untuk tag meta
Untuk pengindeksan yang lebih baik dan berteman dengan perayap dan bot, kita harus menggunakan variabel MVC untuk menginisialisasi tag meta situs web.
Jika Anda menyetel judul laman dengan pengikatan Angular seperti <title>{{title}}</title> kapan pun Anda ingin membagikan laman Anda melalui jejaring sosial, Anda akan melihat {{title}} karena jejaring sosial tidak dapat merender situs.
<title>@ViewBag.title</title>
<meta name="Description" content="@ViewBag.description">
<meta name="Keywords" content="@ViewBag.keywords">
<meta property="og:title" content="@ViewBag.title" />
<meta property="og:description" content="@ViewBag.description" />
4) Ganti pengikatan Angular untuk tag meta
Aplikasi kami adalah SPA, jadi setelah memuat Angular kami keluar dari taman bermain MVC. Kita harus mengganti variabel Angular dengan variabel MVC.
angular.element('title').remove();
angular.element('meta[name="Description"]').remove();
angular.element('meta[name="Keywords"]').remove();
angular.element('meta[property="og:title"]').remove();
angular.element('meta[property="og:description"]').remove();
var description = angular.element('<meta name="Description" content="{{meta.description}}">');
angular.element('head').prepend(description);
var keyword = angular.element('<meta name="Keywords" content="{{meta.keywords}}">');
angular.element('head').prepend(keyword);
var titleOg = angular.element('<meta property="og:title" content="{{meta.title}}" />');
angular.element('head').prepend(titleOg);
var descriptionOg = angular.element('<meta property="og:description" content="{{meta.description}}" />');
angular.element('head').prepend(descriptionOg);
var title = angular.element('<title ng-bind="meta.title"></title>');
angular.element('head').prepend(title);
$rootScope.$applyAsync(function () {
$compile(title)($rootScope);
$compile(description)($rootScope);
$compile(keyword)($rootScope);
$compile(titleOg)($rootScope);
$compile(descriptionOg)($rootScope);
});
5) gunakan JSON-lD untuk konten dinamis
Jika Anda familiar dengan SCHEMA.org Anda lebih baik menggunakan JSON-LD daripada yang lain, karena bot mesin pencari dapat menangkap dan menganalisis <script type="application/ld+json"></script>s yang disisipkan secara dinamis setelah halaman dimuat.
Anda harus memeriksa Schema Dictionary untuk menemukan tipe yang paling dekat dengan struktur data Anda.
Misalnya perusahaan saya json-ld:
<script type="application/ld+json">
{
"@context" : "http://schema.org",
"@type" : "Organization",
"name" : "داده کاوان امیرکبیر",
"alternateName" : "ADM | Amirkabir Data Miners",
"description": "شرکت داده کاوان امیرکبیر | تولید کننده نرم افزارهای تحت وب، از قبیل حسابداری آنلاین 'کاج سیستم' ، سیستم مدیریت پروژه 'تسک من' و ...",
"url" : "https://adm-co.net",
"email": "[email protected]",
"logo": {
"@type": "ImageObject",
"url": "http://khoonamon.com/images/ADM_Logo.png",
"caption": "لوگو داده کاوان امیرکبیر",
"width": "2480px",
"height": "1459px"
},
"telephone": "+98-21-44002963",
"address": "تهران، خیابان آیت ا... کاشانی، نبش خیابان عقیل، پلاک 380، طبقه دوم",
"contactPoint" : [{
"@type" : "ContactPoint",
"telephone" : "+98-21-44002963",
"contactType" : "customer service",
"contactOption" : "TollFree",
"areaServed" : "IR",
"availableLanguage" : "Persian"
}],
"sameAs" : [
"https://google.com/+ADMcoNet-GPlus",
"https://www.linkedin.com/company/adm-amirkabir-data-miners-?trk=biz-companies-cym",
"https://instagram.com/AmirkabirDataMiners/",
"https://www.facebook.com/AmirkabirDataMiners",
"http://www.pinterest.com/AmirkabirDM/",
"https://twitter.com/AmirkabirDM",
"https://www.youtube.com/channel/UCQxP0vZA05Pl9GlyXXQt14A/about"
]
}
</script>
person
MeTe-30
schedule
29.06.2016
