html_مقدمه

مقدمه ای بر html

HTML :  HyperText Markup Language

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

 

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

استانداردها و روشها برای نوشتن HTML توسط کنسرسیوم وب جهانی (W3C) تنظیم و نسخه های متعدد از HTML وجود دارد.

از آنجا که این بخش یک مقدمه از HTML است، ما نمی خواهیم به جزئیات در مورد نسخه های مختلف مانند XHTML، HTML 4.01 و ۲٫۰ HTML و همچنین به طبقه بندی استانداردهای مانند سخت، سنتی، و قاب است بپردازیم.

با اینکه که ممکن است شما فایلهایی با پسوند php, cfm, asp, etc., ببینید ، این فایلها دارای تگ های html به منظور نمایش محتوا هستند. تقریبا هر دستور Html  دارای یک علامت شروع و یک علامت پایان است که در داخل <> قرار میگیرند.ساختار کلی این تگها به شکل زیر است:

<html>

    <head>

        <title> </title>

    </head>

    <body>

    </body>

</html>

 

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

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

ساختار وب

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

طراحی وب سایت مدرن:

ساختار

نمایش

رفتار

مدیریت

مدیریت محتوا

Modern Web Design

HTML: Structure
CSS: Presentation
JavaScript: Behavior

PHP or similar: Backend
CMS: Content Management

منابع:

https://www.w3schools.com

https://www.sololearn.com

HTML,CSS

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

images (2)

HTML,CSS کاربردی آسان سریع

 فصل ۶ :  کدی بنویسید که شکل زیر را ایجاد کند:

1

<html>

    <head>

        <title> sufra </title>

   </head>

<body>           

                     <table  border=“1” width=“400”  height=“150”  cellspacing=“20” cellpadding=“50”

                                style=“margin-left:500;margin-top:300;background-color:red;” >

                                <tr ><td style=“background-color:green;color:red “>&nbsp;</td>

                                <td style=“background-color:white;color:blue “>      &nbsp;</td>

                               <td style=“background-color:yellow;color:white “>    &nbsp;</td></tr>

                  </table>
       </body>

</html>

روش دیگر

<!DOCTYPE html>
<html>
<head>
<style>

table, th,td

}
;border: 1px solid black
{

table

}
;border-spacing: 20px
;background-color:red
{
<style/>
<head/>
<body>
<“;table style=”width:400 ;height=150”;cellspacing=20; cellpadding=50 >
<tr>
<th style=”background-color:green”></th>
<th style=”background-color:white”></th>
<th style=”background-color:yellow”></th>
<tr/>
<table/>
<body/>

<html/>

نکته:

 table

وظیفه ایجاد جدول را برعهده دارد و دارای ویژگیهای زیر است

border

ضخامت خطوط تشکیل دهنده جدول را معین میکند

tr: Table Row

وظیفه ایجاد ردیف را در جدول بر عهده دارد

th :Table Header

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

Td: Table Data

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

&nbsp; non-breaking space

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

width

برای تعیین عرض جدول

height

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

cellspacing

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

cellpadding

وقتی عبارتی را بین برچسب های th  وtd قرار میدهید تا به عنوان محتوای خانه های جدول درج شود، در حالت پیش فرض فاصلۀ چندانی از کناره  جدول ندارد. برای تنظیم این فاصله بر حسب نقطه ،مشخصه cellpading  پیش بینی شده است.

 

style

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

margin-left

مقدار حاشیه از سم چپ ۵۰۰ نقطه

background-color:red

برای رنگ آمیزی پس زمینه

 

   در html همه چیز درون تگ ها (<>) قرار میگیرد مانند <html> , همین تگها مشخص میکنند که چه چیزی درون پاراگراف، لینک ، متن ساده و…قرار بگیرد.

فایل html یک فایل متنی ساده است وبرای ساختن این فایل کافی است در یک notepad از قسمت file  ،save as  را انتخاب کنیم:

2

3

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

نکته:

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

 

 

4

6

اما به این صفحه ، یک صفحه  html  نمیگویند بلکه به صفحه ای html میگویند که دارای یک مقدار کد باشد:

<html>

       <head>

             <title> sufra </title>

       </head>

<body>
<body/>

</html>

HTML,CSS

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

 

images (2)

 

 

:  Hyper Text Markup Language  (HTML) •

 

برای داشتن یک web page باید بتوانیم از یک  صفحه وارد یک صفحه دیگر شویم پس دراینجا با مفهوم Hyper Text آشنا میشویم

 : Hyper Text (HT) •

به معنای ابر متن ،فراتر از یک متن عادی (Text) در واقع ابرمتن  وظیفه ی لینک توسط تگ <a> بین صفحات را دارد که ما این ویژگی را در متن های عادی (text) نداریم.

• زبان های Markup یا نشانه گذاری :

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

    •SGML

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

هنگامی که اولین اید ه ها برای ایجاد صفحات وب و انتقال داد ه ها میان سرویس گیرنده وسرویس دهنده شکل میگرفت ،استاندارد (SGML (Standard Generalized Markup Language مورد توجه قرار گرفت و بر مبنای آن یک زبان استاندارد شده با نامHTML یا  زبان نشانه گذاری ابرمتن  ساخته شد. برچسبهای این زبان بر خلاف  SGML که توسط هر کاربر  قابل تعریف و تغییر بودند،محدود و استاندارد بود تا بتوان صفحات وب رادر قالب یک فایل متنی به رایانه کاربر انتقال داد و در آنجا یک نر م افزار ( که بعدا مرورگر نام گرفت) که صفحه را بازسازی کند.ویژگی ابرمتن یا Hyper Text بودن این زبان هم باعث میشد امکان ایجاد پیوند  درصفحه وب و هدایت کاربر به  سایر  صفحات فراهم آید.

• XML

 یکی دیگر از زبان های نشانه گذاری که بنا بر نیازهای موجود در دنیای وب عرضه گردیده XML  یازبان نشانه گذاری قابل توسعه نام دارد. XML زیرمجموعه ای از SGML  محسوب می شود که برای استفاده بر روی وب بهینه شده اما کارکرد آن کاملاً باHTML تفاوت دارد .
 XMLهیچ برچسب ازپیش تعریف شده ای ندارد و کاربر می تواند برچسب ها را بسته به نیاز خود تعریف کند.
 از این زبان عمدتاًبرای تعریف یک قالب جهت ذخیره سازی داده ها استفاده می شود

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

• (XHTML (XML+HTML

با این توضیحات می توان نتیجه گرفت که HTML دارای برچسب های استانداردی است که قالب نمایش داده ها
(مثلاً رنگ و اندازه آنها)  را تعیین می کند اما برچسب های XML برای توصیف ماهیت داده ها به کار می روند.

انجمن وب پس از استانداردسازی نسخۀ چهارمHTML ،روند توسعه آن را برای مدت زمانی متوقف نمود تا بر روی ترکیبی ازXML و HTML کار کند. نتیجه کار مشترک نمایندگان شرکت های فعال در زمینه وب و کارشناسان این انجمن،ابداع زبان XHTML  بود؛زبانی که می کوشید نقاط ضعف HTMLرا در کار با فن آوری های روز دنیا مانند تلفن های همراه برطرف سازد و نمایش صحیح صفحات وب را روی این دستگاه ها و سایر مرورگرها تضمین نماید.
صرف نظر از نکات فنی در طراحی این زبان جدید، می توان ساختار نگارشی و قواعد سختگیرانه ترنسبت به HTMLرا از وجوه تمایز XHTML   دانست.
در واقع میتوانیم یک برچسب با هر معنایی تعریف کنیم . مثل </tree><tree>

•  فرمت های ذخیره سازی صفحات وب

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

   • برخی سیستم عامل ها مانندLinux و Unix  که نصب آنها بر روی سرورهای وب بسیار رایج است از پسوندهای چهارحرفی مانند html  پشتیبانی نمیکنند.

  • چنان چه صفحه اول سایت به دو صورت index.htm و index.html بر روی سرور وب ذخیره شده باشد، هنگامی که نام سایت را در مرورگر وب وارد می کنید،به صورت پیش فرض ،index. htm نشان داده می شود.
 لذا توصیه می شود برای ذخیره سازی صفحات وب ساخته شده، از فرمت htm استفاده نمایید. 

• صفحات ایستا و پویا
ممکن است هنگام گشت وگذار در اینترنت و مشاهده وب سایت های گوناگون، در نوار نشانی مرورگروبا پسوندهای دیگری غیر ازhtml و htm  مواجه شوید که در این میان، فرمت هایمانند jpsو  aspx ،asp ،php عمومیت بیشتری دارند.

   •  تفاوت این پسوندهای ناآشنا با فرمت هایی html و htm  چیست؟ 

برای پاسخ به این سؤال باید با دو تعریف جدید آشنا شوید: وب سایت های ایستا  و وب سایت هایپویا . وب سایت های ایستا یا استاتیک به آن دسته از وب سای تهایی گفته می شود که میزان تغییراطلاعات در آنها پایین است و به همین دلیل ساخت آنها با استفاده از چند صفحه وب با فرمتhtm و قرار دادن این صفحات بر روی سرور وب انجام میگیرد.در این نوع وب سایت ها، صفحاتی که کاربر مشاهده می کند به صورت مستقیم توسط طراح وب ایجاد شده و تغییر محتوای صفحات فقط توسط طراح امکان پذیر است.
در مقابل، وب سایت های دینامیک که گاهی برنامه های کاربردی وب هم نامیده می شوند ساختارپیشرفته تر و منعطف تری دارند. در این وب سایت ها که عموماً توسط گروهی متشکل از طراحان وبرنامه نویسان تولید می شوند، برای ورود اطلاعات جدید، مدیریت اطلاعات قبلی و نیز ایجاد تغییراتدر تعداد و شکل ظاهری صفحات امکانات مجزایی درنظر گرفته می شود.
در این گونه وب سایت ها که محتوای پویایی دارند اطلاعات نه در صفحات مجزا بلکه در پایگاه دادهذخیره می شود و برای بازیابی و نمایش این اطلاعات باید کدهایی به یک زبان برنامه نویسی تحت وبمانندJSP ،ASP.NET ،PHP و … نوشته شود. به همین دلیل پسوند صفحات این نوع وب سایت ها متناسب با زبانی است که کدهای صفحات بر اساس آن نوشته شده است.

 

در پایان متوانیم  HTML  را به زیربنای ساختمان و CSS را رنگ ولعاب و زیبایی دادن به آن تشابه کنیم .


بیشتر بدانیم

کوکی ها و عملکرد آنها


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

Proxyو مفهوم آن

پِراکسی یک سیستم سخت افزاری یا برنامه کاربردی است که در شبکه، به عنوان واسطه ای میان رایانه کاربر و سرور عمل می کند. به عنوان مثال چنان چه کاربر اینترنت بخواهد درخواستی را با هدف مشاهده صفحه وب یا دریافت یک فایل برای سرور وب ارسال نماید، این درخواست ابتدا توسط پراکسی مورد رسیدگی قرار می گیرد و نتیجه حاصل از این رسیدگی برای کاربر فرستاده می شود.انگیزه اولیه از ایجاد پراکسی ها به اشتراک گذاردن اتصال اینترنت در یک شبکه داخلی بوده است به این معنی که مثلاً در شبکه یک شرکت تجاری، به جای آن که تک تک رایانه ها به صورت جداگانه به اینترنت متصل شوند، همگی از طریق یک دروازه متصل به اینترنت یعنی پراکسی با اینترنت ارتباط برقرار کنند.
با گذر زمان قابلیت های جدیدی فراتر از به اشتراک گذاردن ارتباط با اینترنت به پراکسی ها اضافه شد که از آن جمله می توان به موارد زیر اشاره کرد:
نظارت بر کاربران: با استفاده از پراکسی می توان درخواست های ارسال شده توسط کاربران را بررسی نمود و در صورت عدم تطابق آن ها با معیارهای تعیین شده، کاربر را از دسترسی به صفحات ومحتوای درخواست شد منع نمود.
Cacheکردن اطلاعات: با توجه به گران بودن هزینه ارتباط با اینترنت و محدودیت در پهنای باند مورد تقاضای کاربران، پراکسی قادر است صفحات وب و فایل هایی را که بیش ترین درخواست برای آنها وجود دارددر حافظه داخلی خود ذخیره (Cache) نماید. به این ترتیب در درخواست های بعدی، لزومی به دریافت محتوا از اینترنت نیست و پراکسی با مراجعه به حافظه داخلی خود به درخواست کاربران پاسخ می دهد. این قابلیت ضمن افزایش سرعت دسترسی کاربران به مطالب موردنظر، از هدر رفتن پهنای باند برای دریافت اطلاعات تکراری جلوگیری خواهد کرد.
افزایش امنیت شبکه:از آن جا که پراکسی به عنوان درواز های برای ارتباط شبکه داخلی با اینترنت عمل می کند، با ایجاد یک سیستم امنیتی قدرتمند می توان از نفوذ فایل های مخرب نظیرویروس، کرم، تروجان به درون شبکه داخلی پیشگیری نمود و رایانه های موجود در شبکه را از خطرنفوذگری و دسترسی های غیرمجاز در امان نگه داشت.

معرفی افزونه

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

RSS

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

آشنایی با موتورهای جستجو

وب را می توان منبع بزرگی از اطلاعات دانست که برای اکثر پرسش های کاربران پاسخ های قابلقبولی را در خود جای داده است. امروزه با وجود میلیون ها وب سایت و میلیاردها صفحۀ وب و انبوهی از فایل ها و مستندات قابل دسترس، افراد گوناگون برای دریافت پاسخ پرسش های خود راهی بهترو سریع تر از مراجعه به اینترنت سراغ ندارد. اما سؤال اصلی این است که برای رسیدن به اطلاعات موردنظر باید به کدام وب سایت مراجعه نمود تا از میان انبوه اطلاعات موجود در اینترنت به صفحۀمطلوب رسید؟شاید اگر برای حل این معضل راه حل مناسبی ابداع نشده بود، استفاده عمومی از وبتا این حد گسترش پیدا نمی کرد.
تا مدت ها، کار دسته بندی صفحات وب به صورت دستی و بدون استفاده از نرم افزار خاصیانجام می شد تا این که کم کم ایده تولید موتورهای جستجو میان برنامه نویسان شکل گرفت و از سال۱۹۹۳ به تدریج نرم افزارهایی برای جستجو در محتوای صفحات وب تولید شد. در همین زمان بودکه مفهومی به نام Web Robot پا به دنیای فن آوری اطلاعات گذاشت؛ یعنی نر م افزاری که به صورت خودکار صفحات وب را احضار نموده و با بررسی محتوای صفحات، اقدام به نمایه سازی (Indexing) آنها می کند.

امروزه موتور جستجوی گوگل به مدد الگوریتم قدرتمندی که توسط یک دانشجوی جوان به نام لَری پیِج  نوشته شد توانسته در دنیای موتورهای جستجو به رقیب بلامنازع تبدیل شود و تقریباًٌ سایر رقبا را به حاشیه براند. هنگامی که کلید واژه ای را در یکی از موتورهای جستجو مثلyahoo.com ،google.com،bing.com  وارد می کنید، در کمتر از یک ثانیه، لیستی از نشانی وب سایت ها و صفحات حاوی کلیدواژه در اختیار شما قرار میگیرد و تعداد نتایج به دست آمده می تواند بین صفر تا چند میلیون نتیجه متغیر باشد. این سؤال ممکن است برای هر کاربر موتورهای جستجو پیش بیاید که یافتن این تعداد نتیجه در
این زمان کوتاه چگونه امکان پذیر است؟ برای پاسخ به این سؤال باید اجزاء تشکیل دهنده یک موتورجستجو را که در اغلب آنها مشترک است با هم مرور کنیم:

Robot یا Spider:


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

Crawler:

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

Indexer:

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

Database:

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

Ranker:

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

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

SEO

هنگامی که کاربران، کلیدواژ ه های به کار رفته در محتوای وبسایت را از طریق موتورهای جستجو بررسی میکنند، نام وبسایت در رتبۀ بالاتری قرار میگیرد و طبیعتاً مراجعه به آن بیشتر خواهد شد. بهینه سازی و بسایت برای شناسایی توسط موتورهای جستجو که به اختصار (SEO   (Search Engine Optimization  نام دارد یکی از مهار تهایی است که طراحان وب باید بر آن مسلط باشند.

 

 

مفاهیم مقدماتی وب

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

CLIENT ,SERVERو نحوه درخواست یک صفحه HTML
اگر در فضای اینترنت یک  سایتی را  درخواست  بدهیم این سایت  که بر روی یک کامپیوتر بسیار قدرتمند (server)قرار دارد پاسخ گوی ما خواهد بود  .
سرورهای وب، رایانه هایی با قدرت پردازش بالا  میزبان  یا  وب هستند که به صورت دائم به اینترنت متصل می باشند و روی آنها نرم افزارهایی خاص برای برقراری ارتباط با اینترنت، ارایه سرویس وب و نیز تأمین امنیت اطلاعات نصب شده است.
وب بر اساس مدل سرویس دهنده –  سرویس گیرنده بنا شده است. یعنی یک درخواست ازسرویس گیرنده (مثلاً رایانه شخصی شما) برای سرویس دهنده ( در این جا سرور وب) ارسال می شود.وقتی درخواستی به سرور بفرستیم به این عمل http request و پاسخ سرور به ما  را http response میگویندکه بعد از آن ما صفحه ای را در مرورگر خود میبینیم.
سرویس دهنده، درخواست رسیده را پردازش نموده و پاسخ مناسب را برای سرویس گیرنده ارسال میکند.در سرویس وب برای ارسال درخواستها و پاسخها، مجموعه ای از قواعد تحت عنوان قرارداد  انتقال ابرمتن یا به اختصار HTTPتعریف شده که قوانین انتقال فایل را در وب مشخص میکند. هنگام فراخوانی یک صفحه وب، درخواست HTTP کاربر در قالب یک درخواست برای سرویس دهنده ارسال  میشود . و در پاسخ به این درخواست یک فایل متنی به زبان HTMLبرای سرویس گیرنده فرستاده می شود.
client  یک کامپیوتر عادی است که ما از طریق ا ن درخواست خود را میفرستیم .
مرورگر وب  (web browser)   نرم افزاری برای دریافت و نمایش اطلاعات از وب است. این نرم افزار به صورت مفسر (interpreter) کار می کند که قابلیت تفسیر تگ ها و همچنین اسکریپت ها را دارد .شاید این سوال در ذهن شما پیش آمده  باشد که interpreter چه فرقی با compiler  دارد؟ پاسخ این است که کامپایلر ابتدا تمام دستورات برنامه را خوانده و در صورت صحیح بودن  همه آنها را اجرا میکند  اما مفسر ها رفتار متفاوتی دارند .مفسر ها هر خط برنامه را اجرا کرده و به خط بعدی میروند،در واقع اجرای هر خط همان لحظه خواندن خط اتفاق می افتد .اگر خطایی در خطی باشد آن را اعلام میکند و به کار خود ادامه میدهد .

بنابراین اگر برای نمایش صفحات وب از کامپایلر استفاده میشد  سرعت اجرا بسیار پایین بودو همچنین اگر کوچکترین خطایی در صفحه بود ،هیچ گاه نمیتوانستیم به آن صفحه  دسترسی داشته باشیم تا همه ایرادهای آن برطرف گردد.
حال می توانیم نحوه عملکرد مرورگر را به صورت کامل بررسی کنیم. هر صفحه وب در اینترنت دارای یک نشانی به صورت
http://www.websitename.com/test.htm است که در آن :
Hyper Text Transfer Protocol : http — قوانین انتقال ابر متن ،پروتکل برقراری ارتباط را تعیین میکند.
www : نشان میدهد که کاربر در حال استفاده از سرور وب است .
websitename.com : نام دامنه سایت است و در واقع نشان میدهد که درخواست باید برای کدام یک از سروهای وب موجود در اینترنت ارسال شود.
test.htm : صفحه وب مورد نظر را در وبسایت مذکور مشخص میکند.
وقتی بعد از وارد کردن آدرس اینتر را میزنیم  صفحه ای برای ما باز میشود که بر  روی یک سرور است . در واقع با وارد کردن آدرس ، آدرس همان کامپیوتر قدرتمند را وارد میکینم. آدرس کامپیوتر ها توسط ip  مشخص و تبدیل  به نام میشود.ip دردنیای اینترنت برای یک  کامپیوتر  منحصر به فرد است.

 

حال سوالی که پیش می آید این است که مرورگر از کجا میفهمد چه چیزی را نمایش دهد ؟ اینجا است که موضوع  html   مطرح میشود.