دانشجویان کامپیوتر اصفهان

وب سایت سابق(( دانشجویان کامپیوتر جهاد دانشگاهی یزد - خرم آباد ))

جزوه مهندسی فناوری اطلاعات

سلام دوستای گلم قلب...امیدوارم حال همگی شما خوب باشهلبخند

در این قسمت می خوام در مورد درس مهندسی فناوری اطلاعات رشته ( IT ) که توسط استاد گرامی خانم ساکی تدریس شده است در اختیار شما بگذارم امیدوارم مورد استفادتون قرار بگیرهفرشته

تعریف وب :

1- یک سند HTML که بر روی اینترنت قابل مشاهده می باشد

2- یک سند یا فایل نوشته شده بر اساس HTML که بر روی Server ذخیره می شود و از طریق یک مرورگر از اینترنت قابل باز خوانی می شود.


٣- یک فایل یا سند مجزا روی شبکه جهانی وب می باشد که از طریق  urlشناسایی می شود.

4 – یک سند HTML در وب معمولا یکی از چند قسمت تشکیل دهنده یک وب سایت می باشد

5 – یک سند طراحی شده برای مشاهده در یک مرورگر وب به زبان HTML نوشته می شود

6 – هرگونه سند قابل دست یابی از طریق یک URL در شبکه جهانی وب یک سند وب گفته می شود.

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

7- یک سند مجزا تشکیل یافته از متن و تصویر که یک مرورگر می تواند به آن دسترسی داشته باشد.

تعریف اینترنت :

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

صفحات وب در ارائه سرویس به  Clientها نقش حیاتی دارند صفحات وب با استفاده از HTML ایجاد می گردد و HTML مجموعه ایی از تگ Tag های قابل تعریف شده و رزرو شده در سیستم می باشد که ثابت کند و در واقع نحوه نمایش محتویات یک صفحه وب را برای نمایش دهندگان صفحات وب مشخص می کند.

صفحه وب :

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

تگ های Html :

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

مشاهده محتویات اولیه یک صفحه وب :

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

بدین منظور کلید سمت راست موس را فعال کرده و گزینه View Sorce انتخاب می کنیم در ادامه پنجره ای فعال شده و کلمات و کاراکترهای ما رویت می شود.

هر عنصر یا Element به همراه که مربوط یک Tag در HTML می باشد.

هر صفحه وب دارای Tagهای متفاوت همچون < Head > <  Body > و غیره می باشد که باید این گزینه ها و سایر گزینه های دیگر در درون  تگ HTML نمایان شود.

معرفی شبکه وب در IT :

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

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

مستندات وب در IT :

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

در IT مباحثی مثل  Client ، Server مطرح می باشد، کامپیوترها و اجرایی که اطلاعاتی را به باقی اجزا می دهد Server گفته می شود، اجزایی که این مطالب را دریافت می کند Client می باشد ، برای مثال وقتی می خواهیم ایمیل خود را مشاهده کنیم قسمت هایی به عنوان Server و قسمت هایی به عنوان  Client می باشد، Server برای سرویس دادن به مشترکان می باشد و Client دریافت کننده اطلاعات می باشد.

پورت PORT ( درگاه ) :

هر SERVER سرویس هایی را که دارد در واقع تحت یک درگاه در اختیار Client قرار می دهد برای مثال اگر سایتی دارای یک سرویس وب و یک سرویس پروتکل انتقال فایل FTP باشد در آن متن سرور وب خود را تحت درگاه 80 و FTP تحت درگاه 21 قرار می دهد، اگر SERVER پورت مورد نظر را داشته باشید هیچ قانونی برای تنظیم درگاه وجود ندارد،اگر SERVER خود را روی پورت مثلا 984 لیست کنیم مشکلی پیش نمی آید.

وب جهانی :

وب جهانی یک سیستم جهانی و ارتباطی بر پایه ابر متن ها ( Hyper Text ) بر روی شبکه های اینترنت می باشد که بر اساس سرویس دهند و سرویس گیرنده عمل می کند.

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

پیوندها ( Link ) :

پیوندهای روی صفحات وب مانند: HTTP، FTP ، Protocol  این پیوندها یک صفحه از ابر متن ها را به سرویس های دیگر روی اینترنت مانند FTP وصل نمایند، بعلاوه این پیوندها می توانند به صفحات مربوط به مطالب چند رسانه ای وصل کنند مانند: Media ، Move و....

تعریف ابر متن :

متنی است که خطی نباشد . به عنوان مثال برای تشخیص خطی و غیر خطی بودن ابر متن یک مثال می زنیم:

مثال:

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

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

به وسیله وب می توان اطلاعاتی را هم منتشر کرد و هم دریافت نمود دریافت اطلاعات از کاربران توسط پرسش نامه هایی ( Forms ) انجام می گیرد، این کار توسط HTML صورت می گیرد، لذا وب برای پخش اطلاعات یک طرفه نمی باشد، بلکه توانایی ارتباط متقابل باUser  یا کاربران دارد .

اینترنت یک شبکه منفردنیست بلکه مجموعه ای از شبکه هاست که به یکدیگر متصل شد ه اند. این اتصال بر اساس یک سری پروتکل به نام TCP/IP شناخته شده اند.

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

ارتباط بین سرویس گیر و سرویس گر:

یک درخواست می تواند از طریق سرویس گیر برای سرویس گر ارسال شود در مقابل سرویس گر اطلاعات لازم را برای سرویس گیر ارسال می کند اما می توانیم 1. به عنوان یک سرویس گیر به چند سرویس گر مرور کنیم این کار را به عنوان پرسش و پاسخ در سرویس گیر انجام می گیرد. یک Client از چند Server سرویس می گیرد.

خلاصه ای از نامگذاری کامپیوترها برای اینترنت :

به تمام کامپیوتر های متصل به اینترنت یک آدرس عددی ( IP ) تعلق می گیرد با استفاده از سیستم نام گذاری حوزه اینترنت ( DNS ) می توان بین این آدرس های IP و نام کامپیوترها یک تنازل برقرار کرد، نام کامپیوتر از چند قطعه تشکیل شده است و هر قطعه توسط یک نقطه از هم جدا می شوند قطعه سمت راست بالاترین راه حوزه را مشخص می کند این قسمت معمولا مشخص کننده نوع سازمان یا موسسه ایی است که کامپیوتر متعلق به آن می باشد می دانیم که هر شرکت یا موسسه برای خود نامی در نظر می گیرد که در قسمت سمت چپ نوشته می شود مثل : Yahoo.Com

هر شرکت می تواند نام های دیگری بر اساس تقسیمات سازمانی درون شرکت انتخاب کند،

به عنوان مثال این آدرس ( Miller.cs.uwm.edu ) در واقع به کامپیوتری به نام Miller اشاره می کند که در پارتمان( آموزش) CS ( علوم کامپیوتر ) و موسسه آموزشی ( UWM ) قرار دارد البته طرح هایی وجود دارد که از نام های دو حرفی مشخص کننده نام کشور می باشد به عنوان بالاترین رده حوزه استفاده کند.

نکته :                   وب  =  شبکه   +  چند رسانه ای  +  متن های ویژه

متن های ویژه پایه پیوندهای مربوطه می باشند

چند رسانه ایی اطلاعات را به اشکال مختلف و به کارگیری حواس ( سمعی و بسری ) ارائه می دهد

شبکه برای دسترسی به منبع می باشد

زمینه های ارتباطی وب :

1. ارتباطات گروهی

2. ارتباطات سازمانی

3. ارتباطات توده ایی MASS

4. ارتباطات بین فردی

HTML

معروفترین و شایع ترین زبان علامت گذاری است، معروفیت آن به دلیل سهولت استفاده از آن می باشد چندین نکته دارد:

HTML1.0 ، HTML 2.0 ، HTML 3.0 ، HTML 4.0 ، هر نسخه جدید علاوه بر این که به طور کامل با نسخه های قبلی سازگار است اجزا زیادی از علمان ها یا دستورهای ورژن دیگری را درون خود دارد.

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

شکل دادن به صفحات وب:

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

پیوندها :

پیوندها را می توانیم راههای ارتباطی بین قسمت های مختلف یک صفحه با صفحه دیگر بدانیم.

افزودن لیست به صفحات وب:

به طور کلی توسط HTML سه نوع از لیست های اصلی را ارائه می دهیم:

1. لیست های شماره دار

2. لیست های علامت دار ( گلوله دار )

3. لیست های تعریف

قابلیت های پیشرفته در HTML:

استفاده از پرسش نامه در HTML2.0 اجازه این کار به ما داده شده است در واقع به ما کاربران صفحات وب اجازه می دهد تا تحول عظیمی در این صفحات ایجاد شود این پرسش نامه رابطه دوستانه ایی با کاربران ایجاد کرده تا اطلاعات خود را وارد کنند یا در بانک اطلاعاتی جستجو کنند ویا نظرات خود را به طراح صفحه انتقال دهند پس از اینکه کاربر پرسش نامه را پر کرد برای تسلیم آن کافی است که دکمه Sub Mit را که طراح در نظر گرفته فشار دهیم.

افزودن مطالب چند رسانه ایی به صفحات وب :

 تصاویر مهمترین جزء از این رسانه به شمار می رود در واقع استفاده از تصاویر صفحات وب را قدرتمند می کند علاوه بر تصاویر Multi Media نیز که شامل صوت و ویدئو می باشد در این پدیده کار آراست طراحان برای جزابیت سایت خود این گزینه را مدنظر قرار می دهند تصاویر ویدئویی در مرورگر ورژن2.0 به وجود آمد که می توانستند تصاویر را بطور مستقیم روی وب بگذارند.

صداگذاری و نقشه در HTML :

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

افزودن متن های متحرک به وب :

1. متن های لغزان :

متن های هستند که از یک طرف صفحه وب حرکت کرده ( وارد شده ) و وقتی به طرف دیگر رسید متوقف می شود.

2. متن های چرخان :

از یک طرف صفحه وارد شده و عرض صفحه را طی کرده و به طور کامل از طرف دیگر صفحه خارج می شود و سپس دوباره از طرف اول وارد صفحه می شود.

3. متن های متناوب :

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

تنظیم صفحات وب و کنترل حروف :

در تنظیمات صفحات که در HTML3.2 ارائه شد توانایی رسم خطوط افقی با پهنا ارتفاع یا سایه دلخواه در کنترل حروف این اجازه را به ما می دهد که در صفحات وب متن های دلخواهی بنویسم با ( فرمت های متفاوت ) که اندازه های کوچک برای حروف نوشتن مطالب کم اهمیت تر و نکاتی که نباید جای زیادی در صفحه اشغال کند به کار می رود در حالی که اندازه های بزرگتربرای نوشتن نکات مهمتر که باید مورد توجه قرار گیرد به کار می رود، در واقع می توانیم روی نوع حروف نوع فونت و کنترل رنگ کار کنیم.

قرار دادن زمینه برای صفحات وب :

قبلاً صفحات وب ما به صورت ساده با زمینه خاکستری با سفید نمایش داده می شد اما در ورژن های جدید HTML به ما اجازه داده می شود که صفحات رنگی زمینه کار ما شود ،وقتی یک تصویر به عنوان زمینه صفحات وب قرار داده می شود مرورگر آنقدر آن تصویر را در کنار هم قرار می دهد تا زمینه صفحه پر شود و به این ترتیب صفحه را کاغذ دیواری گویند.

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

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

استفاده از فریم ها ( زیر صفحه ):

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

تکنولوژی های قابل استفاده در وب :

به عنوان مثال :

برنامه ای که بر روی اینترنت وجود دارد اجرا کرده و مرورگر این اجازه را به ما می دهد که بتوانیم آن فایل را از مرورگر برداشت کنیم و یا اگر آن فایل فشرده شده باشد مرورگر نمی تواند آن را باز کند در این کار را به عهده برنامه هایی واگذار می کند که به این برنامه ها نرم افزاری های کمکی یا یاری دهنده می گویند.

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

به عنوان مثال:

برنامه اتصالی مخصوص نمایش فایل ویدئویی ( Quick Time ) به مرورگر اجازه می دهد که برنامه دلخواه ما در وب به طور اتومات بدون نیاز به برنامه کمکی دیگر اجرا شود.

تکنولوژی CGI ) Common Getway Inter face ) :

یک زبان ساده است و برنامه ای است که به عنوان پُلی بین سرویس گیرنده های HTTP و کاربران  وب عمل می کند بدون وجود CGI سرویس گرهای وب فقط مسئول درخواست کاربران مبنی بر ارسال صفحات وب فرستادن صفحات در خواستی بودند اما امروزه سرویس گرهای وب معمولا تعدادی CGI دارند که بر اساس تقاضای کاربران می توانند بر روی سرویس گر اجرا شوند مثال های شایع CGI آن دسته از برنامه هایی هستند که برای پردازش پرسش نامه ها همچنین اجرای عملیاتی بر روی بانک اطلاعاتی می باشد.

ایجاد انمیشن به کمک سرویس گر :

یکی از تکنیک های که در CGI است ساخت انمیشن است یا تصاویری که سرویس گر آن را هدایت می کند ( در واقع CGI به عنوان یک کانال ارتباطی اطلاعات درخواست شده از سرویس گر به سرویس گیر می باشد، برای ساخت تصاویر گرافیکی حتماً از استانداردهای Gif و Jpeg استفاده می شود چون که هر چه حجم فایل ها بیشتر باشد زمان بیشتری برای انتقال حرف خواهد شد لزا بهتر است که فایل های شما حجمی کمتر از حجم 10 کیلو بایت داشته باشند.

جاوا ( Java ) :

یک زبان برنامه نویسی شی گرا است.

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

یک برنامه جاوا با پسوند Java که به صورت یک فایل متنی است نوشته می شود سپس این فایل Cmmon File شده و این فایل کامپایل شده و تبدیل به یک یا چند فایل با پسوند Class می گردد.

1. Java کوچک و ساده است 2. Java  شی گرا است 3.  Java امن است 4. Java غیر قابل به سیستم است *

* جاوا (  Java ) غیر قابل وابسته به سیستم است :

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

تفاوت جاوا با جاوا اسکریپت :

1. برنامه های جاوا اسکریپت مستقیما در داخل سند HTML نوشته می شود.

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

3. جاوا اسکریپت یک زبان تفصیر شونده است .

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

HTML زبان خلق صفحات وب است:

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

ساختار دستورات HTML :

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

اکثر دستورات HTML به صورت جفت هستند و شامل :

دستورات آغازین و دستورات پایانی می باشند.

قبل از دستورات پایانی یک علامت / قرار می گیرد دو دستور آغازین و پایانی با احاطه کردن متن آن را علامت گذاری می کند به عنوان مثال:

دستور <B> به منظور نمایش دادن متن ها با حروف </b> This is the First Line <b> ضخیم به کار می رود اگر در ابتدای متن و انتهای متن قرار بگیرد متن در صفحه وب به صورت ضخیم دیده می شود اما در عین حال بعضی دستورات در HTML به صورت تکی کار می کنند آنها به جای اینکه با احاطه متن را علامت گذاری کنند در واقع علامتی محسوب می شوند و در مواجه با آنها (مرورگر) دستورخاصی را انجام می دهد

مثلا : <BR >

به مرورگر می فهماند که متن باید در سطر بعدی نوشته شود، بعضی از دستورات HTML دارای یک یا چند ویژگی هستند با استفاده از این ویژگی ها می توان دستورات خاصی را برای مرورگر اجرا کرد برای مثال:

<HR > برای رسم یک خط افقی در HTML استفاده می شود دستور < HR > دارای دو ویژگی Size ( ضخامت ) و Width (عرض ) می باشد این دو مختص دستور < hr > است می توان ضخامت و عرض یک خط را تعیین کنیم

                                                                                   <  10   = < Hr Size

                                                                < Hr Width = 200 >                 

    < Hr size = 10    Width = 200 >                                                                                                                     

برای تهیه یک سند HTML می توانیم از ویرایش گر ساده ایی استفاده کنیم چون HTML از حروف اَسکی تشکیل شده است که نیاز به ویرایش گرهای سختی نیست با ویرایشگری مثل NOTPAT اجرا می شود.

دستورات ساختاری :

دستورات < HTML> مشخص کننده شروع و پایان یک سند است دستور آغازین  < HTML> و دستور پایانی>   </ HTMLاست

تمام مطالب برنامه ما در داخل این دستور قرار می گیرد هر سند HTML دارای دو قسمت سر و تنه می باشد در قسمت سر اطلاعاتی از قبیل نوع سند تیتر آن و روش ساخته شدن آن قرار می گیرد که البته مرورگر آنها را نمایش نخواهد داد برای نشان دادن توابع از دستور آغازین و پایانی < HEAD> و < /HEAD>

مهمترین چیزی که در قسمت سر قرار می گیرد تیتر است این تیتر در قسمت بالای پنجره صفحه وب است این دستور < TITLE> قرار دارد.

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

پس از قسمت سر نوبت تنه برنامه می رسد که بین دستور <BODY> قرار می گیرد تمام متن ها و دستوراتی را که صفحه وب را می سازند ما بین این دستور قرار می گیرد ساختار کلی یک سند HTML به این شکل است:

<HTML>

<HEAD>

< TITLE>

----------

</TITLE>

</ HEAD>

<BODY>

-           

-           

-           

-           

</ BODY>

</HTML>

قرار دادن توضیحات در سند HTML :

تقریباً در تمام زبان های دنیا می توان از دستورات یا علامت های خاص استفاده کرد مثلاً در برنامه های برنامه نویسی ( بیسیک) دستور REM و در زبان برنامه نویسی C از این دستور */    /* برای توضیحات استفاده می کنند اما در یک سند HTML برای توضیحات از دو دستور > ---    <!--- استفاده می شود.

تیتر های رده 1 تا 6

در مورد اندازه صفحات وب می توان از تیتر های خاصی استفاده کرد برای این کار 6 رده در HTML در نظر گرفته شده است  از رده  H1تا H6 .

نویسنده با علامت گذاری یک متن با دستورات H1 تا H6 در صفحه وب می تواند متن هایی را با سازهای مختلف ایجاد کند.

ایجاد پاراگراف و خط جدید :

پاراگراف بندی متن و نوشتن مطالب مختلف در خطوط جداگانه متن را زیادتر کرده این بدان علت است که مرورگر خودش خطوط متن موجود در صفحه وب را تنظیم می کند و برای این کار خطوط کوتاه را به هم می چسباند تا خطی بلندتر ایجاد کند و خطوط بلندتر را که در عرض صفحه جا نمی شود به خطوط کوچکتر تبدیل می کند&gt  =    >       ,       &lt    =     <        مانند تگ <p> </p> به وسیله دو دستور <p> و </p> می توان شروع و پایان یک صفحه پاراگرافی را تعیین کنیم می توانیم همان جا نیز دستور <br> را نیز استفاده کرد.

رسم خطوط افقی :

خطوط افقی روشی برای جدا کردن متن ها از یکدیگر می باشد دو ویژگی دارد که دارای سایر وWidth که در دستور <hr> گذاشته شده است .

به عنوان مثال :                                     <hr width = 200

Size = 10     >                                                   

این مثال خطی افقی با عرض 200 نقطه و ضخامت 10 نقطه رسم می کند.

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

آرایش کردن متن :

در html دو گروه از دستورات وجود دارد گروه اول آراینده های منطقی و گروه دوم آراینده های فیزیکی هستند.

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

مثلا : با استفاده از دستور < EM> می توان به مرورگر فهماند که قسمتی از مهمتر از بقیه است و باید تاکید بیشتری روی آن شود.

چنین متن هایی را با حرف کج ( ITALIC ) نمایش می دهند و با این کار تاکید بیشتری روی متن به کاربر می فهماند.

اما در بعضی از مرورگرها این کار با حروف ضخیم انجام می شود ( BOLD ) بنابراین دستور <EM> شکل به نمایش درآوردن متن را نشان نمی دهد. بلکه به نوعی معنی و مقصد آن را به مرورگر می فهماند اینگونه از آرایه ها را آرایه های منطقی گویند.

نکته:

دستور <EM> معادل < I > می باشد.

در آرایه های منطقی دستور دیگری وجود دارد که آن هم تاکید بر روی حروف متن دارد آن دستور < STRONG></STRONG> می باشد، این دستور اصولاً باعث ضخیم شدن حروف متن می باشد و جزء حروف منطقی می باشد و دارای آغاز وپایان است .

در صورتی که بخواهیم در پایین صفحات خود از اشخاصی تشکر و قدردانی داشته باشیم یا احیاناً نام طرح صفحه نوشته شود از دستور <CITE></CITE> استفاده می شود.

اینگونه متن ها در نشریات با حروف کج نشان داده می شوند، همچنین برای نوشتن آدرس پستی یا الکترونیکی افراد از دستور آدرس استفاده می شود<ADDRESS>

<ADDRESS> Administratior@yahoo.com</Address>

معمولاً برای نوشتن برنامه ها و دستورات کامپیوتری از حروف یک اندازه و با فواصل مساوی استفاده می شود اما می توان به وسیله دستور < CODE> اینگونه متن ها را برای مرورگر مشخص کرد به عنوان مثال:

<CODE>FOR I=1 TO 10 <BR> PRINTA<BR> NEXT A </CODE>

آراینده های فیزیکی:

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

مثلا برای ضخیم کردن تگ <b> و برای کج کردن تگ < I > استفاده کنیم.

*نکته: برای اینکه متن ما شبیه به متن های گردند که ماشین های تایپ یا کامپیوتری قدیمی باشد از تگ < TT > استفاده می کنیم.

دستور<FONT> برای مدل های FONTها در HTML استفاده می شود، برای تعیین نوع FONT از ویژگی <FACE> استفاده می شود که در FONT NAME سه نوع FONT وجود دارد که به دلخواه می توانیم استفده کنیم  

<FACE>FONT FACE=" FONT NAME" < FONT FACE=" FONT NAM1, NAM2, FONT NAM3" .

برای  تعیین اندازه حروف از ویژگی سایز( Size) استفاده می کنیم.

معادل این دستور < font Size= n>

نکته : برای هر رنگ یک عدد 6 رقمی در مبنای 16 تعریف می شود،که دو عدد اول ان RGB که دو رقم اول ان مشخص کننده رنگ قرمز و دو عدد دوم رنگ سبز و دو عدد سوم رنگ آبی را مشخص می کند .

در مورد هر رنگ 00 به معنای هیچ رنگی  ولی ff به معنای تمام آن رنگ است.

مثلاً: رنگ سفید ffffff و رنگ سیاه 000000 است.

نکته : باید در استفاده از رنگ ها از مربع استفاده کرده #

<font colore = #ffffoo>  رنگ زرد

< font colore = # 0000ff> رنگ آبی

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

اگر بخواهیم قسمت هایی از متن دقیقا به همان شکلی که در سند html نوشته به وسیله مرورگر  نشان داده شود می توانیم از < pre> استفاده کنیم که در واقع به مرورگر میفهمانیم متن آرایش نشده است.

نکته: استفاده از پیوندها link در صفحات وب در html برای ایجاد پیوند از دستور <A> استفاده می کنیم برای تعیین مقصدی که این پیوند به آنجا اشاره می کند از ویژگی <HREF> استفاده می گردد.

تمام متن ها یا تصاویر گرافیکی بین دو دستور آغازین و پایانی <A></A> قرار می گیرد که در آن صورت وب ما به صورت یک LINK رفتار می کند،یعنی وقتی دکمه موس را روی آن زده مرورگر ما را به مقصد راهنمایی می کند.

<A HREF ="ORL">

<A HREF =" MAY HOME HTML">HOME PAGE </A>

این مثال توضیح می دهد که اگر روی عبارت HOME PAGE کلیک کنید ما را به صفحه MY HOME هدایت می کند.

به طور خلاصه به وسیله دستور <A> می توانیم: 1. پیوندی به صفحات وب برقرار کنیم 2. پیوندی به یک قسمت خاص از صفحه وب برقرار کنیم

تصاویر گرافیکی :

ساختار تصاویر وب اصولاً دو نوع ساختار در ذخیره سازی وب استفاده می شود 1. Gif 2. Jpeg

ساختار و ذخیره ایی Gif می تواند حداکثر 255 رنگ متفاوت را ذخیره کند Gif ساختاریست که فایل هاbit map(نقاشی) را خلاصه می کند، یکی از خصوصیات Gif شفافیت آن است،بدین معنی که در این تصاویر می تواند یک رنگ را به عنوان رنگ شفاف قرار دهید.

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

خصوصیات بعدی به هم بافتگی می باشند،یعنی می توان با قرار دادن آنها به عنوان به هم بافته باعث می شود که مرورگرها پس از دریافت قسمتی از فایل تصویر مذبور آن را موقتاً به صورتی غیر دقیق نشان دهد تا کاربر نمای کلی از تصویر خود را ببیند.

*فایل ( Jpeg ) :

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

دستورات لازم برای قرار دادن تصاویر در صفحه وب :

برای قرار دادن تصویر در صفحه وب از دستور < img> استفاده می کنیم، ویژگی src در این دستور url فایل گرافیکی را مشخص می کند.

< img src = " My.Graphic.Gif " >

به ویژگی Alt می توان متنی را مشخص کرد که کاربران نمی توانند تصویر را دریافت کنند متن را به جای آن مشاهده کنند.

< img src = " My . Graphic . Gif " Alt . " This is Graphical . img">      

بعلاوه با استفاده از ویژگی Width و  Height می توان تصویر را به اندازه دلخواه نمایش داد.

< img SRC = " My . Graphic . Gif " Height = 50 Width = 60 >   

مثال :

< Html> < Title> image Sample > < / Title > < / Head>

< Body >                                                                         

< H1 > My First Image </ H1 >                                    

This is a Picture of aballon :                                        

< img SRC = " Ballon . Gif " >                                   

< /Body >                                                                    

< / Html >                                                                  

این مثال در صفحه وب یک متن با سایز H1 و یک تصویر به همراه متن نوشته شده نمایش می دهد می توانیم یک تصویر گرافیکی را به عنوان یک پیوند ( Link ) قرار دهیم.

< A Href = " Next Page Htm " >       

 < img SRC . " My . Graphic . Gif " >

< / A>                                                

به این ترتیب کاربر با کلیک کردن به مقصد مورد نظر هدایت می شود.

طبقه بندی اطلاعات با استفاده از لیست ها :

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

به کمک Html می توان چند نوع لیست را ساخت :

به کمک Html می توان سه نوع لیست را ساخت که عبارتند از :

1. لیست های مرتب ( شماره دار )

2. لیست های غیر مرتب یا ( گلوله ایی )

3. لیست های تعریف

لیست های مرتب ( شماره دار ):

به وسیله Html می توانیم از این نوع لیست ها در صفحه وب استفاده کنیم، برای این کار لازم نیست که شماره هر عضو را خودمان تعیین کنیم، درعوض باید تنها محتویات رابین دو دستور < OL> و < /OL > قرار داده در آن صورت وقتی مرورگر به این گزینه رسید متوجه می شود که باید اطلاعات را بین دو دستور آغازین و پایانی < OL > و < / OL > قرار دهد و به این منظور خود مرورگر به هر یک از اعضای این کد یک شماره اختصاصی داده و آن را همراه با شماره مربوطه نمایش می دهند.

مثال :

< Html >

< Head >

< Title >Number Lists < / Title >

< / Head > Bg Color = "ffffff " >

<  Body >                                    

                     < H2 > My Five Favorite Basebal < / H2 >                   

< OL > Start = 10 >

< L1 > Red sox

< L1 > Cubs   

< L1 > Royals

< L1 > Indians

< / OL >         

< / Body >

< / Html >

مثال :

در مثال زیر از ویژگی ( Value ) استفاده شده است. در کنار (  L1 ) می باشد، این ویژگی مشخص می کند که ادامه شماره گیری لیست بر اساس آن انجام می شود.

< OL >    

< L1 > Red

< L1 > Royals

                                   < L1 > Value = 10 > Indians                

< L1 > Group

< / OL >

مثال :

در مثال زیر می توانید از روش های دیگری غیر از اعداد انگلیسی استفاده کنیم، مثلاً می توان یک لیست را با حروف الفبا و یا با اعداد لاتین در دستور < OL Type = A > به مرورگر می فهماند که شماره گذاری لیست باید با استفاده از اعداد بزرگ لاتین انجام شود، اما اگر A باشد از حروف بزرگ انگلیسی استفاده می کنیم .

< OL  Type = A>

< L1 >Red     

< L1 >Royals

< L1 > -------

< L1 >-------

< /OL >

A برای نشان دادن حروف بزرگ انگلیسی استفاده می شود، a برای نمایش حروف کوچک استفاده می شود،I برای نمایش اعداد بزرگ لاتین و i کوچک برای نمایش اعداد کوچک لاتین و L برای اعداد انگلیسی استفاده می شود.

< Html >                                            

< Head >                                           

< Title > < List > < / Title > < /Head >

< Body > Bg Color = " ffffff " >

< OL >                                

< L1 > Point 1                  

< L2 > Point                    

< L1 > Point                  

                                           < UL  Type = CIRCIE >                      

< L1 > Point       

< L1 >      

< /UL >

< /L1 > Point 4

< /L1 > Point 5

< UL > Type = Sub Point A >

< L1 > Sub Point 4

< OL Type = 1 >

---------

---------

---------

< / Body >

< / Html >

لیست های غیر مرتب یا ( گلوله دار ):

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

در لیست های غیر مرتب یا گلوله دار از دستورات یا تگ < UL> و < / UL > استفاده می کنیم . این گزینه به مرورگر می فهماند اطلاعاتی باید به شکل لیست های گلوله دار نمایش داده شود.

< UL > <Li > Red < Li >               < Li > Royal < Li > indeans < / UL >

*با استفاده از ویژگی Type در دستور < UL > و < / UL > می توان شکل علامت های مورد استفاده در لیست را تعیین کنیم، این علامت ها می توانند به شکل دایره توپر ، مربع و یا دایره خالی باشند.*

مثال : این گزینه را برای ما روشن می کند:

< UL Type = square > < Li > Red < Li > CUD < Li  > Royal

< Li > indans < / UL >

 می توان شکل علامت های موجود در میان لیست را تغییر دهیم کافی است که ویژگی تایپ در دستور <Li> برابر با یکی از گزینه های انتخاب شده ما شود. ( دایره توپر، مربع ، دایره توخالی ).

نکته : دایره توپر (    DISK     )  ، مربع (    SQUARE    )   ، دایره توخالی (    CIRCLE   ) است.

< UL Type = Square >                                                       

< Li > Red < Li Type = Circle > Royal < Li > indians

< / UL >                                                                      

لیست های تعریف :

یک لیست تعریف شامل تعدادی عبارت و یا اصطلاحاً به همراه هر کدام از آنها می باشد، برای ساخت این نوع از لیست ها از دستور <DL> استفاده می کنیم، سپس قبل از هر اصطلاح دستور < DT > و قبل از هر تعریف دستور < DD > را قرار می دهیم.

< DL >                                                                       

< DT > Term1                                                 

< DD > This is The Definition for Term1      

< / DT > Term 2                                        

-                                                 

-                                                

-                                                

< DD > This is The Definition For Term2      

< / DL >                                                     

مرورگر متنی را که با دستور < DT > مشخص شده باشد در کنار سمت چپ پنجره مرورگر شما قرار می دهد و متنی را که با دستور < DD >  علامت گذاری شده است با کمی فاصله از سمت چپ مرورگر نشان می دهد. بدین ترتیب یک تنظیم خاص را ایجاد می کند.

ساخت لیست های ساده :

برای ساخت لیست های ساده که در کنار پنجره مرورگر قرار می گیرند از دستور < DT > و تگ پایانی آخر به همراه دستورات     < DL > و  < / DL > استفاده می کنیم.

< DL >                                                  < DL >                

< DT > Red                                           < DD > Red       

< DT > indians                                       < DD > Royal   

< DT > Royal                                          < DD > loud     

< DT > Land                                           <DD > indians  

< DT > Dodgers                                      <DD> Cub       

 </ DL >                                                  < /DL>             

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

*در خانه های جدول می توان علاوه بر متن های عادی می توان متن های ویژه ( Hyper text ) تصاویر گرافیکی و یا هر چیز دیگری قرار دارد. حتی می توان آنها را خالی بگذاریم*

ساخت جدول در Html :

برای ساخت و رسم یک جدول مراحل زیر را دنبال می کنیم:

مطالب جدول باید بین دو دستور ( Table ) قرار گیرد. پس هر سطر از جدول را بین دو دستور < TR > و < /TR> قرار می دهیم و در نهایت مطالب هر سلول یا هر خانه جدول بین دو دستور < TD > و < /TD > قرار می گیرد.

< Tablle BORDER = 1 >

< TR >                        

< TD > Cell1

< TD >Cell2

< /TR >                   

< TR >                    

< TD >Cell3

< TD >Cell4

< /TR >                 

< /Table >             

توضیح مثال قبلی :

*همانطور که ملاحظه می کنیم در ابتدا و انتهای مطلب در جدول دستورات  < Table >و< /Table > قرار دارد، سپس مطالب هر سطر از جداول یعنی عبارت Cell1 و Cell2 بین دو دستور< TR >  و < /TR> قرار گرفته است و برای جدا کردن این دو خانه از هم از آنها بین دو تگ < TD > و < /TD > قرار می گیرد.*

*نکته : نوشتن تگ پایانی < /TD > در Html الزامی نیست. اما برای زیباتر شدن سند Html نوشته می شود و تمام مطالب جدول بین این گزینه ها قرار می گیرد.

< Table >                                                         

< TR >                                                     

< /TR>                                                     

 < /Table >                                              

مثال : برای ساخت یک جدول ابتدا سطرها ساخته می شود، و به این منظور از دستورات < TR > و  < /TR > استفاده می شود. تمام مطالب سطرها بین این دو دستور قرار می گیرد . در مرحله بعد باید هر یک از آن سطرها را به طور جداگانه سازیم. همانطور که گفتیم توضیحات سلول ها بین دو دستور  < TD >و< /TD > قرار می گیرد.

< Table >                                           

< TR >                                               

< TD > < /TD > < TD > R < /TD >     

< TD > H < /TD > < TD > E < /TD >

< /TD >                                             

                                        < /Table >           

این مطلب ادامه دارد

 


نویسنده : م . رحمتی - ساعت ۱٢:۳۱ ‎ق.ظ روز چهارشنبه ۱۳۸۸/۸/٢٠
نظرات ()    |   لینک ثابت    |   تگ کامپیوتر


Powered By Persianblog.ir - Designed By Payam salami pargoo