COMPUTER
Hardware-software-windows-network-short stories 
قالب وبلاگ

نرم افزار مورد نیار برای نوشتن HTML :

خیلی از دوستان فکر می کنند که برای نوشتن کد های HTML و کلا برای طراحی وب باید حتما نرم افزار خاصی داشته باشی !!!!!!!!!!!!!! من (علی بهنام فر) اینجا اعلام می کنم ;) که این صحبت ها همه مسخرست ، البته نرم افزار های موجود هست که کد نویسی رو ساده تر می کنند ولی خوب شما برای نوشتن کد ، حتما ،  تاکید می کنم  ، حتما ، نیازی به این نرم افزار ها ندارید.شما می تونید از نرم افزار Notepad که در تمام ویندوز ها موجود هست استفاده کنید و یا حداکثر نرم افزار Notepad++ دانلود و نصب کنید ، در حال حاضر اکثر طراحان حرفه ای وب از دو نرم افزار بالا برای طراحی وب استفاده می کنند.ما در طول آموزش برای اثبات این موضوع از نرم افزار Notepad استفاده می کنیم . ;)

خوب وارد نوشتن کد ها بشیم.در واقع HTML ساخته شده از شناسه ها یا همان تگ (tag) است.خوب حالا این تگ ها چی هستن و اصول نوشتن آن ها چیست ؟

اصول نوشتن تگ (tag) :
هر تگ با علامت کوچکتر ریاضی > آغاز می شود و با علامت بزرگتر < به پایان می رسد.

1 < نام تگ >

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

1 <b>تم دیزاینر : مرجع خدمات وبمستر برای پارسی زبانان</b>

نتیجه کد بالا :

تم دیزاینر : مرجع خدمات وبمستر برای پارسی زبانان

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

1 <b>تم دیزاینر : مرجع خدمات وبمستر برای پارسی زبانان

نتیجه کد بالا :

تم دیزاینر : مرجع خدمات وبمستر برای پارسی زبانان

به نظرم تا اینجا خوب با باز و بسته کردن یک تگ آشنا شدید ولی ساختار HTML از هزاران تگ تشکیل شده که باید در کنار هم به درستی کار کنند برای نوشتن تگ های استاندارد و صحیح ، متن زیر رو همیشه به خاطر داشته باشید (این شعار همیشگی من هم هست) :

هر تگ باز شده باید بسته شود و هر تگی که زود تر باز شد باید دیر تر بسته شود

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

1 <b><u>تم دیزاینر : مرجع خدمات وبمستر برای پارسی زبانان</u></b>

خوب همون طور که می بینید تگ <b> که روزتر باز شده دیر تر بسته شده <b/> .

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

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

ساختار کلی HTML : 
ساختار کلی این زبان از یک تگ اصلی و دو زیر تگ اصلی ساخته شده است.

تگ اصلی <html></html> : تمام کدهای نوشته شده باید بین این تگ باشد.
زیر تگ اصلی <head></head> : تمام تنظیمات صفحه مثل عنوان صفحه و یا کد های css و .. بین این تگ قرار خواهند گرفت.هر چیزی که اینجا قرار داده شود در صفحه به صورت مستقیم قابل دیدن نیست.
زیر تگ اصلی <body></body> : هر چیزی که اینجا قرار داده شود در صفحه شما به صورت مستقیم قابل دیدن است.

ساختار کلی HTML :

1 <html>
2 <head>
3 <title>عنوان صفحه</title>
4 </head>
5 <body>
6 هر چیزی که اینجا قرار داده شود در صفحه شما به صورت مستقیم قابل دیدن است.
7 </body>
8 </html>

در کد های بالا شاید تگ <title></title> برای شما ناشناس باشد.محتوای بین این تگ به صورت عنوان صفحه شناخته می شود .مثلا در همین صفحه ما این تگ رو به صورت زیر تعریف کردیم.

1 <title>جلسه اول : ساختار و اصول نوشتن HTML</title>

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

نمایش و ذخیره سازی HTML :

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

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

1 <html>
2 <head>
3 <title>تست عنوان صفحه</title>
4 </head>
5 <body>
6 هر چیزی که اینجا قرار داده شود در صفحه شما به صورت مستقیم قابل دیدن است.<br>
7 <b>هر چیزی که اینجا قرار داده شود در صفحه شما به صورت مستقیم قابل دیدن است.</b>
8 </body>
9 </html>

بعد هم برید قسمت file و save as رو انتخاب کنید ، نام فایل (File name) را برای مثال ali-behnamfar.html وارد کنید و ذخیره کنید.حالا با هر مرورگری به جز Internet Explorer فایل ذخیره شده را باز کنید ، می بینید که نوشته های فارسی به صورت کد نمایش داده شده اند.برای حل این مشکل موقع ذخیره سازی Encoding را UTF-8 انتخاب کنید.خوب حالا همان مراحل بالا را طی کنید و باید به یاد داشته باشید Encoding را UTF-8 قرار دهید.

راستی تگ <br> هم باعث می شه شما به سطر بعدی متن برید.
تبریک می گم شما اولین صفحه HTML خود را کاملا استاندارد ساختید و ذخیره سازی کردید.

[ ] [ ] [ مدیر ] [ ]
.: Weblog Themes By Iran Skin :.

درباره وبلاگ

کانال ما رو در تلگرام دنبال کنید : ketabnew@ https://telegram.me/ketabnew
نويسندگان
لینک دوستان
موضوعات وب
امکانات وب
Instagram

کمک به سازمان خيريه محک