SlideShare une entreprise Scribd logo
1  sur  15
Télécharger pour lire hors ligne
‫تقنية المعلومات‬
‫تصميم المواقع اإللكترونية‬
   ‫برنامج فرونت بيج‬


    ‫م.سمر سلمان النعيمي‬
‫أهداف الوحدة‬
      ‫-ان يتعرف الطالب كيفية التعامل مع‬
                           ‫اإلضافات‬
                          ‫• النصوص‬
                             ‫• الصور‬
                            ‫• الجداول‬
                           ‫• األصوات‬

       ‫-ان يكتسب الطالب مهارة التعامل مع‬
           ‫التنسيقات المختلفة للصفحة‬
‫-أن يجيد الطالب إضافة االرتباطات التشعيبية‬
                               ‫بأنواعها‬
                     ‫• الى بريد الكتروني‬
                        ‫• الى صفحة ويب‬
                               ‫• الى ملف‬
‫اضغط‬
‫اعةفة ثخؽّػ للطفرة‬

         ‫ِمنووة ان هكٍم بجكشّم الطفرة لّنٍن المٍلع اه ثر ثرثّبة‬

             ‫همة ِمنووة اخجّةر الجكشّم الموةصب لمرجٍى المٍلع‬

                                ‫و ِجم ذلم بةخجّةر‬
                  ‫‪layout tables and cells‬‬

                                        ‫من الكةامة ‪table‬‬
‫فّظٌر لوة شرِػ خةهبُ مجػدد الخّةرات ِمنووة اصجخدام اذدى ًذى‬
                                                   ‫الخّةرات‬
                                   ‫‪Layout‬‬
      ‫‪table‬‬                      ‫‪tables and‬‬
                                    ‫‪cells‬‬
‫اعةفة الشمةت الَ ضفرة الٍِب(‪(theme‬‬




                   ‫- من شرِػ الكٍاام هخجةر‬
 ‫‪format‬‬                     ‫ثم هكٍم بةخجّةر‬
     ‫‪theme‬‬

‫فّظٌ ر لو ة غل َ خةه ب التةش ة ش رِػ ِرج ٍي‬
‫اهم ةط مخجلف ة م ن الخلفّ ةت ِمن ن اخجّ ةر‬
                      ‫اذداًة هخلفّة للمٍلع‬


‫‪format‬‬                      ‫‪theme‬‬
‫إعةفة الوص إلَ ضفرة الٍِب :‬
‫ِجػةمو فروهت بّج مع إعةفة الوص بوفس صٌٍلة برامج مػةلحة النلمةت ، هو مة غلّم ًٍ ان ثن جب وصٍف ِجم لف‬
                                                                                             ‫ً‬
                                 ‫الوص ثلكةاّة إلَ الشؽر الجةلُ بمحرد ان ثطو إلَ هٌةِة الشؽر الذي ثن جبي .‬
                                                                           ‫لجبدا بن جةبة اي فكرة ثرِدًة :‬
                                                                                    ‫آ‬
                                    ‫•إذا لم ثنن لدِم الن ضفرة فةرغة غلَ التةشة ، فلجكم بإهتةء واذدة.‬
                                         ‫• غود المٍعع الذي ِظٌر فّي مؤشر الن جةبة ، اه جب الوص المؽلٍب‬

‫• -اعغػ مفجةح اإلدخةل ‪ Enter‬واصجمر فُ ه جةبة اي هص . ل ثغغػ مفجةح اإلدخةل ‪ Enter‬غودمة‬
                                            ‫ً‬
                        ‫ثطو إلَ هٌةِة الشؽر ، فكػ واضو الن جةبة وصّجم لف الوص ثلكةاّة إلَ الشؽر الجةلُ .‬
                                       ‫ً‬
  ‫ثم اهي لبد ان ثردد الوص الذي ثرِد ثغّّرى او إعةفة اي صمة إلّي ، مثال لجغّّر ذحم الوص الذي ه جبجي ، لم بمة‬
                                                                                                        ‫ِلُ‬

                                                                                          ‫•ذدد هص‬
 ‫•من لةامة ‪ ، Format‬ذدد امر . ‪ Font‬فُ محمٍغة ‪ ، Size‬اصجخدم شرِػ الجمرِر ذجَ ثطو إلَ‬
     ‫خّةر 7 ثم ذددى ، اهكر بػد ذلم زر ‪ ، ok‬ل بد ان ِظٌر الوص لدِم بوفس الرحم المٍخٍد فُ التنو .‬
                                                              ‫ً‬      ‫ً‬
              ‫بتنو غةم ، ِمورم فروهت بّج لدرا مػكٍل من ذرِة الخجّةر فُ ثردِد ذحم الوص الذي ثن جبي .‬
‫إعةفة ال لٍان والشمةت:‬
                                                                                                                                                                                                                        ‫آ‬
                                                                                                                                                        ‫والن ، لم بإعةفة بػظ الشمةت إلَ الوص ، ابدا بجغّّر لٍن الػوٍان :‬
                                                                                                                                                                                                      ‫ولجغّّر لٍن الوص :‬
                                                                                                                                                                                                  ‫• ذدد غوٍان الوص .‬
                                                                                                                                                  ‫• ان لةامة ‪ Format‬اخجر امر ‪ Font‬لجفجد مربع ذٍار ( ‪Font‬‬
    ‫‪format‬‬                                                           ‫‪font‬‬                                                       ‫آ‬
                                                                                                                                                                  ‫• افجد الكةامة الموشدلة ‪Color‬ذجَ ثظٌر لٍذة ال لٍان .‬
                                                                                           ‫•ذدد خّةر ‪ Red‬ثم اهكر زر ‪ ok‬لجغلق مربع ذٍار ‪ Font‬لجفجد مربع ذٍار ‪ِ Font‬حب الن ان ِظٌر غوٍان الفكرة بةللٍن الذمر .‬
                                                                                                                                                                                       ‫ً‬       ‫ً‬                      ‫ً‬
                                                                                                                                                                       ‫اِغة ِمنوم خػو الوص غرِغة او مةاال او اصفلي خػ .‬
                                                                                                                                                                                                        ‫لحػو الوص غرِغةً‬
                                                                                                                                                                                                     ‫:‬
                                                                                                                                                                                                          ‫•ذدد النلمةت .‬
                                                                                                    ‫ً‬                       ‫• اهكر رمز ‪ِ Bold‬رمو ًذا الرمز ذرف ‪B‬المٍخٍد غلَ شرِػ الدوات .‬
                                                                               ‫لحػو الوص مةاال :‬
                                                              ‫• ذدد النلمةت اي من النلمةت .‬
               ‫اهكر رمز ‪ِ Italics‬رمو ًذا الرمز ذرف ‪ I‬المةاو المٍخٍد غلَ شرِػ الدوات .‬         ‫•‬
                                                                        ‫وإلعةفة صؽر اصفو الوص :‬
                                                                                  ‫•ذدد النلمة .‬
                ‫• اهكر رمز ‪ِ Underline‬رمو ًذا الرمز ذرف ‪ U‬المٍخٍد غلَ شرِػ الدوات .‬



                                                                                                ‫اهمةط الخػ والجةثّرات:‬
                                                                                   ‫• ذدد هلمة اي هلمة من الوص .‬
                                    ‫• من لةامة ‪ ، Format‬ذدد امر ‪ Font‬لجفجد مربع ذٍار . ‪Font‬‬
‫• فُ خزء ‪ِ ، Effects‬منوم ان ثرى الجةثّرات المجوٍغة الجُ ِجّرٌة لم ، همة ِجّد لم مربع المػةِوة ‪Preview‬‬
                                                 ‫رؤِة التنو الذي ِظٌر غلّي الوص بػد ثؽبّق اي ثةثّر من ثلم الجةثّرات .‬
 ‫ل ذؾ الشؽرِن الظةًرِن فُ مربع المػةِوة ِجّرةن لم رؤِة الوص بةلوشبة للجةثّرات الجُ ثغّر من الٍعع الراصُ ، مثو ثةثّر‬
                                        ‫اهخفةض ‪ subscript‬وارثفةع ‪ superscript‬الوص غن الشؽر.‬
‫• مثال ذدد خّةري ‪ Caps Small‬و . ‪ Superscript‬اهكر زر ‪ ok‬لجغلق مربع الرٍار وثرى الجغّّرات‬                       ‫ً‬
                                                                                                 ‫الجُ اخرِجٌة غلَ الوص‬
‫‪From‬‬
‫‪insert‬‬   ‫‪picture‬‬
                    ‫‪file‬‬
                                                                                ‫إعةفة الطٍر بةصجخدام فروهت بّج:‬
                                                                                  ‫إلعةفة ضٍرة إلَ ضفرة الٍِب :‬
                                                  ‫-فُ فروهت بّج ، افجد ضفرة خدِدة داخو المٍلع الخةص بم .‬
                           ‫-من لةامة ‪ ، Insert‬ذدد خّةر ‪ Picture‬ثم ‪ From File‬لجفجد مربع ذٍار‬
                                                                                                 ‫. ‪Picture‬‬
                                                             ‫-ذدد ملف الطٍرة الجُ ثرِد إدراخٌة فُ ضفرجم .‬
                                                   ‫-اهكر زر ‪ ok‬وصجظٌر الطٍرة فُ ضفرة الٍِب اهظر التنو .‬
                                              ‫-من لةامة ‪ ، File‬ذدد امر ‪ save‬لجفجد مربع ذٍار ‪save as‬‬

                                                                                      ‫ثػدِو ملفةت الطٍر لدِم :‬
                                                   ‫من اإلغدادات الجُ ِمنوم الكّةم بٌة لجػدِو ملفةت الطٍر مة ِلُ :‬
                                                                   ‫×الجرنم فُ ابػةد الطٍرة داخو الطفرة‬
                                                                               ‫‪ x‬الجرنم فُ ؼرِكة المرةذاة‬
                                                         ‫×ثردِد إذا مة هةن صّجم غرض الطٍرة داخو الردود‬
                                                                                  ‫×إعةفة ارثبةط إلَ الطٍرة‬
                                                                ‫ولجػدِو ؼرِكة غرض الطٍرة داخو ضفرة الٍِب :‬
                                                                          ‫-ذدد الطٍرة الجُ ثرِد ثػدِلٌة .‬
                                  ‫-من لةامة ‪ ، Format‬ذدد امر ‪ Properties‬لجفجد مربع ذٍار‬
                                                                         ‫‪Picture Properties‬‬


                                                                                        ‫‪Picture‬‬
                                 ‫‪format‬‬                   ‫‪Properties‬‬
                                                                                       ‫‪Properties‬‬
‫اهتةء الحداول:‬
                                                                              ‫إلهتةء خدول :‬
                                                         ‫لم بإهتةء ضفرة خدِدة فةرغة .‬   ‫•‬
                       ‫من لةامة ‪ ، Table‬ذدد امر ‪ Insert‬ثم ‪ Table‬لجفجد مربع ذٍار‬         ‫•‬
                                                                     ‫‪Insert Table‬‬

                ‫‪Table‬‬                              ‫‪Insert‬‬                               ‫‪Table‬‬

‫الرحم الفجراعُ لي خدول خدِد ًٍ اربع خالِة ثجةلف من غمٍدِن وضفّن ،اصجخدم اِغة الكّم الفجراعّة لخّةرات محمٍغة ‪ Layout‬وهذلم‬
                                           ‫خّةر . ‪ Specify width‬اهكر زر ‪ ok‬صّجم إهتةء الحدول وِظٌر فُ الطفرة‬

                                                                                                                          ‫.‬
                                                                                     ‫الجػرف غلَ اذحةم الحداول :‬
                       ‫ِحب ان ثػرف هّفّة ثردِد ذحم الحدول لن غرض الحدول وفق الوشبة المبٍِة لرحم التةشة او غدد البنشالت .‬
                                                    ‫ً‬
    ‫بنشالت ‪ Pixels‬غوةضر الطٍرة او البنشالت ًُ اضغر وذدات ثشجخدم مػة لػرض المػلٍمةت غلَ التةشة ، ومن المرخد اهم صمػت‬
‫المطؽلد المشجخدم لٍضف درخة وعٍح الػرض غلَ التةشة . غلَ صبّو المثةل ، من درخةت الٍعٍح التةاػة درخجة 084 ‪800x600 , x‬‬
                                                                        ‫ً‬       ‫ً‬
                                 ‫046ًذى الدرخة ثتّر إلَ غدد البنشالت ( افكّة ‪ X‬راصّة ) المػروعة غلَ التةشة الجُ ثشجخدمٌة .‬
                                                          ‫ً‬
                            ‫غودمة ثردد غرض الحدول وفق هشبة مبٍِة مػّوة ، فإن الػرض صّنٍن هشبّة ، اي وفق هشبة غرض التةشة .‬
                                                         ‫ً ً‬
                                               ‫امة إذا ذددت الحدول وفق غدد مػّن من البنشالت فإهم ثردد غرعة مؽلكة للحدول.‬
                                                                                                          ‫لجغّّر غرض الحدول :‬
                                                                                       ‫عع مؤشر الن جةبة داخو الحدول .‬      ‫•‬
                                                              ‫من لةامة ‪ ، Table‬ذدد خّةر ‪ Select‬ثم . ‪Table‬‬
    ‫من لةامة ‪ ، Table‬ذدد خّةر ‪ Table Properties‬ثم ‪ Table‬لجفجد مربع ذٍار ‪Table Properties‬‬                                   ‫•‬
                                      ‫• فُ خزء ‪ ،Specify width‬ذدد خّةر ‪ In Pixels‬ثم اعبػ الكّمة غلَ 004.‬
                                                                    ‫• اهكر زر ‪ok‬وصّجم ثغّّر ذحم الحدول الذي اهتةثي من لبو .‬
                                                                                                                           ‫•‬
‫إعةفة الطٍت إلَ ضفرةت الٍِب :‬
‫إعةفة الطٍت إلَ مٍلػم امر فُ غةِة الشٌٍلة غّر اهي صجٍاخٌم متنلة ثردِد مٍلع او إهتةء ملفةت الطٍت الجُ ثرِد اصجخدامٌة . لرؤِة ( او لشمةع ) هّف ِمنن اصجخدام‬
                                                                                                                                        ‫الطٍت هةذد الجرشّوةت .‬
   ‫او اه ثر ِرمو‬                                                                       ‫ً‬                                   ‫ً‬
                 ‫وهظرا لن ملفةت ‪ MIDI‬ضغّرة هشبّة ، فإن ثتغّلٌة ِبدو هةهي ِجم ثلكةاّة . إذا الكّت هظرة غلَ محلد ملفةت اإلهجرهت المؤلجة غلَ خٌةزك صجحد ملفةً‬ ‫ً‬
                                               ‫امجداد الملف ‪ MIDI‬وًذى الملفةت ًُ ملفةت‪ MIDI‬الجُ ثشجؽّع اصجخدامٌة فُ صمةع الطٍت غلَ خٌةزك .‬
                                                               ‫إلعةفة اذد ملفةت – ‪ MIDI‬او اي هٍع آاخر من ملفةت الطٍت – إلَ مٍلع الٍِب الخةص بم :‬
                                                                                                  ‫ذدد وافجد الطفرة الجُ ثرِد ان ثغّف إلٌّة ملف الطٍت .‬       ‫•‬
                                                  ‫من لةامة ‪ ، File‬اخجر امر ‪ Properties‬لجفجد مربع ذٍار ‪Page Properties‬‬                                        ‫•‬


                                                                                                                                               ‫‪Page‬‬
                                                                              ‫‪File‬‬                        ‫‪Properties‬‬
                                                                                                                                             ‫‪Properties‬‬




                                                                           ‫•فُ خزء ‪ ، Background Sound‬اه جب اصم الملف الطٍثُ فُ مربع‬
                                                                              ‫هص ‪ ، Location‬اصجخدم زر . ‪ Browse‬إذا لم ثشجؽع ثذهر المٍلع‬
                                                                                                                                    ‫المرفٍظ فّي الملف .‬
                                                                                     ‫اهكر زر ‪ ok‬لجرفؾ اإلغدادات الجُ ذددثٌة وثغلق مربع الرٍار .‬       ‫•‬
                                                                         ‫• فُ خزء ‪ ، Loop‬ذدد غدد المرات الجُ ثرِدًة لجتغّو الملف الطٍثُ ثشجؽّع‬
                                                                           ‫ثردِد خةهة ‪ ، Forever‬ممة ِػوُ ان ثتغّو الملف الطٍثُ صّدوم ؼّلة غرض‬
                                                                                                                           ‫الطفرة الجُ ثغم ًذا الملف .‬
                                                                           ‫• لمػةِوة الطفرة مع الخلفّة الطٍثّة الخةضة بٌة ، اهكر غالمة ثبٍِب ‪preview‬‬
                                                                                                                       ‫داخو الوةفذة الراّشّة لفروهت بّج.‬
‫هّف ثػمو الرثبةؼةت :‬
  ‫غود غرض اي ضفرة وِب بٍاصؽة مشجػرض الٍِب الخةص بم ، ِكٍم المشجػرض بجفشّر الرثبةؼةت غلَ اهٌة‬
      ‫ثٍضّالت إلَ ملفةت او مٍارد اخرى غلَ اإلهجرهت . إذا هوت من مشجخدمُ هّجشنّب او إهجرهت إهشبلٍرر ،‬
   ‫آ‬
‫فشّجرٍل المؤشر بػد وعػي غلَ الرثبةط إلَ ِد بٌة إضبع مرفٍع ًذا المؤشر ِدل غلَ وخٍد ارثبةط إلَ مٍرد اخر‬
                                                                                          ‫غلَ اإلهجرهت‬
                              ‫ِجّد لم فروهت بّج إهتةء الرثبةؼةت الجُ ثرِدًة فُ ضفرةت الٍِب الخةضة بم‬
                                                                                        ‫اهٍاع الرثبةؼةت‬
                          ‫آ‬
   ‫ًوةك غدة اهٍاع من الرثبةؼةت فبػغٌة ِربػ إلَ ضفرةت داخو المٍلع وبػغٌة الخر ِربػ إلَ مٍالع اخرى‬
                ‫ً‬                                        ‫ً‬
‫وبػغٌة ِربػ إلَ غوٍان برِد الن جروهُ واخّرا الرثبةؼةت داخو هفس الطفرة و مةِشمَ اِغة إشةرة مرخػّة او‬
                                                                              ‫.‪Bookmark‬‬


                                      ‫صفحة داخل‬
                                        ‫الموقع‬


                               ‫بريد‬
                                                 ‫موقع ويب‬
                             ‫الكتروني‬
‫ً‬
                                                                          ‫: ولوبدا اول ب الرثبةؼةت إلَ ضفرةت داخو المٍلع‬
                                                 ‫‪Place in‬‬
‫‪Insert‬‬             ‫‪Hyperlink‬‬                         ‫‪this‬‬                                 ‫-لم بإهتةء ضفرة خدِدة .‬
                                                                        ‫.‬   ‫-اه جب الوص الذي ثرِد ان ثوتئ لي ارثبةؼةً‬
                                                ‫‪document‬‬
                                                                                                               ‫. ذدد الوص‬
              ‫-من لةامة ‪ ، Insert‬اخجر امر ‪ Hyperlink‬لجفجد مربع ذٍار. ‪Insert Hyperlink‬‬
       ‫فّفجد لم مربع ذٍار , من ‪ Look in‬ذدد مٍلع الطفرة الجُ ثرِدًة ان ثرثبػ إلَ ًذى النلمةت ثم اعغػ غلَ مٍافق.‬
‫اهتةء ارثبةط إلَ مٍالع وِب اخرى:‬
                                                                        ‫-لم بإهتةء ضفرة خدِدة .‬
                                                       ‫.‬  ‫-اه جب الوص الذي ثرِد ان ثوتئ لي ارثبةؼةً‬
                                                                                            ‫ذدد النلمةت.‬
            ‫-من لةامة ‪ ، Insert‬اخجر امر ‪ Hyperlink‬لجفجد مربع ذٍار . ‪Insert Hyperlink‬‬
         ‫-فُ خةهة ‪ ، Address‬اه جب الوص الجةلُ /‪: http://www.HIKMAHSCH.com‬‬
                                                                            ‫او اصم مٍلع اخر اهظر التنو .‬
                               ‫اهكر زر ‪ ok‬إلغالق مربع الرٍار وذفؾ الرثبةط .‬                           ‫-‬

                                        ‫‪Existing‬‬
‫‪Insert‬‬           ‫‪Hyperlink‬‬               ‫‪file or‬‬
                                        ‫‪web page‬‬
‫ل إهتةء ارثبةط إلَ برِد الن جروهُ :‬
‫هكٍم بجردِد الوص المراد اخراء الرثبةط الجتػّبُ لي وهغغػ هلم ِمّن و هخجةر‪ hyperlink‬فّظٌر‬
                                                                           ‫لوة مربع الرٍار‬
                                                                           ‫هخجةر الجبٍِب‬
                                                       ‫‪E-MAIL Address‬‬
                         ‫و هن جب الػوٍان البرِدي فُ الركو ‪e-mail address‬‬

                                  ‫‪Insert‬‬              ‫‪Hyperlink‬‬              ‫‪E-MAIL‬‬
                                                                             ‫‪Address‬‬
تعليم فرونت بيج

Contenu connexe

Similaire à تعليم فرونت بيج

Auto cad smart_book
Auto cad smart_bookAuto cad smart_book
Auto cad smart_book
Anas Ramadan
 
Introduction ( Html 1)
Introduction  ( Html 1)Introduction  ( Html 1)
Introduction ( Html 1)
Ahmed Hassan
 
الدوريات الالكترونية
الدوريات الالكترونيةالدوريات الالكترونية
الدوريات الالكترونية
Beni-Suef University
 

Similaire à تعليم فرونت بيج (16)

Auto cad smart_book
Auto cad smart_bookAuto cad smart_book
Auto cad smart_book
 
Typography تيبوجرافي المحاضرة الثانية
Typography تيبوجرافي المحاضرة الثانيةTypography تيبوجرافي المحاضرة الثانية
Typography تيبوجرافي المحاضرة الثانية
 
المحاضرة السادسة - فصل الألوان الإلكتروني
 المحاضرة السادسة - فصل الألوان الإلكتروني المحاضرة السادسة - فصل الألوان الإلكتروني
المحاضرة السادسة - فصل الألوان الإلكتروني
 
Ayaspell arabic spellchecker
Ayaspell arabic spellcheckerAyaspell arabic spellchecker
Ayaspell arabic spellchecker
 
Ayspell1
Ayspell1Ayspell1
Ayspell1
 
Word
WordWord
Word
 
بعض قواعد الإملاء الهامة Ast school
بعض قواعد الإملاء الهامة Ast schoolبعض قواعد الإملاء الهامة Ast school
بعض قواعد الإملاء الهامة Ast school
 
Introduction ( Html 1)
Introduction  ( Html 1)Introduction  ( Html 1)
Introduction ( Html 1)
 
نظام نور
نظام نورنظام نور
نظام نور
 
نظام نور.pdf
نظام نور.pdfنظام نور.pdf
نظام نور.pdf
 
الدوريات الالكترونية
الدوريات الالكترونيةالدوريات الالكترونية
الدوريات الالكترونية
 
مقارنة بين ثلاث لغات برمجة عربية
مقارنة بين ثلاث لغات برمجة عربيةمقارنة بين ثلاث لغات برمجة عربية
مقارنة بين ثلاث لغات برمجة عربية
 
Search engines محركات البحث
Search engines  محركات البحث Search engines  محركات البحث
Search engines محركات البحث
 
مهارات فن الإلقاء1
مهارات فن الإلقاء1مهارات فن الإلقاء1
مهارات فن الإلقاء1
 
Bolts, mechanical types and design and categories
Bolts, mechanical types and design and categoriesBolts, mechanical types and design and categories
Bolts, mechanical types and design and categories
 
design and construction of mechanical Bolts.pptx
design and construction of mechanical Bolts.pptxdesign and construction of mechanical Bolts.pptx
design and construction of mechanical Bolts.pptx
 

Plus de Samar Alnuaimy

الدرس الالكتروني
الدرس الالكترونيالدرس الالكتروني
الدرس الالكتروني
Samar Alnuaimy
 
كتاب العبقرية والإبداع و القيادة
كتاب العبقرية والإبداع و القيادةكتاب العبقرية والإبداع و القيادة
كتاب العبقرية والإبداع و القيادة
Samar Alnuaimy
 
علم نفسك التفكير
علم نفسك التفكيرعلم نفسك التفكير
علم نفسك التفكير
Samar Alnuaimy
 
كتاب البحث العلمي
كتاب البحث العلميكتاب البحث العلمي
كتاب البحث العلمي
Samar Alnuaimy
 
عمل ظل رائع لجسم ما
عمل ظل رائع لجسم ماعمل ظل رائع لجسم ما
عمل ظل رائع لجسم ما
Samar Alnuaimy
 
شرح لوحة تحكم المنتديات بأكثر من93 سؤال و جواب لكي تعم الفائدة على الجميع
شرح لوحة تحكم المنتديات بأكثر من93 سؤال و جواب لكي تعم الفائدة على الجميعشرح لوحة تحكم المنتديات بأكثر من93 سؤال و جواب لكي تعم الفائدة على الجميع
شرح لوحة تحكم المنتديات بأكثر من93 سؤال و جواب لكي تعم الفائدة على الجميع
Samar Alnuaimy
 
دورة متكاملة في النظام الجديد ويندوز 8
دورة متكاملة في النظام الجديد ويندوز 8دورة متكاملة في النظام الجديد ويندوز 8
دورة متكاملة في النظام الجديد ويندوز 8
Samar Alnuaimy
 
خاص بك Brushes لصناعة
خاص بك Brushes لصناعةخاص بك Brushes لصناعة
خاص بك Brushes لصناعة
Samar Alnuaimy
 
تقسيم الهارد ديسك
تقسيم الهارد ديسكتقسيم الهارد ديسك
تقسيم الهارد ديسك
Samar Alnuaimy
 
تطبيقات سويتش ماكس
تطبيقات سويتش ماكستطبيقات سويتش ماكس
تطبيقات سويتش ماكس
Samar Alnuaimy
 
النضج و التعلم
النضج و التعلمالنضج و التعلم
النضج و التعلم
Samar Alnuaimy
 

Plus de Samar Alnuaimy (14)

الدرس الالكتروني
الدرس الالكترونيالدرس الالكتروني
الدرس الالكتروني
 
كتاب العبقرية والإبداع و القيادة
كتاب العبقرية والإبداع و القيادةكتاب العبقرية والإبداع و القيادة
كتاب العبقرية والإبداع و القيادة
 
علم نفسك التفكير
علم نفسك التفكيرعلم نفسك التفكير
علم نفسك التفكير
 
كتاب البحث العلمي
كتاب البحث العلميكتاب البحث العلمي
كتاب البحث العلمي
 
عمل ظل رائع لجسم ما
عمل ظل رائع لجسم ماعمل ظل رائع لجسم ما
عمل ظل رائع لجسم ما
 
صنع ايكون
صنع ايكونصنع ايكون
صنع ايكون
 
لعمل كتاب
لعمل كتابلعمل كتاب
لعمل كتاب
 
شرح لوحة تحكم المنتديات بأكثر من93 سؤال و جواب لكي تعم الفائدة على الجميع
شرح لوحة تحكم المنتديات بأكثر من93 سؤال و جواب لكي تعم الفائدة على الجميعشرح لوحة تحكم المنتديات بأكثر من93 سؤال و جواب لكي تعم الفائدة على الجميع
شرح لوحة تحكم المنتديات بأكثر من93 سؤال و جواب لكي تعم الفائدة على الجميع
 
دورة متكاملة في النظام الجديد ويندوز 8
دورة متكاملة في النظام الجديد ويندوز 8دورة متكاملة في النظام الجديد ويندوز 8
دورة متكاملة في النظام الجديد ويندوز 8
 
خاص بك Brushes لصناعة
خاص بك Brushes لصناعةخاص بك Brushes لصناعة
خاص بك Brushes لصناعة
 
تقسيم الهارد ديسك
تقسيم الهارد ديسكتقسيم الهارد ديسك
تقسيم الهارد ديسك
 
صنع ايكون
صنع ايكونصنع ايكون
صنع ايكون
 
تطبيقات سويتش ماكس
تطبيقات سويتش ماكستطبيقات سويتش ماكس
تطبيقات سويتش ماكس
 
النضج و التعلم
النضج و التعلمالنضج و التعلم
النضج و التعلم
 

تعليم فرونت بيج

  • 1. ‫تقنية المعلومات‬ ‫تصميم المواقع اإللكترونية‬ ‫برنامج فرونت بيج‬ ‫م.سمر سلمان النعيمي‬
  • 2. ‫أهداف الوحدة‬ ‫-ان يتعرف الطالب كيفية التعامل مع‬ ‫اإلضافات‬ ‫• النصوص‬ ‫• الصور‬ ‫• الجداول‬ ‫• األصوات‬ ‫-ان يكتسب الطالب مهارة التعامل مع‬ ‫التنسيقات المختلفة للصفحة‬ ‫-أن يجيد الطالب إضافة االرتباطات التشعيبية‬ ‫بأنواعها‬ ‫• الى بريد الكتروني‬ ‫• الى صفحة ويب‬ ‫• الى ملف‬
  • 4. ‫اعةفة ثخؽّػ للطفرة‬ ‫ِمنووة ان هكٍم بجكشّم الطفرة لّنٍن المٍلع اه ثر ثرثّبة‬ ‫همة ِمنووة اخجّةر الجكشّم الموةصب لمرجٍى المٍلع‬ ‫و ِجم ذلم بةخجّةر‬ ‫‪layout tables and cells‬‬ ‫من الكةامة ‪table‬‬ ‫فّظٌر لوة شرِػ خةهبُ مجػدد الخّةرات ِمنووة اصجخدام اذدى ًذى‬ ‫الخّةرات‬ ‫‪Layout‬‬ ‫‪table‬‬ ‫‪tables and‬‬ ‫‪cells‬‬
  • 5. ‫اعةفة الشمةت الَ ضفرة الٍِب(‪(theme‬‬ ‫- من شرِػ الكٍاام هخجةر‬ ‫‪format‬‬ ‫ثم هكٍم بةخجّةر‬ ‫‪theme‬‬ ‫فّظٌ ر لو ة غل َ خةه ب التةش ة ش رِػ ِرج ٍي‬ ‫اهم ةط مخجلف ة م ن الخلفّ ةت ِمن ن اخجّ ةر‬ ‫اذداًة هخلفّة للمٍلع‬ ‫‪format‬‬ ‫‪theme‬‬
  • 6. ‫إعةفة الوص إلَ ضفرة الٍِب :‬ ‫ِجػةمو فروهت بّج مع إعةفة الوص بوفس صٌٍلة برامج مػةلحة النلمةت ، هو مة غلّم ًٍ ان ثن جب وصٍف ِجم لف‬ ‫ً‬ ‫الوص ثلكةاّة إلَ الشؽر الجةلُ بمحرد ان ثطو إلَ هٌةِة الشؽر الذي ثن جبي .‬ ‫لجبدا بن جةبة اي فكرة ثرِدًة :‬ ‫آ‬ ‫•إذا لم ثنن لدِم الن ضفرة فةرغة غلَ التةشة ، فلجكم بإهتةء واذدة.‬ ‫• غود المٍعع الذي ِظٌر فّي مؤشر الن جةبة ، اه جب الوص المؽلٍب‬ ‫• -اعغػ مفجةح اإلدخةل ‪ Enter‬واصجمر فُ ه جةبة اي هص . ل ثغغػ مفجةح اإلدخةل ‪ Enter‬غودمة‬ ‫ً‬ ‫ثطو إلَ هٌةِة الشؽر ، فكػ واضو الن جةبة وصّجم لف الوص ثلكةاّة إلَ الشؽر الجةلُ .‬ ‫ً‬ ‫ثم اهي لبد ان ثردد الوص الذي ثرِد ثغّّرى او إعةفة اي صمة إلّي ، مثال لجغّّر ذحم الوص الذي ه جبجي ، لم بمة‬ ‫ِلُ‬ ‫•ذدد هص‬ ‫•من لةامة ‪ ، Format‬ذدد امر . ‪ Font‬فُ محمٍغة ‪ ، Size‬اصجخدم شرِػ الجمرِر ذجَ ثطو إلَ‬ ‫خّةر 7 ثم ذددى ، اهكر بػد ذلم زر ‪ ، ok‬ل بد ان ِظٌر الوص لدِم بوفس الرحم المٍخٍد فُ التنو .‬ ‫ً‬ ‫ً‬ ‫بتنو غةم ، ِمورم فروهت بّج لدرا مػكٍل من ذرِة الخجّةر فُ ثردِد ذحم الوص الذي ثن جبي .‬
  • 7. ‫إعةفة ال لٍان والشمةت:‬ ‫آ‬ ‫والن ، لم بإعةفة بػظ الشمةت إلَ الوص ، ابدا بجغّّر لٍن الػوٍان :‬ ‫ولجغّّر لٍن الوص :‬ ‫• ذدد غوٍان الوص .‬ ‫• ان لةامة ‪ Format‬اخجر امر ‪ Font‬لجفجد مربع ذٍار ( ‪Font‬‬ ‫‪format‬‬ ‫‪font‬‬ ‫آ‬ ‫• افجد الكةامة الموشدلة ‪Color‬ذجَ ثظٌر لٍذة ال لٍان .‬ ‫•ذدد خّةر ‪ Red‬ثم اهكر زر ‪ ok‬لجغلق مربع ذٍار ‪ Font‬لجفجد مربع ذٍار ‪ِ Font‬حب الن ان ِظٌر غوٍان الفكرة بةللٍن الذمر .‬ ‫ً‬ ‫ً‬ ‫ً‬ ‫اِغة ِمنوم خػو الوص غرِغة او مةاال او اصفلي خػ .‬ ‫لحػو الوص غرِغةً‬ ‫:‬ ‫•ذدد النلمةت .‬ ‫ً‬ ‫• اهكر رمز ‪ِ Bold‬رمو ًذا الرمز ذرف ‪B‬المٍخٍد غلَ شرِػ الدوات .‬ ‫لحػو الوص مةاال :‬ ‫• ذدد النلمةت اي من النلمةت .‬ ‫اهكر رمز ‪ِ Italics‬رمو ًذا الرمز ذرف ‪ I‬المةاو المٍخٍد غلَ شرِػ الدوات .‬ ‫•‬ ‫وإلعةفة صؽر اصفو الوص :‬ ‫•ذدد النلمة .‬ ‫• اهكر رمز ‪ِ Underline‬رمو ًذا الرمز ذرف ‪ U‬المٍخٍد غلَ شرِػ الدوات .‬ ‫اهمةط الخػ والجةثّرات:‬ ‫• ذدد هلمة اي هلمة من الوص .‬ ‫• من لةامة ‪ ، Format‬ذدد امر ‪ Font‬لجفجد مربع ذٍار . ‪Font‬‬ ‫• فُ خزء ‪ِ ، Effects‬منوم ان ثرى الجةثّرات المجوٍغة الجُ ِجّرٌة لم ، همة ِجّد لم مربع المػةِوة ‪Preview‬‬ ‫رؤِة التنو الذي ِظٌر غلّي الوص بػد ثؽبّق اي ثةثّر من ثلم الجةثّرات .‬ ‫ل ذؾ الشؽرِن الظةًرِن فُ مربع المػةِوة ِجّرةن لم رؤِة الوص بةلوشبة للجةثّرات الجُ ثغّر من الٍعع الراصُ ، مثو ثةثّر‬ ‫اهخفةض ‪ subscript‬وارثفةع ‪ superscript‬الوص غن الشؽر.‬ ‫• مثال ذدد خّةري ‪ Caps Small‬و . ‪ Superscript‬اهكر زر ‪ ok‬لجغلق مربع الرٍار وثرى الجغّّرات‬ ‫ً‬ ‫الجُ اخرِجٌة غلَ الوص‬
  • 8. ‫‪From‬‬ ‫‪insert‬‬ ‫‪picture‬‬ ‫‪file‬‬ ‫إعةفة الطٍر بةصجخدام فروهت بّج:‬ ‫إلعةفة ضٍرة إلَ ضفرة الٍِب :‬ ‫-فُ فروهت بّج ، افجد ضفرة خدِدة داخو المٍلع الخةص بم .‬ ‫-من لةامة ‪ ، Insert‬ذدد خّةر ‪ Picture‬ثم ‪ From File‬لجفجد مربع ذٍار‬ ‫. ‪Picture‬‬ ‫-ذدد ملف الطٍرة الجُ ثرِد إدراخٌة فُ ضفرجم .‬ ‫-اهكر زر ‪ ok‬وصجظٌر الطٍرة فُ ضفرة الٍِب اهظر التنو .‬ ‫-من لةامة ‪ ، File‬ذدد امر ‪ save‬لجفجد مربع ذٍار ‪save as‬‬ ‫ثػدِو ملفةت الطٍر لدِم :‬ ‫من اإلغدادات الجُ ِمنوم الكّةم بٌة لجػدِو ملفةت الطٍر مة ِلُ :‬ ‫×الجرنم فُ ابػةد الطٍرة داخو الطفرة‬ ‫‪ x‬الجرنم فُ ؼرِكة المرةذاة‬ ‫×ثردِد إذا مة هةن صّجم غرض الطٍرة داخو الردود‬ ‫×إعةفة ارثبةط إلَ الطٍرة‬ ‫ولجػدِو ؼرِكة غرض الطٍرة داخو ضفرة الٍِب :‬ ‫-ذدد الطٍرة الجُ ثرِد ثػدِلٌة .‬ ‫-من لةامة ‪ ، Format‬ذدد امر ‪ Properties‬لجفجد مربع ذٍار‬ ‫‪Picture Properties‬‬ ‫‪Picture‬‬ ‫‪format‬‬ ‫‪Properties‬‬ ‫‪Properties‬‬
  • 9. ‫اهتةء الحداول:‬ ‫إلهتةء خدول :‬ ‫لم بإهتةء ضفرة خدِدة فةرغة .‬ ‫•‬ ‫من لةامة ‪ ، Table‬ذدد امر ‪ Insert‬ثم ‪ Table‬لجفجد مربع ذٍار‬ ‫•‬ ‫‪Insert Table‬‬ ‫‪Table‬‬ ‫‪Insert‬‬ ‫‪Table‬‬ ‫الرحم الفجراعُ لي خدول خدِد ًٍ اربع خالِة ثجةلف من غمٍدِن وضفّن ،اصجخدم اِغة الكّم الفجراعّة لخّةرات محمٍغة ‪ Layout‬وهذلم‬ ‫خّةر . ‪ Specify width‬اهكر زر ‪ ok‬صّجم إهتةء الحدول وِظٌر فُ الطفرة‬ ‫.‬ ‫الجػرف غلَ اذحةم الحداول :‬ ‫ِحب ان ثػرف هّفّة ثردِد ذحم الحدول لن غرض الحدول وفق الوشبة المبٍِة لرحم التةشة او غدد البنشالت .‬ ‫ً‬ ‫بنشالت ‪ Pixels‬غوةضر الطٍرة او البنشالت ًُ اضغر وذدات ثشجخدم مػة لػرض المػلٍمةت غلَ التةشة ، ومن المرخد اهم صمػت‬ ‫المطؽلد المشجخدم لٍضف درخة وعٍح الػرض غلَ التةشة . غلَ صبّو المثةل ، من درخةت الٍعٍح التةاػة درخجة 084 ‪800x600 , x‬‬ ‫ً‬ ‫ً‬ ‫046ًذى الدرخة ثتّر إلَ غدد البنشالت ( افكّة ‪ X‬راصّة ) المػروعة غلَ التةشة الجُ ثشجخدمٌة .‬ ‫ً‬ ‫غودمة ثردد غرض الحدول وفق هشبة مبٍِة مػّوة ، فإن الػرض صّنٍن هشبّة ، اي وفق هشبة غرض التةشة .‬ ‫ً ً‬ ‫امة إذا ذددت الحدول وفق غدد مػّن من البنشالت فإهم ثردد غرعة مؽلكة للحدول.‬ ‫لجغّّر غرض الحدول :‬ ‫عع مؤشر الن جةبة داخو الحدول .‬ ‫•‬ ‫من لةامة ‪ ، Table‬ذدد خّةر ‪ Select‬ثم . ‪Table‬‬ ‫من لةامة ‪ ، Table‬ذدد خّةر ‪ Table Properties‬ثم ‪ Table‬لجفجد مربع ذٍار ‪Table Properties‬‬ ‫•‬ ‫• فُ خزء ‪ ،Specify width‬ذدد خّةر ‪ In Pixels‬ثم اعبػ الكّمة غلَ 004.‬ ‫• اهكر زر ‪ok‬وصّجم ثغّّر ذحم الحدول الذي اهتةثي من لبو .‬ ‫•‬
  • 10. ‫إعةفة الطٍت إلَ ضفرةت الٍِب :‬ ‫إعةفة الطٍت إلَ مٍلػم امر فُ غةِة الشٌٍلة غّر اهي صجٍاخٌم متنلة ثردِد مٍلع او إهتةء ملفةت الطٍت الجُ ثرِد اصجخدامٌة . لرؤِة ( او لشمةع ) هّف ِمنن اصجخدام‬ ‫الطٍت هةذد الجرشّوةت .‬ ‫او اه ثر ِرمو‬ ‫ً‬ ‫ً‬ ‫وهظرا لن ملفةت ‪ MIDI‬ضغّرة هشبّة ، فإن ثتغّلٌة ِبدو هةهي ِجم ثلكةاّة . إذا الكّت هظرة غلَ محلد ملفةت اإلهجرهت المؤلجة غلَ خٌةزك صجحد ملفةً‬ ‫ً‬ ‫امجداد الملف ‪ MIDI‬وًذى الملفةت ًُ ملفةت‪ MIDI‬الجُ ثشجؽّع اصجخدامٌة فُ صمةع الطٍت غلَ خٌةزك .‬ ‫إلعةفة اذد ملفةت – ‪ MIDI‬او اي هٍع آاخر من ملفةت الطٍت – إلَ مٍلع الٍِب الخةص بم :‬ ‫ذدد وافجد الطفرة الجُ ثرِد ان ثغّف إلٌّة ملف الطٍت .‬ ‫•‬ ‫من لةامة ‪ ، File‬اخجر امر ‪ Properties‬لجفجد مربع ذٍار ‪Page Properties‬‬ ‫•‬ ‫‪Page‬‬ ‫‪File‬‬ ‫‪Properties‬‬ ‫‪Properties‬‬ ‫•فُ خزء ‪ ، Background Sound‬اه جب اصم الملف الطٍثُ فُ مربع‬ ‫هص ‪ ، Location‬اصجخدم زر . ‪ Browse‬إذا لم ثشجؽع ثذهر المٍلع‬ ‫المرفٍظ فّي الملف .‬ ‫اهكر زر ‪ ok‬لجرفؾ اإلغدادات الجُ ذددثٌة وثغلق مربع الرٍار .‬ ‫•‬ ‫• فُ خزء ‪ ، Loop‬ذدد غدد المرات الجُ ثرِدًة لجتغّو الملف الطٍثُ ثشجؽّع‬ ‫ثردِد خةهة ‪ ، Forever‬ممة ِػوُ ان ثتغّو الملف الطٍثُ صّدوم ؼّلة غرض‬ ‫الطفرة الجُ ثغم ًذا الملف .‬ ‫• لمػةِوة الطفرة مع الخلفّة الطٍثّة الخةضة بٌة ، اهكر غالمة ثبٍِب ‪preview‬‬ ‫داخو الوةفذة الراّشّة لفروهت بّج.‬
  • 11. ‫هّف ثػمو الرثبةؼةت :‬ ‫غود غرض اي ضفرة وِب بٍاصؽة مشجػرض الٍِب الخةص بم ، ِكٍم المشجػرض بجفشّر الرثبةؼةت غلَ اهٌة‬ ‫ثٍضّالت إلَ ملفةت او مٍارد اخرى غلَ اإلهجرهت . إذا هوت من مشجخدمُ هّجشنّب او إهجرهت إهشبلٍرر ،‬ ‫آ‬ ‫فشّجرٍل المؤشر بػد وعػي غلَ الرثبةط إلَ ِد بٌة إضبع مرفٍع ًذا المؤشر ِدل غلَ وخٍد ارثبةط إلَ مٍرد اخر‬ ‫غلَ اإلهجرهت‬ ‫ِجّد لم فروهت بّج إهتةء الرثبةؼةت الجُ ثرِدًة فُ ضفرةت الٍِب الخةضة بم‬ ‫اهٍاع الرثبةؼةت‬ ‫آ‬ ‫ًوةك غدة اهٍاع من الرثبةؼةت فبػغٌة ِربػ إلَ ضفرةت داخو المٍلع وبػغٌة الخر ِربػ إلَ مٍالع اخرى‬ ‫ً‬ ‫ً‬ ‫وبػغٌة ِربػ إلَ غوٍان برِد الن جروهُ واخّرا الرثبةؼةت داخو هفس الطفرة و مةِشمَ اِغة إشةرة مرخػّة او‬ ‫.‪Bookmark‬‬ ‫صفحة داخل‬ ‫الموقع‬ ‫بريد‬ ‫موقع ويب‬ ‫الكتروني‬
  • 12. ‫ً‬ ‫: ولوبدا اول ب الرثبةؼةت إلَ ضفرةت داخو المٍلع‬ ‫‪Place in‬‬ ‫‪Insert‬‬ ‫‪Hyperlink‬‬ ‫‪this‬‬ ‫-لم بإهتةء ضفرة خدِدة .‬ ‫.‬ ‫-اه جب الوص الذي ثرِد ان ثوتئ لي ارثبةؼةً‬ ‫‪document‬‬ ‫. ذدد الوص‬ ‫-من لةامة ‪ ، Insert‬اخجر امر ‪ Hyperlink‬لجفجد مربع ذٍار. ‪Insert Hyperlink‬‬ ‫فّفجد لم مربع ذٍار , من ‪ Look in‬ذدد مٍلع الطفرة الجُ ثرِدًة ان ثرثبػ إلَ ًذى النلمةت ثم اعغػ غلَ مٍافق.‬
  • 13. ‫اهتةء ارثبةط إلَ مٍالع وِب اخرى:‬ ‫-لم بإهتةء ضفرة خدِدة .‬ ‫.‬ ‫-اه جب الوص الذي ثرِد ان ثوتئ لي ارثبةؼةً‬ ‫ذدد النلمةت.‬ ‫-من لةامة ‪ ، Insert‬اخجر امر ‪ Hyperlink‬لجفجد مربع ذٍار . ‪Insert Hyperlink‬‬ ‫-فُ خةهة ‪ ، Address‬اه جب الوص الجةلُ /‪: http://www.HIKMAHSCH.com‬‬ ‫او اصم مٍلع اخر اهظر التنو .‬ ‫اهكر زر ‪ ok‬إلغالق مربع الرٍار وذفؾ الرثبةط .‬ ‫-‬ ‫‪Existing‬‬ ‫‪Insert‬‬ ‫‪Hyperlink‬‬ ‫‪file or‬‬ ‫‪web page‬‬
  • 14. ‫ل إهتةء ارثبةط إلَ برِد الن جروهُ :‬ ‫هكٍم بجردِد الوص المراد اخراء الرثبةط الجتػّبُ لي وهغغػ هلم ِمّن و هخجةر‪ hyperlink‬فّظٌر‬ ‫لوة مربع الرٍار‬ ‫هخجةر الجبٍِب‬ ‫‪E-MAIL Address‬‬ ‫و هن جب الػوٍان البرِدي فُ الركو ‪e-mail address‬‬ ‫‪Insert‬‬ ‫‪Hyperlink‬‬ ‫‪E-MAIL‬‬ ‫‪Address‬‬