گزارش کارآموزی رشته کامپیوتر: نرم افزارطراحی صفحات وب

گزارش کارآموزی رشته کامپیوتر: نرم افزارطراحی صفحات وب

  مفاهیم    HTML &XTHML            گزارش کارآموزی رشته کامپیوتر       

این برنامه درواقع نرم افزاری است که کامپیوتر شما برای مرور و نشان  دادن صفحات وب به ان

 

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

 

مایکروسافت (اینترنت اکسپلورر ومرورگرنت اسکیپ اشاره نمود.گردش دروبی که ازنظرمحتوی

 

و یا شکل متشابه ایده های ذهنی شما را جذب کرده و باعث می شودبارها به ان مراجعه کنید.

 

مقطع	کارشناسی و کارشناسی ارشد
فرمت فایل	WORD
رشته	کامپیوتر
تعداد صفحات	82 صفحه

گزارش کارآموزی رشته کامپیوتر

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

 یک صفحه وب چیست ؟                                                                                                              

نیز درواقع یک  نوع زبان  برنامه نویسی  کامپیوتری است  که چگونگی قرار گرفتن وارتباط بین

 

متن ها تصاویروسایرHtmlزبا ن علامت گذاری عناصرموجوددریک صفحه را توضیح داده ودر

 

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

 

htmlتا سال 1993 تقریبا 100بنا نهادند. ازان زمان بتدریج برنامه های مرورگروبه جهت مشاهده

 

این صفحات نوشته واختیار مردم  wwwقرار گرفت*

 

ولی بعلت مقبولیت روزافزون صفحه های  وب تعدادی از (text)  مرورگرهای اولیه فقط  قادربه

 

نشان دادن متنها برنامه نویسان مرورگرهایی را طراحی کردند که علاوه برمتون قادربه نشاندادن

 

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

 

Anderssenیکی از این برنامه نویسان یعنی مرورگر نت اسکیپ به مردی مشهور و ثروتمند بدل

 

گشت*

 

به عنوان رابط اصلی واستاندارداینترنت مورد توافق همگان قرار گرفته اند صفحاتHtmlامروزه

 

میتوانند علاوه بر نشان دادن متن ها ی ساده با تحت  پوشش قرار دادن تصاویر گرافیکی صداها و

 

وحتی ویدئویک برنامه محاوره ای وتعاملی کامل رااینترنت بوجود اوردند *

فقط دراینترنت یافت نمی شوند. بلکه امروزه شبکه های  کامپیوتری  htmlهمان طورکه  می دانید

 

صفحات وب بسیاری ازشرکتهای معتبر درسراسردنیا (اینترنت) ازصفحات وب برای فراهم کردن

 

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

 

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

 

htmlهای تبلیغاتی مختلف امروزه dvdها یا Cd یونی ویا وبرروی را به صورت مستقیم در رابط

 

های مختلف بزرگترین سیستم عامل دنیا (یعنی ویندوز)قرارداده است.به عن htmlنیزهای وب وبه

 

صورت رابط وب به نمایش گذاشته می شوند linkودرایوهای مختلف همگی ازطریق ان مثال فایل

 

ها در همه جا حضور دارد وخوشبختانه  شما هم اکنون با یک انتخاب صحیح در یک مسیرصحیح

Html پس در یک کلام قرار گرفته اند*

 

نام دارد که در واقع ویرایش Xhtml-1 و دیگری Html وجود دارد. 4- Htmlدر حال حاضر دو

 

ویرایش ازبرنامه می باشد. شما درطی مطالعه این مطالب این دوزبان برنامه نویسی وب چگونه با

 

زبان  دیگری بنام   Html-4 پیشرفته و کارکرده استانداردمربوط به هرسه موردفوق را می توانید

 

در ادرس http://www.wxml یعنی درسایت کنسر کنسرسیوم وب جهانی در اینترنت بیابید.

عبارت جدید:

Xmlدرواقع مخفف کلمه    extensible markup  languageیا  زبان علامتگذاری قابل توسعه

 

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

 

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

 

می دهند. در صورتی که در زبان xmlما می توانیم ازدستورهایی با نامهای اختصاصی که توسط

 

خودمان تعریف می شوند استفاده کنیم برتری زبان xhtmlکه ما به انhtml توسعه یافته می گوییم

 

این است که چگونگی نشان دادن داده ها رادراختیار ما قرار داده درصورتی که xmlتوانایی نحوه

 

سازمانده ای این داده ها را در اختیار ما می گذارد*

طرز کار صفحات وب

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

 

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

 

ای هستیدوبعدازفشاردادن یک تکمه صفحه مذکوربرروی مانیتور   شما به نمایش درمی اید اگراین

 

صفحه  برروی کامپیوتر دیگرمی باشد(مثلا برروی سایتی دراینترنت مدتی طول می کشد تا به در

 

خواست شما پاسخ داده شود*

 

البته تفاوتهای عمیق تری را میتوان بین یک صفحه وب و یک صفحه کاغذ معمولی مجله روزنامه

 

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

 

باشیدبه عنوان مثال ما می توانیم صفحه وبی درکامپیوتر خودمان داشته باشیم که هریک ازعناصر

 

موجود بر روی ان در یک کامپیوتر مجزا  ذخیره شده باشد.*

 

اگرچه چنین پدیده ای نا متحمل است ولی غیرممکن نیست.مثلا می توان صفحه وبی درست کردکه

 

متن موجود در ان برروی کامپیوتری دراسترالیا تصاویران برروی کامپیوتری درروسیه صداهای

 

ان بر روی کامپیوتری در کانادا ذخیره شده باشند*

در موقع مرور وب چه اتفاقی می افتد؟

وب جهانی یاwww عملا ازمدل استانداردسرویس دهنده/سرویس گیرنده استفاده می نماید این کلمه

 

ای است که بدون شک شما نیز با ان برخود داشته اید.وقتی شماادرسی نظیرhttp://www.site t

 

http://www.site topgo.com را درپنجره ادرس مرورگر وب خود تایپ کرده کلیدو enterرا

 

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

 

گیرنده اینترنت قرارمی گیرد. کامپیوترهایشما به عنوان یک سرویس دهنده خاصی بنامdirectory

 

Assistance server رفته و ادرس شما به زبان قابل فهم برای ماشین ترجمه خواهد شد.دراین در

 

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

 

دراین هنگام کا م کامپیوترمیزبان(درصورت وجود) به عنوان یک سرویس دهنده عمل کرده ویک

 

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

 

فایل  html مذکور توسط سرویس گیرنده(دراین مثال کامپیوتر شما)در یافت شده وتوسط مرورگر

 

وب موجود تفسیر می گردد. بدین  ترتیب مرورگر وب شما با اجرای این دستورهای html صفحه

 

وب حاصل ازان ربرروی صفحه نمایش ظاهر  می نماید*

نحوه ویرایش صفحات وب

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

 

تایپ این متن را توسط هرپرداشگرویا ویرایشگرمتنی که در اختیار دارید انجام داده و فایل مذکور

را ذخیره نمایید*

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

 

اگربخواهیدازعناصرگرافیکی صوتی ویا حتی ویدیوئی استفاده نموده ویا یک صفحه وب محاوره ا

 

ره ای ایجاد کنید. کافی است دستورهای html محل ذخیره فایل های رسانه ای مذکور را به اطلاع

 

مرورگربرسانید.بنابراین اولاما مستقیما این فایل ها رادرمتن مذکوردرج نکرده وثانیا فایلها ی فوق

 

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

 

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

 

توانید بدون ایجادتغییردرفایل اصلی html تغییرات موردعلاقه خود رابرروی تصویرمذکوراعمال

 

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

 

html ذخیره شده. و بدین ترتیب شما می توانید با یک  فایل تصویری ان را در صفحات وب متعدد

 

مورد استفاده قراردهید

دو راه تولید صفحات وب

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

 

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

 

افزارها خود به صورت خودکا ر کدهای htmlلازم را برای شما ایجاد می نمایند.که توصیه میشود

 

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

 

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

 

شده فوق العاده نا مرتب بوده و اصول صحیح کدنویسی در انها رعایت نمی گردد*

 

البته از میان تمام نرم افزارهای مذ کور نرم افزارfrontpage 2000 از این  قاعده مستسنی است.

 

چراکه با این نرم افزاربه راحتی می توان  کدهای html را ویرایش کرد. بعلاوه با ارائه یک رابط

 

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

 

راحتی کدهای html جدیدرا برکدهای موجود اضافه نمود.نرم افزاربا یک ویرایش گر ساده  نظیر

 

notepad هم  به اضافه نرم افزار گفته شده می باشد که ساده تر عملی تروعلمی تر می باشد*

نرم افزارهای تولید و ویرایشHTML

1-ویرایشگرهای ساده متن

• Microsoft notepad

 

• Microsoft wordpad

 

• Microsoft word

 

• Claris norks

 

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

2-ویرایشگرهای  مخصوصHTML

• Html pad

 

• Html tidy

 

• Coffee cup  html  editor

 

• Html kit

 

• Hot dog  pro

 

3-نرم افزارها ی گرافیکی تولید کننده کدهای HTML

• Microsoft frontpage

 

• Microsoft vusual  Interdev

 

• Netscape composer

 

• Macromedia dreamweaver

 

• Adobe golive

ایجاد کردن یک صفحه وب

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

 

نمایید.اگرچه می توان ازنرم افزارهای مخصوص نوشتن کدهایhtml نیزبهره بردولی من توصیه

 

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

 

به یادگیری نرم افزاردیگری نیست.ازنرم افزاری مثل ms word97-200ویا سایرویرایشگرهایی

 

متنی سازگارباhtml استفاده نکنیداین نرم افزارها کدهایhtml را با روش خاصی بازنویسی کرده

 

که در ابتدا باعث سردرگمی شما می شود*

 

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

 

اکثر برچسب های htmlاز دو قسمت تشکیل شده اند:

 

1)برچسب شروع کننده:که مشخص می کند قطعه متن موردنظر از کجا اغاز شده

 

2)برچسب  پایانی: که مشخص کننده  قطعه متن مذکور کجا خاتمه می یا بد. دربرچسب پایانی یک

 

علامت ((/)) بلافا صله بعد ازعلامت کوچکتر((>)) قرار می گیرد. در مثال برچسب<body> به

 

مرورگرمی گوید که قطعه متن اصلی صفحه وب از کجا اغاز شده وبرچسب <body> محل پایان

 

ان را نشان می دهد.وهمان طورکه مشاهده می کنیدهرعنصری که بین دوبرچسب مقابل</body>

 

و</body>قرار بگیرد در ناحیه نمایش اصلی پنجره مرورگربه نمایش در خواهد امد.در IE ونت

 

اسکیپ متن ذکرشده دربین برچسب های <title>و </title>دربالاترین قسمت پنجرمرورگر(میله

 

عنوان) نمایش داده می شودازعنوان همچنین برای شناسایی صفحه وب  در منوی ___netscape

 

bookmarksولیست favoritesدر ie استفاده خواهد شد.این دو بر چسب در تمام صفحات وب به

 

کارخواهند رفت*

 

چرا که محققا هر صفحه وب به یک عنوان و مقداری متن در بدنه اصلی خود احتیاج دارد*

 

واز دو دستور<html>و<head> نیز همواره مورد استفاده قرارمی گیرندقراردادن برچسب زیر

 

برچسب<html>درابتدای هرصفحه مشخص می کند. که صفحه مذکوریک صفحه وب بوده و بر

 

چسب</html>پایان هرصفحه را به مرورگراطلاع خواهد دادتوجه داشته باشید که قبل ازبرچسب

 

شروع کننده<title>یک دستور<head>و بعدازبرچسب پایانی </title>نیزدستور</head>قرار

 

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

 

ازانها برای نوشتن برچسبهای موردنظراستفاده نمایید به عنوان مثال دستورهای زیردرزبان html

 

یکسان تلقی خواهد شد<HTml>,<html>,<Html>,<HTML>. ولی دراستاندارد تما  xhtml

 

تمام برچسبها باید با حروف کوچک نوشته شوند. به همین منظوروبرای رعایت استانداردجدید تمام

 

دستورها باحروف کوچک نوشته شده وشما نیزبهتراست ازهمین ابتدا عادت کنید که برچسب ها را

 

با حروف کوچک نوشته تابااستانداردxhtml نیز سازگار باشند*

 

شکست خطوط و پا راگرا ف ها

 

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

 

خاصی استفاده کنید بدین منظوربرای ایجاد یک خط فاصله بین پاراگرافها ی مختلف میتوانبرچسب

 

<p>را درشروع  پاراگراف وبرچسب</p>را در انتهای ان قرار دهید.برچسب <br>باعث ایجاد

 

شکست در خطوط داخلی یک پاراگراف خواهد شد*

 

بر خلاف برچسب هایی که تاکنون دیده اید دستور<br>نیازی به برچسب پایانی نداشته و بصورت

 

جفتی عمل  نمی نمایند و باید دستور مذکوربا یک فاصله و یک علامت (/)بکار برید.لذا بهتر است

 

دستور فوق به صورت   </b>نوشته شودالبته براساس قواعدxhtmlلازم نیست که قبل از علامت

 

(/)یک فاصله خالی نیز عایت شود. و می توان دستورفوق را به صورت  <br/>نیز نوشت ولی

 

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

 

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

 

Html سازگار نبوده و به همین دلیل و برای  صفحه ما با htmlسازگاری داشته باشد*

 

با استفاده از دستورهای<br/>و<p>فاصله های موردنظر در بین خطوط رعایت شدودوپاراگراف

 

نیزازهم جدا شده اندازبرچسب <hr/>برای ایجاد یک خط افقی جداکننده را به وجود میاورد دراین

 

حالت  حتی اگر همراه    <hr/>ازبرچسب   <br/>نیز استفاده نشده باشد  یک شکست خطی ایجاد

 

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

 

خالی ایجاد شود باید یک بر چسب<p>   قبل  ازدستور <hr/>و یک بر چسب </p>بلافاصله بعد

 

ازان قراردهید. برچسب <hr/>نیز همانند دستور<br/>نیازی برچسب پایانی </hr> نداشته است.

 

واگرفقط بخواهیم با  استانداردxhml همانند باشیم می توان  ازفاصله خالی بین(/) و (hr) نیزصر

 

صرف  نظر نمود*

 

ایجاد اتصال و پیوند(link)به صفحه وب دیگران 

 

دستوری که مسئول ایجاد پیوندها می باشد. برچسب <a> بوده که مخفف کلمه انگلیسی anchorبه

 

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

 

(“)وبعد ازعبارت href تایپ نمایید*

گزارش کارآموزی رشته کامپیوتر

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

Instagram : unitahlil