Professional Documents
Culture Documents
برنامج تصميم
برنامج تصميم
برنامج تصميم
ﺃﻗﺪﻡ ﻟﻜﻢ ﺩﺭﻭﺱ ﰲ ﺗﻌﻠﻢ ﺑﺮﻧﺎﻣﺞ Web Pag makerﻟﺘﺼﻤﻴﻢ ﺍﳌﻮﺍﻗﻊ ﻭﻫﻮ ﻳﻌﺘﱪ ﻣﻦ ﺃﺳﻬﻞ
ﺑﺮﺍﻣﺞ ﺗﺼﻤﻴﻢ ﺍﳌﻮﺍﻗﻊ ﺣﻴﺚ ﻳﻜﻮﻥ ﺧﺎﱄ ﻣﻦ ﺍﻟﺘﻌﻘﻴﺪ ﻭﳝﻜﻨﻚ ﻣﻦ ﺇﻧﺸﺎﺀ ﻣﻮﻗﻊ ﻭﺑﻄﺮﻳﻘﺔ ﺍﺣﺘﺮﺍﻓﻴﺔ .
ﺳﺄﻗﻮﻡ ﺑﺸﺮﺡ ﻣﻔﺼﻞ ﻭ ﻭﺍﰲ ﺇﻥ ﺷﺎﺀ ﺍﷲ ﳍﺬﺍ ﺍﻟﱪﻧﺎﻣﺞ ﻟﻜﻲ ﻳﺘﻤﻜﻦ ﺃﻱ ﻣﺴﺘﺨﺪﻡ ﻟﻠﻜﻮﻣﺒﻴـﻮﺗﺮ ﺇﻥ
ﻳﻘﻮﻡ ﺑﺘﺼﻤﻴﻢ ﻣﻮﻗﻌﻪ ﺍﳋﺎﺻﺔ ﺑﺔ ﻭﻧﺸﺮﻩ ﻋﻠﻰ ﺷﺒﻜﺔ ﺍﻻﻧﺘﺮﻧﻴﺖ ﻟﺬﻟﻚ ﺃﲤﲎ ﻟﻠﺠﻤﻴﻊ ﺍﻟﻔﺎﺋﺪﺓ .
ﺣﺴﲔ ﺍﻟﻌﺎﺭﺿﻲ
ﻫﺬﻩ ﺍﻟﺼﻔﺤﺔ ﻫﻲ ﻭﺍﺟﻬﺔ ﺍﻟﱪﻧﺎﻣﺞ ﻭﲤﺜﻞ ﺻﺤﺔ ﻋﻤﻞ ﺟﺪﻳﺪ ﺍﻟﺼﻮﺭﺓ ﺍﻟﺘﺎﻟﻴﺔ ﺳﺄﻗﻮﻡ ﺑﺸﺮﺡ ﺍﻟﻘﻮﺍﺋﻢ
ﺍﻟﺮﺋﻴﺴﻴﺔ ﰲ ﺍﻟﱪﻧﺎﻣﺞ
:file -1ﻫﻨﺎ ﲡﺪ ﻛﻞ ﻣﺎﺳﺘﺤﺘﺎﺟﺔ ﻟﺒﺪﺃ ﻋﻤﻞ ﺟﺪﻳﺪ ﺃﻭ ﻓﺘﺢ ﻋﻤﻞ ﺳﺎﺑﻖ ﻣﻦ ﻫﻨﺎ ﳝﻜﻨﻚ ﺗﺴﺠﻴﻞ
ﺍﻟﻌﻤﻞ ﻋﻨﺪ ﺍﻻﻧﺘﻬﺎﺀ
: Edit-2ﻫﻨﺎ ﳝﻜﻨﻚ ﻗﺺ ﻭ ﻟﺼﻖ ﻭ ﺣﺪﻑ ﻣﺎﺗﺮﻳﺪ ﻭ ﻣﻦ ﻫﻨﺎ ﳝﻜﻨﻚ ﻗﻔﻞ ﺍﻟﻌﻤﻞ ﻭ ﻓﺘﺢ ﻣﱴ
ﺷﺌﺖ
:Page -3ﻫﻨﺎ ﲡﺪ ﺻﻔﺤﺎﺕ ﻣﻮﻗﻌﻚ ﻭ ﳝﻜﻨﻚ ﺃﻳﻀﺎ ﺇﺿﺎﻓﺔ ﺻﻔﺤﺔ ﺟﺪﻳﺪﺓ ﺃﻭ ﺣﺬﻑ ﺻﻔﺤﺔ.
:Insert -4ﻭﻣﻦ ﻫﻨﺎ ﳝﻜﻨﻚ ﺇﺿﺎﻓﺔ ﻣﺎ ﺗﺮﻳﺪ ﺇﱃ ﻣﻮﻗﻌﻚ ﻛﻤﺎ ﺗﺸﺎﺀ ﺣﻴﺚ ﲡﺪ ﻛﻞ ﻣﺎ ﺳﺘﺤﺘﺎﺟﻪ
:Arrange -6ﻫﻨﺎ ﺍﻟﻜﺜﲑ ﻣﻦ ﺍﻷﺯﺭﺍﺭ ﺍﳉﻤﻴﻠﺔ ﳌﻮﻗﻌﻚ ﻭﺍﻟﻜﺜﲑ ﻣﻦ ﺍﻟﺒﻨﺮﺍﺕ ﻭ ﺍﳋﻠﻔﻴﺎﺕ .
ﺍﻧﺘﻬﻴﻨﺎ ﻣﻦ ﺗﻌﺮﻳﻔﻜﻢ ﻋﻠﻰ ﻭﺍﺟﻬﺔ ﺍﻟﱪﻧﺎﻣﺞ ﻭﺍﻟﻘﻮﺍﺋﻢ ﺍﻟﱵ ﻓﻴﻬﺎ ﺃﻻﻥ ﻧﺄﰐ ﺇﱃ ﺷﺮﺡ ﺍﻟﻘﻮﺍﺋﻢ ﻭﻣﺎ ﳚﻮﺩ
ﺑﺪﺍﺧﻠﻬﺎ .
-1
ﻚ.
: New site form Templetﻟﺒﺪﺃ ﻋﻤﻞ ﺟﺪﻳﺪ ﻣﻦ ﺗﺼﻤﻴﻢ ﺟﺎﻫﺰ ﻟﺪﻳ
-2
-3
ﳊﻔﻆ ﺍﻟﻌﻤﻞ ﺑﺼﻴﻐﺔ Htmlﻭﻫﻲ ﺻﻴﻐﻪ ﺻﻔﺤﺎﺕ ﺍﻻﻧﺘﺮﻧﻴﺖ ﻟﻴﻈﻬﺮ ﺍﻟﻌﻤﻞ ﺑﺸﻜﻠﻪ ﺍﻟﻨﻬﺎﺋﻲ ﻛﻤﺎ
ﰲ ﺃﻟﺼﻮﺭﻩ .
-5ﻻﺳﺘﻌﺮﺍﺽ ﻋﻤﻠﻚ ﰲ ﺍﳌﺘﺼﻔﺢ ﻛﻤﺎ ﻣﻮﺿﺢ ﰲ ﺍﻟﺼﻮﺭﺓ .
ﻗﻤﻨﺎ ﺳﺎﺑﻘﺎ ﰲ ﺍﳋﻄﻮﺓ ﺭﻗﻢ ) ( 4ﲝﻔﻆ ﺍﻟﻌﻤﻞ ﺑﺼﻴﻐﺔ Htmlﺃﻻﻥ ﺳﻨﻘﻮﻡ ﲝﻔﻈﻪ ﺑﺼﻴﻐﺔ ﺃﺧﺮﻯ
ﺣﻴﺚ ﳝﻜﻨﻨﺎ ﺍﻟﱪﻧﺎﻣﺞ ﻣﻦ ﺍﳊﻔﻆ ﺑﺄﻛﺜﺮ ﻣﻦ ﺻﻴﻐﻪ ﻣﺜﻞ phpﺃﻭ aspﻛﻤﺎ ﻣﻮﺿﺢ ﺑﺎﻟﺼﻮﺭﺓ .
-6
ﻹﺭﺳﺎﻝ ﺍﳌﻮﻗﻊ ﺇﱃ ﺃﻣﻴﻠﻚ ﺃﻭ ﺃﻱ ﺇﻣﻴﻞ ﲣﺘﺎﺭ ﻛﻤﺎ ﻣﺒﲔ ﰲ ﺍﻟﺼﻮﺭﺓ ﺍﻟﺘﺎﻟﻴﺔ ﻭﻟﻜﻦ ﳚﺐ ﺇﻥ ﺗﻜﻮﻥ
ﻣﻮﻫﻴﺊ ﺇﻣﻴﻞ ﻋﻠﻰ ﺑﺮﻧﺎﻣﺞ Outlookﻭﻛﻤﺎ ﻣﻮﺿﺢ ﺑﺎﻟﺼﻮﺭﺓ ﺍﻟﺘﺎﻟﻴﺔ .
-7
ﻫﺬﺍ ﺍﻷﻣﺮ ﻳﺴﺘﻌﻤﻞ ﻟﻄﺒﺎﻋﺔ ﺻﻔﺤﺔ ﺍﳌﻮﻗﻊ .
-8
ﻟﻠﺨﺮﻭﺝ ﻣﻦ ﺍﻟﺒـــﺮﻧـﺎﻣﺞ .
ﺍﻧﺘﻬﻴﻨﺎ ﻣﻦ ﺷﺮﺡ ﻗﺎﺋﻤﺔ . File
.
ﳝﻜﻦ ﺗﻐﲑ ﻟﻮﻥ ﺍﳋﻂ ﻭﺣﺠﻤﻪ ﻟﻸﺯﺭﺍﺭ ﻛﻤﺎ ﻣﻮﺿﺢ ﰲ ﺃﻟﺼﻮﺭﻩ
ﺃﻻﻥ ﻧﺸﺮﺡ ﺃﻣﺮ Tableﻣﻦ ﻗﺎﺋﻤﺔ Insert
ﺑﻌﺪ ﺍﻟﻀﻐﻂ ﺗﻈﻬﺮ ﻫﺬﻩ ﺍﻟﻮﺍﺣﺔ
ﺗﻮﺟﺪ ﺃﻳﻀﺎ ﺿﻤﻦ ﻗﺎﺋﻤﺔ Insertﻗﺎﺋﻤﺔ ﻓﺮﻋﻴﻪ ﻫﻴﻪ Objectﺳﻴﺘﻢ ﺷﺮﺣﻬﺎ ﻛﻤﺎ ﻣﺒﲔ ﰲ
ﺍﻟﺼﻮﺭﺓ .
ﺇﻛﻤﺎﻝ ﺷﺮﺡ ﻣﺎ ﺗﺒﻘﻰ ﻣﻦ ﺃﻭﺍﻣﺮ ﺿﻤﻦ ﻗﺎﺋﻤﺔ Insertﻛﻤﺎ ﻣﻮﺿﺢ ﺑﺎﻟﺼﻮﺭﺓ .
ﺍﻧﺘﻬﻰ ﺷﺮﺡ ﻗﺎﺋﻤﺔ .Insert
-1ﻳﺴﺘﺨﺪﻡ ﻫﺬﺍﻥ ﺍﻷﻣﺮﺍﻥ ﻟﺘﻐﲑ ﺷﻜﻞ ﺍﻟﻜﻠﻤﺔ ﺍﻟﱵ ﲤﺜﻞ ﺭﺍﺑﻂ ﻟﺼﻔﺤﻪ ﺃﻭ ﻣﻮﻗﻊ ﺣﻴﺚ ﳝﻜﻦ
ﺗﻐﲑ ﻟﻮﻥ ﺍﻻﺳﺘﺎﻳﻞ ﻣﻦ ﻫﺬﺍﻥ ﺍﻷﻣﺮﺍﻥ
-2ﺗﻌﺘﱪ ﻫﺬﻩ ﺍﻟﻮﻇﻴﻔﺔ ﻣﻦ ﺍﻟﻮﻇﺎﺋﻒ ﺍﳌﻬﻤﺔ ﻛﻤﺎ ﻣﻮﺿﺢ ﺑﺎﻟﺼﻮﺭﺓ
ﺳﺄﻗﻮﻡ ﺑﺸﺮﺡ ﺷﺮﻳﻂ ﺍﻷﺩﻭﺍﺕ ﻟﻠﱪﻧﺎﻣﺞ ﺍﻟﺬﻱ ﻳﻈﻬﺮ ﺑﺎﻟﺼﻮﺭﺓ .
"! #!$%