آشنایی مقدماتی با HTML
بسیاری از کسانی که تازه وارد دنیای سئو میشوند، وقتی صحبت از کدنویسی و HTML به میان میآید، کمی نگران میشوند. شاید با خودتان فکر کنید: «من که نمیخواهم برنامهنویس شوم، پس چرا باید اینها را یاد بگیرم؟» اما حقیقت این است که یک متخصص سئوی حرفهای، باید بداند زیر پوست یک صفحه وب چه میگذرد. همانطور که یک معمار بدون شناخت مصالح ساختمانی نمیتواند طرحی اصولی بدهد، ما هم بدون درک الفبای وب، نمیتوانیم صفحات را برای گوگل بهینهسازی کنیم.
بیایید با یک مثال ساده شروع کنیم. تصور کنید یک وبسایت مثل یک ساختمان است.
- HTML حکم اسکلتبندی و دیوارهای بتنی را دارد (ساختار و محتوا).
- CSS نقش رنگآمیزی، دکوراسیون و نورپردازی را بازی میکند (ظاهر و دیزاین).
- JavaScript همان سیستمهای هوشمند، آسانسور و دربهای اتوماتیک است (تعامل و پویایی).
در نهایت، هر تکنولوژی پیچیدهای که در پشت صحنه (بکاِند) استفاده شود، خروجی که مرورگر به کاربر نشان میدهد، چیزی جز همین کدهای HTML و CSS نیست.
کالبدشکافی یک صفحه وب: از سر تا پا
وقتی در مرورگر خود روی یک صفحه راستکلیک میکنید و گزینه View Page Source را میزنید، با دنیایی از کدها مواجه میشوید. تمام صفحات استاندارد وب از یک الگوی مشخص پیروی میکنند. این کدها معمولاً به دو بخش اصلی تقسیم میشوند:
۱. بخش Head (مغز متفکر)
این بخش برای کاربر قابل مشاهده نیست، اما حیاتیترین قسمت برای ما سئوکارهاست. هر چیزی که در این بخش نوشته میشود، مستقیماً با رباتهای گوگل و مرورگرها صحبت میکند.
- تایتل و متا دسکریپشن: همان عناوینی که در نتایج گوگل میبینید.
- تگ کنونیکال: که به گوگل میگوید نسخه اصلی محتوا کدام است.
- فایلهای CSS و JS: آدرسهایی که مشخص میکنند استایلها از کجا بارگذاری شوند.
- متا تگ رباتها: که اجازه میدهد صفحه ایندکس شود یا خیر.
۲. بخش Body (آنچه دیده میشود)
هر چیزی که کاربر در صفحه میبیند، از متن و عکس گرفته تا دکمهها و منوها، در این بخش قرار دارد. در نسخه مدرن وب (HTML5)، ما از تگهای «معنایی» استفاده میکنیم. یعنی به جای اینکه همه چیز را در جعبههای بینامونشان بگذاریم، به گوگل میگوییم هر بخش چه هویتی دارد:
- Header: برای لوگو و منوی ناوبری.
- Main: برای بدنه اصلی و محتوای منحصربهفرد صفحه.
- Footer: برای اطلاعات تماس و لینکهای تکراری انتهای صفحه.
چیدمان و زیبایی؛ وقتی CSS وارد میشود
اگر HTML محتوا را میسازد، CSS به آن جان میدهد. ما در سئو با مفاهیمی مثل کلاس (Class) و آیدی (ID) زیاد سر و کار داریم. تصور کنید میخواهید تمام تیترهای سایتتان آبی باشند. به جای اینکه تکتک آنها را رنگ کنید، یک «کلاس» تعریف میکنید و استایل آبی را به آن میدهید. این کار باعث میشود کدهای سایت سبکتر شوند و سرعت لود (که برای سئو بسیار مهم است) افزایش یابد.
یکی از وظایف مهم CSS، مدیریت ریسپانسیو (واکنشگرا) بودن سایت است. با استفاده از کدهایی به نام Media Queries، سایت متوجه میشود که کاربر با موبایل آمده یا دسکتاپ، و چیدمان را بر همان اساس تغییر میدهد تا تجربه کاربری (UX) آسیب نبیند.
تعامل و جادو با جاوا اسکریپت
جاوا اسکریپت (JS) مسئول حرکات پیچیده است. اسلایدرها، منوهای بازشو، یا انیمیشنهایی که با اسکرول کردن ظاهر میشوند، همگی فرزندان JS هستند. با این حال، ما در سئو باید مراقب باشیم؛ استفاده بیش از حد و نادرست از جاوا اسکریپت میتواند سرعت سایت را کند کرده و خواندن محتوا را برای رباتهای گوگل دشوار کند.
اسکیما (Schema)؛ زبان مشترک با گوگل
در نهایت، به مفهومی میرسیم که این روزها در سئو غوغا میکند: دادههای ساختاریافته یا اسکیما. گوگل چطور میفهمد که یک عدد در صفحه، قیمت محصول است یا تاریخ انتشار مقاله؟ چطور متوجه میشود که ستارههای امتیازدهی را در نتایج جستجو نشان دهد؟ پاسخ «اسکیما» است. اسکیما یک شناسنامه نامرئی برای محتوای شماست. با اضافه کردن این کدها (که معمولاً به فرمت JSON-LD هستند)، شما به گوگل کمک میکنید تا ماهیت دقیق محتوا (محصول، دستور پخت غذا، رویداد، ویدیو و…) را درک کند و نمایش شما را در نتایج جستجو جذابتر (Rich Snippets) کند.
آیا باید کدنویس شویم؟
هدف ما از شناخت HTML و مفاهیم فنی، این نیست که از صفر یک سایت را کدنویسی کنیم. هدف این است که وقتی وارد پنل مدیریت سایت یا کدها میشویم، نترسیم. بدانیم تگ <h1> کجاست، چطور یک لینک را Nofollow کنیم، یا چطور یک قطعه کد اسکیما را در جای درست قرار دهیم.
امروزه با کمک ابزارهای هوش مصنوعی، نوشتن یا اصلاح این کدها بسیار ساده شده است؛ اما شما به عنوان متخصص، باید «منطق» پشت آنها را درک کنید تا بتوانید دستورات درستی بدهید. پیشنهاد میکنم حتماً با ابزار Inspect مرورگر خود تمرین کنید و سعی کنید در سایتهای مختلف، اجزای ساخته شده با HTML و CSS را شناسایی کنید.
به یاد داشته باشید، سئو فقط نوشتن محتوا نیست؛ سئو هنر بهینهسازی پیوند میان محتوا، ساختار و کدهایی است که این محتوا را به دنیا عرضه میکنند.