الرئيسية
دخول
** كيف تصمم موقعك الشخصي ؟
الإنترنت في أيامنا الحالية ليست مصدراً للتعلم والإطلاع ، ولكنها مصدر للنشر والتعارف ، لذلك يحتاج الكثير منّا في بعض الأحيان إلى إنشاء صفحة خاصة به يقوم من خلالها بنشر الإعلانات والأبحاث والمقالات وغيرها ، من خلال هذا الموضوع يمكنك أن تتعرف على المعلومات الأساسية التي تمكنك من إنشاء صفحتك .
لكي تنشىء صفحة يجب أن تتوفر لديك المعلومات التالية :
* الموضوع الذي سوف تعرضه الصفحة ، مع تصور مبدئي لتصميم الصفحة الرئيسية والصفحات الداخلية التابعة لها .
* كيفية استخدام المحرر " Editor " لتصميم الصفحة .
* كيفية البرمجة بلغة HTML
أولاً : الموضوع
حدد الهدف من إنشاء صفحتك ، وحاول أن تصمم الصفحة الرئيسية بطريقة تسهل على الزائر تغطية المواضيع بأكملها بشكل سريع ، وذلك من خلال عرض النقاط الأساسية ووضع بعض الفقرات الصغيرة التي توضح للزائر أبعاد موضوعك . عليك أن تهتم بتقليل المدة التي تستغرقها الصفحة في النزول ، وذلك من خلال اختيار صورة قليلة الحجم من نوع ( Jpg , gif) ومراعاة كتابة النقاط الأساسية كتابة " text " وليست ضمن صورة لتعجيل ظهورها .
الصفحة الشخصية تعبر عن صاحبها وتوضح نوع شخصيته ، وذلك يتم من خلال عرضها لاهتماماته وتطلعاته ، يمكنك أن تعرض في صفحتك العديد من المواضيع المتنوعة - مثل شرح وعرض لأهم هواياتك وأبحاثك وتطلعاتك واهتماماتك ، ووضع " link " لمواقع تشعر انها مفيدة ومسلية للزائر ، كذلك يمكنك أن تعرض تساؤلاتك واقتراحاتك لمواضيع تهمك .
ثانياً : استخدام المحرر في تصميم الصفحة
يوجد في الأسواق العديد من البرامج التي تمكن المستخدم من إنشاء صفحته مثل ( Corel Web.Designer, Frontpage) وغيرها ، ومن خلال هذه البرامج تستطيع أن تصمم صفحات جيدة ، لكن من الأفضل أن يكون لديك المعرفة بأساسيات لغة HTML من أجل أن تسهل التعامل مع هذه البرامج وتصميم الصفحات بشكل ممتاز .
كبداية سوف نستخدم " Frontpage Express" لتصميم صفحتك الأولى ، يمكنك إنزال هذا البرنامج مع " Internet Explorer" .
اتباع الخطوات التالية لإنشاء الصفحة الشخصية :
شغل برنامج " 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 " تبدأ بـ " <HTML> وتنتهي بـ <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/> .
" منقوووووووووووول !! "
__________________
الإنترنت في أيامنا الحالية ليست مصدراً للتعلم والإطلاع ، ولكنها مصدر للنشر والتعارف ، لذلك يحتاج الكثير منّا في بعض الأحيان إلى إنشاء صفحة خاصة به يقوم من خلالها بنشر الإعلانات والأبحاث والمقالات وغيرها ، من خلال هذا الموضوع يمكنك أن تتعرف على المعلومات الأساسية التي تمكنك من إنشاء صفحتك .
لكي تنشىء صفحة يجب أن تتوفر لديك المعلومات التالية :
* الموضوع الذي سوف تعرضه الصفحة ، مع تصور مبدئي لتصميم الصفحة الرئيسية والصفحات الداخلية التابعة لها .
* كيفية استخدام المحرر " Editor " لتصميم الصفحة .
* كيفية البرمجة بلغة HTML
أولاً : الموضوع
حدد الهدف من إنشاء صفحتك ، وحاول أن تصمم الصفحة الرئيسية بطريقة تسهل على الزائر تغطية المواضيع بأكملها بشكل سريع ، وذلك من خلال عرض النقاط الأساسية ووضع بعض الفقرات الصغيرة التي توضح للزائر أبعاد موضوعك . عليك أن تهتم بتقليل المدة التي تستغرقها الصفحة في النزول ، وذلك من خلال اختيار صورة قليلة الحجم من نوع ( Jpg , gif) ومراعاة كتابة النقاط الأساسية كتابة " text " وليست ضمن صورة لتعجيل ظهورها .
الصفحة الشخصية تعبر عن صاحبها وتوضح نوع شخصيته ، وذلك يتم من خلال عرضها لاهتماماته وتطلعاته ، يمكنك أن تعرض في صفحتك العديد من المواضيع المتنوعة - مثل شرح وعرض لأهم هواياتك وأبحاثك وتطلعاتك واهتماماتك ، ووضع " link " لمواقع تشعر انها مفيدة ومسلية للزائر ، كذلك يمكنك أن تعرض تساؤلاتك واقتراحاتك لمواضيع تهمك .
ثانياً : استخدام المحرر في تصميم الصفحة
يوجد في الأسواق العديد من البرامج التي تمكن المستخدم من إنشاء صفحته مثل ( Corel Web.Designer, Frontpage) وغيرها ، ومن خلال هذه البرامج تستطيع أن تصمم صفحات جيدة ، لكن من الأفضل أن يكون لديك المعرفة بأساسيات لغة HTML من أجل أن تسهل التعامل مع هذه البرامج وتصميم الصفحات بشكل ممتاز .
كبداية سوف نستخدم " Frontpage Express" لتصميم صفحتك الأولى ، يمكنك إنزال هذا البرنامج مع " Internet Explorer" .
اتباع الخطوات التالية لإنشاء الصفحة الشخصية :
شغل برنامج " 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 " تبدأ بـ " <HTML> وتنتهي بـ <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/> .
" منقوووووووووووول !! "
__________________
