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

اگرچه FrontPage  برای ساختن صفحات وب HTML بسیار سودمند می باشد ولی کارایی خود را هنگام طراحی صفحات  ASP از دست می دهد. شما نمی توانید کدها را به راحتی، drag&drop نمایید و به خاطر اینکه صفحات ASP شامل کدهای Scripting می باشند، شما نمی توانید به همان راحتی که برای صفحات وب کدهای HTML را تولید می کردید، کدها را برای صفحات ASP ایجاد نمایید. با وجود این محدودیت ها، FrontPage  هنوز برای ایجاد صفحات وب استفاده می گردد. توسعه دهندگان از سیستم  SUI FrontPage  به منظور ایجاد HTML برای صفحات وب استفاده می کنند و سپس سورس HTML صفحه ایجاد شده به وسیله FrontPage  را باز کرده و کدهای ASP را به آن اضافه می کنند.شکل زیر  نرم- افزار FrontPage  را در حال کار نشان می دهد.      

  Front page  همانند InterDev شامل تعداد زیادی ریزه کاریها و پیچیدگیها می باشد. به منظور آموزش بیشتر در مورد FrontPage  سایت زیر را بازدید نمایید.

شروع کار

اگرFrontPage در کامپیوتر شما نصب شده باشد می توانید آن را از مسیر start/programs/FrontPage اجرا نمایید. در شکل بالا محیط این نرم افزار نشان داده شده است.

در ستون سمت ۶ تا آیکون وجود دارد :

۱-       page

۲-       Folders

۳-       Reports

۴-       Navigation

۵-       Hyperlinks

۶-       Tasks

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

• private : از دید کاربران غیر فعال است فقط Script ها می توانند به آن دست پیدا کنند.
• images : تصاویر سایت در آن ریخته می شود.

ایجاد یک صفحه جدید 

از نوار استاندار روی آیکن Create a new normal page  کلیک کرده و گزینه web را انتخاب نمایید. یک پنجره باز می شود از Tab Web sites گزینهWeb On Page را انتخاب نمایید . در سمت راست  پنجره آدرس محلی که قرار است سایت مورد نظر را طراحی کنید مشخص نمایید. و روی Ok کلیک نمایید. سپس روی Folders کلیک کنید یک صفحه باز می شود که دارای دو پوشه و یک فایل با نام  Index.htmlمی باشد.وروی فایل Index.html دو بار کلیک نمایید. تا صفحه HTML باز شود. این صفحه دارای سه Tab می باشد :

۱٫     ۱)       HTML : در این Tab کدهای مربوط به طراحی سایت را می نویسیم.

۲٫     ۲)       Normal : طراحی صفحات وب بدون کد نویسی

۳٫     ۳)       Preview : نمایش نهایی صفحه طراحی شده 

برای ذخیره کردن صفحه با پسوند asp آیکن Save را از نوار استاندارد انتخاب کرده وپنجره Save باز شده ودر کادر File name: نام را با پسوند Asp ذخیره نمایید. مانند Index.asp وروی دکمه Save کلیک کنید.

Tab Preview صفحات با پسوند asp را نمایش نمی دهد. برای دیدن این صفحات در ابتدا باید IIS را روی سیستم نصب کنید.

طراحی جدول

روش ۱)

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

در قسمت Alignment می توانید موقعیت جدول را در صفحه تنظیم کنید. در قسمت Cell padding

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

در قسمت Background میتوانید رنگ پیش زمینه را تغییر دهید و یا یک عکس را بعنوان پیش زمینه قرار دهید.

 روش ۲)

می توانید از منوی Table استفاده کنید. 

از منوی Table گزینه Insert/table را انتخاب می کنید سپس یک پنجره باز می شود که می توانید تعداد ستونها را در قسمت Columns و تعداد سطرها را در قسمت Row مشخص می کنید.

 در قسمت Alignment می توانید موقعیت جدول را در صفحه تنظیم کنید. در قسمت Cell padding می توانید فاصله بین محتوی یک خانه جدول و حاشیه آن خانه را تعیین کرد. Cell Spacing در این قسمت می توانید فاصله بین خانه های جدول را کم یا زیاد بکنید. در قسمت Border می توانید اندازه ورنگ آن را تعیین کنید. 

در قسمت Background میتوانید رنگ پیش زمینه را تغییر دهید و یا یک عکس را بعنوان پیش زمینه قرار دهید.

برای حذف جدول و تعدادی از خانه های جدول وارد منوی Table شده و گزینه Delete را انتخاب کنید وحذف کنید. ویا اینکه جدول و یا سلول مورد نظر را انتخاب کرده و کایک راست کرده و گزینه delete را انتخاب کنید.

برای اضافه کردن جدول و یا تعدادی سلول به جدول، یک سلول را انتخاب کرده  واز منوی Table گزینه Insert را انتخاب کنید. ویا اینکه سلول مورد نظر را انتخاب کرده وروی آن کلیک راست کرده و گزینه Insert را انتخاب کنید. 

برای اضافه کردن تعدادی ستون ویا سطر تنها به یک سلول از جدول کافیست وارد منوی Table شده و گزینه split cells… را انتخاب کنید . 

برای استفاده از جداول پیش فرض FrontPage می توانید وارد منوی Table شده و گزینه Table AutoFormat را انتخاب کنید. 

استفاده از تصاویر

روش ۱) از نوار استاندارد گزینه Insert Picture From Files را انتخاب کرده وبا انتخاب عکس مورد نظر آن را اضافه نمایید.

روش ۲) از منوی Picture/From Files /Insert را انتخاب کنید سپس عکس مورد نظر را انتخاب کنید و آن را به صفحه اضافه کنید.

استفاده از Form ها

از منوی Insert/Form را انتخاب کنید Form دارای چندین انتخاب است از جمله: Form ، Textbox ، Text Area 

برای استفاده در ابتدا باید گزینهForm را انتخاب کنیم این فرم دارای یک کادر که حالت نقطه چین دارد ونیز دارای دو Button که نام یکیSubmit و نام دیگریReset می باشد. سپس بسته به نیاز سایت از فرم های دیگر استفاده می کنیم. 

استفاده از Button

Button ها را با استفاده از منوی Insert و گزینه Interactive Button ایجاد می کنیم .هنگامی که گزینه Interactive Button را انتخاب کردیم یک پنجره باز می شود که در آن شکل دکمه را انتخاب می کنیم ودر پایین نام و صفحه ای که قرار است دکمه به آن لینک شود را تایپ می کنیم.