شاهد ما يراه الباحثون أولاً
انظر إلى سطور العنوان والوصف التي يمكن أن تصبح معاينة للبحث.
تُرى في علامات تبويب المتصفح، ونتائج جوجل، والإشارات المرجعية، والروابط المشتركة، ومعاينات الصفحات.
تعلم أساسيات HTML<\/title><br><meta name="description" content="دروس HTML للمبتدئين مع أمثلة."></div>
<div class="roy_lesson_includes"><b>يشمل:</b><ul><li>علامة العنوان</li><li>علامة الوصف</li><li>علامة تبويب المتصفح</li><li>معاينة البحث</li><li>قرار النقر</li></ul></div>
<div class="roy_lesson_links"><a href="lectures/titles_and_descriptions.lecture.1.php">محاضرة</a></div>
</article>
<article id="headings.lecture" class="roy_lesson_card roy_card_has_lecture" tabindex="0" role="link">
<h3>اقرأ الصفحة كملخص</h3>
<p>استخدم العناوين H1 و H2 حتى يكون للصفحة هيكل واضح.</p>
<div class="roy_lesson_seen">تُرى في الدروس، والمقالات، وصفحات الخدمات، وصفحات المنتجات، والوثائق.</div>
<div class="roy_lesson_code"><h1>تعلم HTML<\/h1><br><h2>النماذج<\/h2><br><h2>الجداول<\/h2></div>
<div class="roy_lesson_includes"><b>يشمل:</b><ul><li>H1</li><li>H2</li><li>ملخص</li><li>أقسام</li><li>قابلية المسح</li></ul></div>
<div class="roy_lesson_links"><a href="lectures/headings.lecture.php">محاضرة</a></div>
</article>
<article id="internal_links.lecture" class="roy_lesson_card roy_card_has_lecture" tabindex="0" role="link">
<h3>وجه الزوار إلى الصفحة المفيدة التالية</h3>
<p>استخدم روابط داخلية واضحة حتى لا تكون الصفحات ذات الصلة مخفية.</p>
<div class="roy_lesson_seen">تُرى في المدونات، والمتاجر، ومواقع الدورات، ومراكز المساعدة، والقوائم، والصفحات ذات الصلة.</div>
<div class="roy_lesson_code"><a href="\/products.php"><br> المنتجات<br><\/a></div>
<div class="roy_lesson_includes"><b>يشمل:</b><ul><li>علامة الربط</li><li>href</li><li>نص الرابط</li><li>الصفحات ذات الصلة</li><li>الروابط المعطلة</li></ul></div>
<div class="roy_lesson_links"><a href="lectures/internal_links.lecture.php">محاضرة</a></div>
</article>
<article id="canonical_pages.lecture" class="roy_lesson_card roy_card_has_lecture" tabindex="0" role="link">
<h3>حدد النسخة الرئيسية من الصفحة</h3>
<p>استخدم الروابط القانونية حتى تشير عناوين URL المكررة إلى صفحة مفضلة واحدة.</p>
<div class="roy_lesson_seen">تُرى في المتاجر، والمدونات، والصفحات المترجمة، والصفحات المفلترة، وعناوين URL التتبع، والصفحات المكررة.</div>
<div class="roy_lesson_code"><link rel="canonical"<br> href="https:\/\/example.com\/page.php"></div>
<div class="roy_lesson_includes"><b>يشمل:</b><ul><li>أساسي</li><li>عنوان URL المفضل</li><li>التكرارات</li><li>عناوين URL التتبع</li><li>وضوح البحث</li></ul></div>
<div class="roy_lesson_links"><a href="lectures/canonical_pages.lecture.php">محاضرة</a></div>
</article>
<article id="schema_basics.lecture" class="roy_lesson_card roy_card_has_lecture" tabindex="0" role="link">
<h3>أظهر للآلات ما تدور حوله الصفحة</h3>
<p>استخدم بيانات منظمة بسيطة حتى يكون للمحتوى معنى يمكن قراءته آلياً.</p>
<div class="roy_lesson_seen">تُرى في المقالات، والمنتجات، والمراجعات، والوصفات، والأحداث، والأسئلة الشائعة، والنتائج الغنية.</div>
<div class="roy_lesson_code">{<br> "@type":"Article",<br> "headline":"تعلم HTML"<br>}</div>
<div class="roy_lesson_includes"><b>يشمل:</b><ul><li>المخطط</li><li>JSON-LD</li><li>type</li><li>العنوان الرئيسي</li><li>البيانات المنظمة</li></ul></div>
<div class="roy_lesson_links"><a href="lectures/schema_basics.lecture.php">محاضرة</a></div>
</article>
<article id="content_matching.lecture" class="roy_lesson_card roy_card_has_lecture" tabindex="0" role="link">
<h3>اجعل الصفحة تتطابق مع البحث</h3>
<p>قارن عبارة البحث بمحتوى الصفحة وتحقق مما إذا كانت تتطابق فعلاً.</p>
<div class="roy_lesson_seen">تُرى في صفحات الهبوط، والمقالات، وصفحات المنتجات، وصفحات الخدمات، وملخصات الذكاء الاصطناعي.</div>
<div class="roy_lesson_code">بحث: شراء أحذية<br>صفحة: أحذية جري زرقاء للبيع</div>
<div class="roy_lesson_includes"><b>يشمل:</b><ul><li>نية البحث</li><li>سؤال</li><li>إجابة</li><li>تناسب المحتوى</li><li>حاجة الزائر</li></ul></div>
<div class="roy_lesson_links"><a href="lectures/content_matching.lecture.php">محاضرة</a></div>
</article>
<article id="local_seo.lecture" class="roy_lesson_card roy_card_has_lecture" tabindex="0" role="link">
<h3>عرض العمل المحلي بوضوح</h3>
<p>تحقق من الاسم، المدينة، العنوان، الهاتف، وتفاصيل الثقة المحلية.</p>
<div class="roy_lesson_seen">يُرى في الخرائط، البحث المحلي، الأعمال الخدمية، المطاعم، العيادات، والمتاجر.</div>
<div class="roy_lesson_code">ABC Plumbing<br>كالجاري AB<br>403-555-1234</div>
<div class="roy_lesson_includes"><b>يشمل:</b><ul><li>اسم العمل</li><li>المدينة</li><li>الهاتف</li><li>العنوان</li><li>الثقة المحلية</li></ul></div>
<div class="roy_lesson_links"><a href="lectures/local_seo.lecture.php">محاضرة</a></div>
</article>
<article id="speed_and_core_web_vitals.lecture" class="roy_lesson_card roy_card_has_lecture" tabindex="0" role="link">
<h3>اقرأ إشارات السرعة الأساسية</h3>
<p>انظر إلى أرقام Core Web Vitals وافهم ما يبدو صحيًا.</p>
<div class="roy_lesson_seen">يُرى في التصفح عبر الجوال، صفحات المنتجات، صفحات الهبوط، المتاجر، والمواقع ذات الحركة العالية.</div>
<div class="roy_lesson_code">LCP 1.8s<br>CLS 0.02<br>INP 120ms</div>
<div class="roy_lesson_includes"><b>يشمل:</b><ul><li>LCP</li><li>CLS</li><li>INP</li><li>الصور</li><li>سرعة التحميل</li></ul></div>
<div class="roy_lesson_links"><a href="lectures/speed_and_core_web_vitals.lecture.php">محاضرة</a></div>
</article>
<article id="ai_search_readiness.lecture" class="roy_lesson_card roy_card_has_lecture" tabindex="0" role="link">
<h3>اكتب محتوى سؤال وإجابة واضح</h3>
<p>هيكل المحتوى بحيث يمكن للأشخاص، ومحركات البحث، وأنظمة الذكاء الاصطناعي فهم الإجابة.</p>
<div class="roy_lesson_seen">يُرى في ملخصات الذكاء الاصطناعي، مقالات المساعدة، الوثائق، الدروس، الأسئلة الشائعة، وصفحات المعرفة.</div>
<div class="roy_lesson_code">سؤال: ما هو HTML؟<br>إجابة: HTML هي لغة هيكل صفحات الويب.</div>
<div class="roy_lesson_includes"><b>يشمل:</b><ul><li>الأسئلة</li><li>إجابات</li><li>الوضوح</li><li>هيكل</li><li>ملخصات الذكاء الاصطناعي</li></ul></div>
<div class="roy_lesson_links"><a href="lectures/ai_search_readiness.lecture.php">محاضرة</a></div>
</article>
<article id="seo_audits.lecture" class="roy_lesson_card roy_card_has_lecture" tabindex="0" role="link">
<h3>استخدم قائمة تحقق بدلاً من التخمين</h3>
<p>راجع العناوين، العناوين الرئيسية، الروابط، الأوصاف، السرعة، والأساسيات المفقودة.</p>
<div class="roy_lesson_seen">يُرى قبل الإطلاق، إعادة التصميم، الهجرات، تسليم العملاء، مراجعات SEO، ومشاكل الحركة.</div>
<div class="roy_lesson_code">✓ العنوان موجود<br>✓ H1 موجود<br>✗ الوصف مفقود</div>
<div class="roy_lesson_includes"><b>يشمل:</b><ul><li>قائمة تدقيق المراجعة</li><li>عنوان</li><li>H1</li><li>وصف</li><li>خطة الإصلاح</li></ul></div>
<div class="roy_lesson_links"><a href="lectures/seo_audits.lecture.php">محاضرة</a></div>
</article>
</div>
</div>
</section>
<section class="roy_section">
<div class="roy_wrap">
<div class="roy_final">
<h2>نحن نعرض كيفية إظهار مهارات تحسين محركات البحث الجاهزة للعمل:</h2>
<p>الهدف بسيط: استخدام الذكاء الاصطناعي بشكل أسرع، ولكن فهم ما يكفي للبقاء في السيطرة.</p>
<div class="roy_cta_row" style="justify-content:center;">
<a class="roy_button roy_button_ghost" href="#primer">راجع المقدمة</a>
<a class="roy_button roy_button_primary" href="#lessons">ابدأ الدروس</a>
</div>
</div>
</div>
</section>
</main>
<script>
/* MARKER: make-card-the-lecture-link
Old course.dom.php files may contain separate Lecture and Worksheet buttons.
This keeps those files usable, but makes the card itself open the lecture.
*/
function make_roy_cards_use_lecture_link()
{
var cards = document.querySelectorAll( ".roy_lesson_card" );
cards.forEach( function( card ){
var lecture_link = card.querySelector( ".roy_lesson_links a[href*='lecture'], .roy_lesson_links a:first-child" );
if ( ! lecture_link )
{
return;
}
var lecture_href = lecture_link.getAttribute( "href" );
if ( ! lecture_href )
{
return;
}
card.classList.add( "roy_card_has_lecture" );
card.setAttribute( "tabindex", "0" );
card.setAttribute( "role", "link" );
card.setAttribute( "aria-label", "Open lecture: " + ( card.querySelector( "h3" ) ? card.querySelector( "h3" ).textContent : "lesson" ) );
card.addEventListener( "click", function( event ){
var clicked_link = event.target.closest( "a" );
if ( clicked_link )
{
event.preventDefault();
}
window.location.href = lecture_href;
});
card.addEventListener( "keydown", function( event ){
if ( event.key === "Enter" || event.key === " " )
{
event.preventDefault();
window.location.href = lecture_href;
}
});
});
}
document.addEventListener( "DOMContentLoaded", make_roy_cards_use_lecture_link );
function toggle_roy_panel( panel_id, clicked_button )
{
var selected_panel = document.getElementById( panel_id );
var panels = document.querySelectorAll( ".roy_panel" );
var buttons = document.querySelectorAll( ".roy_tab" );
if ( ! selected_panel )
{
return;
}
if ( selected_panel.classList.contains( "is_open" ) )
{
selected_panel.classList.remove( "is_open" );
if ( clicked_button )
{
clicked_button.setAttribute( "aria-expanded", "false" );
}
return;
}
panels.forEach( function( panel ){
panel.classList.remove( "is_open" );
});
buttons.forEach( function( button ){
button.setAttribute( "aria-expanded", "false" );
});
selected_panel.classList.add( "is_open" );
if ( clicked_button )
{
clicked_button.setAttribute( "aria-expanded", "true" );
}
}
</script>
<hr class="rule">
<div class="support-line">
moc.rt-tij [ta] troppus
<div style="unicode-bidi: revert; font-weight: normal; font-size: smaller">
(التخصيص متاح)
</div>
</div>
<p class="footer-note">
<em>© 2026 - <a href="https://jit4all.com" target="_blank">https://jit4all.com</a> - تم بناؤه وترجمته بالتعاون مع ChatGPT، مدعوم بنماذج OpenAI.</em><br><br>
<em>التكامل بواسطة متصفح ترجمة فورية بديل في <a href="https://jit-browser.com" target="_blank">https://jit-browser.com</a><br>تطور من <a href="https://jit-tr.com" target="_blank">https://jit-tr.com</a><br>جزء من إنترنت الترجمة البديلة <a href="https://jit4.com" target="_blank">https://jit4.com</a></em><br><br>تقنية قيد الحصول على براءة اختراع.<br><br>
<em>الأعلام من الخدمة المجانية على https://flagpedia.net<br>
الخرائط © مساهمو OpenStreetMap (https://www.openstreetmap.org)<br>
تم العرض باستخدام Leaflet (https://leafletjs.com)</em><br><br>
</p>
<button id="to-top" aria-label="Back to top" title="Back to top" style="position: fixed; right: 18px; bottom: 18px; z-index: 9999; display: grid; place-items: center; width: 64px; height: 64px; border: 0px; border-radius: 999px; cursor: pointer; opacity: 1; pointer-events: auto; transform: translateY(0px); transition: opacity 0.2s, transform 0.2s, box-shadow 0.16s;" onclick="(function(){
var prefersReduced = window.matchMedia && window.matchMedia('(prefers-reduced-motion: reduce)').matches;
if (prefersReduced) { window.scrollTo(0,0); return; }
window.scrollTo({ top:0, behavior:'smooth' });
})()">
<svg viewBox="0 0 24 24" width="26" height="26" aria-hidden="true" style="display:block; fill:#fff">
<path d="M12 4l7 7h-4v9H9v-9H5l7-7z"></path>
</svg>
</button>
<style>
.support-line {
margin: 0 auto 3rem auto;
font-size: x-large;
font-weight: bold;
unicode-bidi: bidi-override;
direction: rtl;
text-align: center;
}
.footer-note {
margin: 18px 0 0 0;
text-align: center;
font-size: small;
opacity: 0.90;
}
.rule {
height: 9px;
background: var( --accent );
margin: 18px 0;
border: 0;
}
#to-top {
--pulse-period: 2s;
scale: 1;
animation: toTopHeartbeat var(--pulse-period) ease-in-out infinite;
background: radial-gradient(130% 130% at 28% 28%, rgba(255,255,255,.18) 0%, rgba(255,255,255,0) 62%), linear-gradient(180deg, rgba(255,255,255,.22) 0%, rgba(255,255,255,0) 38%), radial-gradient(140% 140% at 70% 85%, rgba(0,0,0,.12) 0%, rgba(0,0,0,0) 70%), linear-gradient(90deg, var(--cta, #FF7A00), color-mix(in oklab, var(--cta, #FF7A00) 65%, var(--brand, #0B5F82)));
box-shadow: inset 0 0 0 8px var(--paper, #fff), inset 0 2px 4px rgba(255,255,255,.30), inset 0 -4px 8px rgba(0,0,0,.25), 0 18px 44px rgba(0,0,0,.20);
}</style>
</body></html>
</main>
<script>
/* MARKER: make-card-the-lecture-link
Old course.dom.php files may contain separate Lecture and Worksheet buttons.
This keeps those files usable, but makes the card itself open the lecture.
*/
function make_roy_cards_use_lecture_link()
{
var cards = document.querySelectorAll( ".roy_lesson_card" );
cards.forEach( function( card ){
var lecture_link = card.querySelector( ".roy_lesson_links a[href*='lecture'], .roy_lesson_links a:first-child" );
if ( ! lecture_link )
{
return;
}
var lecture_href = lecture_link.getAttribute( "href" );
if ( ! lecture_href )
{
return;
}
card.classList.add( "roy_card_has_lecture" );
card.setAttribute( "tabindex", "0" );
card.setAttribute( "role", "link" );
card.setAttribute( "aria-label", "Open lecture: " + ( card.querySelector( "h3" ) ? card.querySelector( "h3" ).textContent : "lesson" ) );
card.addEventListener( "click", function( event ){
var clicked_link = event.target.closest( "a" );
if ( clicked_link )
{
event.preventDefault();
}
window.location.href = lecture_href;
});
card.addEventListener( "keydown", function( event ){
if ( event.key === "Enter" || event.key === " " )
{
event.preventDefault();
window.location.href = lecture_href;
}
});
});
}
document.addEventListener( "DOMContentLoaded", make_roy_cards_use_lecture_link );
function toggle_roy_panel( panel_id, clicked_button )
{
var selected_panel = document.getElementById( panel_id );
var panels = document.querySelectorAll( ".roy_panel" );
var buttons = document.querySelectorAll( ".roy_tab" );
if ( ! selected_panel )
{
return;
}
if ( selected_panel.classList.contains( "is_open" ) )
{
selected_panel.classList.remove( "is_open" );
if ( clicked_button )
{
clicked_button.setAttribute( "aria-expanded", "false" );
}
return;
}
panels.forEach( function( panel ){
panel.classList.remove( "is_open" );
});
buttons.forEach( function( button ){
button.setAttribute( "aria-expanded", "false" );
});
selected_panel.classList.add( "is_open" );
if ( clicked_button )
{
clicked_button.setAttribute( "aria-expanded", "true" );
}
}
</script>
<hr class="rule">
<div class="support-line">
moc.rt-tij [ta] troppus
<div style="unicode-bidi: revert; font-weight: normal; font-size: smaller">
(customization available)
</div>
</div>
<p class="footer-note">
<em>© 2026 - <a href="https://jit4all.com" target="_blank">https://jit4all.com</a> - Co-built and translated with ChatGPT, powered by OpenAI models.</em><br><br>
<em>Integration by an alternate instant-translation browser at <a href="https://jit-browser.com" target="_blank">https://jit-browser.com</a><br>Evolved from <a href="https://jit-tr.com" target="_blank">https://jit-tr.com</a><br>Part of an alternate-translation internet a <a href="https://jit4.com" target="_blank">https://jit4.com</a></em><br><br>Patent pending technology.<br><br>
<em>Flags from the free service at https://flagpedia.net<br>
Maps © OpenStreetMap contributors (https://www.openstreetmap.org)<br>
Rendered with Leaflet (https://leafletjs.com)</em><br><br>
</p>
<button id="to-top" aria-label="Back to top" title="Back to top" style="position: fixed; right: 18px; bottom: 18px; z-index: 9999; display: grid; place-items: center; width: 64px; height: 64px; border: 0px; border-radius: 999px; cursor: pointer; opacity: 1; pointer-events: auto; transform: translateY(0px); transition: opacity 0.2s, transform 0.2s, box-shadow 0.16s;" onclick="(function(){
var prefersReduced = window.matchMedia && window.matchMedia('(prefers-reduced-motion: reduce)').matches;
if (prefersReduced) { window.scrollTo(0,0); return; }
window.scrollTo({ top:0, behavior:'smooth' });
})()">
<svg viewBox="0 0 24 24" width="26" height="26" aria-hidden="true" style="display:block; fill:#fff">
<path d="M12 4l7 7h-4v9H9v-9H5l7-7z"></path>
</svg>
</button>
<style>
.support-line {
margin: 0 auto 3rem auto;
font-size: x-large;
font-weight: bold;
unicode-bidi: bidi-override;
direction: rtl;
text-align: center;
}
.footer-note {
margin: 18px 0 0 0;
text-align: center;
font-size: small;
opacity: 0.90;
}
.rule {
height: 9px;
background: var( --accent );
margin: 18px 0;
border: 0;
}
#to-top {
--pulse-period: 2s;
scale: 1;
animation: toTopHeartbeat var(--pulse-period) ease-in-out infinite;
background: radial-gradient(130% 130% at 28% 28%, rgba(255,255,255,.18) 0%, rgba(255,255,255,0) 62%), linear-gradient(180deg, rgba(255,255,255,.22) 0%, rgba(255,255,255,0) 38%), radial-gradient(140% 140% at 70% 85%, rgba(0,0,0,.12) 0%, rgba(0,0,0,0) 70%), linear-gradient(90deg, var(--cta, #FF7A00), color-mix(in oklab, var(--cta, #FF7A00) 65%, var(--brand, #0B5F82)));
box-shadow: inset 0 0 0 8px var(--paper, #fff), inset 0 2px 4px rgba(255,255,255,.30), inset 0 -4px 8px rgba(0,0,0,.25), 0 18px 44px rgba(0,0,0,.20);
}</style>
</body>
</html>
<style>
.roy_cs_backdrop
{
position: fixed;
inset: 0;
z-index: 999999;
display: none;
align-items: center;
justify-content: center;
padding: 24px;
background: rgba( 0, 0, 0, 0.66 );
}
.roy_cs_backdrop.is_open
{
display: flex;
}
.roy_cs_modal
{
width: min( 92vw, 540px );
padding: 34px;
border-radius: 26px;
background: #fdfbf5;
color: #221e18;
text-align: center;
box-shadow: 0 30px 90px rgba( 0, 0, 0, 0.42 );
border: 1px solid rgba( 255, 255, 255, 0.55 );
font-family: Arial, Helvetica, sans-serif;
}
.roy_cs_modal h2
{
margin: 0 0 14px 0;
font-family: Georgia, "Times New Roman", serif;
font-size: clamp( 2rem, 5vw, 3rem );
line-height: 1.05;
}
.roy_cs_modal p
{
margin: 0 0 26px 0;
font-size: 1.12rem;
line-height: 1.55;
}
.roy_cs_modal button
{
border: 0;
border-radius: 999px;
padding: 13px 30px;
background: #c2502f;
color: #ffffff;
font-weight: 900;
cursor: pointer;
font-size: 1rem;
}
.roy_cs_modal button:hover
{
background: #9c3b1f;
}
</style>
<div id="roy_cs_backdrop" class="roy_cs_backdrop" onclick="royCloseComingSoon(event);">
<div class="roy_cs_modal" role="dialog" aria-modal="true" aria-labelledby="roy_cs_title" onclick="event.stopPropagation();">
<h2 id="roy_cs_title">قريباً</h2>
<p>يتم إعداد هذا الدرس بلغتك.</p>
<button type="button" onclick="royCloseComingSoon(event);">
OK </button>
</div>
</div>
<script>
function royComingSoon( e )
{
if ( e )
{
e.preventDefault();
}
var modal = document.getElementById( "roy_cs_backdrop" );
if ( modal )
{
modal.classList.add( "is_open" );
}
return false;
}
function royCloseComingSoon( e )
{
if ( e )
{
e.preventDefault();
}
var modal = document.getElementById( "roy_cs_backdrop" );
if ( modal )
{
modal.classList.remove( "is_open" );
}
return false;
}
document.addEventListener( "keydown", function( e )
{
if ( e.key === "Escape" )
{
royCloseComingSoon( e );
}
});
document.addEventListener("click", function(e)
{
var card = e.target.closest(".roy_lesson_card");
if (card && card.closest("#lessons"))
{
var lecture = card.querySelector(".roy_lesson_links a");
/*
NON-EN copied pages:
Only .lecture.1.php is available.
Any other lecture link shows Coming Soon.
*/
if (
lecture &&
document.body.classList.contains("la_non_en") &&
lecture.getAttribute("href").indexOf(".lecture.1.php") === -1
)
{
e.stopPropagation();
e.preventDefault();
royComingSoon(e);
return false;
}
/*
Existing rule:
Any lecture link with c=1 still shows Coming Soon.
Keep this.
*/
lecture = card.querySelector(".roy_lesson_links a[href*='c=1']");
if (lecture)
{
e.stopPropagation();
e.preventDefault();
royComingSoon(e);
return false;
}
}
}, true);
</script>
<!-- <
link rel="stylesheet" href="_smart_search/indexer.css">
<script src="_smart_search/indexer.js"></script>
-->
</body>
</html>
