صور على صفحات الويب. الرسومات على صفحة الويب في HTML

لإدراج الصورة في نص صفحة الويب، استخدم علامة واحدة (الجدول. ص 1). يتم تعيين سمات هذه العلامة جميع معلمات الصورة المنشورة على الصفحة. إلزامي هو سمة SRC التي تحدد عنوان واسم ملف الرسوم. إذا لم يتم تثبيت سمة SRC، فسيتم عرض أيقونة صورة فارغة فقط.

هيكل العلامة سمة SRC هي:

.

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

.

تنسيق اسم الملف

لاستيعاب ملف رسومي مع اسم Minsk، على العنوان D: \\ Collection \\ City \\ Minsk.gif، يجب عليك تسجيل .

باستخدام العلامة تستضيف صفحة الويب ملف رسومي يقع على كمبيوتر آخر في الإنترنت العالمي "الإنترنت".

لإنشاء صفحة ويب مع صورة لمعهدنا، والتي تظهر في الشكل. 4.1، تحتاج إلى إدخال رمز HTML التالي:

معهدنا

تين. 4.1. صفحة الويب مع معهد الصور

في المثال أعلاه، فإن ارتفاع الصورة (الارتفاع) هو 200 بكسل، والعرض (العرض) هو 300 بكسل. لاستيعاب الصورة، يتم إنشاء فقرة بمحاذاة في المركز.

الخطوط الأفقية

يتم إجراء الإقامة على صفحة الويب الأفقية باستخدام علامة واحدة

---

وبعد يتم تغيير استخدام حجم الصفات والعرض واللون ومحاذاة، سمك، عرض، لون وطريقة محاذاة الخطوط وفقا لذلك.

النظر في بعض الأمثلة على شرح وضع خطوط مظلة Gori:

1.

---

- الخط الأفقي للصفحة بأكملها بسماكة 2 بكسل.

2.

---

العرض \u003d "200" محاذاة \u003d "اليمين"\u003e - خط أفقي من اللون الأخضر 15 بكسل، عرض 200 بكسل وترك الحافة اليمنى.

3.

---

- الخط الأزرق الأفقي على الصفحة بأكملها بسماكة 25 بكسل.

4.

---

العرض \u003d "300" محاذاة \u003d "اليسار"\u003e - خط أفقي من اللون الأحمر 20 بكسل سميكة، 300 بكسل عرض ومحاذاة على طول الحافة اليسرى.

يتم عرض خطوط عرض أربعة أمثلة مسجلة في الشكل. 4.2.

تين. 4.2. خطوط على صفحة الويب

الجداول

إنشاء الجداول

يتم إنشاء جدول باستخدام علامة الزوج

… وبعد تقوم هذه العلامة بإنشاء جدول في المكان الذي تتم إضافته
في كود HTML.

أي جدول يتكون من خطوط، والخطوط من الخلايا. بالنسبة إلى صفوف التزاوج والخلايا الخلايا، يتم استخدام العلامات التالية:

... - خط جديد؛

... - رأس الخلية؛

... - خلية الجدول الطبيعي.

يتم تسجيل هذه العلامات داخل علامة الزوج

… .

يحدث تكوين الجدول على الصفوف - محدد سطر واحد ويتم تحديد العدد المطلوب من الخلايا فيه، ثم السطر الثاني، إلخ.

من أجل الحصول على جدول على صفحة الويب المعروضة في الشكل. 5.1، تحتاج إلى طلب رمز HTML التالي:

تين. 5.1. الصفحة مع الجدول

يتم عرض النص الموجود في خلايا رأس الجدول (الشكل 5.1) بواسطة خط نصف جريئة مع محاذاة في وسط الخلية، وفي الخلايا التقليدية لا يتم تمييز النص ومحاذاة الحافة اليسرى.

تجدر الإشارة إلى أنه في كود HTML العلامة أعلاه

سيارات	سعر	معقل	5000	جولف	6000

يحتوي على سمة الحدود مع القيمة "1". هذا يعني أنه في الجدول المعروض في الشكل. 5.1، سمك الحدود الخارجية يساوي
1 بكسل. إذا قمت بتسجيل

… ,

سماكة الحدود الخارجية ستكون تساوي 6 بكسل. لم يتم عرض حدود الطاولة، فإن سمة الحدود ضرورية لتعيين قيمة تساوي 0، أو ببساطة حذف هذه السمة.

مرحبا عزيزي القراء بلوق! في هذه المقالة سوف تتعلم كل شيء عن كيفية إدراج صورة على صفحة HTMLوبعد هل لديك العديد من الصور التي تريد وضعها في صفحتك أو هل ترغب في وضع شعار على موقع الويب الخاص بك؟ كل هذا سهل. بعد قراءة هذه المقالة، يمكنك إدراج صور على صفحات HTML دون أي صعوبات. للقيام بذلك، دعونا نتحدث بالتفصيل img tag. وسماتها، والنظر لفترة وجيزة في تنسيقات ملفات الرسومات، مثل GIF و JPEG و PNG، بالإضافة إلى نرى الميزات الجديدة ل HTML5، والتي تبسط إدراج إدخال الفيديو والصوت إلى الموقع.

نظرا لحقيقة أنه لا يمكن دمج بيانات الرسومات ونص HTML في ملف واحد، يتم استخدام نهج آخر لعرضها على الموقع، بدلا من صفحات HTML الأخرى. بادئ ذي بدء، يتم تخزين صور الرسوم البيانية وبيانات الوسائط المتعددة الأخرى في ملفات منفصلة. ولتنفيذها، يتم استخدام علامات خاصة في صفحة الويب التي تحتوي على روابط لهذه الملفات الفردية. على وجه الخصوص، العلامة هي img tag.وبعد بعد أن قابلت هذه العلامة مع العنوان، يطلب المتصفح أولا الطلب المناسب بالملف المناسب بالصورة أو الصوت أو الفيديو، ثم يعرضه فقط على صفحة الويب.

يتم استدعاء جميع الصور الجرافيكية بشكل عام أي بيانات مخزنة في الملفات الفردية من صفحة الويب منفذ عناصر الصفحة.

قبل إدراج الصور والنظر في علامة "IMG" بالتفصيل، فإن الأمر يستحق التعلم القليل عن تنسيقات الرسومات.

تنسيقات الصور الجرافيك.

هناك العديد من تنسيقات الرسومات المختلفة، ولكن المتصفحات تدعم عدد قليل فقط. النظر في ثلاثة منهم.

1. تنسيق JPEG(مجموعة خبراء التصوير الفوتوغرافي المشترك). تنسيق شعبي جدا يستخدم لتخزين الصور. يدعم لون 24 بت ويحتفظ بجميع النصف في الصور دون تغيير. لكن JPEG لا يدعم الشفافية وتشويه التفاصيل والنص الصغيرة في الصور. يستخدم JPEG بشكل أساسي لتخزين الصور. تحتوي ملفات التنسيق هذا على ملحقات JPG و JPE و JPEG.

2. شكل gif.(تنسيق تبادل الرسومات.). الميزة الرئيسية لهذا التنسيق هي القدرة على تخزين العديد من الصور في ملف واحد في وقت واحد. هذا يسمح لك بإنشاء بكرات متحركة كاملة. ثانيا، فإنه يدعم الشفافية. العيب الرئيسي هو الدعم ل 256 لون فقط، وهو غير مناسب لتخزين الصور. يستخدم GIF بشكل أساسي لتخزين الشعارات واللافتات والصور ذات المواقع الشفافة وتحتوي على نص. تحتوي ملفات التنسيق على ملحق GIF.

3. تنسيق PNG(رسومات الشبكة المحمولة.). تم تطوير هذا التنسيق على أنه استبدال GIF القديم، وكذلك إلى حد ما، JPEG. يدعم الشفافية، ولكن لا يسمح بإنشاء الرسوم المتحركة. هذا التنسيق لديه امتداد PNG.

عند إنشاء المواقع عادة ما تستخدم الصور في تنسيق JPEG أو GIF، ولكن في بعض الأحيان استخدم PNG. الشيء الرئيسي لفهم في الحالات ما هو الشكل الأفضل للاستخدام. إذا لفترة وجيزة، ثم:

أفضل استخدام JPEG لتخزين الصور أو الصور النصفية التي لا تحتوي على نص؛

• يستخدم gif أساسا للرسوم المتحركة.
• PNG هو شكل لبقية (الرموز والأزرار، إلخ).

إدخال الصور في صفحات HTML

فكيف لا تزال تدرج الصورة على صفحة الويب؟ أدخل الصورة يسمح واحد img tag.وبعد يضع المتصفح الصورة في مكان صفحة الويب حيث يلتقي IMG.

إدراج صور رمز في HTML الصفحة لديها هذا النوع:

سيضع رمز HTML هذا الصورة المخزنة في ملف Image.jpg على صفحة الويب، والتي هي في نفس المجلد باستخدام صفحة ويب. كيف يمكن أن تلاحظ عنوان الصورة المشار إليه في سمة SRC.وبعد ما قلته بالفعل. لذلك، فإن سمة SRC هي سمة إلزامية تعمل على تحديد عنوان الملف مع الصورة. بدون سمة من SRC، لا معنى علامة IMG.

سأقدم بعض الأمثلة الأخرى لتحديد عنوان صورة الملف:

سيتم إدراج رمز HTML هذا صورة مع اسم Image.jpg إلى الصفحة، والذي يتم تخزينه في مجلد الصور الموجود في جذر الموقع الإلكتروني.

في سمة SRC، يمكنك تحديد الروابط النسبية فقط إلى الصور. نظرا لأن الصور يتم تخزينها على الشبكة مع صفحات HTML، لذلك يحتوي كل ملف مع الصورة عن عنوان URL الخاص به. لذلك، سمة SRC يمكنك إدراج عنوان URL للصورة. على سبيل المثال:

سيقوم هذا الرمز بإدخال الصورة من MySite.ru إلى الصفحة. عادة ما يتم تطبيق URL ADPEC إذا حددت صورة على موقع آخر. بالنسبة للصور المخزنة على موقعك، فمن الأفضل استخدام الروابط النسبية.

علامة IMG هي عنصر أقل من الأحرف، لذلك من الأفضل وضعه داخل عنصر الكتلة، على سبيل المثال، داخل علامة "P" - الفقرة:

دعنا نمارس وأدخل الصورة إلى صفحتنا من المقالات السابقة على صورة HTML. سأقوم بإنشاء مجلد HTML لصفح صفحتك "الصور" ووضع الملف باستخدام الصورة "bmw.jpg"، والتي تبدو وكأنها:

ثم ستكون صفحة HTML الخاصة بالصفحة مع الصورة المدرجة مثل هذا:

ونحن ننظر إلى نتيجة العرض في المتصفح:

كما نرى شيئا معقدا في وضع الصور على صفحات الويب. بعد ذلك، فكر في العديد من السمات المهمة الأخرى لعلامة "IMG".

سمة alt - كخيار الغيار

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

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

ويبدو أن هذا:

اضبط حجم الصورة

لا يزال هناك بضع سمات علامة IMG التي يجب أن تعرفها. هذا هو زوج من السمات العرض و ارتفاعوبعد يمكنك استخدامها لتحديد أبعاد الصور:

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

في هذا حول إدراج الصور على الصفحات، كل شيء، ثم ضع في كيفية إدراج الصوت أو الفيديو إلى الموقع ...

إدراج الفيديو والصوت مع HTML 5

في مواصفات HTML5 الجديدة، ظهرت العديد من العلامات الجديدة التي يمكنك بسهولة إدخال ملفات الوسائط المتعددة بسهولة. هذا يتعلق في المقام الأول الفيديو والصوت.

لإدراج صوتي HTML5 يوفر علامة الزوج صوتي.وبعد يتم الإشارة إلى عنوان الملف الذي يتم فيه تخزين حلقة الصوت، من قبل سمة SRC مألوفة بالفعل لنا:

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

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

التعريف 1.

صفحة الويب هي ملف نصي تم إنشاؤه في HTML ويقع في World Wide Web (www). قد تحتوي صفحة الويب باستثناء النص على روابط تشعبية يمكنك الانتقال إلى صفحات الويب الأخرى وعرضها، بالإضافة إلى إدراجات في شكل رسومات ورسوم متحركة ومقاطع فيديو وموسيقى.

باستخدام لغة HTML، يمكنك:

1. إنشاء وتحرير صفحات الويب.
2. تحرير مستندات تنسيق HTML من الإنترنت، مع مراعاة أداء جميع الكائنات المنفذة في المستند (الصور، الرسوم المتحركة، إلخ).
3. باستخدام روابط النص التشعبي والقدرة على تقديم رسومات تنسيق التنسيق المستند المستند، الرسوم البيانية، الرسوم المتحركة، مقاطع الفيديو، مرافقة الموسيقى والكلام، مؤثرات خاصة النص، إنشاء عروض تقديمية متعددة الوسائط، شرائح، مشاريع العرضية.

ملاحظة 1.

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

إضافة الصور إلى صفحة ويب

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

إضافة صورة إلى الصفحة يمكن أن تستخدم علامة مصدر للصورة تبدو:

حيث - العلامة نفسها، و SCR هي سمة له. نظرا لأن سمة SCR إلزامية، فيمكن القول أن كل هذا الإدخال هو علامة شائعة واحدة. في علامة المصدر، لا يتم استخدام الحفل الإغلاق المقابل، نظرا لأن علامة المصدر كافية ذاتيا، وبالتالي عند استخدامها، من الضروري إضافة خط مائل إغلاق في النهاية :.

إضافة نقوش بديلة

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

يوجد أدناه رمز NTML الذي تتم إضافة سمة ALT داخل العلامة. هذه السمة مشابهة لسمة SRC بإعلام المستعرض للحصول على بعض المعلومات الإضافية حول الصورة ويمكن أيضا استخدامها مع TEG.

alt \u003d "(! Lang: إنها صورة!" />!}

تعمل وظيفة السمة ALT لتحديد العنصر الرسمي للنص البدائل المضافة إلى صفحة الويب. يسمى البديل لأنه يتم عرضه على الشاشة كبديل للصورة نفسها. إن سمة Alt تؤدي ميزة مهمة أخرى. يتيح مصمم الويب أن يكون متأكدا من أنه إذا كان زائر الصفحة لا يرى الصورة على شاشته، فإنه على الأقل يتمكن على الأقل من التعرف على المعلومات النصية المضافة إلى هذه الصورة.

عند استخدام سمة ALT لكل علامة، من المهم أن تكون منتبهة بعدم تعيين الرسائل النصية في العناصر الرسومية. على سبيل المثال، لا معنى له في إضافة نقوش نصية بديلة إلى عناصر مظهر الصفحة. لتجنب مثل هذه الأخطاء، يمكنك تعيين سمة قيمة فارغة لهذه العناصر (ALT \u003d "). إذا لم تقم بتحديد القيم إلى السمات الأخرى، فسيقوم المستعرض بإعادة إنتاج الصورة في الحجم الأصلي، أثناء قيام الخطوط العليا بالصورة باستخدام الحافة العلوية لسلسلة من السلسلة النصية. ومع ذلك، يمكنك تغيير كل من هذه المعلمات باستخدام علامات النمط.

سمات الصورة

يتم سمات العلامة التي تتيح لك تغيير حجم الصور. هنا بعض منهم:

• الارتفاع - مع ذلك، يتم تحديده من ارتفاع الصورة في بكسل أو النسب المئوية؛
• عرض - استخدامه عرض الصورة في البكسل أو النسب النسب المئوية.

ضبط ارتفاع وعرض الصورة

يمكن تعيين أبعاد الصور المنشورة على صفحات الويب باستخدام السمات المذكورة أعلاه. علاوة على ذلك، يتم تحديد قيمها إما كرقم ثابت من البكسل، أو كنسبة مئوية بالنسبة لحجم الصفحة. في كود HTML أدناه، تحتوي العلامة الأولى على أحجام الصورة الأصلية في البكسل (60 بكسل عموديا و 60 بكسل أفقيا)، عرض العلامة الثانية من نفس مجموعات الصور تساوي 6٪ من عرض الصفحة، و الارتفاع هو 10٪ بالنسبة لارتفاع الصفحة.

alt \u003d "هذه صورة!" الوزن \u003d "60" العرض \u003d "60" /\u003e

alt \u003d "هذه صورة!" الارتفاع \u003d "10٪" العرض \u003d "6٪" /\u003e

ملاحظة 2.

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

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

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

التسوية النص والرسومات

لمحاذاة الصورة على اليمين (يمين) أو اليسار (يسار)، تستخدم حافة سلسلة النص سمة علامة المحاذاة. على سبيل المثال:

alt \u003d "هذه صورة!" الوزن \u003d "60" العرض \u003d "60" محاذاة \u003d "اليمين" /\u003e

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

باستخدام الصور كمراجع

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

المنمنمات من الصور

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

alt \u003d "انقر لرؤية الصورة العادية."

الوزن \u003d "60" العرض \u003d "60" /\u003e

أسرار الاستخدام الناجح للصور

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

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

ملاحظة 3.

يعتمد الحجم الكلي لملف مستند HTML بأكمله، مما بدوره، ليس فقط على حجم الصور الموجودة فيه، ولكن أيضا على كميةها. يجب أن تكون منتبها عند استخدام سمة Alt بحيث يتوافق محتوى الرسائل النصية دائما مع الصورة نفسها. وفي الحالة المعاكسة: من الضروري التأكد من أن الصورة تتوافق مع المعلومات النصية المقدمة على الصفحة.

عند استخدام الصور المستعار إليها على الإنترنت، في الصفحة التي يتم إنشاؤها، يجب عليك التحقق مما إذا كانت هذه الصور محمية بحقوق النشر.

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

بمساعدة علامات HTML

إدراج الصور في مستند HTML

1. العلامة

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

أو