كيف تكتب و تنسق مساهماتك فى المنتدى (الدرس السادس والسابع)

[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذا الرابط]

الصور imagesفى هذا الفصل سيتم التعرف على كيفية وضع الصور فى صفحتك وفى نهاية الكورس يجب أن تعلم:

التمييز بين الصور التى تدعم والتى لاتدعم المتصفحات

تحديد أى هيئة من الصور تناسب موقعك

أضافة صورة للصفحة أشكال الصور المدعمة للصفحات

gif وهى أختصار ل(graphic interchange format)صفات الصورة

أفضل التشكيلات لعرض الصور والتى تستخدم فى تصميم البرامج الرسومية مثل اللوجووالأيقونات والأزرار فىصفحتك
أذا تم حفظ gif 89a ك interlace فان المتصفح سيعرضها بالتدريج قطعة قطعة ولكن حفظها interlaced يأخذ مساحة أكبر
مع gif يمكنك أستخدام لون كشفيفة والذى يسمح لخلفية اللون أو الصورة يعمل كعلامة مائية
أخف الصور فى عمل الحركات على الويب

ثانيا: jpg or jpeg وهى أختصار ل(joint photographic export group)

يحتوى على ملايين من الألوان
لايعطى خاصية الشفيفة أو خاصية interlace
حجم معقول للصورة لذا يمكنك أن توازن بين حجم الصورة وجودتها

ثالثا : هذه الأنواع تدعمها بعض المتصفحات دون الأخرى

png portable network group

bmp ms windows bitmap

tiff pcx tagged image file format

وأمر تعريف الصور الرسومية < img > .... < /img >والصورة يجب تحديد مسارها تحديد كامل ويجب تحدبد حجمها والاطار الخارجى لها وحجمه والهوامش المحيطة بالصورة مثال:

< img src="1.jpg" alt="السلام عليكم aignement="center" width="250" height="250" border="5" hspace="30" vspace="50">

[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذه الصورة][ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذا الرابط]

التحليل :نحن قمنا بوضع صورة فى صفحتنا تسمى 1.gif وهذه الصورة فى المجلد mوالمجلد نفسه موجود مع ملف الصفحة فى نفس المجلدويجب أن نعرف المسار كاملا لملف الصورةلقد عرفنا المسار بلأمر (src)ثم قمنا بكتابة تعليق على الصورة بلأمر altيظهر عند مرور المؤشر عليها.وطول الصورة(height)=250 وعرضها (width)=250 ثم عرفنا الحد الخارجى للصورة (البرواز)بأنه 5 بكسل بلأمرborder ثم كان الفراغ الرأس vspace والأفقى hspace حول الصورة.

[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذا الرابط]

الوصلات

الوصلات ثلاثة أنواع

وصلة تنقلك لفقرة فى نفس الصفحة.
وصلة تنقلك لصفحة أخرىفى نفس الموقع.
وصلة تنقلك لموقع آخر.

والوصلات هذه تكون متاحة بواسطة url's(uniform resource locator's)والامر هو

< ahref="url" >......< /a >a(anchor)href صفة للعنصر anchor الموصف لurl . لو أن لهذه الصفة قيمة فان المحتويات بين < a >......< /a >سوف تتحول ليد عند وقف المؤشر عليها وبالضغط عليها ستؤدى الى فتح الملف الموصف بurle.g : < a href=http://www.xnu.com>موقع تعليمى < /a > والناتج هو [ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذا الرابط]

ماهو ال(url)?

هو عبارة عن طريقة قياسية تحدد الخدمة (service)والمضيف (hostname) والميناء(port)والمسار (path).

[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذا الرابط]

أمثلة على أنواع الخدمات:

http: hyper text transport protocol e.g: [ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذا الرابط] نوع الخدمة httpوهى بروتوكول قياسى لوصل محتويات صفحات الشبكة بالوسائط المتعددة واسم المضيف هو wwwفى النطاق tripodفى المنطقة com (commercial)بينما الصفحة المرادة هى members
ftp:file transfer porotocole.g: ftp//ftp.tripod.com/membersنوع الخدمة ftp وهذه الخدمة لخلق وتحميل الصفحة من والى السيرفرات كتحميل موقعك باذن الله.
news:north-east-west-south أخبارىونوع الخدمة هنا أخبارية
[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذا الرابط]
email: electronic mailmailto:mamhay@msn.comنوع الخدمة mail to الوكيل msn المستقبل mamhay
telnet//media.mit.edu

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

< a name="الفصل الأول"> الفصل الأول < /a > الصفة name للعنصر anchor تحدد الموقع فى الوثيقة المراد والآن أختر النص المراد أن يكون هو الوصلة وضعه بين anchor < a href="#الفصل الأول"< الفصل الأول< a >فيكون الناتج [ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذا الرابط]
[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذا الرابط]
[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذا الرابط]
فلنفترض أننا كتبنا الفهرس كلآتى :

محمدمحمودأحمدخالدوأن الموضوع كلآتىمحمد................................................................................أحمد................................................................................................محمود...........................................................................................خالد......................................................................................................ونريد بمجرد النقل على أحمد فى الفهرس ننتقل الى الموضوع أولا: نأتى عند أحمد الذى فى الموضوع ونكتب الأمر كلآتى

< a name="أحمد" ><حمد < /a >

لاحظ أننا كتبنا أحمد مرتين مرة داخل علامتى >< ومرة خارجها والفرق أن أحمد داخل علامتى أكبر وأصغر من هو الذى تذهب اليه الوصلة بينما أحمد الذى بين أمر التنفيذ والنهاية هو الذى يظهر على المتصفح (الفهرس)الآن نذهب الى أحمد الذى فى الفهرس ونضعه كلآتى

< a href="#أحمد">أحمد حيث أحمد مابين أمر التنفيذ وأمر النهاية ÷ هو الذى يظهر فى الفهرس لنفترض أننا نريد أن يكون الجزءالذى نضغط عليه صورة تؤدى لموقع ما فكيف ذلك؟ ان الصور التى لهاهذه الخاصية(الاتصال بالضغط) تسمى الخرائط الصورية (image map)وعلى هذا فان تعريف الخرائط الصورية :هو شكل رسومى يخلق وصلة بين الصفحات.وينقسم الى:

clint-side
server-side

[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذا الرابط]

والناتج هو:

[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذا الرابط]>

2-clint-side imge map(usemap)e.g < img src="1.jpg" usemap="#map1">< area shape="rect"coords="100,200,156,249" href="whatever.htm" >< area shape="rect" coords="100,200,156,249"href="whatever.htm" >< /map >

الاشكال: مستطيل rect or rectangle
الدائرة: circ or circle
المضلع polygon يحتاج ثلاث أوأكثر من أزواج الاحداثيات

تقبلو مرورى وفائق إحترامى وتقديرى لمجهوداتكم وسدد الله خطاكم ووفقكم لما يحبه ويرضاه

» كيف تكتب و تنسق مساهماتك فى المنتدى (الدرس الأول)
» كيف تكتب و تنسق مساهماتك فى المنتدى (الدرس الأول)
» كيف تكتب و تنسق مساهماتك فى المنتدى (الدرس الثانى)
» كيف تكتب و تنسق مساهماتك فى المنتدى (الدرس الثالث)
» كيف تكتب و تنسق مساهماتك فى المنتدى (الدرس الثامن)