إنشاء روابط محسنة لمحركات البحث (SEO) في إطار عمل Laravel 5

تلعب روابط URL دورا هامًّا في العثور على مواقع الويب؛ لذا من المهم تحسينها لمحركات البحث Search Engine Optimization. سنرى في هذا الدرس طريقةً لجعل روابط مشروع larashop محسّنة للمحركات. رأينا في الدرس السابق كيف تعمل المسارات والمتحكمات، سنبني على هذه المعرفة التي اكتسبناها من أجل الوصول إلى الهدف المحدّد.

هذا الدرس جزء من سلسلة تعلم Laravel والتي تنتهج مبدأ "أفضل وسيلة للتعلم هي الممارسة"، حيث ستكون ممارستنا عبارة عن إنشاء تطبيق ويب للتسوق مع ميزة سلة المشتريات. يتكون فهرس السلسلة من التالي:

• مدخل إلى Laravel 5.
• تثبيت Laravel وإعداده على كلّ من Windows وUbuntu.
• أساسيات بناء تطبيق باستخدام Laravel.
• إنشاء روابط محسنة لمحركات البحث (SEO) في إطار عمل Laravel. (هذا الدرس)
• نظام Blade للقوالب.
• تهجير قواعد البيانات في Laravel.
• استخدام Eloquent ORM لإدخال البيانات في قاعدة البيانات، تحديثها أو حذفها.
• إنشاء سلة مشتريات في Laravel.
• الاستيثاق في Laravel.
• إنشاء واجهة لبرمجة التطبيقات API في Laravel.
• إنشاء مدوّنة باستخدام Laravel.
• استخدام AngularJS واجهةً أمامية Front end لتطبيق Laravel.
• الدوّال المساعدة المخصّصة في Laravel.
• استخدام مكتبة Faker في تطبيق Laravel لتوليد بيانات وهمية قصدَ الاختبار.

سنغطّي في هذا الدرس موضوعين أساسيّين:

• العوامل المؤثّرة في التحسين لمحركات البحث.
• كيفية إنشاء روابط محسّنة لمحركات البحث في Laravel.

العوامل المؤثرة في التحسين لمحركات البحث

لا نهدف إلى تقديم دليل شامل عن التحسين لمحركات البحث؛ ما نريده هنا هو ذكر بضعة عوامل يجب على المطور أن يكون على اطّلاع عليها. في ما يلي عوامل تؤثر على تقويم محركات البحث مثل Google لصفحات الويب:

• سرعة الموقع: يحب الجميع أن تظهر صفحة الويب التي يزورها بسرعة، فلا أحد يحب الانتظار إلى ما لا نهاية حتى تظهر الصفحة التي يطلبها. من الأحسن ألا يتعدى زمن تنزيل الصفحة ثانيتين وكل ما قلّ كلّ ما كان الأمر أفضل. يجب عليك بوصفك مطوّرا اختبارُ سرعة تطبيقك وإجراء التحسينات اللازمة إن اقتضت الضرورة.
• إحصاءات الشبكات الاجتماعية: من الطبيعي، عند قراءتك شيئا مهمّا، مشاركتُه مع متابعيك وأصدقائك على الشبكات الاجتماعية؛ وهذا دليل على الأهمية بالنسبة لمحركات البحث. دورك كمطور هو توفير الأدوات التي تسهل على الزوار مشاركة محتوى الموقع.
• تصميم تجاوبي Responsive: يمثل مستخدمو الأجهزة المتنقلة جزءًا كبيرًا من مستخدمي خدمات الويب. من هذا المنطلق يجب التأكد من أن موقع الويب يظهر بشكل صحيح على أجهزة الجوّال، الأجهزة اللوحية وأجهزة سطح المكتب؛ إذ أن تجربة المستخدم من العوامل المؤثرة في تقويم محركات البحث.
• الكلمات المفتاحية Keywords: تصنف محركات البحث مليارات صفحات الويب حسب الكلمات الأساسية الواردة فيها. يتمثل دور المطور في التأكد من توفير آليات مثل الوسوم Tags، أوصاف meta، وعناوين HTML يمكن لكاتب المحتوى استخدامها لتمييز المحتوى المفتاحي.
• روابط URL الخاصة بالموقع: يجب أن تظهر الكلمات المفتاحية في روابط الموقع.

كيفية إنشاء روابط محسنة لمحركات البحث في Laravel

عرضنا لأساسيات تحسين محركات البحث مع ذكر دور المطور في تنفيذها. سنبدأ الآن في وضع هذه المبادئ موضع التنفيذ. سننشئ مسارات ونربطها بمت حكم. يُظهر الجدول التالي الروابط التي سيتكون منها متجرنا الإلكتروني.

تعريف مسارات الروابط

سنعرّف مسارا لكل من الروابط الموجودة في الجدول أعلاه، لذا نفتح الملف app/Http/routes.php ونعدّل المحتوى بحيث يصبح التالي:

<?php

/*
|--------------------------------------------------------------------------
| Application Routes
|--------------------------------------------------------------------------
|
| Here is where you can register all of the routes for an application.
| It's a breeze. Simply tell Laravel the URIs it should respond to
| and give it the controller to call when that URI is requested.
|
*/
Route::get('/','Front@index');
Route::get('/products','Front@products');
Route::get('/products/details/{id}','Front@product_details');
Route::get('/products/category','Front@product_categories');
Route::get('/products/brands','Front@product_brands');
Route::get('/blog','Front@blog');
Route::get('/blog/post/{id}','Front@blog_post');
Route::get('/contact-us','Front@contact_us');
Route::get('/login','Front@login');
Route::get('/logout','Front@logout');
Route::get('/cart','Front@cart');
Route::get('/checkout','Front@checkout');
Route::get('/search/{query}','Front@search');

احفظ الملف.

يستدعي كلٌّ مسار دالة المتحكم Front الموافقة له، حسب الجدول أعلاه. بقي الآن إنشاء المتحكم وكتابة الدوال.

نستخدم أداة Artisan لإنشاء شفرة نمطية لمتحكم Laravel. تأكد من وجودك في مجلد المشروع larashop ثم نفذ الأمر التالي:

php artisan make:controller Front

يعني ظهور الرسالة التالية أن الأمر نُفذ كما يجب:

Controller created successfully.

افتح ملف المتحكم Font الذي أنشأناه للتو (app/Http/Controllers/Front.php) وعدّل عليه بحيث يصبح محتواه التالي:

<?php

namespace App\Http\Controllers;

use Illuminate\Http\Request;
use App\Http\Controllers\Controller;

class Front extends Controller {

  public function index() {
    return 'index page';
  }

  public function products() {
    return 'products page';
  }

  public function product_details($id) {
    return 'product details page';
  }

  public function product_categories() {
    return 'product categories page';
  }

  public function product_brands() {
    return 'product brands page';
  }

  public function blog() {
    return 'blog page';
  }

  public function blog_post($id) {
    return 'blog post page';
  }

  public function contact_us() {
    return 'contact us page';
  }

  public function login() {
    return 'login page';
  }

  public function logout() {
    return 'logout page';
  }

  public function cart() {
    return 'cart page';
  }

  public function checkout() {
    return 'checkout page';
  }

  public function search($query) {
    return "$query search page";
  }
}

تعرّف الشفرة أعلاه الدوال التي تجيب على كل طلب يأتي من المسارات التي عرّفناها في ملف routes.php. اكتفينا -لحد الساعة- بجعل كل دالة ترجع اسم المسار الذي تجيب على طلباته.

انتقل الآن للمتصفح وأدخل الرابط التالي في شريط العناوين:

http://larashop.dev/search/boots

ستحصل على صفحة بالمحتوى التالي:

boots search page

جرب الروابط الأخرى أيضا:

http://larashop.dev/
http://larashop.dev/products
http://larashop.dev/products/details/7
http://larashop.dev/products/category
http://larashop.dev/products/brands
http://larashop.dev/blog
http://larashop.dev/blog/post/3
http://larashop.dev/contact-us
http://larashop.dev/login
http://larashop.dev/logout
http://larashop.dev/cart
http://larashop.dev/checkout
http://larashop.dev/search/Keyword

ترجمة -وبتصرّف- لمقال Laravel 5 SEO Friendly URLs لصاحبه Rodrick Kazembe.