تكنولوجيا

تصميم صفحة ويب بلغة html جاهزة

منى فكريمنى فكري
منذ 6 شهور
تصميم صفحة ويب بلغة html جاهزة

ربما يبدأ البعض أو تخطر بعقولهم فكرة إنشاء صفحة أو تصميم صفحة ويب بلغة html ، ولكن الأمر ليس بهذه السهولة، لكي تتمكن من إكمال مهام تصميم الصفحة، يتطلب ذلك أن تكون على دراية كاملة باللغة الخاصة لتصميم الصفحة، وهناك بعض الخطوات التي يجب أن تقوم بها لكي تصل إلى التصميم المطلوب وسنعرف أكثر عنه في المقال، والأشياء التي يجب أن تتعلمها قبل أن تخوض تجربة إنشاء صفحة.

ما يجب أن تتعلمه قبل إنشاء الصفحة

قبل تصميم صفحة ويب بلغة html جاهزة بالنسبة للمبتدئين، يعد الإلمام بكل محتويات الويندوز أمرًا مهمًا للغاية، لأن المعرفة العملية بـ ويندوز تجعل من السهل تعلم استخدام لغة HTML وJavaScript، لهذا السبب يجب أن تكون على دراية بما يلي:

  • تعرف على كيفية عمل مجلد، والتخزين الخاص به وكيفية استخدام المستعرض ومستكشف ويندوز والمعرفة الأساسية ببرنامج الوورد.
  • تأكد من أنك تعرف كيفية القيام بما يلي:
  • إن تنشئ مستند على القرص الصلب الخاص بك.
  • إنشاء مجلد داخل مجلد آخر.
  • كيفية نسخ جزءًا من مستند وضعه في مستند آخر.
    • تحتاج إلى التدرب على استخدام وظائف القص والنسخ واللصق في برامج Word العادية، بمجرد الانتهاء، يمكنك تعلم HTML وJavaScript.

    إذا وجدت صعوبة في تنفيذ هذه المهام، فاستغرق بضع ساعات لتعلم أساسيات ويندوز أو اطلب من صديق أو زميل على جهاز الكمبيوتر لمساعدتك في تعلم كيفية استخدام Windows Explorer.

    ماهي لغة HTML

    • هي لغة برمجة، أو HTML باختصار، هي اللغة المسؤولة عن تصميم صفحة ويب بلغة html جاهزة على سبيل المثال، يمكنك تحديد العناوين والفقرات والنصوص والصور في الويب بتنسيق HTML وسنعرض أكثر عن هذه اللغة ووظائفها في إنشاء المواقع، حيث أنه يمكننا إنشاء مواقع ويب معقدة للغاية باستخدام HTML وعدة لغات أخرى فقط ومع ذلك، ستكون هذه المواقع ثابتة، مما يعني أن زوار الموقع يمكنهم تصفح الصفحات، لكن لا يمكنهم أن يضيفوا أي تفاعل معها (ما لم ينقروا على الروابط الموجودة على الصفحات).
    • لكن لبرمجة موقع إلكتروني متاح ويمكن التفاعل معه، سنحتاج إلى لغات برمجة أخرى، مثل JavaScript أو Dart باستخدامهم.
    • يمكننا تطوير العديد من التطبيقات كاملة عبر الإنترنت، على سبيل المثال، التطبيقات المهتمة بتنفيذ حسابات متنوعة وتطبيقات ألعاب وتطبيقات دردشة وما إلى ذلك، ويمكن تشغيل هذه التطبيقات بالفعل في متصفحك.
    • هناك لغات وتقنيات برمجية أخرى، مثل PHP وRuby و NET، والتي تتيح لك  إنشاء تطبيقات ويب يمكن التفاعل معها، ولكن هذه التطبيقات تعمل داخل موفر مستضاف (على الخادم).

    ما تحتاجه لإنشاء صفحة ويب

    نحتاج إلى شيئين في منتهي الأهمية وذلك من أجل الدخول إلى عالم برمجة وإنشاء صفح الويب، وكل هذا من أجل تصميم صفحة ويب بلغة html جاهزة، حيث تحتاج إلى:

    المحرر

    • يُستخدم فقط في محرر نص عادي (مثل Notepad في ويندوز) لكن من الأفضل استخدام محرر متميز، مما يجعل عملنا أسهل بكثير للقيام بذلك.
    • أوصي باستخدام محرر نصوص حديث مخصص لتحرير HTMLK ومحرر الوسائط، ومحرر النصوص الذي أوصي به حاليًا هو Brackets (متاح مجانًا من Adobe).
    • لكن يمكنك استخدام أي محرر تريده، يوجد  محرر نصوص عالي الجودة يمكنك استخدامه، وهو Atom، ومحرر نصوص آخر، على الرغم من أنه قديم بعض الشيء، إلا أنه عبارة عن مفكرة جيدة ++.

    المتصفح

    • يجب أن يكون موقعنا الإلكتروني متاحًا في جميع المتصفحات الرئيسية ومع ذلك، أوصي باستخدام متصفح Chrome للتطوير والبرمجة، حيث أنه يوفر Chrome أدوات مفيدة جدًا لمطوري الويب، والتي يتم استخدامها بشكل متكرر، محرر الأقواس متوافق مع Chrome، لذلك سيتم عرض التغييرات على النص مباشرة في Chrome (من خلال الميزة التي تسمى “Live Reload”).

    خطوات تصميم صفحة ويب

    لنبدأ الآن تصميم صفحة ويب بلغة html جاهزة لموقع الويب كل ما عليك أن تقوم بالخطوات الخاصة بإنشاء الموقع وهي كالتالي:

    • قم بإنشاء مجلد للمشروع، ولا بد أن تقوم بتسمية مجلد الحافظة.
    • قم بفتح برنامج الدعم.
    • من القائمة الخاصة بكلمة “ملف”، حدد الأمر فتح مجلد لتحديد وفتح المجلد الذي تم عمله للتو.
    • انقر بزر الماوس الأيمن على اسم المجلد وحدد “ملف جديد” لإنشاء ملف جديد، وقم بتسميته html.
    • لديك الآن ملف نصي فارغ يسمى html.

    لماذا يسمى بـ index.html

    • في الواقع ملف html له معنى خاص في عملية تصميم صفحة ويب لذلك عندما نطلب من المتصفح عنوان موقع الويب (مثل http://code.makery.ch)، سيظهر ملف index.html تلقائيًا أولاً، وستزداد بهذه الطريقة عملية ظهوره، كما لو كان علينا ذلك أدخل العنوان http://code.makery.ch/index.html. بالنسبة لنا، سيكون index.html هو الصفحة الرئيسية.

    السمات الخاصة بلغة Html

    معلومات تخص لغة Html

    تعتبر هذه اللغة هي اللغة المستخدمة في تصميم صفحة ويب بلغة html جاهزة، ومن المعلومات الخاصة بها أو السمات والتي يجب أن تكون على دراية بها ومعرفة عن ماذا تعبر:

    • إذا وضعت دائمًا على السطر الأول فإنه يخبر المتصفح بنوع المستند.
    • كما أنه يشير إلى بداية المستند ويشير إلى نهاية المستند.
    • يدل العنصر (بين علامتي الفتح والإغلاق) على وجود معلومات أخرى حول الصفحة.
    • بعد ذلك، نرى ، التي تحتوي وتعبر على عنوان المستند الذي سيتم عرضه في شريط العنوان في نافذة المتصفح.</li> <li>سيحدث عملية ظهور للمحتوى الموجود أسفل علامة <body> في نافذة المتصفح الرئيسية.</li> <li>يحدد العنصر <h1> العنوان الرئيسي الذي سيتم عرضه للمستخدم على صفحة الويب، يمكنك  استخدام عناصر أخرى لإنشاء توقيع.</li> <li>يعتبر النص بين علامتي <p> و <p /> فقرة منفصلة تمثل عنصر <p>.</li> </ul> <p>يرشح لك موقع الماقه التعرف على خطوات عمل بحث جامعي قصير بالمراجع: كيفية عمل البحث الجامعي بالمراجع وقصير بالخطوات <p>وأخيرا بإمكانك الآن تصميم الصفحة التي تريدها بعد معرفتك أغلب ما يخص لغة HTML التي تستخدم في تصميم صفحة ويب بلغة html جاهزة. </div> <div class="container container-bn container-bn-ds bn-p-b"> <div class="row"> <div class="bn-content"> <div class="bn-inner bn-ds-3"> <script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-3876100803664677" crossorigin="anonymous"></script> <!-- Elmaqah-Bottom --> <ins class="adsbygoogle" style="display:block" data-ad-client="ca-pub-3876100803664677" data-ad-slot="1503848117" data-ad-format="auto" data-full-width-responsive="true"></ins> <script> (adsbygoogle = window.adsbygoogle || []).push({}); </script> </div> </div> </div> </div> <div class="container container-bn container-bn-mb bn-p-b"> <div class="row"> <div class="bn-content"> <div class="bn-inner bn-mb-3"> <script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-3876100803664677" crossorigin="anonymous"></script> <!-- Elmaqah-Bottom --> <ins class="adsbygoogle" style="display:block" data-ad-client="ca-pub-3876100803664677" data-ad-slot="1503848117" data-ad-format="auto" data-full-width-responsive="true"></ins> <script> (adsbygoogle = window.adsbygoogle || []).push({}); </script> </div> </div> </div> </div> <br> <div class="d-flex post-share-buttons mb-4"> <div class="btn-share"> <span class="title" style="margin-left: 20px;font-size: 15px;font-weight: 500;margin-top: 7px;">شارك</span> </div> <div class="btn-share"> <a href="https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Felmaqah.net%2F8299" target="_blank" rel="noopener noreferrer" class="color-facebook" aria-label="Share on Facebook"> <i class="icon-facebook"></i> </a> </div> <div class="btn-share"> <a href="https://twitter.com/share?url=https%3A%2F%2Felmaqah.net%2F8299&text=%D8%AA%D8%B5%D9%85%D9%8A%D9%85+%D8%B5%D9%81%D8%AD%D8%A9+%D9%88%D9%8A%D8%A8+%D8%A8%D9%84%D8%BA%D8%A9+html+%D8%AC%D8%A7%D9%87%D8%B2%D8%A9" target="_blank" rel="noopener noreferrer" class="color-twitter" aria-label="Share on Twitter"> <i class="icon-twitter"></i> </a> </div> <div class="btn-share"> <a href="http://www.linkedin.com/shareArticle?mini=true&url=https%3A%2F%2Felmaqah.net%2F8299" target="_blank" rel="noopener noreferrer" class="color-linkedin" aria-label="Share on LinkedIn"> <i class="icon-linkedin"></i> </a> </div> <div class="btn-share"> <a href="http://pinterest.com/pin/create/button/?url=https%3A%2F%2Felmaqah.net%2F8299&media=https://elmaqah.net/uploads/images/202501/image_870x_6775bbcbb4cae.webp" target="_blank" rel="noopener noreferrer" class="color-pinterest" aria-label="Share on Pinterest"> <i class="icon-pinterest"></i> </a> </div> <div class="btn-share ms-auto"> </div> </div> <div class="post-next-prev mt-5 "> <div class="row"> <div class="col-sm-6 col-xs-12 left"> <div class="head-title text-end"> <a href="https://elmaqah.net/8298"> <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-arrow-left" viewBox="0 0 16 16"> <path fill-rule="evenodd" d="M15 8a.5.5 0 0 0-.5-.5H2.707l3.147-3.146a.5.5 0 1 0-.708-.708l-4 4a.5.5 0 0 0 0 .708l4 4a.5.5 0 0 0 .708-.708L2.707 8.5H14.5A.5.5 0 0 0 15 8z"/> </svg> السابق </a> </div> <h3 class="title text-end"> <a href="https://elmaqah.net/8298">برنامج زيادة متابعين انستجرام</a> </h3> </div> <div class="col-sm-6 col-xs-12 right"> <div class="head-title text-start"> <a href="https://elmaqah.net/8300"> التالي <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-arrow-right" viewBox="0 0 16 16"> <path fill-rule="evenodd" d="M1 8a.5.5 0 0 1 .5-.5h11.793l-3.147-3.146a.5.5 0 0 1 .708-.708l4 4a.5.5 0 0 1 0 .708l-4 4a.5.5 0 0 1-.708-.708L13.293 8.5H1.5A.5.5 0 0 1 1 8z"/> </svg> </a> </div> <h3 class="title text-start"> <a href="https://elmaqah.net/8300">اسماء جروبات للاصدقاء مزخرفة</a> </h3> </div> </div> </div> <div style="border-top: 1px solid #f0f0f0; margin-top: 10px; margin-bottom: 10px;"></div> <section class="section section-related-posts mt-5 "> <div class="row"> <div class="col-12"> <div class="section-title"> <div class="d-flex justify-content-between align-items-center"> <h3 class="title">قد يهمك أيضا</h3> </div> </div> <div class="section-content"> <div class="row"> <div class="col-sm-12 col-md-6 col-lg-4"> <div class="post-item"> <div class="image ratio"> <a href="https://elmaqah.net/17522"> <img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAcIAAAEYAQMAAAD1c2RPAAAAA1BMVEUAAACnej3aAAAAAXRSTlMAQObYZgAAACVJREFUaN7twQEBAAAAgqD+r26IwAAAAAAAAAAAAAAAAAAAACDoP3AAASZRMyIAAAAASUVORK5CYII=" data-src="https://elmaqah.net/uploads/images/202502/image_430x256_67a7f52f14bdc.webp" alt="عروض stc للأجهزة الذكية" class="img-fluid lazyload" width="269" height="160"/> </a> </div> <h3 class="title fsize-16"><a href="https://elmaqah.net/17522">عروض stc للأجهزة الذكية</a></h3> <p class="small-post-meta"></p> </div> </div> <div class="col-sm-12 col-md-6 col-lg-4"> <div class="post-item"> <div class="image ratio"> <a href="https://elmaqah.net/17508"> <img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAcIAAAEYAQMAAAD1c2RPAAAAA1BMVEUAAACnej3aAAAAAXRSTlMAQObYZgAAACVJREFUaN7twQEBAAAAgqD+r26IwAAAAAAAAAAAAAAAAAAAACDoP3AAASZRMyIAAAAASUVORK5CYII=" data-src="https://elmaqah.net/uploads/images/202502/image_430x256_67a7d37100599.webp" alt="كيف ارسل خاص في تويتر للمتابعين وغير المتابعين" class="img-fluid lazyload" width="269" height="160"/> </a> </div> <h3 class="title fsize-16"><a href="https://elmaqah.net/17508">كيف ارسل خاص في تويتر للمتابعين وغير المتابعين</a></h3> <p class="small-post-meta"></p> </div> </div> <div class="col-sm-12 col-md-6 col-lg-4"> <div class="post-item"> <div class="image ratio"> <a href="https://elmaqah.net/17507"> <img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAcIAAAEYAQMAAAD1c2RPAAAAA1BMVEUAAACnej3aAAAAAXRSTlMAQObYZgAAACVJREFUaN7twQEBAAAAgqD+r26IwAAAAAAAAAAAAAAAAAAAACDoP3AAASZRMyIAAAAASUVORK5CYII=" data-src="https://elmaqah.net/uploads/images/202502/image_430x256_67a7d37019ae8.webp" alt="كيفية استرجاع الرسائل المحذوفة من الماسنجر" class="img-fluid lazyload" width="269" height="160"/> </a> </div> <h3 class="title fsize-16"><a href="https://elmaqah.net/17507">كيفية استرجاع الرسائل المحذوفة من الماسنجر</a></h3> <p class="small-post-meta"></p> </div> </div> <div class="col-sm-12 col-md-6 col-lg-4"> <div class="post-item"> <div class="image ratio"> <a href="https://elmaqah.net/17506"> <img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAcIAAAEYAQMAAAD1c2RPAAAAA1BMVEUAAACnej3aAAAAAXRSTlMAQObYZgAAACVJREFUaN7twQEBAAAAgqD+r26IwAAAAAAAAAAAAAAAAAAAACDoP3AAASZRMyIAAAAASUVORK5CYII=" data-src="https://elmaqah.net/uploads/images/202502/image_430x256_67a7d36f4a1e8.webp" alt="أفضل 8 فيسات الواتس اب ومعانيها" class="img-fluid lazyload" width="269" height="160"/> </a> </div> <h3 class="title fsize-16"><a href="https://elmaqah.net/17506">أفضل 8 فيسات الواتس اب ومعانيها</a></h3> <p class="small-post-meta"></p> </div> </div> <div class="col-sm-12 col-md-6 col-lg-4"> <div class="post-item"> <div class="image ratio"> <a href="https://elmaqah.net/17504"> <img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAcIAAAEYAQMAAAD1c2RPAAAAA1BMVEUAAACnej3aAAAAAXRSTlMAQObYZgAAACVJREFUaN7twQEBAAAAgqD+r26IwAAAAAAAAAAAAAAAAAAAACDoP3AAASZRMyIAAAAASUVORK5CYII=" data-src="https://elmaqah.net/uploads/images/202502/image_430x256_67a7d36db8009.webp" alt="كيف أشتري من أمازون عبر الإنترنت؟" class="img-fluid lazyload" width="269" height="160"/> </a> </div> <h3 class="title fsize-16"><a href="https://elmaqah.net/17504">كيف أشتري من أمازون عبر الإنترنت؟</a></h3> <p class="small-post-meta"></p> </div> </div> <div class="col-sm-12 col-md-6 col-lg-4"> <div class="post-item"> <div class="image ratio"> <a href="https://elmaqah.net/17505"> <img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAcIAAAEYAQMAAAD1c2RPAAAAA1BMVEUAAACnej3aAAAAAXRSTlMAQObYZgAAACVJREFUaN7twQEBAAAAgqD+r26IwAAAAAAAAAAAAAAAAAAAACDoP3AAASZRMyIAAAAASUVORK5CYII=" data-src="https://elmaqah.net/uploads/images/202502/image_430x256_67a7d36e7bd42.webp" alt="برامج تصميم خرائط" class="img-fluid lazyload" width="269" height="160"/> </a> </div> <h3 class="title fsize-16"><a href="https://elmaqah.net/17505">برامج تصميم خرائط</a></h3> <p class="small-post-meta"></p> </div> </div> </div> </div> </div> </div> </section> </div> </div> <div class="col-md-12 col-lg-4 "> <div class="col-sidebar sticky-lg-top"> <div class="row"> <div class="col-12"> <div class="sidebar-widget"> <div class="widget-head"><h4 class="title">أخر الأخبار</h4></div> <div class="widget-body"> <div class="row"> <div class="col-12"> <div class="tbl-container post-item-small"> <div class="tbl-cell left"> <div class="image"> <a href="https://elmaqah.net/17824"> <img src="data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==" data-src="https://elmaqah.net/uploads/images/202502/image_140x98_67b8830b3fa7a.webp" alt="طرق إزالة الشعر من الوجه" class="img-fluid lazyload" width="130" height="91"/> </a> </div> </div> <div class="tbl-cell right"> <h3 class="title"><a href="https://elmaqah.net/17824">طرق إزالة الشعر من الوجه</a></h3> <p class="small-post-meta"></p> </div> </div> </div> <div class="col-12"> <div class="tbl-container post-item-small"> <div class="tbl-cell left"> <div class="image"> <a href="https://elmaqah.net/17821"> <img src="data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==" data-src="https://elmaqah.net/uploads/images/202502/image_140x98_67b883083c24a.webp" alt="هل الكابتشينو يزيد الوزن" class="img-fluid lazyload" width="130" height="91"/> </a> </div> </div> <div class="tbl-cell right"> <h3 class="title"><a href="https://elmaqah.net/17821">هل الكابتشينو يزيد الوزن</a></h3> <p class="small-post-meta"></p> </div> </div> </div> <div class="col-12"> <div class="tbl-container post-item-small"> <div class="tbl-cell left"> <div class="image"> <a href="https://elmaqah.net/17818"> <img src="data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==" data-src="https://elmaqah.net/uploads/images/202502/image_140x98_67b88305409a4.webp" alt="ألوان موضة صيف 2024" class="img-fluid lazyload" width="130" height="91"/> </a> </div> </div> <div class="tbl-cell right"> <h3 class="title"><a href="https://elmaqah.net/17818">ألوان موضة صيف 2024</a></h3> <p class="small-post-meta"></p> </div> </div> </div> <div class="col-12"> <div class="tbl-container post-item-small"> <div class="tbl-cell left"> <div class="image"> <a href="https://elmaqah.net/17815"> <img src="data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==" data-src="https://elmaqah.net/uploads/images/202502/image_140x98_67b883021b0c3.webp" alt="هل خل التفاح يفتح لون البشرة" class="img-fluid lazyload" width="130" height="91"/> </a> </div> </div> <div class="tbl-cell right"> <h3 class="title"><a href="https://elmaqah.net/17815">هل خل التفاح يفتح لون البشرة</a></h3> <p class="small-post-meta"></p> </div> </div> </div> <div class="col-12"> <div class="tbl-container post-item-small post-item-no-image"> <div class="tbl-cell right"> <h3 class="title"><a href="https://elmaqah.net/17812">فوائد زبدة الفول السوداني لزيادة الوزن</a></h3> <p class="small-post-meta"></p> </div> </div> </div> <div class="col-12"> <div class="tbl-container post-item-small"> <div class="tbl-cell left"> <div class="image"> <a href="https://elmaqah.net/17809"> <img src="data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==" data-src="https://elmaqah.net/uploads/images/202502/image_140x98_67b882fd183a4.webp" alt="أفضل كريم لتفتيح البشرة الدهنية" class="img-fluid lazyload" width="130" height="91"/> </a> </div> </div> <div class="tbl-cell right"> <h3 class="title"><a href="https://elmaqah.net/17809">أفضل كريم لتفتيح البشرة الدهنية</a></h3> <p class="small-post-meta"></p> </div> </div> </div> <div class="col-12"> <div class="tbl-container post-item-small"> <div class="tbl-cell left"> <div class="image"> <a href="https://elmaqah.net/17806"> <img src="data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==" data-src="https://elmaqah.net/uploads/images/202502/image_140x98_67b882fa198a9.webp" alt="تجربتي مع إنزيم q10 للتنحيف" class="img-fluid lazyload" width="130" height="91"/> </a> </div> </div> <div class="tbl-cell right"> <h3 class="title"><a href="https://elmaqah.net/17806">تجربتي مع إنزيم q10 للتنحيف</a></h3> <p class="small-post-meta"></p> </div> </div> </div> <div class="col-12"> <div class="tbl-container post-item-small"> <div class="tbl-cell left"> <div class="image"> <a href="https://elmaqah.net/17803"> <img src="data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==" data-src="https://elmaqah.net/uploads/images/202502/image_140x98_67b882f729c87.webp" alt="أسباب تساقط الشعر في سن المراهقة" class="img-fluid lazyload" width="130" height="91"/> </a> </div> </div> <div class="tbl-cell right"> <h3 class="title"><a href="https://elmaqah.net/17803">أسباب تساقط الشعر في سن المراهقة</a></h3> <p class="small-post-meta"></p> </div> </div> </div> <div class="col-12"> <div class="tbl-container post-item-small"> <div class="tbl-cell left"> <div class="image"> <a href="https://elmaqah.net/17800"> <img src="data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==" data-src="https://elmaqah.net/uploads/images/202502/image_140x98_67b882f4543dd.webp" alt="فوائد شرب الكمون للكرش" class="img-fluid lazyload" width="130" height="91"/> </a> </div> </div> <div class="tbl-cell right"> <h3 class="title"><a href="https://elmaqah.net/17800">فوائد شرب الكمون للكرش</a></h3> <p class="small-post-meta"></p> </div> </div> </div> <div class="col-12"> <div class="tbl-container post-item-small"> <div class="tbl-cell left"> <div class="image"> <a href="https://elmaqah.net/17797"> <img src="data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==" data-src="https://elmaqah.net/uploads/images/202502/image_140x98_67b882f1110b2.webp" alt="أسباب تصبغات الجلد البنية" class="img-fluid lazyload" width="130" height="91"/> </a> </div> </div> <div class="tbl-cell right"> <h3 class="title"><a href="https://elmaqah.net/17797">أسباب تصبغات الجلد البنية</a></h3> <p class="small-post-meta"></p> </div> </div> </div> </div> </div> </div> </div> </div> </div> </div> </div> </div> </section> <style> .post-text img { display: none !important; } .post-content .post-summary { display: none; } </style> <script type="application/ld+json"> { "@context": "https://schema.org", "@type": "NewsArticle", "mainEntityOfPage": { "@type": "WebPage", "@id": "https://elmaqah.net/8299" }, "headline": "تصميم صفحة ويب بلغة html جاهزة", "name": "تصميم صفحة ويب بلغة html جاهزة", "articleSection": "تكنولوجيا", "image": { "@type": "ImageObject", "url": "https://elmaqah.net/uploads/images/202501/image_870x580_6775bbcb9201f.webp", "width": 750, "height": 500 }, "datePublished": "2025-01-01T23:03:55+0200", "dateModified": "2025-01-01T23:03:55+0200", "inLanguage": "ar-EG", "keywords": "تصميم, صفحة, ويب, بلغة, html, جاهزة", "author": { "@type": "Person", "name": "منى فكري", "url": "https://elmaqah.net/profile/mona" }, "publisher": { "@type": "Organization", "name": "الماقه", "logo": { "@type": "ImageObject", "width": 190, "height": 60, "url": "https://elmaqah.net/uploads/logo/logo_66c9e09176bd43-83972193.png" } }, "description": "ربما يبدأ البعض أو تخطر بعقولهم فكرة إنشاء صفحة أو تصميم صفحة ويب بلغة html ، ولكن الأمر ليس بهذه السهولة، لكي تتمكن من إكمال مهام تصميم الصفحة، يتطلب ذلك أن تكون على دراية كاملة باللغة الخاصة لتصميم الصفحة، وهناك بعض الخطوات التي يجب أن تقوم بها لكي تصل إلى التصميم المطلوب وسنعرف أكثر عنه …" } </script> <footer id="footer"> <div class="footer-inner"> <div class="container-xl"> <div class="row justify-content-between"> <div class="col-sm-12 col-md-6 col-lg-4 footer-widget footer-widget-about"> <div class="footer-logo"> <img src="https://elmaqah.net/uploads/logo/logo_66c9e1ad06aee8-24734278.png" alt="logo" class="logo" width="240" height="90"> </div> <div class="footer-about"> موقع الماقه نيوز لمتابعة كل اخبار الوطن العربي في مختلف المجالات السياسية والرياضية والاقتصادية، وباقة اخبار المنوعات والفن والعالم العربي </div> </div> <div class="col-sm-12 col-md-6 col-lg-4 footer-widget"> <h4 class="widget-title">قد يهمك أيضا</h4> <div class="footer-posts"> </div> </div> <div class="col-sm-12 col-md-6 col-lg-4 footer-widget"> <h4 class="widget-title">النشرة الإخبارية</h4> <div class="newsletter"> <p class="description">انضم إلى قائمة المشتركين لدينا للحصول على آخر الأخبار والمستجدات مباشرة في البريد الالكتروني الخاص بك</p> <form id="form_newsletter_footer" class="form-newsletter"> <div class="newsletter-inputs"> <input type="email" name="email" class="form-control form-input newsletter-input" maxlength="199" placeholder="بريد إلكتروني"> <button type="submit" name="submit" value="form" class="btn btn-custom newsletter-button">اشترك</button> </div> <input type="text" name="url"> <div id="form_newsletter_response"></div> </form> </div> <div class="footer-social-links"> <ul> </ul> </div> </div> </div> </div> </div> <div class="footer-copyright"> <div class="container-xl"> <div class="row align-items-center"> <div class="col-sm-12 col-md-6"> <div class="copyright text-start"> جميع الحقوق محفوظة لموقعنا الماقه elmaqah.net </div> </div> <div class="col-sm-12 col-md-6"> <div class="nav-footer text-end"> <ul> <li><a href="https://elmaqah.net/privacy-policy">سياسة الخصوصية </a></li> <li><a href="https://elmaqah.net/contact">اتصل بنا </a></li> <li><a href="https://elmaqah.net/about">من نحن </a></li> </ul> </div> </div> </div> </div> </div> </footer> <a href="#" class="scrollup"><i class="icon-arrow-up"></i></a> <!-- <div class="fixed-bottom-ad"> <div id='div-gpt-ad-1719143535736-0' style='min-width: 320px; min-height: 100px;'> <script> googletag.cmd.push(function() { googletag.display('div-gpt-ad-1719143535736-0'); }); </script> </div> </div> --> <script src="https://elmaqah.net/assets/themes/magazine/js/jquery-3.6.1.min.js "></script> <script src="https://elmaqah.net/assets/vendor/bootstrap/js/bootstrap.bundle.min.js "></script> <script src="https://elmaqah.net/assets/themes/magazine/js/plugins.js "></script> <script src="https://elmaqah.net/assets/themes/magazine/js/main-2.2.min.js "></script> <script>$("form[method='post']").append("<input type='hidden' name='sys_lang_id' value='2'>");</script> <script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-3876100803664677" crossorigin="anonymous"></script><!-- Google tag (gtag.js) --> <script async src="https://www.googletagmanager.com/gtag/js?id=G-CWC79D9J6H"></script> <script> window.dataLayer = window.dataLayer || []; function gtag(){dataLayer.push(arguments);} gtag('js', new Date()); gtag('config', 'G-CWC79D9J6H'); </script> </body> </html>