دانلود مقاله سایت های اینترنتی

در دنیای امروز که رفته رفته تمامی اعمالی که بشر انجام می دهد به صورت مجازی و از طریق اینترنت به منظور سهولت کار انجام می شود ، سایت های اینترنتی خود را به عنوان یکی از نیاز های انسان روز به روز بیشتر پیدا می کنند و هر شرکت ، نهاد ، مجموعه و هر شخصی برای نمایاندن خود به دیگران و گام برداشتن در جهت پیشرفت خویش ، نیازمند در اختیار داشتن وب سایتی می باشد .

امروزه سایت های اینترنتی در حال جایگزین شدن به جای مغازه ها و بازار های فیزیکی و تبلیغات مختلف می باشند چرا که بشر امروزه به درستی معنی وقت طلاست را درک می کند و از تلف کردن وقت در رفت و آمد های مکرر و بی مورد به سطوح آمده است .

اما نکته ای که در این میان خود نمایی می کند و بیش از پیش به چشم میآید لزوم حفظ مفهوم حفاظت اطلاعات در چهار چوب الکترونیکی جدید است و اینکه استفاده از امکاناتی که نهادی که سایتی را در اینترنت جهت استفاده ی عده ای خاص قرار می دهد ؛ فقط محدود به همان عده باشد .

به عبارتی دیگر اجازه ی استفاده از آن امکانات را خود آن سایت برای کاربران تعیین کند .

در چنین شرایطی است که نیاز به مجوز ها تحت وب ( ( Web Permissionsاحساس می شود.

به همین منظور بر آن شدم تا این مفهوم نسبتا تازه را در قالب مجتمع عالی آموزشی و پژوهشی خراسان پیاده سازی نمایم .

در طراحی این سایت علاوه بر پیاده سازی مفهوم Permission ها ، موارد دیگری از جمله برنامه نویسی های جاوا ، صفحات داینامیکی که متون آن های از بانک اطلاعاتی فراخوانی می شود و پیکر بندی آنها با استفاده از زبان های Server Side صورت می پذیرد و ...

نیز استفاده شده که هر یک در جای خود جای بحث دارد که به اختصار در مورد آنها در ادامه توضیح داده خواهد شد .

فصل اول : طراحی سایت ها 1-1) تاریخچه ی سایت های اینترنتی : در اولین روزهای تاسیس وب دستورات HTML بسیار ساده بود، ولی هنگامی که Web، شروع به پیشرفت نمود، طراحان خواستار کنترل بیشتری شده و در نتیجه مجموعه دستورات مورد نیاز تهیه گردید.سپس از آنجاییکه صفحات وب، بهتر است به صورت دینامیک و متحرک باشند، طراحان نیز خواستار ارتباط بین بینندگان سایت و صاحبان آن شدند، در نتیجه استفاده از دستورات HTML به تنهایی نیاز آنها را برطرف نکرد و سپس شرکت Netscape برای ایجاد و کنترل ارتباط بین صاحبان سایت و بینندگان آن در صفحات Web از JavaScript کمک گرفت.

با به وجود آمدن جاوا سکریپت بسیاری از نیاز هایی که طراحان سایت به دنبا آن بودند بر طرف شد جاواسکریپت که امروزه به عنوان یکی از قدرتمند ترین زبان های Client side مورد استفاده قرار می گیرد در بسیاری از موارد کاربرد داشت و جوابگو بود اما نکته ای که در مورد این زبان و زبان های مشابه ای که به مرور زمان برای کاربرد های مختلفی به وجود آمدند ، همچون VBSCRIPT , DHTML , …این بود که به واسطه ی اینکه ای کامپایل این زبان ها در سمت کاربر انجام می شد از طرفی Source کامل برنامه در اختیار کاربر قرار می گرفت و از آن مهم تر اینکه برنامه هایی که در سمت کاربر کامپایل می شوند – Client Side - کاملا وابسته به سیستم کاربر می شوند و اکر خطایی در کامپیوتر کاربر وجود داشته باشد عملکرد سایت را تحت تاثیر قرار می دهد ( به عنوان مثال بسیاری از منو ها و پروگرام های جاوا در صورتی که Java Virtual Machine نصب نباشد قابل نمایش نمی باشند و ...

) این دلایل و مواردی از این دست طراحان را بر این امر واداشت که تا در پی آن باشند که برنامه هایی طراحی کنند که در سمت سرور اجرا شده و نتیجه ی آن به صورت کد های Generate شده Html برای کاربر ارسال گردد ( Server Side ) .

از سوی دیگر نیاز به پایداری اطلاعات و استفاده از بانک های اطلاعاتی برای حفظ داده های مورد نیاز این ضرورت را به وجود آورد که برنامه های تحت وب بتوانند با بانک اطلاعاتی ارتباط برقرار کنند .

زبان هایی که امروزه قدرتمندانه تحت عنوان زبان های سرور ساید خودنمایی می کنند محدود به PHP و ASP و ASP.Net می باشند که هر یک به نوبه ی خود طیف وسیعی از سایت های پویای طراحی شده را به خودش اختصاص می دهد کاربرد ها و توانایی های متفاوتی دارند .

از آنجایی که در طراحی وب سایت مربوطه از ASP استفاده شده در ادامه ی این فصل فقط به اختصار توضیحاتی در مورد ASP به همراه مابقی ابزار ها و زبان های استفاده شده ذکر خواهد شد .

1-2) HTML 1-2-1) مقدمه ای بر HTML یک فایل HTML چیست؟

HTML را "اچ تی ام ال" و یا اچتمل بخوانید.

HTML برگرفته از حروف اول Language Markup Text Hyper میباشد.

یک فایل HTML فایلی از نوع text میباشد که متشکل از markup tag ها میباشد.

مرورگر یا Browser از روی markup tag ها می فهمد که چگونه باید صفحه را نمایش بدهد.

یک فایل HTML باید دارای انشعاب htm و یا html باشد.

یک فایل HTML فایلی از نوع text میباشد که با هر ادیتور ساده ای قابل ایجاد است.

وظیفه اصلی تگ های اچتمل ( markup tags ) بیان چگونگی نمایش اطلاعات میباشد.

ساختن یک فایل Html Notepad را باز کرده و متن زیر را در آن تایپ میکنیم: Title of page This is my first html page.

This text is bold سپس فایل را با نام مثلا test.html در درایو C:\ ذخیره می کنیم .

برای دیدن فایل اچتمل بالا در مرورگر یا Brower ( معمولا اینترنت اکسپلورر و یا نتسکیپ نویگیتور ) کافی است که از روی منوی File/Open file فایل بالا را از روی محل ذخیره شده باز کنیم .

یکی از مهمترین وظایف مرورگرها نمایش صفحات اچتمل میباشد، چه این صفحات روی کامپیوتر ذخیره شده باشند و یا اینکه از اینترنت خوانده شوند.

با کلیک روی این لینک فایلی شبیه فایل ذخیره شده از روی وب سرور توسط مرورگرتان خوانده شده و سپس نمایش داده خواهد شد توضیح مثال بالا اولین تگ مثال بالا تگ میباشد.

از روی این تگ، مرورگر نوع متن یعنی اچتمل بودنش را یافته و از رویانتهای متن اچتمل را میبابد.

متن بین تگ و تگاطلاعات شناسنامه ای یا "Header information" متن اچتمل بوده و نمایش داده نخواهند شد.

در این مثال با کمک تگهایوتیتر و یا Title صفحه که در این مثال عبارت "Title of page" میباشد در بالای مرورگر نمایش داده خواهد شد.

متن بین تگ و انتهای آن یعنی تگتنها اطلاعاتی است که توسط مرورگرنمایش داده خواهند شد.

متن بین تگ و انتهای آن یعنی تگ بصورت Bold و یا توپر نمایش داده خواهند شد.

فایل htm یا html ؟

اغلب مرورگرها هر دو نوع انشعاب را به خوبی میشناسند ولی ترجیحا به هنگام ذخیره فایلهای اچتمل از html استفاده کنید.( استفاده از انشعابهای سه حرفی مانند htm مربوط به قدیم و سیستم عاملهائی چون DOS بودند.) 1-2-2) عناصر ( Elements ) تگ های اچتمل (HTML Tags) با کمک تگ های اچتمل عناصر و یا Elements ساخته میشوند.

در زبان اچتمل حدود 80 عنصر تعریف شده است.

تگ های اچتمل بوسیله دو نویسه (char) > و تگ های اچتمل معمولا بصورت زوج ظاهر میشوند، مانند test تگ اول در یک زوج تگ مثلا تگ شروع و تگ دوم مثلا تگ پایانی نام دارد.

متن بین تگ اول و تگ دوم در یک زوج تگ محتوای عنصر یا element content نامیده میشود، مثلا "test" تگ های اچتمل را میتوانید بوسیله حروف لاتین کوچک (lower case) و یا بزرگ (upper case) نوشت و case sensitive نیستند.

برای مثال دو تگ و معادل هم هستند ولی شدیدا توصیه میشود که به خاطر سازگاری با XHTML از حروف کوچک استفاده شود.

عناصر اچتمل (HTML Elements) مثال بخش مقدمه را در نظر بگیرید: Title of page This is my first html page.

This text is bold *** نمونه ای از یک عنصر اچتمل: This text is bold عنصر اچتمل بالا با تگ شروع شده و با تگ پایان می یابد.

محتوای این عنصر عبارت "This text is bold" است.

لازم به ذکر است که کاربرد تگ نمایش توپر یا bold متون است.

*** مثال دوم یک عنصر اچتمل This is my first homepage.

This text is bold عنصر اچتمل بالا با تگ شروع شده و با تگ پایان می یابد.

همانطور که مشاهده می شود گاهی یک عنصر حاوی یک یا چند تگ دیگر میباشد.وظیفه تگ تعیین بدنه اصلی یا body یک متن اچتمل است.لازم به یادآوری است که تنها اطلاعات بخش یک فایل اچتمل در صفحه مرورگر نمایش داده خواهد شد.

شناسه های یک تگ (Tag Attributes) تگ ها میتوانند حاوی اطلاعات اضافی دیگر باشند، به این اطلاعات شناسه یا Attribute میگویند و وظیفه آنها بیان دیگر اطلاعات یک عنصر یا Element میباشد.

مثلا در مورد تگ شناسه ای به نام bgcolor وجود دارد که رنگ زمینه متن (background) را تعیین میکند برای نمونه اگر بخواهیم که رنگ زمینه صفحه Html سیاه باشد کافی است که به شکل زیر عمل کرد : در مثال زیر تگ دارای چهار شناسه مختلف با نامهای width، height ، align و border و مقادیر center، 60، 100 و 0 میباشد.

در مثال زیر تگ دارای چهار شناسه مختلف با نامهای width، height ، align و border و مقادیر center، 60، 100 و 0 میباشد.

......

شناسه ها به صورت کلی "مقدار=نام" یا "name=value" نوشته میشوند و همیشه به تگ شروع یک عنصر یا Element اضافه میشوند و نهایتا اگر در یک عنصر یا Element شناسه ها قید نشوند از مقادیر قراردادی یا default آنها استفاده خواهد شد مثلا در تگ body اگر شناسه bgcolor نوشته نشود از رنگ سفید برای زمینه صفحه استفاده خواهد شد.

مقدار یک شناسه را میتوانید داخل نویسه های " و یا ' بنویسید و اختیار دست شما است فقط در مواردی که مقدار یک شناسه شامل نویسه " هم میشود باید از نویسه ' استفاده شود.

1-2-3) تگ های اصلی ( Basic Tags ) سر تیترها (Headings) سر تیترها با کمک تگ های تا تعیین میشوند.

معرف بزرگترین سر تیتر و معرف کوچکترین سر تیتر است.

مرورگر به هنگام نمایش یک سر تیتر بصورت اتوماتیک یک سطر خالی قبل و بعد از هر سر تیتر اضافه خواهد کرد.

پاراگرافها (Paragraphs) پاراگرافها با کمک تگ معرفی میشوند.مرورگر به هنگام نمایش یک پاراگراف بصورت اتوماتیک یک سطر خالی قبل و بعد از آن اضافه خواهد کرد.

سطر جدید (Line Breaks) برای رفتن سر سطر جدید از تگ استفاده میشود.در این حالت یک پاراگراف جدید ایجاد نمیشود.

تگ از نوع تگ های خالی بوده و دارای تگ انتهائی (مثلا ) نمیباشد.

کامنت ها در اچتمل (Comments) برای نوشتن شرح و توضیحات در مورد کدهای اچتمل باید از تگ خاصی استفاده کنید.

برای اینکار باید متن و شرحتان را درون علائم قرار دهید.

مرور تگ های comment را در نظر نگرفته و محتوی آنها را نمایش نخواهد داد و فقط شرح و توضیحات برای برنامه نویس و دیگر افرادی که احتمالا در آینده با کد اچتمل کار خواهند کرد مفید خواهد بود.

(به محل نویسه "!" توجه کنید!

فقط یکی و آنهم در ابتدا) تگهای اصلی در جدول زیر عناصر معرفی شده در این فصل به همراه لینکهای مربوطه جهت مطالعه بیشتر آورده شده است.

توجه داشته باشید که برای هر عنصر فهرستی از شناسه ها یا Attributes موجود است و همچنین به شناسه های کنارگذاشته شده (Deprecated) در نسخه های آینده اچتمل توجه داشته باشید و سعی کنید که از آنها استفاده نکنید.

: 1-2-4) پیوندهای اچتمل ( HTML Links ) در محیط وب، صفحات اچتمل با کمک پیوندها به یکدیگر متصل (Link) میشوند.

اصطلاح ابرمتن (Hyper Text) در مقابل متن خطی (Linear) قرار دارد.

در یک متن معمولی خواندن به شکل خطی و از ابتدا به انتها میباشد و در مقابل در یک متن مختلط (Hyper) با کمک پیوندها میتوان از یک متن به هر صفحه دیگر در وب متصل شد.این کار با کمک عنصری به نام A یا Anchor میسر میگردد.

تگ Anchor و شناسه href برای ایجاد پیوند به صفحات دیگر از تگ استفاده میشود.

پیوندها میتوانند به بخش دیگری از همان صفحه، صفحات دیگر وب، تصاویر، فایلهای صوتی یا حتی فیلم ها و ...

اشاره کنند.

فرم کلی یک پیوند به قرار زیر است: در مثال بالا تگ برای ایجاد پیوندی به صفحه ای دیگر که آدرس اینترنتی آن url میباشد بکار رفته است.

برای تعیین مقصد و یا آدرس صفحه جدید از شناسه ای به نام href که همان hyerlink reference میباشد، استفاده میشود و مقدار این شناسه در واقع همان آدرس اینترنتی صفحه مقصد است.

بخش قابل رویت پیوند و در واقع متــنــی (و یا تصویری ) که توسط مرورگر نمایش داده خواهد شد و بازدیدکننده روی آن کلیک خواهد کرد میان تگهای و قرار داده میشود و هر چند که در مثال بالا این بخش متن "Some Text" است ولی میتواند حتی یک تصویر باشد.

شناسه target در پیوندها: با کمک شناسه target امکان تعیین مقصد پیوند جدید فراهم میشود.

در مثال بالا پس از کلیک روی پیوند، مرورگر سایت google.com را باز کرده و جایگزین سایت فعلی خواهد شد.

اگر میخواهید که مرورگر پیوند را در صفحه ای جدید باز کند باید از شناسه target و مقدار "_blank" برای آن استفاده کنید شناسه Name : با کمک شناسه name میتوانید پیوندها را نام گذاری کنید.پیوندهای نامگذاری شده امکان حرکت میان قسمتهای مختلف یک صفحه یا page را فراهم میکنند.

در اینصورت مثلا برای رفتن به آخر یک متن دیگر نیازی به Scrool down کردن تمامی صفحه نیست و کافی است که بازدیدکننده روی پیوندی که به آخر صفحه اشاره میکند کلیک کند.

استفاده از پیوندهای نامگذاری شده شامل دو مرحله است: 1- ایجاد یک پیوند نامگذاری شده (این قسمت به عنوان لنگر کار خواهد کرد.) : فرم کلی یک پیوند نام گذاری شده به قرار زیر است: وظیفه شناسه name تعیین نام برای پیوند است و مقدارآن همان نام پیوند میباشد.

نام پیوند هم هر نام لاتینی میتواند باشد.

در فرم کلی بالا، نام پیوند label و متنی که بعنوان پیوند نمایش داده میشود عبارت "Text to be displayed" خواهد بود.

مثال زیر به ایجاد یک پیوند نامگذاری شده با نام top میپردازد: 2- ایجاد یک پیوند به پیوند نامگذاری شده دیگر: برای دادن لینک به پیوندی نام گذاری شده، کافی است که پیوندی معمولی ایجاد کرده و در قسمت href آن ابتدا url مقصد و سپس نویسه # و در نهایت نام پیوند نامگذاری شده را درج کنید.

مثال زیر ایجاد پیوندی است که به لینک نامگذاری شده ای به نام top اشاره میکند: در اثر کلیک روی پیوند بالا مرورگر مستقیما به ابتدای بخش top صفحه http://www.MapSab.com/index.asps خواهد رفت.

اگر مقصد پیوند در همان صفحه قرار دارد نیازی به قید url نیست و فقط نویسه # و سپس نام پیوند کافی است: 1-2-5 ) جداول ( Tables) برای تعریف جداول از تگ استفاده میشود.

یک جدول از یک یا چند سطر که با کمک تگ تعریف میشوند، تشکیل میشود.

هر ردیف یا row از یک یا چند سلول، خانه یا cell تشکیل گردیده که با کمک تگ ایجاد میشوند.

نام های td و tr به ترتیب خلاصه شده row table و data table میباشند.

محتوی یک سلول میتواند متن، تصویر، فهرستها، جداول دیگر، پاراگرافها و ...

باشد.

مثال زیر جدولی است با دو سطر و سه ستون : جدولها و شناسه border و dir :  در مثال بالا شناسه border مرز جدول را مشخص میکند، مقدار 1 مرزی با ضخامت یک پیکسل را نمایش خواهد داد و مقدار صفر جدول را بدون مرز نمایش خواهد داد.

توجه داشته باشید که حالت پیش فرض یعنی جدولی بدون شناسه border ، جداول بدون مرز را نمایش خواهد داد.

 در مثال بالا شناسه dir یا direction و مقدار rtl برای آن، سبب تعیین نمایش جهت متون از راست به چپ خواهد شد و چو ن در داخل تک table تعریف شده است به تمامی سلولهای جدول اعمال خواهد شد.

خانه های خالی در جداول (Empty Cells) اگر محتوای خانه ای از یک جدول خالی باشد چه چیزی باید نمایش داده شود؟

بسته به مرورگری که استفاده میکنید نتیجه نمایش متفاوت است خانه خالی جدول بدون مرز نمایش داده خواهد شد در اینگونه موارد برای رفع مشکل کافی است که از non-breaking space ( ) یا همان نویسه و کاراکتر قاصله و بلانک استفاده شود و در مورد مثال ذکر شده مرورگر جدول را به شکل زیر نمایش خواهد داد: چند نکته اساسی در مورد جداول:  شناسه dir قابل استفاده در بسیاری از تگها ( مثلا table ، tr ، td ، th ) میباشد.

با کمک شناسه dir و مقدار rtl برای آن، جهت نمایش متون فارسی از "راست به چپ" تعیین میگردد.

توجه شود که مقدار شناسه dir به صورت موروثی از table به tr و th و از tr و th به td خواهد رسید.مثلا برای تعیین مقدار rtl برای تمامی خانه های یک جدول کافی است که فقط شناسه مزبور را در تگ table قید کنید و نیازی به قید آن در تمامی خانه های جدول نیست.

البته میتوان که در مورد یک ردیف خاص و یا یک خانه خاص شناسه dir را موردی تعیین کنید.

تگهای جداول 1-2-6 ) فرمها (Forms) تمامی عناصر و تگهائی که تاکنون ذکر شد فقط به نمایش اطلاعات پرداخته اند و هیچکدام به گرفتن و اخذ اطلاعات از کاربر نپرداخته اند.

فرمها که با تگ معرفی میشوند، طراح سایت را قادر به جمع آوری و اخذ اطلاعات از بازدیدکننده سایت خواهند کرد.

عنصر فرم و گروهی از عناصر و تگهای درون آن به دریافت و ارسال اطلاعات به سمت وب سرور کمک خواهند کرد و لازم به ذکر است که تمامی تگهای مربوط به فرمها باید درون تگهای و قرار میگیرند.

درون تگ فرم گروه زیادی از عناصر و تگهای مختلف قابل استفاده هستند از قبیل عناصر ورود متن یک سطری(text fields)، عناصر ورود متنهای چند سطری (Textarea)، منوهای drop-down و radio buttons و ...

تگ Input به عنوان پر مصرف ترین تگ مربوط به ورود اطلاعات باید از تگ نام برد.

در این تگ شناسه ای به نام type به تعیین نوع اطلاعات ورودی اختصاص دارد.

مقادیر ممکن برای این شناسه به قرار زیرند: text , checkbox , radio , password , hidden , submit , reset , button , file , image در ادامه به شرح بعضی از type های کاربردی خواهیم پرداخت: * ورودیهای متن (Text Fields) اگر میخواهید که بازدیدکننده اطلاعاتی از قبیل متن، اعداد و ...

را وارد کند از شناسه ای با مقدار "text" استفاده میشود.

توجه شود که تگ چیزی را به نمایش نخواهد گذاشت بلکه تگهای درون آن توسط مرورگر نمایش داده خواهند شد.

در مثال فارسی بالا به شناسه dir و مقدار rtl آن توجه شود .لازم به یادآوری است که اغلب مرورگرها در حالت پیش فرض برای ورودیهای متن اندازه 20 کاراکتر را در نظر میگیرند و اگر میخواهید که اندازه پیش فرض ورودیهای متن را تغییر دهید باید از شناسه ای به نام size استفاده کنید.

* ورودیهای Radio Buttons اگر میخواهید که بازدیدکننده گزینه ای را از بین چند گزینه محدود انتخاب کند، از مقدار "radio" برای شناسه type استفاده کنید: * ورودیهای Checkboxes اگر بخواهیم که بازدیدکننده یک یا چند گزینه را از بین چند گزینه محدود انتخاب کند، از مقدار "checkbox" برای شناسه type استفاده می کنیم : * شناسه Action و دکمه Submit در فرمها ( Form's Action Attribute & Submit Button) در فرمها برای ارسال اطلاعات کسب شده از دکمه ای به نام ارسال یا Submit Button استفاده میشود و در اثر کلیک کاربر بروی این دکمه "Submit" ، اطلاعات درون فرم به فایلی دیگر ارسال خواهند شد.

برای تعیین مقصد ارسال اطلاعات باید درون تگ form از شناسه ای به نام action استفاده می کنیم .

مقدار شناسه action آدرس یا url فایلی است که به دریافت و سپس پردازش اطلاعات دریافتی خواهد پرداخت.

معمولا فایلهای بخش action برنامه ها و اسکریپت هائی نوشته شده با ربانهای cgi مانند ASP، Perl ، PHP و ...

بوده و وظیفه آنها دریافت اطلاعات فرمها و سپس پردازش آنها میباشد.

تعیین مقدار "submit" برای شناسه type سبب نمایش دکمه Submit یا ارسال خواهد گردید.

1-2-7 ) استایل شیتها ( Style Sheets ) در نسخه جدید(4/0) اچتمل امکان جداسازی کامل فرمت دهی از ساختار صفحات اچتمل فراهم شده است.

در این نسخه توصیه میشود که تمامی اطلاعات مربوط به نمایش و ترازبندی به فایلهائی مجزا از صفحه اچتمل منتقل شوند.

بخشی از صفحات اچتمل که مربوط به نمایش، ترازبندی و فرمت دهی است، استایل شیت یا "Style Sheet" نامید شده و معمولا به صورت فایلی مجزا درون بخش صفحات اچتمل معرفی میگردند.

* چگونگی استفاده از استایل شیتها: مرورگرها از روی استیلهای تعریف شده توسط استایل شیتها به فرمت دهی و نمایش اطلاعات درون صفحه اچتمل میپردازند.

تعریف و استفاده از استایل ها در صفحات اچتمل به سه روش مختلف ممکن میباشد: 1)استایل شیتهای خارجی (external style sheet) : در این روش تمامی استیلها و تعاریف نمایشی درون فایلی جداگانه قرار گرفته و بسیار مناسب حالتهائی است که قرار است که استایلی به بیش از یک صفحه اچتمل اعمال شود.

مزیت این روش سهولت در تغییر ظاهر صفحات یک وب سایت میباشد و برای یک تغییر کلی در سایت کافی است که فایل استایل شیت کل سایت که معمولا یک فایل واحد است تغییر داده شود.

(باید توجه داشت که در این حالت تمامی صفحات سایت باید به یک فایل استایل شیت واحد لینک شده باشند.) استایل شیتهای خارجی توسط تگ که درون بخش head صفحات اچتمل قرار میگیرد، معرفی میشوند.

در مثال زیر با کمک شناسه href از تگ link نام و در حالت کلی url فایل در برگیرنده استایلهای تعریف شده تعیین میگردد: 2)استایل شیتهای داخلی (Internal Style Sheet) : کاربرد این روش در حالتهائی است که صفحه اچتمل نیازمند تعریف استایلی منحصر به فرد و مجزا بوده و استایل طراحی شده فقط بدرد آن صفحه خواهد خورد.

در این حالت باید کدهای حاوی تعریف استایل درون تگ های و قرار گرفته و معمولا نتیجه درون بخش head صفحه اچتمل گذاشته میشود.مثال: 3)استایل شیتهای درجا (Inline Styles) : کاربرد این روش در مواردی است که باید برای یک المان (یا گروهی) خاص استایلی اعمال شود.

در این حالت باید از شناسه ای به نام style که تقریبا در تمامی تگها قابل اعمال است استفاده شود.

مثال: تگ های استایل تغییرات در نسخه جدید اچتمل (4/0) : هدف اولیه از طراحی زبان اچتمل ایجاد زبانی برای تعریف اطلاعات محض بدون در برداشتن جزئیات مربوط به فرمت و نمایش بود ولی با ایجاد نسخه 3/2 زبان اچتمل و اضافه شدن تگهای فرمت دهی مانند و یا شناسه هائی مانند color و Align محتوا و نمایش در صفحات اچتمل ادغام گردیده و همین امر سبب بروز مشکلات عدیده ای برای طراحان و برنامه نویسان وب گردید.

برای رفع این مشکل در نسخه 4/0 اچتمل توصیه بر جداسازی کامل این دو گروه از اطلاعات بوده و در نسخه های آینده اچتمل این جداسازی اجباری خواهد گردید و توصیه مدرسه وب نیز استفاده از استایل شیتها برای هر نوع تعریف فرمت و ترازبندی میباشد.

1-3) Java Script جاوا اسکریپت یک زبان اسکریپت نویسی زبان برنامه نویسی شی گرا است.

جاوا اسکریپت عموماً برای وب سایت ها استفاده می شود.این زبان توسط Brendan Eich از شرکت Netscape Communications با نام Mocha و سپس LiveScript و در آخر JavaScript ایجاد شده است.این زبان دارای Syntax شبیه به Sun Microsystems’ Java است.جاوا اسکریپت برای اولین بار در سالهای بین 1997-1999 توسط ECMA و تحت نام ECMAScript استاندارد سازی شد.این استاندارد با نام ECMA-262 ویرایش سوم برای JavaScript نسخه ی 1.5 بود.استاندارد ISO فعلی نیز همین استاندارد است.

جاوا اسکریپت یک زبان اسکریپت می باشد .

زبان اسکریپت یک زبان برنامه نویسی کم حجم است.

هر خط جاوا اسکریپت قابل اجرا می باشد.این زبان توسط اکثر Browser ها پشتیبانی میشود ، مانند Internet Explore , Netscape برنامه نویسی با زبان جاوا این قابلیت را دارد که می توان کدهای جاوا اسکریپت را در میان کدهای HTML نیز قرار داد .

این زبان ساختاری شبیه زبان C دارد و بیشتر برای ایجاد افکت بر روی کامپیوتر کاربر استفاده میشود (Client-side) .احتمالا تا کنون سایت هایی را دیده اید که در آن کلمه خاصی دنبال موس میدود .

یا هنگام وارد شدن به آن سایت مرورگر شما در صفحه ویندوزتان میلرزد .

این قبیل کد ها که فقط روی سیستم کاربر اجرا میشوند و نیازی به پردازش توسط سرور ندارند را کد های سمت کاربر (کلاینت ساید) میگویند در JavaScript اگر دستوری که با حروف کوچک است با حروف بزرگ بنویسید با Error در صفحات مواجه میشود .

1-3-1) اندکی در مورد تاریخچه JavaScript در صورتیکه JavaScript با نام Java تناسبی ندارد، پس چرا در نام خود شباهت دارند؟

پاسخ به این سئوال را در استفاده از معروفیت نام موجود در بازار خواهید یافت.

بعد از اضافه نمودن قابلیتهای اسکریپت نویسی Netscape که اساسا زبان برنامه نویسی Livescript نامیده شده در همین موقع زبان gava معروفیت خاصی پیدا کرد و شرکت Netscape بعنوان اولین شرکت از آن در browserهای خود استفاده کرد و نام آنرا به JavaScript تغییر این زبان برنامه نویسی گسترش چشمگیری بدنبال داشت.

1-3-2) مزایای جاوا اسکریپت : · جاوا اسکریپت بر خلاف vbscript در همه browser ها قابل استفاده و خوانده شدن است.

· جاوا اسکریپت قابلیت برنامه نویسی را به صفحات HTML میدهد.

· جاوا اسکریپت صفحات HTML را پویا میکند.

· جاوا اسکریپت به رویدادها پاسخ میدهد ( مثل کلیک موس،load شدن صفحه و ...) · جاوا اسکریپت قابلیت ارزیابی و تغییر روی اطلاعات را دارد.

· جاوا اسکریپت قابلیتهای زیادی در کنترل browser بیننده دارد.

· جاوا اسکریپت میتواند cookie بسازد و استفاده کند 1-3-3) مفهوم JavaScript JavaScript دقیقا یک زبان برنامه نویسی میباشد که به وسیله آن میتوان بین کاربر و سایت ارتباط برقرار نمود.

توجه داشته باشید که استفاده از JavaScript در صفحات Web نیازی به نوشتن اسکریپتها نداشته و میتوانید اسکریپتهای موجود در شبکه اینترنت را کپی و در مکان مورد نظر با ایجاد تغییرات مورد نیاز استفاده کنید، اما در صورتیکه یک برنامه نویس باشید با استفاده از این سایت خواهید توانست اسکریپتهای مورد نظرتان را بنویسید.

1-3-4) قابلیت JavaScript به وسیله جاوا اسکریپت میتوان قابلیتهای بیشماری از قبیل ایجاد ارتباط بین کاربر و سایت به صفحه Web اضافه نمود.

مثلا سایتهایی را مشاهده نمودید که با قرار گرفتن نشانگر موس بر روی دکمه مورد نظر بصورتی متفاوت (برجسته، تغییر محتویات درون دکمه) نمایش داده میشود، این عمل توسط JavaScript انجام شده و به این تکنیک rollover گفته میشود.

به وسیله rollover میتوان حالتی ایجاد نمود تا اطلاعات وارد شده توسط کاربر درون فرمها بطور صحیح باشند و در نتیجه در زمان و هزینه مربوط بتوان صرفه جویی نمود.

میتوان محاسبات لازم و مورد نیاز عددی را بدین وسیله در دستگاه کاربر و بدون نیاز به هیچ گونه فرایندی در serverها انجام داد تفاوت بین برنامهای server-side و client-side بدین گونه است که در برنامه server-side برنامه توسط CGI در خود serverها اجرا میشود مانند: برنامه ASP ولی در برنامه های client-side برنامه در دستگاه کاربر اجرا خواهد شد.

از دیگر فرمت ها و قابلیتهای JavaScript میتوان، صفحات HTML را بر اساس عمل کاریر نمایش داد.

فرض کنید که یک سایت آژانس مسافرتی را باز کرده و مقصد خود را هاوایی انتخاب کنید، بوسیله اسکریپت میتوان آخرین اطلاعات مسافرتی مورد نیاز برای هاوایی را در صفحه ای جدید مشاهده نمایید.

به وسیله این برنامه میتوان بر browser کنترل انجام داد و پنجره های جدیدی را باز نمود، جعبه های پیغام را به کاربر اعلام نمود و بر روی قسمت status bar پنجره browser پیغام مخصوصی را نمایش داد.

همچنین بخاطر وجود قابلیتهای ویژه ای که در این نوع برنامه نویسی وجود دارد میتوان ساعت، تقویم و هر برنامه زمانی دیگری نیز تهیه کرد.

1-3-5) تفاوت جاوا و جاوا اسکریپت : برخلاف شباهت اسمی موجود برنامه Java و JavaScript، هیچگونه شباهتی بین این دو برنامه وجود ندارد Java یک زبان برنامه نویسی بسیار کامل پیشرفته ای است که توسط شرکت sun microsystem تهیه شده و با استفاده از آن که نسل بعدی برنامه های c و ++c میباشد، میتوان تمامی برنامه مورد نیاز را نوشته و در ضمن قطعات الکترونیکی استفاده کننده را نیز کنترل نمود.

از خاصیتهای دیگر Java اجرای برنامه نوشته شده توسط آن در تمامی مکانها با هرگونه سیستم عامل از قبیل Windows، Unix، Mac os میباشد.

اساس Java در برنامه های client-side برای ایجاد appletها میباشد، این برنامه های کوچک توسط شبکه اینترنت دریافت شده و درون خود browserها اجرا میشوند بطوریکه بعلت وجود قابلیت همه گیر Java، این برنامه در تمامی browserهایی که قابلیت اجرای Java را دارند، کار میکنند.

میتوانید بااستفاده از تگ در سند HTML فرامین Java را بکار بگیرید و سپس هنگامی که browser تگ را مشاهده کرد، applet مورد نظر از server وارد دستگاه شده و در جای تعبیه شده درون سند HTML اجرا میشود.

برخلاف شباهت اسمی موجود برنامه Java و JavaScript، هیچگونه شباهتی بین این دو برنامه وجود ندارد.

Java یک زبان برنامه نویسی بسیار کامل و پیشرفته ای است که توسط شرکت sun microsystem تهیه شده و جاوا اسکریپت توسط شرکت netscape.( اساس Java در برنامه های client-side برای ایجاد appletها میباشد، این برنامه های کوچک توسط شبکه اینترنت دریافت شده و درون خود browserها اجرا میشوند بطوریکه بعلت وجود قابلیت همه گیر Java، این برنامه در تمامی browserهایی که قابلیت اجرای Java را دارند، کار میکنند زبان ترکیبی: زبان JavaScript یک زبان برنامه نویسی "شی گرا" میباشد.

در این قسمت مفهوم شی گرایی یک برنامه را با توجه به مفاهیم object مشخصات و اعمال، آنها را توضیح میدهیم.

1-3-6) Methods کاری که اشیاء میتوانند انجام دهند، Methods نامیده میشود، که مثلا خرخر گربه، خرابی کامپیوتر، و چرخش دوچرخه را میتوان عنوان نمود.

اشیاء زبان JavaScript نیز دارای methodsهایی میباشد مثلا عمل کلیک برای دکمه ، بازکردن پنجره و انتخاب متن مورد نظر را بدنبال دارد.

همانطور که توجه میکنید پرانتزها نمایانگر وجود method میباشند.

کنترل وقایع (handling events) events عملیاتی بوده که کاربر در هنگام مشاهده صحنه طراحی شده انجام میدهد.

پذیرش (Submitting) یک فرم و تغییر مکان نشانگر ماوس برروی یک تصویر، دو نمونه از حالات و وقایع اتفاق افتاده میباشند.

توسط دستورات بنام event handlers، این برنامه وقایع مورد نظر را کنترل میکند.

متداولترین کنترل کننده های وقایع در جدول فوق آورده شده اند : 1-3-7) Event نکات مورد توجه زبان JavaScript به حروف بزرگ و کوچک حساس میباشد.

نام متغیرها با اعداد شروع نمیشود.

و در آنها فضای خالی یا نقطه گذاری وجود ندارد.

همچنین نباید اسمی مشابه با کلمات از قبل رزرو شده و مخصوص JavaScript استفاده کرد.

1-3-8) عملگرها عملگر، علاماتی بوده که برای کار با متغییرها استفاده میشوند.

مطمئنا با عملگرهای ساده ریاضی مثل جمع، تفریق آشنا هستید.

برای اطلاع بیشتر به دیگر عملگرها به جدول فوق توجه کنید.