1. ‫بسم اهلل الرمحن الرحيم‬
‫جامعة فلسطني األهلية‬
‫مقدمة يف لغة ‪HTML‬‬
‫1102-0102‬
‫حقوق الطبع حمفوظة‬
‫1‬

2. ‫‪ ٟ٘ HTML‬جٌٍغس جٌّٓطهىِس إلٔشحء طفكحش جإلٔطٍٔص . (ٚجٌىٍّس جنطظحٌ ٌـ ‪.)Language Markup Text Hyper‬‬
‫ٟٚ٘ ٌ١ٓص ٌغس ذٍِؿس ذحٌّؼٕٝ ٚجٌشىً جٌّطؼحٌف ػٍ١ٗ ٌٍغحش جٌرٍِؿس جألنٍٜ وٍغس ++‪ . C‬فٟٙ ِػالً ال ضكطٛٞ ػٍٝ ؾًّ‬
‫جٌطكىُ ٚجٌىٌٚجْ، ٚػٕى جٌكحؾس الْطهىجَ ًٖ٘ جٌؿًّ ٠ؿد ضؼّ١ٓ ش١فٍجش ِٓ ٌغحش أنٍٜ وـ ‪Java, JavaScript, CGI‬‬
‫... جٌم، وًٌه فٟٙ ال ضكطحؼ ئٌٝ ِطٍؾُ نحص ذٗ ‪ ٟ٘ٚ . Compiler‬غ١ٍ ٍِضرطس ذٕظحَ ضشغ١ً ِؼ١ٓ، ألٔٗ ٠طُ ضفٓ١ٍ٘ح‬
‫ٔف١ً ضؼٍ١ّحضٙح ِرحشٍز ِٓ لرً ِطظفف جإلٔطٍٔص ٚذغغ جٌٕظٍ ػٓ جٌٕظحَ جٌّٓطهىَ . ًٌٌه فٟٙ ٌغس ذٓ١طس ؾىجً، ٍْٚٙس جٌفُٙ‬‫ٚش‬
‫ٚجٌطؼٍُ ٚال ضكطحؼ ٌّؼٍفس ِٓرمس ذٍغحش جٌرٍِؿس ٚجٌٙ١ىٍ١س جٌّٓطهىِس ف١ٙح . ذً ٌذّح وً ِح ضكطحؾٗ ٘ٛ جٌمٍ١ً ِٓ جٌطفى١ٍ‬
‫جٌّٕطمٟ ٚضٍض١د جألفىحٌ.‬
‫ضطىْٛ ِفٍوجش ٌغس ‪ ِٓ Html‬ش١فٍجش ضّٓٝ ‪ TAGS‬أٞ جٌَْٛٛ . ٟٚ٘ ضٓطهىَ ذشىً أَٚجؼ ٚضىطد ذحٌظ١غس جٌطحٌ١س (ِٓ‬
‫جٌ١ٓحٌ ئٌٝ جٌ١ّ١ٓ) :-‬
‫فؼٍٝ ْر١ً جٌّػحي جٌُْٛ <‪ٓ٠ >B‬طهىَ ٌىطحذس جٌىٍّحش ذهؾ أْٛو ػٍ٠غ ‪ٚ Bold‬يٌه ذحٌشىً جٌطحٌٟ:‬
‫>‪<B> Text </B‬‬
‫<‪ >BR‬أٚ لى ضٓطهىَ ذىٍطح جٌكحٌط١ٓ ِػً‬ ‫ٕٚ٘حن ذؼغ جٌَْٛٛ جٌهحطس جٌطٟ ضٓطهىَ ذظٌٛز ِفٍوز ِػً ُْٚ ٔٙح٠س جٌٓطٍ‬
‫ُْٚ جٌفمٍز <‪ْٛٚ .>P‬ف ٕٔحلش ًٖ٘ جٌَْٛٛ ٚغ١ٍ٘ح ذحٌطفظ١ً فٟ ق١ٕٗ ئْ شحء هللا‬
‫كيف َبدأ...‬
‫خ وطحذس ٍِف ‪ HTML‬أ٠س ذٍجِؽ نحطس. ذً ٔكطحؼ فمؾ ئٌٝ ذٍٔحِؽ ٌطكٍ٠ٍ جٌٕظٛص جٌرٓ١طس ِٚؼحٌؿطٙح، ٚذٍٔحِؽ‬ ‫ال ٠ططً‬
‫جٌّفىٍز ‪ Notepad‬جٌّٛؾٛو فٟ ‪٠ Windows‬فٟ ذًٙج جٌغٍع . ٚوًٌه ٔكطحؼ ئٌٝ أقى ِطظفكحش جإلٔطٍٔص ‪ Firefox‬أٚ‬
‫‪ٌّ MS Internet Explorer‬ؼح٠ٕس جٌظفكحش جٌطٟ ٔمَٛ ذطظّ١ّٙح . ٚ ػٍ١ه فمؾ أْ ٔمَٛ ذكفع جٌٕض جٌّىطٛخ ذٍّف ٠كًّ‬
‫جالُْ جٌّّطى ‪ ‎html‬أٚ ‪‎htm‬‬
‫.‬ ‫.‬
‫ٚجٌؿى٠ٍ يوٍٖ أٔٗ ٠ٛؾى جٌؼى٠ى ِٓ جٌرٍجِؽ جٌطٟ ضٓطهىَ إلٔشحء طفكحش ‪ .Html‬وْٚ جٌكحؾس ٌّؼٍفس ًٖ٘ جٌٍغس ق١ع ٠مَٛ‬
‫جٌّٓطهىَ ِٓ نالٌٙح ذىطحذس جٌظفكحش ٚضظّ١ّٙح ذّح ضكٛ٠ٗ ِٓ ٔظٛص ٌِْٚٛحش ٚؾىج ٚي ق١ع ٠مَٛ جٌرٍٔحِؽ ػًّ جٌَْٛٛ‬
‫خ‬
‫جٌّٕحْرس ٚضكٛ٠ً ًٖ٘ جٌظفكحش ضٍمحت١ح ً ٚقفظٙح ذطٕٓ١ك ‪ .html‬أٞ أْ وٌٚ جٌّٓطهىَ ٠ٕكظٍ فٟ جٌىطحذس ٚجٌطظّ١ُ فمؾ، ًٖٚ٘‬
‫. ِٚٓ ًٖ٘‬ ‫جٌطٍ٠مس ػٍٝ ٌْٙٛطٙح ٍْٚػطٙح ٔٓر١حً، ئال أٟٔ ال أٔظف ذحْطهىجِٙح ٌّٓ ٠ٍ٠ى ِؼٍفس ًٖ٘ جٌٍغس ٚجٌطّىٓ ِٕٙح‬
‫جٌرٍجِؽ:‬
‫-‬ ‫,‪MS – Front Page‬‬
‫-‬ ‫,‪Dream Weaver‬‬
‫-‬ ‫‪Kompozer‬‬
‫2‬

3. ‫قبم أٌ َبدأ‬
‫قٕٓحً، ٌى٠ه ِكٌٍ ٔظٛص ٌىطحذس ٍِفحش ‪ٌٚ HTML‬ى٠ه ِطظفف ئٔطٍٔص ٌّؼح٠ٕطٙح، ٌٚى٠ه ًٖ٘ جٌىٌِٚ جٌطٟ ْطٕطٍك ِؼٙح‬
‫ئٌٝ ػحٌُ ضظّ١ُ طفكحش جٌٛ٠د. ً٘ ً٘ج ٠ىفٟ؟ ذٍأ٠ٟ جٌّطٛجػغ، ال.‬
‫. ِح ٌأ٠ه فٟ أْ ضفىٍ‬ ‫ضكطحؼ وجتّح ً ٚأذىجً ئ ٌٝ ضطر١ك ِح ضطؼٍّٗ ذظٌٛز ػٍّ١س أوػٍ ِٓ ِؿٍو جألِػٍس جٌّىٌؾس فٟ جٌىٌِٚ‬
‫. ِٚغ ضمىِه فٟ‬ ‫ذّٛػٛع ِح ٠ٓطٙٛ٠ه ٚضكد أْ ضطؼحؽٝ ذٗ؟ ٚضه١ً أٔه ْطمَٛ ذأشحء ِٛلغ ٚ٠د ػٕٗ ذظٌٛز ٚجلؼ١س‬
‫جٌىٌِٚ لُ ذططر١ك ِح ف١ٙح ػٍٝ طفكحضه . ْطؿى جٌىػ١ٍ ِٓ جٌّطؼس فٟ ً٘ج، ْٚطٍٓ ؾىجً ػٕىِح ضٍٜ طفكطه ضطرٌٍٛ أِحَ ػ١ٕ١ه‬
‫٠ِٛح ً ذؼى ٠َٛ، ٚجألُ٘ ِٓ ً٘ج وٍٗ ٘ٛ أٔه ْطىطشف أٞ غغٍجش فٟ جْط١ؼحذه ًٌٖٙ جٌىٌِٚ (ٚػٕى٘ح ِٓ جٌّإوى أٔه ْطمَٛ‬
‫ذطالف١ٙح) .‬
‫ٔاآلٌ... نُبدأ‬
‫المحتوى‬ ‫الدرس‬
‫ضؼٍ٠ف ٍِف ‪ٚ Html‬جٌَْٛٛ جٌٍت١ٓ١س ف١ٗ، ئٔشحء طفكس ٚ٠د ذٓ١طس‬ ‫‪ ‬جألٚي: جألْحْ١حش‬
‫ضٕٓ١ك جٌظفكس، أػف ٌظفكطه ذؼغ جٌك١ٛ٠س ذحْطهىجَ جألٌٛجْ ٚجٌهٍف١حش‬ ‫‪ ‬جٌػحٟٔ: جألٌٛجْ‬
‫جٌطكىُ ذحٌهطٛؽ فٟ جٌظفكس، ئنط١حٌ أٔٛجػٙح ٚأقؿحِٙح ٚضٕٓ١محضٙح‬ ‫‪ ‬جٌػحٌع: جٌهطٛؽ‬
‫لُ ذطٕٓ١ك ٚضٕظ١ُ طفكطه، ٚجْطهىَ جٌمٛجتُ ٌطٍض١د ذ١حٔحضه‬ ‫‪ ‬جٌٍجذغ: جٌفمٍجش ٚجٌمٛجتُ‬
‫ئوٌجؾٙح، جٌطكىُ ذأقؿحِٙح ٚأذؼحو٘ح. أٔٛجع ٍِفحش جٌظٌٛ فٟ جٌٛ٠د‬ ‫‪ ‬جٌهحِّ: جٌظٌٛ ٚجٌٍِْٛحش‬
‫... و١ف ٚطٍص ئٌٝ ٕ٘ح؟؟؟ ذحٌٕمٍ ػٍٝ ٚطٍس ضشؼر١س!‬ ‫‪ ‬جٌٓحوِ: جٌٍٚجذؾ ٚجٌٛطالش جٌطشؼر١س‬
‫ٌضد ذ١حٔحضه ػّٓ جٌؿىجٚي، ٚضكىُ ذشىً طفكطه ذظٌٛز فؼحٌس‬ ‫‪ ‬جٌٓحذغ: جٌؿىجٚي‬
‫ذال ضؼٍ١ك ... فحٌؼٕٛجْ ٠ىفٟ‬ ‫‪ ‬جٌػحِٓ: َْٚٛ ... ِٓ ٕ٘ح ٕٚ٘حن‬
‫جألٌق جٌىجتُ ٌّظّّٟ طفكحش جٌٛ٠د ٚوًٌه جٌٍغس جٌؼٍذ١س‬ ‫‪ ‬جٌطحْغ: جٌَْٛٛ جٌهحطس ٚجٌٍغس جٌؼٍذ١س‬
‫3‬

4. ‫اندزض األٔل: األظاظياث‬
‫أ٘ال ْٚٙال ذه ئٌٝ جٌىٌِ جألٚي ِٓ وٌِٚ ‪ْٛ .HTML‬ف ألَٛ فٟ ً٘ج جٌىٌِ ذٍٓو جٌَْٛٛ جألْحْ١س ٌظفكس‬‫ً‬ ‫ً‬
‫جٌٛ٠د ِٕٚحلشطٙح ِؼه ٚجقىجً ضٍٛ ج٢نٍ. ٌٕظً فٟ جٌٕٙح٠س ئٌٝ ئٔشحء طفكس ٚ٠د ذٓ١طس.‬
‫ٌٕأنً جٌَْٛٛ جٌطحٌ١س:‬
‫ٔظى انبدايت‬ ‫ٔظى انُٓايت‬
‫>‪<HTML‬‬ ‫>‪<‎HTML‬‬
‫/‬
‫>‪<HEAD‬‬ ‫>‪<‎HEAD‬‬
‫/‬
‫>‪<TITLE‬‬ ‫>‪<‎TITLE‬‬
‫/‬
‫>‪<BODY‬‬ ‫>‪<‎BODY‬‬
‫/‬
‫ِحيج ضالقع؟ أْ وً ِٕٙح ٠طأٌف ِٓ َٚؼ ِٓ جٌَْٛٛ أقىّ٘ح ُْٚ جٌرىج٠س، ٚج٢نٍ ُْٚ جٌٕٙح٠س . ٚ٠طّ١ُ ُْٚ جٌٕٙح٠س‬
‫ذٛؾٛو جٌٍُِ / . ضأًِ جٌٍُْ جٌطحٌٟ، فٙٛ ٠ؼطٟ فىٍز ػٓ ضٍو١د ٍِف ‪Html‬‬
‫ئيْ فٍّف ‪٠ Html‬رىأ وجتّح ً ذحٌُْٛ <‪ٔ >HTML‬طٟٙ ذحٌُْٛ <‪ .>‎HTML‬ال ضٕٓٝ يٌه!‬
‫/‬ ‫ٚٞ‬
‫أِح جٌُْٛ <‪ >HEAD‬ف١كىو ذىج٠س جٌّمطغ جًٌٞ ٠كطٛٞ ػٍٝ جٌّؼٍِٛحش جٌهحطس ذطؼٍ٠ف جٌظفكس . وحٌؼٕٛجْ جٌظحٍ٘‬
‫ػٍٝ شٍ٠ؾ ػٕٛجْ جٌّطظفف . ًٚ٘ج جٌؼٕٛجْ ذىٌٖٚ ٠كطحؼ ألْ ٠ٛػغ ذ١ٓ جٌّْٛ١ٓ : <‪>‎TITLE< … >TITLE‬‬
‫/‬
‫ٚذحٌطرغ ٠ؿد وطحذس جٌُْٛ <‪ٌ >‎HEAD‬ىٟ ٕٟٔٙ ً٘ج جٌّمطغ.‬
‫/‬
‫ٔأضٟ ئٌٝ جٌُْٛ <‪ٚ >BODY‬جًٌٞ ٠طُ وطحذس ٔظٛص طفكس جٌٛ٠د ػّٕٗ، ذحإلػحفس ئٌٝ ئوٌجؼ جٌظٌٛ ٚجٌؿىجٚي‬
‫ٚذحلٟ ِكطٛ٠حش جٌظفكس. ٚ٘ٛ أ٠ؼح ً ٠كطحؼ ئٌٝ ُْٚ جإلٔٙحء <‪>‎BODY‬‬
‫/‬
‫ِح ٌأ٠ه ٌٛ ٔرىأ ذططر١ك ًٖ٘ جٌّؼٍِٛحش ذظٌٛز ػٍّ١ٗ؟ ٘١ح… لُ ذفطف ذٍٔحِؽ جٌُ فىٍز ٚجوطد ِح ٠ٍٟ:‬
‫4‬

5. ‫>‪<HTML‬‬
‫>‪<HEAD‬‬
‫>‪<TITLE‬‬
‫‪This is a test Webpage‬‬
‫>‪<‎TITLE‬‬
‫/‬
‫>‪<‎HEAD‬‬
‫/‬
‫>‪<BODY‬‬
‫‪Wow, I'm writing my first webpage‬‬
‫>‪<‎BODY‬‬
‫/‬
‫>‪<‎HTML‬‬
‫/‬
‫ٚج٢ْ لُ ذكفع ِح وطرطٗ فٟ ٍِف ٚذأٞ جُْ ضهطحٌٖ . ٚال ضٕٓٝ أْ جالِطىجو جٌّٓطهىَ فٟ أّْحء ٍِفحش ‪ٛ٘ HTML‬‬
‫‪ .htm‬أٚ ‪ِ .html‬ػالً أٔح جنطٍش جالُْ ‪ ِٓٚ ‎ st_file.htm‬جألفؼً أْ ضمَٛ ذأشحء ِؿٍى ِٓطمً ػٍٝ جٌمٍص جٌظٍد‬
‫1‬
‫ذحالُْ‬ ‫ٌىٟ ضكفع ذٗ ٍِفحضه فًٙج ٠ًٓٙ ػٍ١ه ػٍّ١س جْطٍؾحػٙح ٌٍؼٍع أٚ جٌطكى٠ع ٌٚ١ىٓ ً٘ج جٌّؿٍى ِػالً‬
‫‪( C:htmfiles‬أٚ ذأٞ جُْ ٠كٍٛ ٌه).‬
‫قحْ ٚلص جٌؼٍع، ٌىٟ ٔشح٘ى ٔط١ؿس ِح وطرٕحٖ. لُ ذطشغ١ً ِطظفف جإلٔطٍٔص جًٌٞ ضٓطهىِٗ . فايج وحْ ‪ Firefox‬جنطٍ‬
‫جألٍِ ‪ ِٓ …File Open‬لحتّس ‪ .File‬أِح فٟ ‪ MS Internet Explorer‬فحنطٍ جألٍِ ‪ ِٓ …Open‬لحتّس ‪ .File‬غُ‬
‫قىو جٌّٓحٌ جًٌٞ ٠ٛؾى ذٗ جٌٍّف. أٔح شهظ١ح ً لّص ذطكى٠ى جٌّٓحٌ جٌطحٌٟ:‬
‫‪C:htmfiles1st_file.htm‬‬
‫ٚيٌه ؽرؼح ً قٓد جالفطٍجػحش جٌٓحذمس جٌطٟ جضرؼطٙح ػٕى ضهُ٠ٓ جٌٍّف . ًٚ٘ج ِح قظٍص ػٍ١ٗ:‬
‫ِٚحيج ػٕه؟ ً٘ قظٍص ػٍٝ ٔفّ جٌٕط١ؿس؟ ئيْ ِرٍٚن، ٌمى لّص ذأشحء أٚي طفكس ٚ٠د نحطس ذه.‬
‫ٚلرً أْ ٔٓطٍّ أٌ٠ى أْ أٔرٙه ئٌٝ ذؼغ جٌّالقظحش ػٕى وطحذس طفكحش جٌٛ٠د:‬
‫‪ UPPERCASE‬أٚ جألقٍف جٌظغ١ٍز‬ ‫ال ٠ٛؾى فٍق ذ١ٓ وطحذس جٌَْٛٛ ذحألقٍف جإلٔؿٍ١ُ٠س جٌىر١ٍز‬ ‫‪‬‬
‫‪ًٌٌ .lowercase‬ه ضٓطط١غ جٌىطحذس ذأٞ شىً ِّٕٙح أٚ قطٝ جٌىطحذس ذىٍ١ّٙح.‬
‫ئْ جٌّطظفكحش ال ضأنً ذؼ١ٓ جالػطرحٌ جٌفٍجغحش جٌُجتىز أٚ ئشحٌجش ٔٙح٠س جٌفمٍجش (أٞ ػٕىِح ضمَٛ ذؼغؾ ِفطحـ‬ ‫‪‬‬
‫‪ )Enter‬جٌطٟ ضؿى٘ح ًٖ٘ جٌّطظفكحش فٟ ٍِف ‪ٚ .Html‬ذؼرحٌز أنٍٜ فاْ ذحْططحػطه وطحذس ٍِفه جٌٓحذك‬
‫ذحٌشىً جٌطحٌٟ:‬
‫>‪<HTML><HEAD><TITLE> This is a test Webpage </TITLE></HEAD><BODY‬‬
‫‪Wow, I'm writing my first webpage </BODY></HTML>‎‬‬
‫5‬

6. ‫أٚ ذحٌشىً جٌطحٌٟ:‬
‫>‪<HTML‬‬
‫>‪<HEAD‬‬
‫>‪<TITLE‬‬
‫‪This‬‬
‫‪is a‬‬
‫‪test‬‬
‫‪Webpage‬‬
‫>‪<‎TITLE‬‬
‫/‬
‫>‪<‎HEAD‬‬
‫/‬
‫>‪<BODY‬‬
‫,‪Wow‬‬
‫‪I'm‬‬
‫‪writing‬‬
‫‪my‬‬
‫‪first‬‬
‫‪webpage‬‬
‫>‪<‎BODY‬‬
‫/‬
‫>‪<‎HTML‬‬
‫/‬
‫أٚ قطٝ ذًٙج جٌشىً:‬
‫>‪<HTML> <HEAD> <TITLE‬‬
‫‪This is a test Webpage‬‬
‫>‪<‎TITLE‬‬
‫/‬
‫>‪<‎HEAD‬‬
‫/‬
‫>‪<BODY‬‬
‫‪Wow, I'm writing my first webpage‬‬
‫>‪<‎BODY‬‬
‫/‬
‫>‪<‎HTML‬‬
‫/‬
‫…‬ ‫ٚفٟ وً جٌكحالش ْطكظً ػٍٝ ٔفّ جٌٕط١ؿس . ٚئيج وٕص ِٓ ضٍه جٌٕٛػ١س ِٓ جٌٕحِ جٌطٟ ال ضظىق وً ِح ٠محي‬
‫ضٓطط١غ أْ ضؿٍخ يٌه ذٕفٓه!!! ٘١ح ؾٍخ.‬
‫ً‬
‫ٌىٓ ً٘ج ال ٠ؼٕٟ أْ جٌفمٍز جٌّىٛٔس ِػال ِٓ ػشٍز أْطٍ ْطّطى ئٌٝ ػىز أِطحٌ ذؼٍع جٌشحشس . وال ذحٌطرغ ألْ جٌّطظفف‬
‫ْ١مَٛ ذؼًّ جٌطفح ف ضٍمحتٟ ٌٙح ذكٓد ػٍع جٌشحشس، ِّٙح وحْ ِمىجٌ ً٘ج جٌؼٍع.‬
‫ٚج٢ْ لى ضطٓحءي، ئيْ و١ف ٠ّىٓ جٌطكىُ ذّمىجٌ جٌٕض جٌّىطٛخ فٟ وً ْطٍ ٚو١ف ٠ّىٓ ضكى٠ى ٔٙح٠س جٌفمٍز ٚذىج٠س‬
‫جٌفمٍز جٌطٟ ضٍ١ٙح؟ ْإجي ٚؾ١ٗ!!! ٚجإلؾحذس ػٍ١ٗ ٟ٘:‬
‫ْٛف ٔٓطهىَ جٌُْٛ <‪ٌ >BR‬طكى٠ى جٌٕٙح٠س ٌٍٓطٍ. ٚجٌرىء ذٓطٍ ؾى٠ى ( القع أْ ً٘ج جٌُْٛ ِفٍو، أٞ ٌ١ّ ٌٗ ُْٚ‬
‫ٔٙح٠س).‬
‫ٚٔؼٛو ئٌٝ جٌّػحي جٌٓحذك، لُ ذطؼى٠ً جٌٍّف ٌىٟ ٠ظرف ذحٌشىً جٌطحٌٟ‬
‫6‬

7. <HTML>
<HEAD>
<TITLE>
This is a test Webpage
<‎TITLE>
/
<‎HEAD>
/
<BODY>
Wow, <BR> I'm writing my <BR>‎
first webpage
<‎BODY>
/
<‎HTML>
/
ٓ‫> جًٌٞ ٠مَٛ ضمٍ٠رح ً ذٕفّ ػًّ جٌُْٛ جٌٓحذك أٞ أٔٗ ٠ٕٟٙ جٌٓطٍ أٚ جٌفمٍز ٚ٠رىأ ذٓطٍ ؾى٠ى ٌى‬P< ٌُْٛ‫ٕٚ٘حن أ٠ؼح ج‬
‫ِغ ئػحفس ْطٍ ئػحفٟ فحٌؽ ذ١ٓ جٌفمٍجش. جٌُّ٠ى ػٓ ً٘ج جٌُْٛ فٟ جٌىٌِ جٌٍجذغ جٌفمٍجش‬
<HTML>
<HEAD>
<TITLE>
This is a test Webpage
<‎TITLE>
/
<‎HEAD>
/
<BODY>
Wow, <P> I'm writing my <P>‎
first webpage
<‎BODY>
/
<‎HTML>
/
7

8. ‫أِح جٌفٍجغحش فطؼطرٍ ٌَِٛجً نحطس ًٌٌه ال ٔٓطط١غ جٌطكىُ ذٙح ٚذؼىو٘ح ئال ذحْطهىجَ جٌُْٛ ;‪ٚ( ‎&nbsp‬جألقٍف ٟ٘‬
‫جنطظحٌ ٌٍؼرحٌز ‪ٚ .)Non Breakable Space‬ئيج أٌوش ئونحي ػىز فٍجغحش ذ١ٓ ٔض ٚآنٍ ِح ػٍ١ه ئال وطحذس ً٘ج‬
‫جٌُْٛ ذٕفّ ػىو جٌفٍجغحش جٌّطٍٛخ. وّح ٠ؿد ػٍ١ه جٌطم١ى ذحألقٍف جٌظغ١ٍز ٕ٘ح.‬
‫ئيْ ٌٕؼى ئٌٝ جٌّفىٍز ٚٔىطد ٍِفٕح ذحٌشىً جٌطحٌٟ :‬
‫>‪<HTML‬‬
‫>‪<HEAD‬‬
‫>‪<TITLE‬‬
‫‪This is a test Webpage‬‬
‫>‪<‎TITLE‬‬
‫/‬
‫>‪<‎HEAD‬‬
‫/‬
‫>‪<BODY‬‬
‫‪Wow, &nbsp; &nbsp; &nbsp;‎‬‬
‫‪I'm &nbsp; &nbsp; &nbsp;writing &nbsp; &nbsp;‎‬‬
‫‪‎ nbsp; my &nbsp; &nbsp; &nbsp; first &nbsp; &nbsp; &nbsp; webpage‬‬
‫&‬
‫>‪<‎BODY‬‬
‫/‬
‫>‪<‎HTML‬‬
‫/‬
‫ٚذّٕحْرس جٌكى٠ع ػٓ جٌٍَِٛ جٌهحطس فٕٙحن جٌؼى٠ى ِٓ ًٖ٘ جٌٍَِٛ ٚجٌطٟ ٠ؿد أْ ضىطد ذظٌٛز ِؼ١ٕس‬
‫ٚذحْطم وجَ جٌَْٛٛ ٌٚ١ّ ِرحشٍز ذظٌٛضٙح جٌؼحو٠س . نً ِػال ئشحٌضٟ أورٍ ِٓ ٚأطغٍ ِٓ ٚئشحٌز‬
‫جاللطرحِ ". وً ًٖ٘ جإلشحٌجش ضٓطهىَ أطالً ِغ جٌَْٛٛ فٟٙ ِكؿَٛز ػّٓ ِفٍوجش ٌغس ‪HTML‬‬
‫ِٚٓ جٌهطأ جْطهىجِٙح ذظٌٛضٙح جٌظٍ٠كس ٌثال ٠إوٞ يٌه ئٌٝ قىٚظ ِشحوً فٟ ؽٍ٠مس ػٍع‬
‫جٌظفكس. وًٌه فاْ ٕ٘حن ٌَِٛجً غ١ٍ ِٛؾٛوز أْحْحً ػٍٝ ٌٛقس جٌّفحض١ف وٍُِ قمٛق جٌطرغ © ٌُِٚ‬
‫جٌؼالِس جٌّٓؿٍس ® ٚٔكطحؼ ئٌٝ ًٖ٘ جٌطٍ٠مس (ؽٍ٠مس جٌَْٛٛ) ٌىطحذطٙح.‬
‫8‬

9. ‫ٚئٌ١ه ؾىٚي ذرؼغ ًٖ٘ جٌٍَِٛ ِْٚٚٛٙح جٌّىحفثس . ٚأٌفص ٔظٍ ن ئٌٝ أٔٙح ضىطد وّح ٟ٘ فٟ جٌؿىٚي‬
>< ٟ‫ٚذىْٚ ئشحٌض‬
< &lt;
> &gt;
& &amp;
" &quot;
&shy;
© &copy;
™ &#153;
¼ &frac14;
½ &frac12;
¾ &frac34;
® &reg;
± &plusmn;
µ &micro;
¶ &para;
· &middot;
¢ &cent;
£ &pound;
¥ &yen;
¿ &iquest;
° &deg;
¦ &brvbar;
§ &sect;
¹ &sup1;
² &sup2;
³ &sup3;
« &laquo;
» &raquo;
.‫ٚطٍٕح ئٌٝ جٌٕٙح٠س... ٔٙح٠س جٌىٌِ جألٚي. أضّٕٝ أْ ضىْٛ لى ٚؾىش ف١ٗ ِٓ جٌّطؼس ٚجٌفحتىز‬
9

10. ‫اندزض انثاَي: األنٕاٌ - أظف نصفحخك بعط انحيٕيت‬
‫أ٘الً ْٚٙالً ذه ئٌٝ جٌىٌِ جٌػحٟٔ ِٓ وٌِٚ ‪ِٚ .HTML‬ف ٔمَٛ فٟ ً٘ج جٌىٌِ ذحٌطؼٍف ػٍٝ جٌهظحتض جٌطٟ ٠ّىٓ‬
‫ئػحفطٙح ئٌٝ جٌُْٛ <‪ ِٓ >BODY‬أؾً جٌطكىُ ذحٌشىً جٌؼحَ ٌٍظفكس، ٚنظٛطح ف١ّح ٠طؼٍك ذحألٌٛجْ.‬
‫ؽرؼح ً أٔص ال ٌَص ضًوٍ جٌظفكس جٌطٟ لّٕح ذىطحذطٙح فٟ جٌىٌِ جألٚي . طفكس ذٓ١طس ذهٍف١س ٌِحو٠س ٚنؾ طغ١ٍ ٔٓر١ح ً ٌٛٔٗ‬
‫أْٛو. ًٖٚ٘ ٟ٘ جإلػىجوجش جإلفطٍجػ١س جٌطٟ ٠ؼطّى٘ح جٌّطظفف ػٕىِح ال ٔمَٛ ٔكٓ ذطكى٠ى ئػىجوجش أنٍٜ . (ٌذّح ضمٛي : أًٖ٘‬
‫طفكس ئٔطٍٔص! أ٠ٓ جألٌٛجْ ٚجٌٍِْٛحش ٚجٌهطٛؽ جٌؿّ١ٍس ٚجٌطٕٓ١محش جٌطٟ ٍٔج٘ح فٟ طفكحش جإلٔطٍٔص؟ ِؼه قك ٌىٓ‬
‫ِٙالً فّح ٌَٕح فٟ جٌرىج٠س).‬
‫ْٛف ٔٓطٍّ ذحْطهىجَ طفكطٕح ًٖ٘ ٌطٛػ١ف أِػٍس ً٘ج جٌىٌِ أ٠ؼحً، ٌىٓ ٌٓ ألَٛ ذطىٍجٌ وطحذس َْٚٛ جٌرىج٠س ؽحٌّح أْ ػٍّٕح‬
‫<‪.>‎ BODY< ... >BODY‬‬
‫/‬ ‫٠طٍوُ فٟ جٌؿُء جٌّهظض ٌّكطٛ٠حش جٌظفكس ٔفٓٙح أٞ ػّٓ جٌّْٛ١ٓ‬
‫ئيْ ٌٕرىأ جٌؼًّ!‬
‫ٔطٍك وٍّس نحط١س (‪ )Attribute‬ػٍٝ جٌطؼحذ١ٍ جٌطٟ ضؼحف ئٌٝ جٌَْٛٛ، ِٓ أؾً ضكى٠ى جٌى١ف١س أٚ جٌشىً جًٌٞ ضؼًّ ذٙح ًٖ٘‬
‫جٌَْٛٛ. ٚذؼرحٌز أنٍٜ فاْ جٌُْٛ ٠مَٛ ذانرحٌ جٌّطظفف ػٓ جٌؼًّ جًٌٞ ٠ؿد جٌم١حَ ذٗ أِح جٌهحط١س فطكىو جٌى١ف١س جٌطٟ ْ١طُ‬
‫ذٙح أوجء ً٘ج جٌؼًّ.‬
‫ضأًِ جٌش١فٍز جٌطحٌ١س:‬
‫‪‎ BODY BGCOLOR="FFFFFF">‎‬‬
‫<‬
‫...‬
‫>‪<‎ BODY‬‬
‫/‬
‫ٌمى لّص ئػحفس جٌهحط١س ‪ BGCOLOR‬ئٌٝ جٌُْٛ <‪ ٟ٘ٚ ، >BODY‬ضمَٛ ذطكى٠ى ٌْٛ جٌهٍف١س ٌٍظفكس . أِح ‪FFFFFF‬‬ ‫خ‬
‫فٟٙ جٌم١ّس جٌطٟ ضّػً جٌٍْٛ جٌّهطحٌ ٚ٘ٛ ٕ٘ح جٌٍْٛ جألذ١غ، (القع أٔٙح ِىطٛذٗ ذ١ٓ ئشحٌضٟ " " ) ٌٚٛ أٌوش ضّػ١ً جٌٍْٛ‬
‫......‬ ‫جٌفحضف‬ ‫9966‪ ٌٍْٛ CC‬جألٌَق‬ ‫000000. أٚ جٌٍُِ‬ ‫جألْٛو ٌىطرص جٌٍُِ‬
‫فّٓ أ٠ٓ ؾحءش ًٖ٘ جٌم١ُ، ٚو١ف؟... ضحذغ جٌمٍجءز ْٚٛف ضؼٍف‬
‫انقهيم عٍ األنٕاٌ...‬
‫ضالقع أْ جٌم١ُ جٌٓحذمس ِىٛٔس ِٓ ْطس ٌَِٛ، ٟٚ٘ ِىطٛذس ذحٌظ١غس جٌطحٌ١س:-‬
‫ٕ٘حن غالغس أٌٛجْ أْحْ١س ٟ٘ جألقٍّ ٚجألنؼٍ ٚجألٌَق، ٌٚىً ِٕٙح ٠ٛؾى 652 وٌؾس ٌٛٔ١س ٚ٠ؼرٍ ػٓ ًٖ٘ جٌىٌؾحش‬
‫ذحألٌلحَ ِٓ 000 ٚقطٝ 552. ِٚٓ نالي ُِؼ ًٖ٘ جألٌٛجْ ذىٌؾحضٙح جٌٍٛٔ١س جٌّهطٍفس ٔكظً ػٍٝ جألٌٛجْ جألنٍٜ.‬
‫* ئْ أٞ ٌْٛ ٘ٛ ُِ٠ؽ - ٚذٕٓرس ِؼ١ٕس ِٓ جٌىٌؾحش- ِٓ ًٖ٘ جألٌٛجْ جٌػالغس *‬
‫01‬

11. ‫فّػال جٌٍْٛ جألْٛو ِىْٛ ِٓ جٌىٌؾس 000 ِٓ وً ِٓ جٌٍْٛ جألقٍّ ٚجألنؼٍ ٚجألٌَق. ٚجٌٍْٛ جألذ١غ ِىْٛ ِٓ جٌىٌؾس‬
‫552 ِٓ ًٖ٘ جألٌٛجْ . أِح جٌٍْٛ جألطفٍ فٙٛ ِىْٛ ِٓ جٌىٌؾس 552 ٌٍْٛ جألقٍّ، ٚجٌىٌؾس 552 ٌٍْٛ جألنؼٍ، ٚجٌىٌؾس‬
‫000 ِٓ جٌٍْٛ جألٌَق... ٚ٘ىًج ذٕفّ جٌطٍ٠مس ٠طُ ضىٛ٠ٓ ذحلٟ جألٌٛجْ.‬
‫ٚذؼٍّ١س قٓحذ١س ذٓ١طس 652×652×652 ٠ٕطؽ ٌى٠ٕح أْ ػىو جألٌٛجْ جٌطٟ ٠ّىٓ جٌكظٛي ػٍ١ٙح ذُّؼ جألٌٛجْ جٌػالغس جٌٓحذمس‬
‫٘ٛ 61277761 ذحٌؼرؾ.‬
‫قٕٓح، ٌىٓ ِٓ أٞ ؾحءش جٌٍَِٛ ‪ٚ FFFFFF‬جٌطٟ ػرٍش ػٓ جٌٍْٛ جألذ١غ ذٙح . ئٔٙح ذرٓح ؽس أٌلحَ … ِىطٛذس ذحٌٕظحَ‬
‫جٌٓىجِ ػشٍٞ (ٔظحَ ػىوٞ أْحْٗ جٌٍلُ 61 ٚ٠ؼرٍ ػٕٗ ذحْطهىجَ جألٌلحَ جٌؼحو٠س ِٓ 0 ئٌٝ 9 ٚجٌٍَِٛ ‪A,B,C,D,E,F‬‬
‫.‬ ‫‪ FF‬ذحٌٕظحَ جٌٓىجِ ػشٍٞ‬ ‫552 ذحٌٕظحَ جٌؼشٍٞ جٌؼحوٞ ٠ىحفثٗ جٌٍلُ‬ ‫). فحٌٍلُ‬
‫ئيْ فحٌٍلُ جٌٓىجِ ػشٍٞ ‪ FF‬ػٍٝ جٌ١ٓحٌ ٠ّػً جٌىٌؾس 552 ٌْٛ جألقٍّ. ٚجٌٍلُ ‪ FF‬فٟ جٌْٛؾ ٠ّػً جٌىٌؾس 552 ِٓ‬
‫ي‬
‫.‬ ‫552 ِٓ جٌٍْٛ جألٌَق‬ ‫‪ FF‬ػٍٝ جٌ١ّ١ٓ ٠ّػً جٌىٌؾس‬ ‫. ٚجٌٍلُ‬ ‫جٌٍْٛ جألنؼٍ‬
‫ٚػٍٝ ً٘ج جٌّٕٛجي ٠ؼرٍ ػٓ جٌٍْٛ جألٌَق جٌفحضف ذحٌٍلُ جٌٓىجِ ػشٍٞ : 9966‪ CC‬أِح جٌٍْٛ جألْٛو فٍلّٗ ٘ٛ 000000.‬
‫ًٚ٘ج ؾىٚي ذرؼغ جألٌٛجْ ٌَِٚٛ٘ح جٌّىحفثس ذحٌٕظحَ جٌٓىجِ ػشٍٞ.‬
‫00‪FFFF‬‬ ‫‪ABCDEF‬‬
‫996633‬ ‫‪FEDCBA‬‬
‫332211‬ ‫664377‬
‫666666‬ ‫2211‪FF‬‬
‫333366‬ ‫‪0033FF‬‬
‫00‪00FF‬‬ ‫‪AABBAA‬‬
‫0066‪FF‬‬ ‫008008‬
‫663399‬ ‫800800‬
‫654321‬ ‫967020‬
‫123456‬ ‫111111‬
‫أِح و١ف ضؼٍف جٌٍُِ جٌهحص ذحٌٍْٛ ج ًٌٞ ضٍ٠ى جنط١حٌٖ، ف١ٛؾى ذٍجِؽ نحطس ضٓطط١غ ِٓ نالٌٙح وِؽ جألٌٛجْ جٌػالغس ذٕٓد‬
‫ِهطٍفس، ِٚٓ غُ ٠مَٛ جٌرٍٔحِؽ ذطٌٛ١ى جٌٍُِ جٌٓىجِ ػشٍٞ جٌّىحفة ٌٍْٛ جٌٕحضؽ. ًٚ٘ج أقى٘ح‬
‫ِّٙس: بعط انًخصفحاث ال حخعسف عهى زيٕش األنٕاٌ إال بٕظع إشازة # قبم ْرِ انسيٕشز نرنك األألعم اظختدايٓا ااًا ًا.‬ ‫ِالقظس‬
‫ٚذحٌٕٓرس ٌرؼغ جألٌٛجْ جألْحْ١س ٚجٌىجٌؾس، ِٓ جٌّّىٓ جْطهىجَ أّْحء ًٖ٘ جألٌٛجْ ِرحشٍز ذىالً ِٓ جألٌلحَ جٌٓىجِ ػشٍ٠س .‬
‫ًٚ٘ج ؾىٚي ٠ٛػف ًٖ٘ جألٌٛجْ ِّٚٓ١حضٙح:‬
‫‪White‬‬ ‫‪Black‬‬
‫‪Green‬‬ ‫‪Red‬‬
‫‪Purple‬‬ ‫‪Marron‬‬
‫‪Blue‬‬ ‫‪Navy‬‬
‫‪Lime‬‬ ‫‪Teal‬‬
‫‪Silver‬‬ ‫‪Gray‬‬
‫‪Aqua‬‬ ‫‪Olive‬‬
‫‪Yellow‬‬ ‫‪Fuchsia‬‬
‫ٚٔؼٛو ئٌٝ جٌَْٛٛ ٚ نظحتظٙح ...‬
‫11‬

12. ‫‪‎ BODY BGCOLOR="#FFFFFF" BACKGROUND="image.jpg">‎‬‬
‫<‬
‫...‬
‫>‪<‎ BODY‬‬
‫/‬
‫ضمَٛ جٌهحط١س ‪ BACKGROUND‬ذطكى٠ى طٌٛز وهٍف١س (ٌٚق ؾىٌجْ) ٌٍظفكس ٚلى جْطهىِص جٌظٌٛز جٌطحٌ١س:‬
‫ٚجٌّّٓحز ‪ image.jpg‬فٟ طفكطٟ ٚوحٔص ًٖ٘ جٌٕط١ؿس‬
‫ضالقع أْ جٌّطظفف لى لحَ ذطىٍجٌ ػٍع جٌظٌٛز ذطٍ٠مس جٌطؿحٔد ٚأٔٙح أطركص ضغطٟ وً جٌشحشس . ذك١ع قؿرص أ٠ؼح ً‬
‫جٌٍْٛ جألذ١غ جًٌٞ قىؤحٖ وٍْٛ جٌهٍف١س (ِٓ نالي جٌهحط١س ‪ٚ )BGCOLOR‬جٌكم١مس أْ جٌٍْٛ ٠ظٍٙ فمؾ ػٕىِح ال ٔمَٛ‬
‫ذحْطهىجَ طٌٛز ِح وهٍف١س. ِٚغ يٌه ٠فؼً ضكى٠ىٖ ئقط١حؽح ً نحطس ٚأْ ذؼغ جٌّطظفكحش جٌمى٠ّس ضٛطف ذأٔٙح ِطظفكحش‬
‫ٔظ١س ‪( Text-Based Browsers‬أٞ ٌ١ّ ذاِىحٔٙح ػٍع جٌظٌٛ). أٚ ٌذّح ٕ٘حن ذؼغ جٌّٓطهىِ١ٓ جًٌ٠ٓ لحِٛج ذاٌغحء‬
‫ن١حٌ ػٍع جٌظٌٛ ضٍمحت١ح ً ِٓ ِطظفكحضُٙ. ئيْ ٌٕؼطُٙ ػٍٝ جأللً فٍطس َ شح٘ىز ذؼغ جألٌٛجْ ئْ ٌُ ٠ٓطط١ؼٛج ِشح٘ىز‬
‫جٌظٌٛ.‬
‫ئٕٔح ٔٓطط١غ جْطهىجَ جٌظٌٛ ذأقؿحَ ِهطٍفس ؽٌٛ١ح ً أٚ ػٍػ١ح ً وهٍف١حش ٌٍظفكس، ٚجٌّطظفف ٔفٓٗ ٘ٛ جًٌٞ ٠مَٛ ضٍمحت١ح ً‬
‫:‬ ‫. ٚئٌ١ه ذؼغ جألِػٍس‬ ‫ذؼٍػٙح فٟ ٚػغ جٌطؿحٔد ِّح ٠ؼطٟ جالٔطرحع ذأٔٙح طٌٛز ور١ٍز‬
‫أَقس عهى انصٕزة نكي اْدْا كتهفيت نهصفحت.‬
‫حش‬
‫21‬

13. ‫ٌٕٚىًّ ِغ ذحلٟ جٌهظحتض فٟ ُْٚ <‪ٌ :>BODY‬ذّح القظص نالي جْطهىجِه ٌإلٔطٍٔص أْ ِؼظُ جٌٛطالش جٌطشؼر١س‬
‫(‪ )Links‬جٌطٟ ضٕمٍ ػٍ١ٙح ٌطٕمٍه ئٌٝ طفكحش أٚ ِٛجلغ أنٍٜ ػٍٝ جٌشرىس ٟ٘ وجتّح ً ِّ١ُز ذحٌٍْٛ جألٌَق، ٚأْ جٌٛطالش‬
‫جٌطٟ لّص ذُ٠حٌضٙح فؼالً لى ضكٛي ٌٛٔٙح ئٌٝ جٌمٍُِٞ . قٕٓحً، ًٖ٘ ٟ٘ جألٌٛجْ جإلفطٍجػ١س جٌطٟ ضؼطّى٘ح جٌّطظفكحش . ٌىٓ لى‬
‫ال ٠ؼؿره يٌه ٚضٍ٠ى ضغ١١ٍ ً٘ج جٌٕظحَ. أٚ ذرٓحؽس ٌذّح ضٍ٠ى جْطهىجَ ٌْٛ أٚ طٌٛز غحِمس ٌهٍف١س جٌظفكس ذّح ْ١إوٞ ئٌٝ‬
‫جنطفحء ًٖ٘ جٌٛطالش أٚ قطٝ جنطفحء ٔض جٌظفكس ٔفٓٙح. فّح جٌؼًّ؟‬
‫ئٌ١ه ًٖ٘ جٌهظحتض جٌطٟ ضمَٛ ذحٌطكىُ فٟ أٌٛجْ جٌٕظٛص:‬
‫‪ ‎ EXT="#rrggbb"‎‬ضكى٠ى ٌْٛ جٌٕض جألْحْٟ ٌٍظفكس‬
‫‪T‬‬
‫‪ ‎ INK="#rrggbb"‎‬ضكى٠ى ٌْٛ جٌٛطالش جٌطشؼر١س‬
‫‪L‬‬
‫‪ ‎ LINK="#rrggbb"‎‬ضكى٠ى ٌْٛ جٌٛطالش جٌطشؼر١س جٌطٟ ضّص َ٠حٌضٙح ‪visited links‬‬
‫‪V‬‬
‫‪ ‎ LINK="#rrggbb"‎‬ضكى٠ى ٌْٛ جٌٛطٍس جٌطشؼر١س جٌفؼحٌس أٞ ػٕىِح ٠طُ جٌٕمٍ ػٍ١ٙح ‪active links‬‬
‫‪A‬‬
‫ٚج٢ْ، وػٕح ٔؿًّ جٌهظحتض جٌٓحذمس فٟ ػرحٌز ٚجقىز . ْٚٛف أوطد جٌٍَِٛ جٌهحطس ذحألٌٛجْ ذٕفّ ضٍه جألٌٛجْ جٌطٟ‬
‫ضّػٍٙح. ٚأٌفص ٔظٍن ئٌٝ أٔٗ ال أّ٘١س ٌٍطٍض١د فٟ وطحذس ًٖ٘ جٌهظحتض وجنً جٌؼرحٌز.‬
‫‪‎ BODY BACKGROUND="backimag.jpg"‎‬‬
‫<‬
‫‪BGCOLOR="#ffff00"‎‬‬
‫‪TEXT="#000066"‎‬‬
‫‪LINK="#00ff00"‎‬‬
‫‪VLINK="#ff0000"‎‬‬
‫‪ALINK="#999999">‎‬‬
‫قحٚي أْ ضكٍٍٙح! ً٘ جْطٕطؿص إٟٔٔ لى قىوش جٌظٌٛز ‪ backimag.jpg‬وهٍف١س ٌٍظفكس؟ ٚإٟٔٔ جنطٍش جٌٍْٛ جألطفٍ‬
‫ٌٍهٍف١س (فٟ قحٌس ػىَ ػٍع جٌظٌٛز جٌٓحذمس وهٍف١س )؟ ٚجْ جٌٕض ظٍٙ ذحٌٍْٛ جألٌَق جٌغحِك؟ أِح جٌٛطالش جٌطشؼر١س‬
‫ْٟ‬
‫فٍٛٔٙح أنؼٍ، ٚجٌٛطالش جٌطٟ ضّص َ٠حٌضٙح ْطظٍٙ ذحٌٍْٛ جألقٍّ. أِح ضٍه جٌٛطٍس جٌفؼحٌس فٓطظٍٙ ذحٌٍْٛ جٌٍِحوٞ فٟ‬
‫ٌكظس جٌٕمٍ ػٍ١ٙح ذحٌفأٌز.‬
‫ئيج وحٔص ًٖ٘ ٟ٘ جْطٕطحؾحضه... فّرٍٚن، ٌمى ٔؿكص. ٚوً ِح أضّٕحٖ أْ ضىْٛ لى لؼ١ص ٚلطح ً ٍِٛٔح ً َٚج٘١ح ً ِغ ً٘ج جٌىٌِ.‬
‫31‬

14. ‫اندزض انثانث: انتطٕغ‬
‫أ٘الً ْٚٙالً ذه ئٌٝ جٌىٌِ جٌػحٌع ِٓ وٌِٚ ‪ .HTML‬ال ٌَٕح ٕٔحلش ِؼح ً أْحْ١حش ضٕٓ١ك طفكحش جإلٔطٍٔص ٚجٌطكىُ‬
‫ذهظحتظٙح. ْٚٛف ٔطحذغ يٌه فٟ ً٘ج جٌىٌِ ِٓ نالي جٌطؼٍف ػٍٝ جٌَْٛٛ جٌهحطس ذحٌهطٛؽ . ْٛف ضالقع فٟ ً٘ج‬
‫.‬ ‫جٌىٌِ ٚجٌىٌِٚ جٌالقمس أْ ٕ٘حن أوػٍ ِٓ ؽٍ٠مس ألوجء ٔفّ جٌؼًّ، أٚ ئػطحء ٔفّ جٌهظحتض ٌظفكحش جإلٔطٍٔص‬
‫ٚذحٌّمحذً لى ٠رىٚ ٌه أْ ذؼغ جٌَْٛٛ ٚجٌهظحتض ِطشحذٙس فٟ ضأغ١ٍ٘ح، ٌىٓ ذحٌمٍ١ً ِٓ جٌطىل١ك ٚجٌطؿٍذس ْطىطشف أْ ٌىً‬
‫ُْٚ نظٛط١طٗ.‬
‫ٌجؾغ طفكطٕح جٌرٓ١طس جٌطٟ ػٍّٕح ف١ٙح فٟ جٌىٌْ١ٓ جٌٓحذم١ٓ . ئٕٔح ٌُ ٔمُ ذحٌطؼحًِ ِغ جٌهطٛؽ ف١ٙح ٚال ذأٞ شىً‬ ‫ٌٕٚرىأ‬
‫ِٓ جألشىحي . أٞ إٔٔح ضٍوٕح٘ح ػٍٝ ئػىجوجضٙح جالفطٍجػ١س . ٚذحٌّٕحْرس فاْ ًٖ٘ جإلػىجوجش ٟ٘ نؾ ػحوٞ، ٔٛػٗ ‪Times‬‬
‫‪ٚ New Roman‬قؿّٗ 3 (ذّم١حِ ِطظفكحش جإلٔطٍٔص).‬
‫جٌُْٛ جألٚي جٌهحص ذحٌهطٛؽ ٘ٛ <‪>FONT/< ... >FONT‬‬
‫ٚ٘ٛ ٠مَٛ ذحٌطكىُ ذحٌهطٛؽ ِٓ ق١ع جٌٕٛع ٚجٌٍْٛ ٚجٌكؿُ. أِح جٌهظحتض جٌطٟ ٔٓطهىِٙح ِغ ً٘ج جٌُْٛ ٚجٌَْٛٛ جألنٍٜ‬
‫ٌٍهطٛؽ فٟٙ وحٌطحٌٟ:‬
‫‪ Face‬بتقوم هذم الخاصيم بتحصحم قوم الخم اهذم نصحذهمقوحم تقوم بتحصحم أكنم مم قوم مم ًا.مقفيم هذم ةمإه ماوم‬
‫اتخل‬ ‫خ‬
‫صبق جحم الخم ا تححم قالًامعلىمجهخزم اشلصم اهذمصبافحم ا قوعمصبومإعب خحم الخم اكخ يم...مق أه م‬
‫‪‎ FONT FACE="Traditional Arabic, Arabic Transparent, Simplified Arabic">‎‬‬
‫<‬
‫... ‪... Text‬‬
‫>‪<‎FONT‬‬
‫/‬
‫خ مخًامالمب سم ممببأأحم ممأبخ يم س خءم الخقخم خااقنةم ااتصحةم جخاصم ًا .م‬
‫خ‬
‫خم هذم الخاصيمفبتححماقمم الخهمقهاكم فسم خحئمبتحصحم ألاق مم ابيمبتحك خمفيم احنسم اسخ قم‬ ‫‪Color‬‬
‫‪‎ FONT COLOR="#FF0000">‎‬‬
‫<‬
‫... ‪... Text‬‬
‫>‪<‎FONT‬‬
‫/‬
‫‪ Size‬قابتحصحمتجوم الخم سبلحوم هذم الخاصي.مقفتخم خكمس ميم تجخومألذملخمبسبخصعم ا بافتختم ابمنفم‬
‫علصهخ.م‬
‫ق تقوم بتحصحم اتجوم ا خلقبم أسلق صم:م قاه خم ا خشن.متصثمصبومأبخ يمنوومصبن قحم خم صمم1-7.م ذم خم‬
‫لبخنم اتجوم اهذم نصحذم خشنة.م‬
‫‪‎ FONT SIZE="4">‎‬‬
‫<‬
‫... ‪... Text‬‬
‫>‪<‎FONT‬‬
‫/‬
‫قإاصكم خهجم أتجخوم الخقخم‬
‫ملخم تجوم1م‬
‫لخم تجوم2م‬
‫لخم تجوم3مممم( الخم الفبن ضي )م‬
‫لخم تجوم4م‬
‫لخم تجوم5م‬
‫م‬ ‫لخم تجوم6‬
‫م‬ ‫لخم تجوم7‬ ‫م‬
‫خم ألسلقبم اكخ يمفهقم ا س ي:متصثمبأببم ألنوخوم مم1مإاىم6م نفتيمإ خم إشخنةم+م قم إشخنةم-.م‬
‫41‬

15. ‫‪‎ FONT SIZE="+4">‎‬‬
‫<‬
‫... ‪... Text‬‬
‫>‪<‎FONT‬‬
‫/‬
‫ًا‬
‫قفيم هذم اخنصتيمفإمم ألنوخوم1-6مب كلمحنجختم ابأ صنم(+)م قم اباغصنم(-)ماللخمقهاكم س يمإاىم اتجوم‬
‫الفبن ضي.مف كالم انووم+4م صم يمبأ صنم الخم ن عمحنجختمعمم اتجوم الفبن ضيمق قم3 هم ذم همصا حم‬
‫خاتجوم7.م خا تخ لمفأمم انووم-1م صم يمباغصنم الخمحنجيمق تحةم ذمصا حم خاتجوم2.ممم‬
‫قابقضصحم ه م ألسلقبهمإاصكم هذم ا خهج:م‬
‫مم‬
‫لخم تجوم-3م‬
‫لخم تجوم-2م‬
‫لخم تجوم-1م‬
‫لخم تجوم+0ممم( قم-0مق قم الفبن ضي)م‬
‫لخم تجوم+1م‬
‫م‬ ‫لخم تجوم+2‬
‫م‬ ‫لخم تجوم+3‬
‫م‬ ‫لخم تجوم+4‬
‫م‬ ‫لخم تجوم+5‬
‫م التظم همتبىمفيم ألسلقبم ا س يمالم سبخصعم اتاقلمعلىم أكنم ممس ميم تجخوماللخقخ.متبىمقإمم‬
‫تخقا خمأبخ يم نوخوم أ نم قم اغنمأ خمفملتم خم أبخ يم اتجوم-3م قم+5.م‬
‫ٚج٢ْ أػٍف ِحيج ضٍ٠ى أْ ضٓأي، ْطمٛي ٌمى غرص قؿُ جٌهؾ ػٍٝ قىٖ جألؤٝ ػٕى جٌىٌؾس - 2 ٚػٍٝ قىٖ جألػٍٝ ػٕى جٌىٌؾس‬
‫+4. ئيْ ِح جٌفحتىز ِٓ ٚؾٛو جٌىٌؾحش جألنٍٜ جأللً ِٓ - 2 ٚجألورٍ ِٓ +4؟‬
‫قٕٓح ٚأٔح أؾ١ره ذٓإجي آنٍ : ِحيج ٌٛ لّٕح ذطغ١١ٍ جٌكؿُ جالفطٍجػٟ ٌٍهؾ فٟ وً جٌظفكس ئٌٝ 1 ذىالً ِٓ 3؟ (ْٚٛف ٔمَٛ‬
‫ذًٌه فؼالً ذؼى لٍ١ً )، أال ٔكطحؼ فٟ ًٖ٘ جٌكحٌس ئٌٝ جٌىٌؾحش ِٓ +1 ئٌٝ +6 ٌطّػ١ً جألقؿحَ جألورٍ ِٕٗ؟ ٚئيج لّٕح ذطكى٠ى 7‬
‫وكؿُ ئفطٍجػٟ أال ٔكطحؼ ئٌٝ جٌىٌؾحش ِٓ - 1 ئٌٝ - 6 ٌطّػ١ً جألقؿحَ جألطغٍ ِٕٗ؟ ئيْ ٔكٓ ٔكطحؼ فؼالً ئٌٝ ًٖ٘‬
‫جٌىٌؾحش ٌىٟ ٔغطٟ ؾّ١غ جإلقطّحالش جٌٛجٌوز.‬
‫أٌؾٛ أْ ٠ىْٛ ً٘ج جٌؿٛجخ لى ألٕؼه .‬
‫ًٖٚ٘ ذؼغ جألِػٍس ٌطٛػف ٌه و١ف١س جْطهىجَ ً٘ج جٌُْٛ، ْٚٛف أٌفك ٔط١ؿس وً ِػحي ذؼىٖ ِرحشٍز.‬
‫‪‎ FONT FACE="arial" SIZE="6" COLOR="#FF0000">‎‬‬
‫<‬
‫‪This font is Arial, Size is 6, Color is Red‬‬
‫>‪<‎FONT‬‬
‫/‬
‫‪This font is Arial, Size is 6, Color is Red‬‬
‫‪‎ FONT FACE="arial" SIZE="+3" COLOR="#FF0000">‎‬‬
‫<‬
‫‪This font is Arial, Size is +3, Color is Red‬‬
‫>‪<‎FONT‬‬
‫/‬
‫51‬

16. This font is Arial, Size is +3,
Color is Red
‎ FONT FACE="Times New Roman" SIZE="5" COLOR="#0000FF">‎
<
This font is Times New Roman, Size is 5, Color is Blue
<‎FONT>
/
This font is Times New Roman, Size is 5, Color is Blue
‎ FONT FACE="courier" SIZE="2" COLOR="#800000">‎
<
This font is Courier, Size is 2, Color is Maroon
<‎FONT>
/
This font is Courier, Size is 2, Color is Maroon
<FONT FACE="Arial" SIZE="5" COLOR="#00FF00"> This <‎FONT>
/
<FONT FACE="Times New Roman" SIZE="7" COLOR="#FF00FF"> is <‎FONT>
/
<FONT FACE="Arial" SIZE="2" COLOR="#FF0000"> multi <‎FONT>
/
<FONT FACE="Impact" SIZE="4" COLOR="#000000"> colors, <‎FONT>
/
<FONT FACE="Courier" SIZE="2" COLOR="#0000FF"> multi <‎FONT>
/
<FONT FACE="Times New Roman" SIZE="3" COLOR="#008080"> faces, <‎FONT>
/
<FONT FACE="Courier" SIZE="6" COLOR="#FFFF00"> and <‎FONT>
/
<FONT FACE="Arial" SIZE="5" COLOR="#808080"> multi <‎FONT>
/
<FONT FACE="Impact" SIZE="2" COLOR="#800000"> sizes <‎FONT>
/
<FONT FACE="Times New Roman" SIZE="7" COLOR="#00FFFF"> text <‎FONT>
/
This is multi colors, multi faces, and multi sizes text
<FONT FACE="Impact" SIZE="6" COLOR="#000000">C <‎FONT>
/
<FONT FACE="Impact" SIZE="6" COLOR="#008080">O<‎FONT>
/
<FONT FACE="Impact" SIZE="6" COLOR="#FF0000">L<‎FONT>
/
<FONT FACE="Impact" SIZE="6" COLOR="#0000FF">O<‎FONT>
/
<FONT FACE="Impact" SIZE="6" COLOR="#800000">R<‎FONT>
/
<FONT FACE="Impact" SIZE="6" COLOR="#FF00FF">S<‎FONT>
/
COLORS
16

17. ‫َُخقم اآلٌ إنى انٕظى انثاَي يٍ انٕظٕو انتاصت بانتطٕغ ْٕٔ <‪.>BASEFONT‬‬
‫ٚػٍّٗ ٘ٛ ضكى٠ى ٔٛع جٌهؾ ٚنظحتظٗ ذحٌٕٓرس ٌٍظفكس وٍٙح . أٞ أٔٗ ٠مَٛ ذطؼٍ٠ف ٔٛع جٌهؾ جألْحْٟ جًٌٞ ْ١ٓطهىَ فٟ‬
‫جٌظفكس ِٓ ذىج٠طٙح ئٌٝ ٔٙح٠طٙح ٚ٠كىو ٌٛٔٗ ٚقؿّٗ.‬
‫ً٘ القظص جٔٗ ُْٚ ِفٍو ٚال ٠كطٛٞ ػٍٝ ُْٚ ٌٍٕٙح٠س؟ ذحٌطرغ ِح جٌكحؾس ئٌٝ ُْٚ جٌٕٙح٠س ؽحٌّح أٔٗ ٠طؼحًِ ِغ جٌظفكس‬
‫وىً ِٚغ جإلػىجوجش جألْحْ١س ٌٙح، ٌٚ١ّ ِغ وٍّس أٚ ْطٍ أٚ فمٍز ذًجضٙح . يٌه فاْ ً٘ج جٌُْٛ ٠ىطد ػحوز فٟ أٚي جٌٍّف،‬
‫ي‬
‫ٚ٠فؼً ِرحشٍز ذؼى ُْٚ <‪ .>BODY‬أِح جٌهظحتض جٌّٓطهىِس ِؼٗ فٟٙ ٔفّ جٌهظحتض ْحٌفس جًٌوٍ ِغ <‪، >FONT‬‬
‫(ٔٓطط١غ جْطهىجَ جٌهحط١س ‪ِ Name‬ؼٗ ذىالً ِٓ ‪ٚ .)Face‬ذٕفّ جٌطٍ٠مس ٚذىْٚ أٞ جنطالفحش. ٚئٌ١ه ًٖ٘ جٌش١فٍز وّػحي:‬
‫‪‎ BASEFONT Name="Arial" COLOR="#FF0000" SIZE="5">‎‬‬
‫<‬
‫ٚذىٌجْس ً٘ج جٌّػحي ٔٓطٕطؽ أٔٗ ٠مَٛ ذطؼى٠ً جٌهؾ جالفطٍجػٟ ٌٍظفكس ذك١ع ٠ظرف ٔٛػٗ ‪ٚ Arial‬قؿّٗ 5 ٌٚٛٔٗ أقٍّ .‬
‫ٚذحٌطحٌٟ فاْ وً جٌٕظٛص جٌّىطٛذس فٟ ضٍه جٌظفكس ْ١طرك ػٍ١ٙح ً٘ج جٌّٕؾ ِٓ جٌهؾ . ِح ٌُ ٔمُ ؽرؼح ذحْطهىجَ جٌَْٛٛ‬
‫<‪ٌ >‎ ont/< ... >Font‬طؼى٠ٍٙح ٚجٌطكىُ ذّظٍٙ٘ح وّح فؼٍٕح فٟ جألِػٍس جٌٓحذمس، فٟٙ أوػٍ ضكى٠ىجً ٚأوػٍ ٍِٚٔس ِٓ جٌُْٛ‬
‫‪F‬‬
‫<‪>BASEFONT‬‬
‫ٚذّٕحْرس جٌكى٠ع ػٓ جألٌٛجْ ٚضغ١١ٍ جٌٍْٛ جألْحْٟ ٌٕض جٌظفكس. أال ضًوٍ إٔٔح فٟ جٌىٌِ جٌٓحذك ضىٍّٕح ػٓ جٌهحط١س‬
‫‪ Text‬جٌطٟ ضىطد ِغ جٌُْٛ <‪ٚ >Body‬جٌطٟ جْطهىِٕح٘ح ٌطكى٠ى ٌْٛ ٔض جٌظفكس... أٔح ال ٌَص أيوٍ يٌه.‬
‫ال ٠ٛؾى ضؼحٌع ذ١ٓ ًٖ٘ جٌهحط١س ٚنحط١س ‪ Color‬فٟ جٌُْٛ <‪ >BASEFONT‬فأٔص ذىً ذٓحؽس ضٓطط١غ جْطهىجَ أٞ‬
‫ِّٕٙح فٟ طفكطه. ٚئيج قىظ ٚجْطهىِص والّ٘ح فاْ جٌٍْٛ جٌّكىو ِغ جٌُْٛ <‪ ٛ٘ >BASEFONT‬جًٌٞ ْ١طرمٗ‬
‫جٌّطظفف ٚ٠ؼطّىٖ.‬
‫أكثس يٍ غسيقت أل اء َفط انعًم‬ ‫ٕٚ٘ح أٌ٠ى أْ أيوٍن ذّح لٍطٗ فٟ ذىج٠س ً٘ج جٌىٌِ: يٕخد ااًا ًا‬
‫ٕ٘حن َْٚٛ نحطس ضٓطهىَ ٌطّ١١ُ جٌؼٕحٚ٠ٓ ‪ Headings‬فٟ طفكحش جإلٔطٍٔص ٟٚ٘: <‪>‎ Hn< ... >Hn‬‬
‫/‬
‫ٚقٍف ‪ٌ ٛ٘ n‬لُ ذ١ٓ 1-6 ٠ّػً ِٓطٜٛ جٌؼٕٛجْ.‬
‫>1‪<H1> Heading 1 <‎H‬‬
‫/‬
‫>2‪<H2> Heading 2 <‎H‬‬
‫/‬
‫>3‪<H3> Heading 3 <‎H‬‬
‫/‬
‫>4‪<H4> Heading 4 <‎H‬‬
‫/‬
‫>5‪<H5> Heading 5 <‎H‬‬
‫/‬
‫>6‪<H6> Heading 6 <‎H‬‬
‫/‬
‫1 ‪Heading‬‬
‫2 ‪Heading‬‬
‫3 ‪Heading‬‬
‫4 ‪Heading‬‬
‫5 ‪Heading‬‬
‫6 ‪Heading‬‬
‫ٚٔأضٟ ج٢ْ ئٌٝ جٌطٕٓ١محش ٚجٌطأغ١ٍجش جٌطٟ ٠ّىٓ ئػحفطٙح ئٌٝ جٌٕض. ٚف١ّح ٠ٍٟ جٌَْٛٛ جٌهحطس ذٙح ِطرٛػس ذّػحي ٚٔط١ؿطٗ:‬
‫* انتػ انغايق (األظٕ انعسيط )ز َٔعختدو نّ انٕظٕو انخانيت : >‪<B> ... <‎B‬‬
‫/‬
‫‪This is Bold Text‬‬ ‫>‪<B> Bold Text <‎B‬‬
‫/‬
‫* انتػ انًاام >‪<I> ... <‎I‬‬
‫/‬
‫‪This is Italic Text‬‬ ‫>‪<I> Italic Text <‎I‬‬
‫/‬
‫71‬

18. <U> ... <‎U> ‫* انتػ انًعطس‬
/
This is Undelined Text <U> Undelined Text <‎U>
/
<SUP> ... <‎SUP> ‫* انتػ انًسحفع‬
/
Superscript Text
This is <SUP> Superscript Text <‎SUP>
/
<SUB> ... <‎SUB> ‫* انتػ انًُتفط‬
/
This is Subscript Text <SUB> Subscript Text <‎SUB>
/
<BIG> ... <‎BIG> ‫* خػ كبيس‬
/
This is Big Text <BIG> Big Text </BIG>
<SMALL> ... <‎SMALL> ‫* خػ صغيس‬
/
This is Small Text <SMALL> Small Text <‎SMALL>
/
<S> ... <‎S> ‫* َص يعخسظّ خػ‬
/
This is Striked Text too <S> Striked Text <‎S>
/
<TT> ... <‎TT> TeleType ‫* َص اآلنت انطابعت‬
/
This is TeleType Text <TT> TeleType Text <‎TT>
/
: ٌٟ‫. ٌٚطٛػ١ف ً٘ج جٌّفَٙٛ ئٌ١ه جٌّػحي جٌطح‬Monospaced Text ‫ًٚ٘ج جٌٕض ٠ؼٍف أ٠ؼح ً ذحٌٕض ِٛقى جٌّٓحفحش‬
َ
‫ ٟ٘ أػؼحف جٌّٓحقس‬m ‫ ٚوطرٕح وً ِّٕٙح ػشٍ ٍِجش ِططحٌ١س ٔالقع أْ جٌّٓحقس جٌطٟ شغٍٙح جٌكٍف‬m,i ٓ١‫ئيج أنًٔح جٌكٍف‬
i ‫جٌطٟ شغٍٙح جٌكٍف‬
iiiiiiiiii
mmmmmmmmmm
‫> ألإٌ انًعاحت انخي يشغهٓا كال انحسأليٍ حصبح يٕحدة‬‎ TT< ... >TT< ‫أيا عُد اظختداو انٕظى‬
/
iiiiiiiiii
mmmmmmmmmm
:ً ‫ًٖٚ٘ أِػٍس ضؿّغ ذ١ٓ ػىز ضٕٓ١محش ِؼح‬
<B><I><U>
This is a Bold, Italic and Underlined Text
<‎U> <‎I> <‎B>
/ / /
This is a Bold, Italic and Underlined Text
<FONT COLOR="#FF0000" SIZE="+3"><U><I>
This text is red, size +3, Italic, and Underlined
<‎I> <‎U> <‎FONT>
/ / /
This text is red, size +3, Italic, and
Underlined
18

19. ‫ٚلى أٌوش ِٓ ًٖ٘ جألِػٍس ضٛػ١ف ِٓحتً ِؼ١ٕس أٚ ٌٙح: أْ ذاِىحٕٔح جْطهىجَ ػىز َْٚٛ ٚضٕٓ١محش ِؼح ً فٟ ٔفّ جٌٛلص ٌٕٚفّ‬
‫جٌّمطغ ِٓ جٌٕض . ( ٚيٌه ٌؿّ١غ جٌَْٛٛ ٌٚ١ّ فمؾ ٌَْٛٛ جٌهطٛؽ ). ٚوّح يوٍش ْحذمحً، ال أّ٘١س ٌطٍض١د ًٖ٘ جٌَْٛٛ ٚال‬
‫ػٕى جْطهىجَ جٌَْٛٛ جٌّطؼىوز فٟ ِمطغ ٚجقى ٠ؿد ٍِجػحز ػىَ جٌص وجنً ذ١ٕٙح!... و١ف؟ أٔظٍ ئٌٝ‬ ‫أ٠ٙح ٌٚو أٚالً ... نكٍ‬
‫جٌٍُْ جٌطحٌٟ:‬
‫فىطحذس جٌَْٛٛ جٌٓحذمس ذحٌطٍق جٌطحٌ١س ٘ٛ نطأ:‬
‫>‪<B><I><U‬‬
‫‪This is a Bold, Italic and Underlined Text‬‬
‫>‪<‎B> <‎I> <‎U‬‬
‫/‬ ‫/‬ ‫/‬
‫>‪<B><I><U‬‬
‫‪This is a Bold, Italic and Underlined Text‬‬
‫>‪<‎B> <‎U> <‎I‬‬
‫/‬ ‫/‬ ‫/‬
‫أػٍف أٔه ٌُ ضظىلٕٟ ٚأٔه لّص ذطؿٍذس ًٖ٘ جٌَْٛٛ ٌٚذّح قظٍص ػٍٝ ٔط١ؿس طك١كس . قٕٓح ً جٌؼرٍز ٌ١ٓص فٟ ػرحٌز‬
‫ٚجقىز ِىٛٔس ِٓ ّْٚ١ٓ أٚ غالغس ضىطرٙح فٟ ٍِف طغ١ٍ ذً فٟ طفكس ئٔطٍٔص وحٍِس لى ضص أٌف ِٓ ِثحش أٚ قطٝ آالف‬
‫جٌَْٛٛ ِىطٛذس فٟ ٍِف نحي ِٓ جألنطحء جٌّٕطم١س ٚجٌطىجنالش جٌطٟ لى ضٓرد جإلٌذحن ٌٍّطظفكحش، ٚضإوٞ ئٌٝ ػىَ ػٍع‬
‫ٍ‬
‫ًٖ٘ جٌظفكس ذحٌشىً جٌّٕحْد ٚجٌّطٍٛخ.‬
‫وطحذس ًٖ٘ جٌَْٛٛ‬ ‫ًٌٌه فأّ٘١س أْ ضطؿٕد ٚؾٛو جٌَْٛٛ جٌّطىجنٍس فٟ طفكطه ٘ٛ ذٕفّ جألّ٘١س جٌطٟ ٠ؿد أْ ضٌٛ١ٙح ي‬
‫ذحٌظٌٛز جٌظك١كس ئِالت١ح ً . ٚئال فحٌّطظفكحش ال ضٍقُ . ٚوػ١ٍز ٟ٘ جٌٍّجش جٌطٟ قظً ف١ٙح جٌّظّّْٛ ػٍٝ طفكحش‬
‫ِٕٙحٌز ذٓرد ٔٓ١حْ قٍف ٚجقى أٚ ئشحٌز ِػً < أٚ > أٚ "‬
‫ذانطظحٌ شى٠ى... ٚومحػىز أْحْ١س، جٌظفكس جٌّظّّس ؾ١ىجً ٟ٘ جٌظفكس يجش جٌَْٛٛ جٌظك١كس ٌ جٌّطىجنٍس.‬
‫ٚغٟ‬
‫91‬

20. ‫اندزض انسابع: انفقساث ٔانقٕااى‬
‫‪ .HTML‬فٟ ً٘ج جٌىٌِ ْٛف ٕٔحلش جٌَْٛٛ جٌهحطس ذحٌفمٍجش ذشىً‬ ‫أ٘الً ْٚٙالً ذه ئٌٝ جٌىٌِ جٌٍجذغ ِٓ وٌِٚ‬
‫نحص ٚضٍض١د جٌظفكحش ٚضٕٓ١مٙح ذشىً ػحَ.‬
‫طك١ف أْ جْطهىجِه ٌألٌٛجْ ٚجٌٍِْٛحش فٟ جٌظفكس ٠ؼفٟ ػٍ١ٙح ٔٛػح ً ِٓ جٌف ٠ٛ٠س، ٚأْ جٌهطٛؽ ضؼطٟ طفكطه ٌٚٔمح ً‬
‫ٚؾّحالً. ٌىٕه ئْ ٌُ ضٙطُ ذطٍض١د طفكطه أٚ ضمؼٟ ذؼغ جٌٛلص فٟ ضٕٓ١ك ٘١ىٍٙح جٌؼحَ ٚضٕظ١ُ فمٍجضٙح ٚلٛجتّٙح، فأٗ ِٓ‬
‫جٌظؼد ػٍ١ه جٌكظٛي ػٍٝ طفكس ٚ٠د ٔحؾكس . فحٌطٍض١د ٘ٛ جٌهطٛز جألٌٚٝ ٌؿًخ ج٘طّحَ جٌُجتٍ أٚ جٌمحٌب ٌظفكطه‬
‫ٚضًٓٙ ػٍ١ٗ فُٙ جٌهطٛؽ جٌؼٍ٠ؼس ٌٍظفكس.‬
‫ٌمى لّص فٟ جٌىٌِ جألٚي ذا٠ؼحـ ذؼغ جٌَْٛٛ جٌهحطس ذحٌفمٍجش . ٚال ذأِ ِٓ ضًو١ٍن ذٙح . فحٌُْٛ <‪٠ >P‬مَٛ ذأٙحء‬
‫جٌفمٍز. ٚجٌُْٛ <‪ ٟٕٙ٠ >BR‬جٌٓطٍ جٌكحٌٟ ٚ٠ٕمً جٌٕض ئٌٝ ْطٍ ؾى٠ى. ٚجٌُْٛ ;‪٠ ‎ nbsp‬مَٛ ذاػحفس جٌفٍجغحش، ٚ٠ؿد‬
‫&‬
‫ضىٍجٌ وطحذطٗ ذٕفّ ػىو جٌفٍجغحش جٌّطٍٛخ.‬
‫ٚٔطحذغ فٟ ً٘ج جٌىٌِ ِغ ًٖ٘ جٌَْٛٛ ٚغ١ٍ٘ح.‬
‫ٌمى لٍص ئْ جٌُْٛ <‪ِ ُْٚ ٛ٘ >P‬فٍو ٌىٕٗ ٠ٓطهىَ أ٠ؼح ً وُْٛ ُِوٚؼ <‪ٚ >‎ P< ... >P‬فٟ ًٖ٘ جٌكحٌس ٠ّىٕٕح ِٓ ضكى٠ى‬
‫ّ‬ ‫/‬
‫ئضؿحٖ جٌفمٍز ٚئضؿحٖ جٌٕض ف١ٙح ق١ع ٠ٓطهىَ ِؼٗ جٌهظحتض ‪.ALIGN, DIR‬‬
‫فحٌهحط١س ‪ ALIGN‬قىو ِكحيجز جٌفمٍز ٟٚ٘ ضأنً جٌم١ُ ‪ٚ Center, Right ,Left‬أٚػكٙح ذحألِػٍس جٌطحٌ١س:‬
‫ش‬
‫>‪<P Align="left"> This is a left-aligned paragraph <‎P‬‬
‫/‬
‫‪This is left-aligned paragraph‬‬
‫>‪<P Align="right"> This is right-aligned paragraph</P‬‬
‫‪This is a right-aligned paragraph‬‬
‫>‪<P Align="center"> This is a centered paragraph</P‬‬
‫‪This is a centered paragraph‬‬
‫وًٌه ٌطْٛ١ؾ جٌفمٍجش أٚ جٌىحتٕحش ذشىً ػحَ فٟ جٌظفكس ٔٓطط١غ جْطهىجَ جٌَْٛٛ <‪>CENTER/< ... >CENTER‬‬
‫>‪<CENTER> This is a centered text </CENTER‬‬
‫‪This is a centered text‬‬
‫أِح جٌهحط١س ‪ٚ DIR‬جٌطٟ ٔٓطهىِٙح أ٠ؼح ً ِغ <‪ >P‬فطمَٛ ذطكى٠ى ئضؿحٖ لٍجءز جٌٕض ٚضأنً جٌم١ُ‬
‫‪ LTR‬ئضؿحٖ جٌٕض ِٓ جٌ١ٓحٌ ئٌٝ جٌ١ّ١ٓ )‪(Left To Right‬‬
‫‪ RTL‬ئضؿحٖ جٌٕض ِٓ جٌ١ّ١ٓ ئٌٝ جٌ١ٓحٌ )‪(Right To Left‬‬
‫(حركس ْرِ انتاصيت خيداًا ألٓي يًٓت عُد كخابت صفحاث بانهغت انع زبيت)‬
‫02‬

21. ‫انقٕااى‬
‫ضكطٛٞ ٌغس ‪ HTML‬ػٍٝ ِؿّٛػس ِٓ جٌَْٛٛ جٌهحطس ذطٕظ١ُ جٌر١حٔحش فٟ لٛجتُ ٚذحْطهىجَ ػىز ن١حٌجش. ٕٚ٘حن‬
‫ٔٛػ١ٓ ِٓ جٌمٛجتُ: أٔنًٓا انًخعهعهت ‪ٔ .Ordered Lists‬انيك انًثال انخاني عهيٓا‬
‫أّْحء ذؼغ جٌّىْ جٌفٍٓط١ٕ١س‬
‫جٌمىِ‬ ‫1.‬
‫ٔحذٍّ‬ ‫2.‬
‫ٌجَ هللا‬ ‫3.‬
‫جٌهٍ١ً‬ ‫4.‬
‫ؾٕ١ٓ‬ ‫5.‬
‫ؽٌٛىٍَ‬ ‫6.‬
‫ٚغحٔ١ّٙح جٌمٛجتُ غ١ٍ جٌّطٍٍٓٓس ‪ً٘ٚ Unordered Lists‬ج ِػحي ػٍ١ٙح‬
‫أّْحء ذؼغ جٌؿحِؼحش جٌفٍٓط١ٕ١س‬
‫ؾحِؼس جٌٕؿحـ‬ ‫‪‬‬
‫ؾحِؼس جٌمىِ جٌّفطٛقس‬ ‫‪‬‬
‫ؾحِؼس ذ١ٍَ٠ص‬ ‫‪‬‬
‫ؾحِؼس جٌهٍ١ً‬ ‫‪‬‬
‫ػٕى جٌطؼحًِ ِغ جٌمٛجتُ ذٕٛػ١ّٙح ٔكطحؼ ئٌٝ َْٚٛ نحطس ذطكى٠ى ذىج٠س ٚٔٙح٠س جٌمحتّس َْٚٚٛ ضكىو ذٕٛو ًٖ٘ جٌمحتّس.‬
‫ذحٌٕٓرس ٌٍمٛجتُ جٌّطٍٍٓٓس ٔٓطهىَ جٌَْٛٛ‬
‫<‪>‎OL< ... >OL‬‬
‫/‬
‫أِح ذحٌٕٓرس ٌٍمٛجتُ غ١ٍ جٌّطٍٍٓٓس فٕٓطهىَ‬
‫<‪>‎UL< ... >UL‬‬
‫/‬
‫ٌٚطؼ١١ٓ وً ذٕى ِٓ ذٕٛو جٌمحتّس ٔٓطهىَ جٌُْٛ <‪ِ ُْٚ ٛ٘ٚ >LI‬فٍو ٠ىطد فٟ ذىج٠س جٌٓطٍ جٌهحص ذىً ذٕى ‪List‬‬
‫‪.Item‬‬
‫ئيْ ػٕىِح لُ ش ذأشحء جٌمٛجتُ جٌٓحذمس جْطهىِص جٌش١فٍز جٌطحٌ١س :‬
‫>‪<OL‬‬
‫جٌمىِ>‪<LI‬‬
‫ٔحذٍّ>‪<LI‬‬
‫هللا ٌجَ>‪<LI‬‬
‫جٌهٍ١ً>‪<LI‬‬
‫ؾٕ١ٓ>‪<LI‬‬
‫ؽٌٛىٍَ>‪<LI‬‬
‫>‪<‎OL‬‬
‫/‬
‫>‪<UL‬‬
‫جٌٕؿحـ ؾحِؼس>‪<LI‬‬
‫ؾحِؼس جٌمىِ جٌّفطٛقس>‪<LI‬‬
‫ذ١ٍَ٠ص ؾحِؼس>‪<LI‬‬
‫ؾحِؼس جٌهٍ١ً>‪<LI‬‬
‫>‪<‎UL‬‬
‫/‬
‫12‬

22. ‫اندزض انتايط: انصٕز ٔانسظٕياث‬
‫فٟ ً٘ج جي وٌِ ْٛف ألَٛ ذحٌكى٠ع ػٓ جٌظٌٛ ٚجٌٍِْٛحش ِٚح ٠طؼٍك ذحٌطؼحًِ ِؼٙح، ذحإلػحفس ئٌٝ جٌطؼٍ٠ف ذأٔٛجع‬
‫جٌٍّفحش جٌٍِْٛ١س جٌىجٌؾس فٟ جإلٔطٍٔص.‬
‫جٌىٌِ جٌػحٟٔ أِح ئوٌجؼ جٌظٌٛ‬ ‫ٌمى جلطظٍ قى٠ػٕح ػٓ جٌظٌٛ قطٝ ج٢ْ ػٍٝ ئػحفس نٍف١حش ٌٍظفكحش، ٚوحْ يٌه فٟ‬
‫ػّٓ جٌظفكحش ٔفٓٙح فٍٗ قىح٠س أنٍٜ، أذىأ ذٍٚج٠طٙح ٌه ج٢ْ.‬
‫ئْ جٌُْٛ جٌٍت١ٟٓ جٌّٓطهىَ ٌطؼٍ٠ف طٌٛز ِح وجنً جٌظفكس ٘ٛ <‪ِ ُْٚ ٛ٘ٚ >IMG‬فٍو . ٌىٓ ً٘ ٠ىفٟ ً٘ج إلوٌجؼ‬
‫طٌٛز؟ وال، ذحٌطرغ ٠ؿد أْ ٔكىو جٌظٌٛز جٌطٟ ٍٔ٠ى٘ح. ًٌٌه ٔؼ١ف جٌهحط١س ٌٗ ‪ٌ SRC‬طكى٠ى ِٛلغ ٚجُْ جٌظٌٛز.‬
‫جٌظٌٛز جٌطحٌ١س ئّْٙح ‪ٚ thedome.jpg‬ػٕىِح لّص ذاوٌجؾٙح. وحٔص جٌش١فٍز جٌهحطس ذًٌه ٟ٘‬
‫‪‎ IMG SRC="thedome.jpg">‎‬‬
‫<‬
‫ٚجٌظ١غس ًٖ٘ ضفطٍع أْ جٌظٌٛز ِٛؾٛوز فٟ َفط اندنيم انفسعي أٔ انًدهد ق١ع ٠طٛجؾى ٍِف ‪ HTML‬جًٌٞ أػًّ ػٍ١ٗ،‬
‫ٚلّص ذحْطىػحء جٌظٌٛز ِٓ نالٌٗ. ٌىٓ ِحيج ٌٛ وحٔص جٌظٌٛز فٟ ِؿٍى فٍػٟ آنٍ؟ قٕٓح ْٛف جٔحلش ِؼه قحٌط١ٓ ًٌٖٙ‬
‫جٌّٓأٌس.‬
‫جٌكحٌس جألٌٚٝ أْ ضىْٛ جٌظٌٛز ِٛؾٛوز فٟ ِؿٍى ِطفٍع ػٓ جٌّؿٍى جٌّٛؾٛو ذٗ ٍِف ‪ HTML‬قٓد جٌشىً جٌطحٌٟ:‬
‫ٔمَٛ فٟ ًٖ٘ جٌكحٌس ذىطحذس ئُْ ً٘ج جٌّؿٍى ضطرؼٗ ئشحٌز / غُ جُْ جٌظٌٛز.‬
‫جٌكحٌس جٌػحٔ١س: أْ ٠ىْٛ ٍِف ‪ِٛ HTML‬ؾٛوجً فٟ ِؿٍى ِح ٚضىْٛ جٌظٌٛز ِٛؾٛوز فٟ ِؿٍى آنٍ ذٕفّ جٌّٓطٜٛ . أٞ أّٔٙح‬
‫َ ؾٍى٠ٓ ِطؿحٌٚ٠ٓ ٌٚ١ٓح ِطفٍػ١ٓ أقىّ٘ح ػٓ ج٢نٍ .‬
‫ٚفٟ ًٖ٘ جٌكحٌس ٔىطد .. (ٔمطط١ٓ) ٌطٛؾ١ٗ جٌّطظفف ٌٍهٍٚؼ ِٓ جٌّؿٍى جٌفٍػٟ جٌكحٌٟ (ق١ع ٠ٛؾى ٍِف ‪ ِٓٚ )HT‎ L‬غُ‬
‫‪M‬‬
‫جٌىنٛي ئٌٝ جٌّؿٍى ‪ images‬ق١ع ضٛؾى جٌظٌٛز.‬
‫ٚذشىً ػحَ، ِّٙح وحٔص ِٛجلغ ضٛجؾى جٌٍّفحش فاْ ػٍّ١س ضكى٠ى ِٛجلؼٙح ٚجٌٛطٛي ئٌ١ٙح ال ضهٍؼ ػٓ ٔطحق ً٘ج جٌّٕؾ ِٓ‬
‫جٌش١فٍز. أٞ وطحذس جٌٕمطط١ٓ ٌٍهٍٚؼ ِٓ ِؿٍى فٍػٟ، ٚوطحذس جُْ جٌّؿٍى جًٌٞ ٠ؿد جٌىنٛي ئٌ١ٗ.‬
‫ٌٚز ٟ٘ 002×541 ذ١ىًٓ ‪ ( Pixel‬ضحذغ جٌمٍجءز قطٝ ٔٙح٠س ً٘ج جٌىٌِ ٚأػىن أْ أٚػف ٌه‬ ‫ئْ جألذؼحو جألْحْ١س ًٌٖٙ جٌض‬
‫ِح ٟ٘ ٚقىز جٌر١ىًٓ ئيج وحٔص ًٖ٘ أٚي ٍِز ضطؼٍف ف١ٙح ػٍٝ ًٖ٘ جٌٛقىز) ٚوّح ضالقع ضُ ئوٌجؼ جٌظٌٛز ِغ جٌّكحفظس ػٍٝ‬
‫ًٖ٘ جألذؼحو. ِٚغ يٌه فٕكٓ ٔٓطط١غ جٌطكىُ أ٠ؼح ً ذٙح ٚئظٙحٌ جٌظٌٛز ذحٌفؾُ جًٌٞ ٍٔ٠ىٖ ِٓ نالي ً٘ج جٌُْٛ. و١ف؟‬
‫ذاػحفس جٌهظحتض ‪ِ HEIGHT, WIDTH‬طرٛػس ذأٌلحَ ضّػً جإلٌضفحع ٚجٌؼٍع جٌّطٍٛذ١ٓ .‬
‫22‬

23. ‫‪‎ IMG SRC="thedome.jpg" HEIGHT="70" WIDTH="120">‎‬‬
‫<‬
‫‪‎ IMG SRC="thedome.jpg" HEIGHT="300" WIDTH="500">‎‬‬
‫<‬
‫جٌهحط١س جٌطحٌ١س جٌطٟ ضٓطهىَ ِغ <‪ٚ ALT ٟ٘ >IMG‬ف١ٙح ٔكىو ٔظح ً ذى٠الً ٠ظٍٙ ِىحْ جٌظٌٛز. ًٚ٘ج جٌٕض ٠القع‬
‫ٚطح ً ػٕىِح ٠ىْٛ ن١حٌ "ئظٙحٌ جٌظٌٛ ضٍمحت١ح ً" غ١ٍ فؼحي فٟ جٌّطظفف. وّح ضٓطط١غ ِالقظطٗ فٟ جٌفطٍز جٌطٟ ضٓرك‬
‫نض‬
‫ضكّ١ً جٌظٌٛ ٚنحطس فٟ جٌّٛجلغ ذط١ثس جٌطكّ١ً.‬
‫‪‎ IMG SRC="thedome.jpg" ALT="The Dome Of The Rock">‎‬‬
‫<‬
‫ػٕىِح ٔمَٛ ذاوٌجؼ طٌٛز ػّٓ فمٍز فاْ ِٛلغ ظٌٙٛ٘ح ٠طكىو ذحٌطرغ قٓد ضٍض١د ٌٚٚو٘ح فٟ جٌفمٍز، ِػٍٙح ِػً أٞ وٍّس‬
‫أٚ ػرحٌز أنٍٜ.‬
‫ٚج٢ْ قحْ جٌٛلص ٌىٟ ٕٔحلش ِؼح ً ذؼغ جألٌِٛ جٌطٟ ضطؼٍك ذحٌظٌٛ ٚجٌٍِْٛحش ذشىً ػحَ .‬
‫* ً٘ قحٌٚص أْ ضطؼٍف ػٍٝ أٔٛجع جٌٍّفحش جٌٍِْٛ١س جٌطٟ ضمَٛ ذطكّ١ٍٙح نالي ضظفكه ٌّٛجلغ جإلٔطٍٔص؟‬
‫٠ُنٍ عجٌُ جٌىّر١ٛضٍ ذحٌؼشٍجش ِٓ أٔٛجع جٌٍّفحش جٌٍِْٛ١س ٚضٕٓ١محش جٌظٌٛ. ٚوً ِٕٙح ٠هطٍف ػٓ غ١ٍٖ ِٓ ػىز ٔٛجـ،‬
‫أيوٍ ٌه ِٕٙح: جٌىلس، ٚػىو جألٌٛجْ جٌطٟ ٠ٓطٛػرٙح، ٚجٌكؿُ جٌطهُ٠ٕٟ ٌٍٍّف. ٌىٓ ٕ٘حن ٔٛػ١ٓ فمؾ ِٓ ًٖ٘ جٌٍّفحش ٠طُ‬
‫ضىجٌّٚٙح قحٌ١ح ً فٟ جإلٔطٍٔص ّٚ٘ح:‬
‫‪JPEG ,JPG‬‬
‫ئنطظحٌ ٌـ ِ ‪٠ٚ .Group Experts Photographic Joint‬ىػُ ً٘ج جٌطٕٓ١ك طٌٛجً ذؼ١حٌ 42 ذص (أٞ 7.61 ٍِ١ْٛ ٌْٛ).‬
‫ِٚ١ُز ً٘ج جٌطٕٓ١ك ضطّػً فٟ ئِىحٔ١س ػغؾ جٌظٌٛ ذٕٓد ِهطٍفس ػٕى ضهُ٠ٕٙح ٚذحٌطحٌٟ جٌكظٛي ػٍٝ طٌٛ طغ١ٍز جٌكؿُ‬
‫ٔٓر١ح ً.(أػٕٟ ٕ٘ح قؿُ جٌطهُ٠ٓ ذحٌى١ٍٛذح٠طحش ٌٚ١ّ ػحو جٌظٌٛز). ٌىٓ ذحٌّمحذً وٍّح ئَوجوش ٔٓرس جٌؼغؾ ٚطغٍ قؿُ‬
‫أخ‬
‫جٌٍّف وحْ يٌه ػٍٝ قٓحخ جٌؿٛوز ٚجٌٛػٛـ.‬
‫‪GIF‬‬
‫ئنطظحٌ ٌـ ِ ‪ٚ Format Interchange Graphical‬ألظٝ ػىو ٌألٌٛجْ فٟ ً٘ج جٌطٕٓ١ك ٘ٛ 562 ٌْٛ. ِٚغ يٌه فاْ أقؿحَ‬
‫جٌظٌٛ جٌّهُٔس ذٗ ور١ٍ ٔٓر١ح ً ِمحٌٔس ذطٕٓ١ك ‪ٌ .JPG‬ىٓ ٕ٘حن ُِج٠ح ٌجتؼس ٠ٕفٍو ذٙح ضٕٓ١ك ‪ِّ GIF‬ح ٠ٓطىػٟ جْطهىجِٗ‬
‫فٟ طفكحش جٌٛ٠د، أٌٚٙح جٌمىٌز ػٍٝ ضهُ٠ٓ طٌٛ ذهٍف١حش شفحفس ‪ٚ Transparent Images‬غحٔ١ٙح جٌظٌٛ جٌّطكٍوس‬
‫‪Animated Gifs‬‬
‫ِفظٍس قٛي ًٖ٘ جٌّٛجػ١غ ػّٓ وٌِٚ ‪.Pro Paint Shop‬‬ ‫ٚضؿى ِؼٍِٛحش ٚجف١س ٚوٌْٚح ً‬
‫ٚج٢ْ لى ضٓأي، أٞ ِٓ ً٘٠ٓ جٌطٕٓ١م١ٓ أْطهىَ فٟ طفكحضٟ؟! ال ٠ٛؾى ؾٛجخ لطؼٟ ًٌٙج جٌٓإجي ٌىٓ ئٌ١ه ٘حض١ٓ جٌّؼحوٌط١ٓ:‬
‫‪ =JPG‬جٌظٌٛ جٌكم١م١س يجش جٌؼىو جٌىر١ٍ ِٓ جألٌٛجْ، ٚيجش جألذؼحو جٌىر١ٍز‬
‫‪ =GIF‬جٌظٌٛ لٍ١ٍس جألٌٛجْ ٚطغ١ٍز جألذؼحو ِػً جألٌَجٌ .‬
‫32‬

24. ‫اندزض انعا ض : انٕصالث حشعبيت‬
‫ال‬
‫و١ف ٚطٍص ئٌٝ ًٖ٘ جٌظفكس؟ ! ٌذّح ضؼطرٍ ً٘ج ْإجالً ْه١فحً، ٚأْ جإلؾحذس ػٍ١ٗ ٟ٘ ِٓ جٌرى٠ٙ١حش ... ًٚ٘ج طك١ف ! ِٓ‬
‫جٌّإوى أٔه لّص ذحإلٔطمحي ئٌٝ ٕ٘ح ِٓ نالي ئقىٜ طفكحش ً٘ج جٌّٛلغ، أٚ ِٓ نالي أقى ِكٍوحش جٌطفط١ش، أٚ ِٓ نالي‬
‫أقى جٌّٛجلغ جٌطٟ لّص ذُ٠حٌضٙح ِإنٍجً ... ٚفٟ وً جألقٛجي لّص ذحٌٕمٍ ػٍٝ ٚطٍس ضشؼر١س ِح .‬
‫‪ ...Links‬أٚ جٌٛطالش جٌطشؼر١س ٟ٘ ٌٚـ جإلٔطٍٔص . ٚئيج وحٔص جإلٔطٍٔص ذّؿٍّٙح ٟ٘ شرىس جٌؼٕىرٛش فاْ ًٖ٘ جٌٛطالش‬
‫ٟ٘ جٌه١ٛؽ جٌطٟ ضشىً ًٖ٘ جٌشرىس ٚضإٌف قٍمحش جٌٛطً ذ١ٓ جٌّال٠١ٓ ِٓ ِٛجلؼٙح . ضٕمٍ ػٍٝ ٚطٍس ِح فطٕمٍه ئٌٝ طفكس‬
‫أنٍٜ فٟ ٔفّ جٌّٛلغ ... ٚضٕمٍ ػٍٝ ٚطٍس أنٍٜ ٌطٕمٍه وٍ١ح ً ئٌٝ أقى جٌّٛجلغ فٟ جٌؿحٔد ج٢نٍ ِٓ جٌؼحٌُ ... ٚطٍس ضؿؼٍه‬
‫ضكًّ ٍِفح ً ٚأنٍٜ ضؿؼٍه ضشغً ِمطؼح ِْٛ١م١ح ً ٚغحٌػس ضؼٍع ٌه طٌٛز...‬
‫ّ‬ ‫ّ‬
‫قٕٓحً، ِٓ جٌّإوى أٔه جْطٕطؿص ج٢ْ ِٓ ًٖ٘ جٌّمىِس أٔه ذظىو ضؼٍُ و١فٟ ز ئوٌجؼ جٌٛطالش جٌطشؼر١س فٟ طفكحضه ... ٌمى‬
‫طىق جْطٕطحؾه ًٌٌه ٘١ح ئٌٝ جٌؼًّ...‬
‫ٕ٘حن ػىز ن١حٌجش ٌٍٛطالش جٌطشؼر١س، ِٕٙح أْ ضىْٛ جٌٛطٍس ٌّٛلغ آنٍ، أٚ أْ ضىْٛ ٌظفكس أنٍٜ وجنً جٌّٛلغ ٔفٓٗ،‬
‫(ئٌٝ أػٍٝ أٚ أْفً ػٍٝ ْر١ً جٌّػحي ) أٚ أْ ضىْٛ ٚطٍس ٌؼٕٛجْ ذٍ٠ى‬ ‫ِٕٚٙح أْ ضىْٛ ٌّىحْ آنٍ فٟ ٔفّ جٌظفكس‬
‫ئٌىطٍٟٚٔ ‪ٚ E-mail‬فٟ ؾّ١غ جٌكحالش فاْ جٌّرىأ ٚجقى ٌىٓ ضهطٍف ذؼغ جٌطفحط١ً . ْٚٛف أٔحلش ِؼه وً قحٌس ػٍٝ قىز‬
‫ٚذحٌطفظ١ً.‬
‫ٔٓطهىَ جٌَْٛٛ‬
‫<‪>‎ < ... >/A‬‬
‫‪A‬‬
‫وَْٛٛ أْحْ١س إلوٌجؼ جٌٛطالش جٌطشؼر١س، ٟٚ٘ جنطظحٌ ٌىٍّس ‪ ٟ٘ٚ .Anchor‬ال ضؼًّ ٌٛقى٘ح ذً ضططٍد ئػحفس‬
‫نظحتض ِؼ١ٕس أٌٚٙح ٚأّ٘ٙح جٌهحط١س‬
‫‪HREF‬‬
‫جٌطٟ ٔكىو ِٓ نالٌٙح جٌّٛلغ جًٌٞ ٍٔ٠ى جٌىالٌس ػٍ١ٗ، ٚ٠ؿد أْ ٠ىطد ػٕٛجْ جٌّٛلغ وحِالً.‬
‫جٌكحٌس جألٌٚٝ: ئوٌجؼ ٚطٍس ضشؼر١س ضش١ٍ ئٌٝ ِٛلغ نحٌؾٟ.‬
‫ٌٕمُ ذاوٌجؼ ٚطٍس ضشؼر١س ئٌٝ أقى جٌّٛجلغ جٌؼٍذ١س جٌٍجتىز ٚجٌٍجتغز، ٚ٘ٛ ِٛلغ شٍوس طهٍ . ٚػٕٛجٔٗ‬
‫‪ http://www.sakhr.com‬فٟ ًٖ٘ جٌكحٌس ٠طُ وطحذس جٌش١فٍز ذحٌشىً جٌطحٌٟ:‬
‫>‪<A HREF="http://www.sakhr.com"> <‎A‬‬
‫/‬
‫ٌىٓ ذمٟ شٟء ٚجقى ٚ٘ٛ جٌؼرحٌز أٚ جٌىٍّس جٌطٟ ْ١طُ جٌٕمٍ ػٍ١ٙح ٌطشغ١ً جٌٛطٍس، ًٖٚ٘ ٠ؿد أْ ضٛػغ ذ١ٓ جٌّْٛ١ٓ <‪>A‬‬
‫... <‪ .>‎ A‬أٞ ٌىٟ ضىطًّ جٌٛطٍس جٌٓحذمس ٠ؿد أْ ٔىطد ِؼٙح أٞ ػرحٌز ٍٔ٠ى٘ح، ٌىٟ ٠ٕمٍ ػٍ١ٙح جٌُجتٍ فطٕمٍٗ ئٌٝ جٌؼٕٛجْ‬
‫/‬
‫جٌّطٍٛخ. ِح ٌأ٠ه ذؼرحٌز: ‪ٚ Go To SAKHR‬جٌطٟ ضظرف جٌش١فٍز ِؼٙح ذحٌشىً جٌطحٌٟ:‬
‫>‪<A HREF="http://www.sakhr.com">Go To SAKHR<‎A‬‬
‫/‬
‫ٚضظٍٙ جٌٛطٍس وّح ٠ٍٟ:‬
‫‪Go To SAKHR‬‬
‫ٌُ ضؼؿره؟ ٌ١ّ يٌه ِشىٍس فأٔص ضٓطط١غ وطحذس أٞ شٟء ضٍ٠ىٖ وؼٕٛجْ ٌٍٛطٍس جٌطٟ ضٍ٠ى٘ح. ِح ٌأ٠ه ٌٛ ؾؼٍٕح وٍّس‬
‫‪ ٟ٘ SAKH‎‬فمؾ جٌؼٕٛجْ ًٌٖٙ جٌٛطٍس.‬ ‫‪R‬‬
‫‪‎ o To <A HREF="http://www.sakhr.com">SAKHR<‎A>‎‬‬
‫‪G‬‬ ‫/‬
‫‪Go To SAKHR‬‬
‫42‬

25. ‫ذً ئٔه ضٓطط١غ ئوٌجؼ طٌٛز أٚ (ٌَ) ورى٠ً ػٓ جٌىٍّحش - وّح ضشح٘ى فٟ جٌىػ١ٍ ِٓ جٌّٛجلغ- ٚوً ِح ػٍ١ه فؼٍٗ فٟ ًٖ٘‬
‫جٌكحٌس ٘ٛ وطحذس جٌُْٛ جٌهحص ذاوٌجؼ جٌظٌٛز ذ١ٓ جٌّْٛ١ٓ <‪ >‎ A< ... >A‬ذحٌشىً جٌطحٌٟ:‬
‫/‬
‫>‪<A HREF="http://www.sakhr.com"><IMG SRC="sakhrlgo.gif">‎ ‎A‬‬
‫/<‬
‫ٚجًٌٞ ٠إوٞ ئٌٝ ظٌٙٛ جٌظٌٛز جٌطحٌ١س وٛطٍس ضشؼر١س ٌّٛلغ طهٍ‬
‫ٚذشىً ػحَ فاْ أٞ شٟء ٠ٛػغ ذ١ٓ جٌّْٛ١ٓ <‪ْٛ >‎ A< ... >A‬ف ٠ىْٛ جٌْٛ١ٍس أٚ جٌؼٕٛجْ جًٌٞ ٠ٕمٍٕح ئٌٝ جٌّٛلغ‬
‫/‬
‫جٌّشحٌ ئٌ١ٗ فٟ جٌٛطٍس جٌطشؼر١س، ْٛجء وحْ ً٘ج جٌشٟء ٔظح ً أٚ طٌٛز أٚ والّ٘ح ِؼح ً.‬
‫ً‬
‫ٕٔطمً ج٢ْ ئٌٝ جٌكحٌس جٌػحٔ١س، ٟٚ٘ أْ ضش١ٍ جٌٛطٍس جٌطشؼر١س ئٌٝ ٍِف ِٛؾٛو فٟ ٔفّ جٌّٛلغ (أٞ ٍِف ِكٍٟ ) ْٛجء وحْ‬
‫ً‬
‫ٍِف ‪ HTML‬أٚ طٌٛز أٚ غ١ٍ يٌه . ٚفٟ ًٖ٘ جٌكحٌس فاْ ِح ٠ىطد ِغ جٌهحط١س ‪ ٛ٘ HREF‬جُْ ً٘ج جٌٍّف جٌّطٍٛخ‬
‫جٌٛطٛي ئٌ١ٗ.‬
‫ٌٕمُ ذأشحء ٚطٍس ضشؼر١س ضمٛؤح ئٌٝ جٌظفكس جٌٍت١ٓ١س ًٌٙج جٌّٛلغ ٚذحٌّٕحْرس فاْ جٌٍّف جًٌٞ ٠كطٛ٠ٙح جّْٗ ‪، index.html‬‬
‫ٚجٌش١فٍز جٌهحطس ذًٌه ٟ٘:‬
‫>‪<A HREF="index.html">Main Page<‎A‬‬
‫/‬
‫‪Main Page‬‬
‫ٚأيوٍن ذأٔه ضٓطط١غ ئوٌجؼ طٌٛز ٕ٘ح أ٠ؼح ً وؼٕٛجْ ٌٍٛطٍس جٌطشؼر١س ٚيٌه ذٕفّ جٌطفحط١ً جٌطٟ شٍقطٙح فٟ جٌكحٌس‬
‫جٌٓحذمس.‬
‫٘١ح ٔىٌؼ طٌٛز ِظغٍز وؼٕٛجْ ٌٛطٍس ػر١س ٌٍظٌٛز جألطٍ١س.‬
‫ضش‬
‫>‪<A HREF="nablus1.jpg"><IMG SRC="nablus_1.jpg" BORDER="0"><‎A‬‬
‫/‬
‫فٟ ً٘ج جٌّػحي لّص ذطكى٠ى جٌظٌٛز جٌّظغٍز جٌّّٓحٖ ‪ nablus_1.jpg‬وٛطٍس ضشؼر١س ضظٍٕح ئٌٝ جٌظٌٛز جألطٍ١س جٌّّٓحٖ‬
‫‪nablus1.jpg‬‬
‫ٌىٓ ئٔطرٗ ! ئيج وحْ جٌٍّف جٌّطٍٛخ ٚجًٌٞ ضٍ٠ى جإلشحٌز ئٌ١ٗ ِٛؾٛوجً فٟ ِؿٍى ِهطٍف ػٓ جٌّؿٍى جًٌٞ ٠ٛؾى ذٗ جٌٍّف‬
‫جٌكحٌٟ، ف١ؿد ػٍ١ه ضكى٠ى جٌّٓحٌ جٌه جًِ ًٌٙج جٌٍّف ٚيٌه ذٕفّ جٌطٍ٠مس جٌطٟ ٔحلشٕح٘ح فٟ جٌىٌِ جٌٓحذك ػٕىِح لّٕح‬
‫٠اوٌجؼ جٌظٌٛ.‬
‫أِح جٌكحٌس جألن١ٍز ٚجٌطٟ ٔمَٛ ف١ٙح ذاوٌجؼ ٚطٍس ضشؼر١س ٌؼٕٛجْ ذٍ٠ى ئٌىطٍٟٚٔ، ٠إوٞ جٌٕمٍ ػٍ١ٙح ئٌٝ ئؽالق ذٍٔحِؽ جٌرٍ٠ى‬
‫جإلٌىطٍٟٚٔ ٌٍُجتٍ ذشىً ضٍمحتٟ. فحإلنطالف جٌٛق١ى جًٌٞ ٠طٍأ ٕ٘ح ٘ٛ وطحذس وٍّس ‪ MAILTO‬ذؼى نحط١س ‪ٌ HREF‬ىٟ‬
‫ضىي ػٍٝ أْ جٌؼٕٛجْ جًٌٞ ٠ٍٟ ٘ٛ ػٕٛجْ ‪ ّ١ٌٚ EMAIL‬أٞ ػٕٛجْ آنٍ‬
‫>‪<A HREF="MAILTO:yahya@palnet.com"> Email Me <‎A‬‬
‫/‬
‫‪Email Me‬‬
‫52‬

26. ‫اندزض انعابع: انددأل (1)‬
‫ً٘ج جٌىٌِ ْٟوْٛ جألٚي ِٓ وٌْ١ٓ قٛي جٌؿىجٚي . ٚلى فؼٍص ضؿُتطٙح ئٌٝ لّٓ١ٓ ٚيٌه ألّ٘١س ً٘ج جٌّٛػٛع ٚضؼىو‬
‫نظحتض جٌؿىجٚي ٚجقطّحالش جْطهىجِٙح فٟ طفكحش جٌٛ٠د.‬
‫ضؼى جٌؿىجٚي ِٓ ألٜٛ جألوٚجش جٌطٟ ضطؼّٕٙح ٌغس ‪ٚ HTML‬أوحو أؾَُ ذأٔٗ ال ٠ٛؾى ِٛلغ فٟ جإلٔطٍٔص ئال ٚ٠ٓطهىِٙح‬
‫ذظٌٛز أٚ ذأل ٌٜ. ٚجٌكم١مس أْ ٚػغ جٌؿىجٚي فٟ طفكحش جٌٛ٠د ال ٠مطظٍ ػٍٝ ضٍه جٌمٛجتُ ِٓ جٌر١حٔحش جٌطٟ ٔكطحؼ‬
‫ٌطٍض١رٙح فٟ طفٛف ٚأػّىز، ذً ٠طؼىٜ يٌه ئٌٝ جْطهىجِٙح فٟ ضظّ١ُ جٌظفكحش ٔفٓٙح ٚضٕظ١ّٙح، ٚجٌطكىُ ذّظٍٙ٘ح‬
‫٠ك جٌظفكحش.‬‫ذظٌٛز لٛ٠س ٚفؼحٌس ال ٠ّىٓ أوجؤ٘ح ِّٙح جْطهىِٕح ِٓ َْٚٛ نحطس ذطّٕ‬
‫ئْ جٌطؼحًِ ِغ جٌؿىجٚي ٚئوٌجؾٙح فٟ طفكحش جٌٛ٠د ًْٙ ؾىجً ِػٍٗ ِػً أٞ أوجز ِٓ أوٚجش ‪ٌ HTML‬ىٕٗ لى ٠رىٚ ٌه ٍِذىح ً‬
‫ذؼغ جٌشٟء ٚنحطس فٟ جٌرىج٠س، ٚيٌه ٌطؼىو جٌهظحتض جٌطٟ ضٓطؼًّ ِؼٙح ٚضؼىو جألٚؾٗ جٌطٟ ٔٓطط١غ جٌطظٍف ذٙح . ٌىٓ‬
‫ال ضمٍك فىً شٟء ٠رىٚ طؼرح ً فٟ ذىج٠طٗ ٌٚىٓ ٍْػحْ ِح ٠ظرف ْٙالً.‬
‫ً٘ أٔص ِٓطؼى؟ ئيْ ٘١ّح ذٕح…‬
‫ذىج٠س، ئٌ١ه ً٘ج جٌٛطف جٌرٓ١ؾ ٌٍَْٛٛ جألْحْ١س جٌهحطس ذحٌؿىجٚي‬
‫َْٚٛ ضؼٍ٠ف جٌؿىٚي‬ ‫>‪<TABLE>...<‎ TABLE‬‬
‫/‬
‫‪ َْٛٚ Table Row‬ضؼٍ٠ف جٌظف فٟ جٌؿىٚي‬ ‫>‪<TR>...<‎ TR‬‬
‫/‬
‫‪ َْٛٚ Table Data‬ضغٌ٠ف جٌهال٠ح فٟ جٌظف ٚضؼٍ٠ف ِكطٛ٠حش وً نٍ١س‬ ‫>‪<TD> Cell Data <‎TD‬‬
‫/‬
‫ٚج٢ْ ٌٕطىٍُ ذظٌٛز أوػٍ ولس ٚضفظ١الً:‬
‫ًٖ٘ ٟ٘ جٌَْٛٛ جٌطٟ ٔرىأ ذٙح إلوٌجؼ ؾىٚي ِىْٛ ِٓ نٍ١س ٚجقىز أٚ ِٓ ٍِ١ْٛ نٍ١س… جألٍِ ْ١حْ‬
‫<‪>‎ TABLE< ... >TABLE‬‬
‫/‬
‫ٚج٢ْ ذؼى ئوٌجؼ ً٘٠ٓ جٌّْٛ١ٓ، ٕ٘حن ْإجٌ١ٓ ٠ٕرغٟ جإلؾحذس ػٍ١ُٙ ج. جألٚي: وُ ػىو جٌظفٛف جٌطٟ ٍٔ٠ى٘ح فٟ جٌؿىٚي؟‬
‫غالغس، أٌذؼس، ِحتس؟ ال ذأِ، لُ ذاػحفس جٌَْٛٛ‬
‫<‪>‎ TR< ... >TR‬‬
‫/‬
‫ذٕفّ ػىو جٌظفٛف جٌطٟ ضٍ٠ى٘ح. ٌٕٚفطٍع ٕ٘ح أٔٙح غالغس.‬
‫>‪<TABLE‬‬
‫>‪<TR‬‬
‫>‪<‎TR‬‬
‫/‬
‫>‪<TR‬‬
‫>‪<‎TR‬‬
‫/‬
‫>‪<TR‬‬
‫>‪<‎TR‬‬
‫/‬
‫>‪<‎TABLE‬‬
‫/‬
‫62‬