ArakTeam.net - درس چهارم-اولين سايتتان را بسازيد!
بوسيله آموزش هايي كه در درس هاي قبل داده شد،حالا تا ساخت اولين ساييتان فقط
چند دقيقه فاصله داريد!
چگونه؟
در درس اول گفتيم كه براي طراحي سايت به دو چيز نياز داريم:مرورگر و نرم افزار
ويرايشگر متن مثل Notepad .لطفا در هنگام خواندن اين درس مرورگر و notepad ( از
قسمت Accessories كه زير مجموعه programs از منوي start است) را باز كنيد.
چگونه كار كنم؟
مي خواهيم طراحي سايت را با يك چيز ساده شروع كنيم.مثلا صفحه اي كه در آن نوشته شده
باشد "Hurrah! This is my first website.".پس تا پايان اين آموزش را بخوانيد تا
ببينيد چقدر آسان است!
اولين چيزي كه شما نياز داريد اين است كه به مرورگر بفهمانيد كه زبان صفحه Html
است.براي انجام اين كار بايد از برچسب ابتدايي < html> استفاده كنيد.پس بنابراين
قبل از هركاري در اولين خط از سندي كه درnotepad باز كرده ايد،< html> را وارد
كنيد.
يادآوري از درسهاي جلسات قبل: < html> يك برچسب ابتدايي است كه بايد با يك برچسب
انتهايي بسته شود پس هنگامي كه نوشتن كدهاي html در صفحه تمام شد بايد تگ انتهايي <
/html> را بنويسيد.براي اينكه نوشتن برچسب پاياني < /html> يادتان نرود بهتر است
همين الان < /html> را در آخرين خط سند،وارد كنيد و محتواي صفحه يتان را در بين
برچسب ابتدايي < html> و برچسب انتهايي < /html> بنويسيد.
دومين چيزي كه سند Html شما به آن نياز دارد عنصر " head" (برچسب ابتدايي <head> و
برچسب انتهايي </head>) است كه اطلاعاتي درباره سند شما در آن نوشته مي شود.پس از
head شما به عنصر "body" (برچسب ابتدايي < body > و برچسب انتهايي </ body >) نياز
داريد كه محتواي صفحه شما بايد در اين قسمت قرار گيرد.
حالا سند Html شما مثل زير خواهد بود:
<html>
<head>
</head>
<body>
</body>
</html>
به ساختار و نحوه قرار گيري برچسب ها در خط هاي جديد و بصورت تو رفته توجه كنيد.
ايجاد تو رفتگي اهميتي در ساختار صفحه شما ندارد ،و فقط كمك مي كند تا كد صفحات شما
خواناتر باشد.به همين دليل پيشنهاد مي شود كه ساختار صفحات html را مرتب و بصورت
تورفته يا در خط هاي جديد بنويسيد،مانند مثال بالا.
اگر سند Html تان مانند مثال بالا باشد،شما اولين سايت خود را ساخته ايد.شايد در
اول آموزش فكر نمي كرديد كه اين قدر آسان باشد ولي شما اكنون قالب اصلي اسناد Html
را ايجاد كرده ايد.
خوب،حالا چگونه محتواي وبسايتم را اضافه كنم؟
طبق چيزي كه يادگرتهايد،سند Html شما از دو قسمت تشكيل شده بود:يك head و يك
body.در بخش headشما اطلاعاتي درباره صفحه درج مي كنيد كه اين اطلاعات در خود صفحه
نشان داده نمي شود،در صورتيكه قسمت body تشكيل از محتواي سايت شما تشكيل مي شود.
براي مثال،اگر مي خواهيد عنوان صفحه در بالاي پنجره مرورگر (top bar ) نمايش داده
شود،بايد كد مخصوص به اين كار را در بخش head قرار دهيد.عنصر مخصوص براي نمايش
عنوان يك صفحهtitle مي باشد كه بايد عنوان صفحه را بين دو برچسب <title> و </title>
قرار دهيد.
<title>My first website</title>
طبق نوشته هاي بالا قرار شد در صفحه عبارت "Hurrah! This is my first website"
نمايش داده شود.پس بايد در قسمت body كد زير را وارد كنيد:
<p>Hurrah! This is my first website.</p>
P كوتاه شده "paragraph"است و متني كه بيت دو تگ <p> و </p> نوشته مي شود در يك
پاراگراف نمايش داده مي شود.
حالا سند Html شما بصورت زير مي باشد:
<html>
<head>
<title>My first website </title>
</head>
<body>
<p>Hurrah! This is my website.</p>
</body>
</html>
تمام شد!
شما اولين وبسايت خود را طراحي كرديد!
مرحله بعدي كه بايد انجام دهيد ذخيره كردن سند Html بر روي هارد ديسك و سپس باز
كردن آن است.
در Notepad در منوي بالا File و سپس "Save as..." را انتخاب كنيد.
"All Files" را از "Save as type" انتخاب كنيد.
حالا سند Html خود را با نام "page1.htm" (".htm" نشانگر اين است كه صفحه شما Html
است. مي توانيد از ".html" هم استفاده كنيد.استفاده از اين دو اختياري است و تغييري
در نتيجه حاصل نمي شود.)
سپس بر روي "save" كليك كنيد.به ياد داشته باشيد كه صفحه را در كجا ذخيره كرده ايد.
حالا به مرورگر رفته و اقدامات زير را انجام دهيد:
از منوي بالا به "File" رفته و "Open" را انتخاب كنيد.
بر روي "Browse" كليك كنيد.
اكنون سند Html اي را كه ساخته ايد پيدا كرده و بر روي "Open" كليك كنيد.
حالا بايد در صفحه شما عبارت "Hurrah! This is my first website." نمايش داده شود.
اگر درباره اين مطلب سوالي داريد در اين قسمت مطرح نماييد
منبع:
http://www.html.net/tutorials/html/lesson4.asp
مترجم: محمدعلي آبائي
mohammadali@arakteam.net
تاريخ ايجاد مطلب:12/2/1387