المهدى
12-16-2005, 07:30 AM
كون شبكة الانترنت من أسهل الوسائل للتفاعل بين الشعوب وتبادل الثقافات والأفكار إلى جانب كونها وسيلة للتعارف والتقارب بين الأجناس والجنسيات تولدت لدى العديد الرغبة فى إنشاء موقع خاص تنشر به المعلومات الشخصية والأفكار والاختراعات و الخواطر التي تنشر على هيئة مدونات، وتصميم موقع شخصي على الانترنت ليس بالامر الصعب تحقيقه في وقت يتبارى فيه مطورو البرمجيات في انتاج الادوات اللازمة والخاصة بتصميم المواقع التي تسهل لاي مستخدم كمبيوتر عملية تصميم موقع دون الحاجة الى اللجوء الى شركات مختصة بذلك.
و من خلال هذا الموضوع يمكنك أن تتعرف على المعلومات الأساسية التي تمكنك من إنشاء موقعك على الشبكة.
تجهيزات ماقبل البدايه
- اعداد البيانات التي ترغب فى نشرها على الموقع سواء كانت نصوصا او صورا
- عمل رسم توضيحي يدوي للشكل الذي سيكون عليه الموقع بمحتوياته
تثبيت الادوات التي سوف تستخدمها في تصميم الموقع كمحرر الصفحات مثل Dreamwaver, Frontpage وغيرها، كبداية سوف نستخدم Frontpage Express لتصميم صفحتك الأولى، بالاضافة الى معالج الصور وليكن ادوب فوتوشوب على حاسبك
- الالمام بكيفية البرمجة بلغة HTML او استخدام المساعدة الموجودة بالمحرر
نصائح عامة
حاول أن تصمم الصفحة الرئيسية بطريقة تسهل على الزائر تغطية المواضيع بأكملها بشكل سريع، وذلك من خلال عرض النقاط الأساسية ووضع بعض الفقرات الصغيرة التي توضح للزائر أبعاد موضوعك. عليك أن تهتم بتقليل المدة التي تستغرقها الصفحة في النزول، وذلك من خلال اختيار صورة قليلة الحجم من نوع Jpg, gif ومراعاة كتابة النقاط الأساسية كتابة text وليست ضمن صورة لتعجيل ظهورها.
عناصر الموقع
عند تصميم موقع يجب مراعاة التفرقة بين ما تريد نشره وما يجذب الزائر اليه ، يمكنك أن تعرض في صفحتك العديد من المواضيع المتنوعة التي تخصك، مثل شرح وعرض لأهم هواياتك وأبحاثك وتطلعاتك واهتماماتك، ولكن كل ذلك قد لا يكون مصدر جذب للزائر، لذلك بجب اضافة روابط لمواقع تعد مصدر جذب للزوار كمحركات البحث والمواقع الاخبارية العالمية والمحلية يالاضافة الى مواقع الاغاني والافلام وغيرها من التي تشعر بانها مفيدة ومسلية للزائر، كذلك يمكنك أن تعرض تساؤلاتك واقتراحاتك لمواضيع تهمك.
خطوات تنفيذية
قم بتشغيل برنامج Frontpage Express.
من المهم أن تضع محتوى صفحتك بداخل جدول من أجل تنسيق أفضل، حيث أن الجدول سيسهل لك تقسيم صفحتك إلى أعمدة وصفوف متناسقة ويمكنك من تنسيق الصفحة عن طريق وضع جدول داخل جدول، كذلك فإن الجداول تعمل على تثبيت حجم الصفحة، وتثبيت مواقع محتوياتها.
الآن انقر Table ثم اختر Insert Table ثم حدد عدد الأعمدة columns =1 وعدد الصفوف rows =4 ذلك لتنشىء الجدول الأول والأساسي في الصفحة. اختر عرض الجدول بالـpixel وذلك بنقر In pixel ووضع العرض Specify Width = 640 بهذا تجعل حجم الصفحة ثابتا مهما اختلفت الـ format من كمبيوتر لأخر.
ضع المؤشر داخل الصف الأول من الجدول ثم أنشىء جدولاً يتكون من صف واحد وثلاثة أعمدة لكي نخصص الخلية الأولى لشعار صفحتك والثانية لكلمة الترحيب - مرحبا بكم - والثالثة للصورة الشخصية. هذه مجرد أمثلة
من أجل وضع صورة شعار صفحتك، ضع المؤشر في أول خلية من خلايا الجدول الذي أنشاته وهي الخلية الخاصة بالشعار ثم انقر Insertواختر Image ثم انقر Browse لتحديد موقع واسم الصورة المطلوبة ثم انقرOk.
اكتب - عنوان - في الخلية الثانية من الجدول ثم كرر الخطوة الرابعة لوضع الصورة الشخصية في الخلية الثالثة للجدول.
اكتب الفقرة التالية في الصف الثاني من صفوف الجدول الرئيسي: أشكرك على زيارتك لصفحتي.. وأتمنى أن تكون سعيدا بها، اسمي.. وأنا من.. عمري ( ) سنة، ولدت في.. وأنا حاصل على ( شهادتك ) لوني المفضل هو ( ) رقمي المفضل هو ( ). ملاحظة: عندما تكتب سطرا وترغب في الانتقال إلى السطر الذي يليه انتقل عن طريق نقر shift وEnter هذا يجعل المسافة بين السطرين أقل من المسافة الناتجة من نقر Enter فقط، نسق الخط بالطريقة التي تفضلها من حيث الحجم واللون والمحاذاة.
لتنسيق خلايا الجدول من حيث المحاذاة إلى الأعلى أو الأسفل أو التوسط ضع المؤشر عند الخلية المراد تنسيقها ثم انقرTable واختر Cell Properties لتظهر لك شاشة Cell Properties حيث من خلالها تستطيع التحكم بطبيعة المحاذاة.
من أجل أن تضع خطا في نهاية الفقرة، انتقل إلى سطر جديد ثم انقر Insert واختر Horizontal Line.
ضع المؤشر بداخل الصف الثالث من الجدول الرئيسي ثم أنشىء جدولا يتكون من صف واحد وعمودين، خصص الخلية الأولى لـAbout Me والثانية لـ «بلادي» ألصق صورة About Me ثم انقر shiftوEnter لتنتقل للسطر الذي يليه، ثم اكتب «اسمك».
لوضع ارتباط تشعبي لكلمة - اسمك - لكي تمكن الزائر من الانتقال من الصفحة الرئيسية إلى الصفحة المتخصصة بعرض معلومات عنك، ظلل الكلمة بالفأرة ثم انقر «Insert ثم اختر» Hyperlink ثم اكتب عنوان الصفحة بالمستطيل المشار إليه بالسهم.
كررخطوة ( 9 ) لصورة ( بلادي ).
لوضع خلفية للصفحة انقر format ثم اختر «Background سوف تظهر لك شاشة» Page Properties التي تمكنك من اختيار لون الخلفية أو وضع الصورة التي تريدها أن تكون خلفية للصفحة.
ملاحظة: عليك أن تضع كلاً من ملف الصفحة التي تنشئها والصور الموجودة فيها في مكان واحد Same Folder.
في الخلية الرابعة ألصق الصورة المعبرة عن البريد الإلكتروني ثم اكتب بريدك الإلكتروني: yourname@yahoo.com
Frontpage Express سوف تصنع له ارتباطا تشعبيا Automatically.
انقر «حفظ» من أجل حفظ آخر التعديلات التي أجريتها على الصفحة ثم أغلق Frontpage Express.
ثالثا: كيفية البرمجة بلغة HTML:
في كثير من الأحيان تحتاج إلى العودة للغة HTML من أجل إدخال بعض الإضافات التي تحتاجها في إنشاء الصفحة، حيث يوجد العديد من المواقع التي تقدم لك برمجة معدة، فقط تحتاج أن تضاف إلى الصفحة، برنامج Frontpage Express يمكنك من فتح برمجة الصفحة والتعديل فيها، من خلال الخطوات التالية سوف تتعرف على كيفية إضافة التالي :
ü عداد .counter
ü سجل للزوار Guest Book
قبل البدء بإضافة العداد وسجل الزوار نتعرف على لغة HTML.
برنامج Frontpage Express يمكنك من عرض برمجة HTML لصفحتك والتغيير فيها.
انقر View اختر HTML لتظهر البرمجة.
تلاحظ أن لغة HTML تبدأ بـ TML وتنتهي بـ HTML كذلك كل مكونات هذه اللغة تبدأ وتنتهي بالطريقة نفسها. بالداخل تجدHEAD الذي يحتوي على العنوان - عنوان صفحتنا هنا هو «صفحة شخصية» تجده مطبوعاً بين TITLE الآن كل برمجة الصفحة تكون بداخل body.
برمجة الجدول في لغة HTML تبدأ بـ Table برمجة الصف في داخل الجدول تبدأ بـ TR أما العمود فتبدأ بـ TD بالنسبة لعرض الجدول يفضل أن يكون بالأرقام pixel وليس بالنسبة المئوية من أجل الحصول على حجم ثابت للجدول FONT تستعمل لتنسيق الخط، حيث FACE تحدد اسم الخط وSize تحدد حجم الخط، أما الإرتباط التشعبي فيتم من خلال A HREF=adress وينتهي بـ a لوضع خط في نهاية الصفحة HR يقوم بوضع خط ويمكنك التحكم في عرضه.
وضع عداد
هناك العديد من المواقع التي تسهل عليك وضع عداد لصفحتك، ما عليك إلا التسجيل في أحد هذه المواقع ثم لصق «البرمجة» التي تنتجها لك وهي خاصة بالعداد قبل body في برمجة الصفحة أو في المكان الذي تخصصه أنت للعداد.
اتبع الخطوات التالية لإدخال العداد لصفحتك :
سوف نأخذ العداد من موقع http:// member.linkexchange.com اذهب إلى الموقع ثم انقر FastCounter.
انقر Sign me up لتنقلك إلى الصفحة التي تليها ثم انقر I agree to these terms and conditions ادخل بياناتك في أماكنها ثم انقر Next.
حدد موقع الصفحة على الإنترنت ثم اختر شكل العداد المناسب للصفحة وحدد العدد الذي يبدأ به العداد ( 100 ) مثلاً ثم انقر Submit.
وأخيرا تظهر لك شاشة تحتوي على البرمجة خاصة للعداد ظللها وانسخها ثم ألصقها في برمجة الـ HTML للصفحة قبل body.
و من خلال هذا الموضوع يمكنك أن تتعرف على المعلومات الأساسية التي تمكنك من إنشاء موقعك على الشبكة.
تجهيزات ماقبل البدايه
- اعداد البيانات التي ترغب فى نشرها على الموقع سواء كانت نصوصا او صورا
- عمل رسم توضيحي يدوي للشكل الذي سيكون عليه الموقع بمحتوياته
تثبيت الادوات التي سوف تستخدمها في تصميم الموقع كمحرر الصفحات مثل Dreamwaver, Frontpage وغيرها، كبداية سوف نستخدم Frontpage Express لتصميم صفحتك الأولى، بالاضافة الى معالج الصور وليكن ادوب فوتوشوب على حاسبك
- الالمام بكيفية البرمجة بلغة HTML او استخدام المساعدة الموجودة بالمحرر
نصائح عامة
حاول أن تصمم الصفحة الرئيسية بطريقة تسهل على الزائر تغطية المواضيع بأكملها بشكل سريع، وذلك من خلال عرض النقاط الأساسية ووضع بعض الفقرات الصغيرة التي توضح للزائر أبعاد موضوعك. عليك أن تهتم بتقليل المدة التي تستغرقها الصفحة في النزول، وذلك من خلال اختيار صورة قليلة الحجم من نوع Jpg, gif ومراعاة كتابة النقاط الأساسية كتابة text وليست ضمن صورة لتعجيل ظهورها.
عناصر الموقع
عند تصميم موقع يجب مراعاة التفرقة بين ما تريد نشره وما يجذب الزائر اليه ، يمكنك أن تعرض في صفحتك العديد من المواضيع المتنوعة التي تخصك، مثل شرح وعرض لأهم هواياتك وأبحاثك وتطلعاتك واهتماماتك، ولكن كل ذلك قد لا يكون مصدر جذب للزائر، لذلك بجب اضافة روابط لمواقع تعد مصدر جذب للزوار كمحركات البحث والمواقع الاخبارية العالمية والمحلية يالاضافة الى مواقع الاغاني والافلام وغيرها من التي تشعر بانها مفيدة ومسلية للزائر، كذلك يمكنك أن تعرض تساؤلاتك واقتراحاتك لمواضيع تهمك.
خطوات تنفيذية
قم بتشغيل برنامج Frontpage Express.
من المهم أن تضع محتوى صفحتك بداخل جدول من أجل تنسيق أفضل، حيث أن الجدول سيسهل لك تقسيم صفحتك إلى أعمدة وصفوف متناسقة ويمكنك من تنسيق الصفحة عن طريق وضع جدول داخل جدول، كذلك فإن الجداول تعمل على تثبيت حجم الصفحة، وتثبيت مواقع محتوياتها.
الآن انقر Table ثم اختر Insert Table ثم حدد عدد الأعمدة columns =1 وعدد الصفوف rows =4 ذلك لتنشىء الجدول الأول والأساسي في الصفحة. اختر عرض الجدول بالـpixel وذلك بنقر In pixel ووضع العرض Specify Width = 640 بهذا تجعل حجم الصفحة ثابتا مهما اختلفت الـ format من كمبيوتر لأخر.
ضع المؤشر داخل الصف الأول من الجدول ثم أنشىء جدولاً يتكون من صف واحد وثلاثة أعمدة لكي نخصص الخلية الأولى لشعار صفحتك والثانية لكلمة الترحيب - مرحبا بكم - والثالثة للصورة الشخصية. هذه مجرد أمثلة
من أجل وضع صورة شعار صفحتك، ضع المؤشر في أول خلية من خلايا الجدول الذي أنشاته وهي الخلية الخاصة بالشعار ثم انقر Insertواختر Image ثم انقر Browse لتحديد موقع واسم الصورة المطلوبة ثم انقرOk.
اكتب - عنوان - في الخلية الثانية من الجدول ثم كرر الخطوة الرابعة لوضع الصورة الشخصية في الخلية الثالثة للجدول.
اكتب الفقرة التالية في الصف الثاني من صفوف الجدول الرئيسي: أشكرك على زيارتك لصفحتي.. وأتمنى أن تكون سعيدا بها، اسمي.. وأنا من.. عمري ( ) سنة، ولدت في.. وأنا حاصل على ( شهادتك ) لوني المفضل هو ( ) رقمي المفضل هو ( ). ملاحظة: عندما تكتب سطرا وترغب في الانتقال إلى السطر الذي يليه انتقل عن طريق نقر shift وEnter هذا يجعل المسافة بين السطرين أقل من المسافة الناتجة من نقر Enter فقط، نسق الخط بالطريقة التي تفضلها من حيث الحجم واللون والمحاذاة.
لتنسيق خلايا الجدول من حيث المحاذاة إلى الأعلى أو الأسفل أو التوسط ضع المؤشر عند الخلية المراد تنسيقها ثم انقرTable واختر Cell Properties لتظهر لك شاشة Cell Properties حيث من خلالها تستطيع التحكم بطبيعة المحاذاة.
من أجل أن تضع خطا في نهاية الفقرة، انتقل إلى سطر جديد ثم انقر Insert واختر Horizontal Line.
ضع المؤشر بداخل الصف الثالث من الجدول الرئيسي ثم أنشىء جدولا يتكون من صف واحد وعمودين، خصص الخلية الأولى لـAbout Me والثانية لـ «بلادي» ألصق صورة About Me ثم انقر shiftوEnter لتنتقل للسطر الذي يليه، ثم اكتب «اسمك».
لوضع ارتباط تشعبي لكلمة - اسمك - لكي تمكن الزائر من الانتقال من الصفحة الرئيسية إلى الصفحة المتخصصة بعرض معلومات عنك، ظلل الكلمة بالفأرة ثم انقر «Insert ثم اختر» Hyperlink ثم اكتب عنوان الصفحة بالمستطيل المشار إليه بالسهم.
كررخطوة ( 9 ) لصورة ( بلادي ).
لوضع خلفية للصفحة انقر format ثم اختر «Background سوف تظهر لك شاشة» Page Properties التي تمكنك من اختيار لون الخلفية أو وضع الصورة التي تريدها أن تكون خلفية للصفحة.
ملاحظة: عليك أن تضع كلاً من ملف الصفحة التي تنشئها والصور الموجودة فيها في مكان واحد Same Folder.
في الخلية الرابعة ألصق الصورة المعبرة عن البريد الإلكتروني ثم اكتب بريدك الإلكتروني: yourname@yahoo.com
Frontpage Express سوف تصنع له ارتباطا تشعبيا Automatically.
انقر «حفظ» من أجل حفظ آخر التعديلات التي أجريتها على الصفحة ثم أغلق Frontpage Express.
ثالثا: كيفية البرمجة بلغة HTML:
في كثير من الأحيان تحتاج إلى العودة للغة HTML من أجل إدخال بعض الإضافات التي تحتاجها في إنشاء الصفحة، حيث يوجد العديد من المواقع التي تقدم لك برمجة معدة، فقط تحتاج أن تضاف إلى الصفحة، برنامج Frontpage Express يمكنك من فتح برمجة الصفحة والتعديل فيها، من خلال الخطوات التالية سوف تتعرف على كيفية إضافة التالي :
ü عداد .counter
ü سجل للزوار Guest Book
قبل البدء بإضافة العداد وسجل الزوار نتعرف على لغة HTML.
برنامج Frontpage Express يمكنك من عرض برمجة HTML لصفحتك والتغيير فيها.
انقر View اختر HTML لتظهر البرمجة.
تلاحظ أن لغة HTML تبدأ بـ TML وتنتهي بـ HTML كذلك كل مكونات هذه اللغة تبدأ وتنتهي بالطريقة نفسها. بالداخل تجدHEAD الذي يحتوي على العنوان - عنوان صفحتنا هنا هو «صفحة شخصية» تجده مطبوعاً بين TITLE الآن كل برمجة الصفحة تكون بداخل body.
برمجة الجدول في لغة HTML تبدأ بـ Table برمجة الصف في داخل الجدول تبدأ بـ TR أما العمود فتبدأ بـ TD بالنسبة لعرض الجدول يفضل أن يكون بالأرقام pixel وليس بالنسبة المئوية من أجل الحصول على حجم ثابت للجدول FONT تستعمل لتنسيق الخط، حيث FACE تحدد اسم الخط وSize تحدد حجم الخط، أما الإرتباط التشعبي فيتم من خلال A HREF=adress وينتهي بـ a لوضع خط في نهاية الصفحة HR يقوم بوضع خط ويمكنك التحكم في عرضه.
وضع عداد
هناك العديد من المواقع التي تسهل عليك وضع عداد لصفحتك، ما عليك إلا التسجيل في أحد هذه المواقع ثم لصق «البرمجة» التي تنتجها لك وهي خاصة بالعداد قبل body في برمجة الصفحة أو في المكان الذي تخصصه أنت للعداد.
اتبع الخطوات التالية لإدخال العداد لصفحتك :
سوف نأخذ العداد من موقع http:// member.linkexchange.com اذهب إلى الموقع ثم انقر FastCounter.
انقر Sign me up لتنقلك إلى الصفحة التي تليها ثم انقر I agree to these terms and conditions ادخل بياناتك في أماكنها ثم انقر Next.
حدد موقع الصفحة على الإنترنت ثم اختر شكل العداد المناسب للصفحة وحدد العدد الذي يبدأ به العداد ( 100 ) مثلاً ثم انقر Submit.
وأخيرا تظهر لك شاشة تحتوي على البرمجة خاصة للعداد ظللها وانسخها ثم ألصقها في برمجة الـ HTML للصفحة قبل body.