HTMl5
HTMl5

آموزش HTML5 – جلسه ی اول

آموزش HTML5 – جلسه ی اول

HTML5 Logo | آموزش HTML5

جلسه ی اول آموزش HTML5 شروع کار با HTML دخیره سازی و ایجاد یک صفحه ی وب .

ایجاد فایل html

برای شروع برنامه نویسی کافیست تا شما NotePad یا Notepad++ را باز کنید و کد های html را در آن بنویسید و بعد از نوشتن کد ها فایل را Save As نمایید . پسوند پیشفرض در notepad پسوند txt خواهد بود . شما باید پسوند فایل خود را به htm یا html تغییر دهید مثلا name.html یا name.htm و سپس فایل را دخیره کنید . فایل ذخیره شده به صورت یک فایل وب در خواهد آمد . و شما قادر خواهید بود این فایل را در مورور گر خود باز کنید .

ساختار کلی html

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

با دستور <!DOCTYPE html> شما مشخص میکنید که زبان استفاده شده در این کد html5 خواهد بود . ( در گذشته این کد پیچیده تر بود )

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

تگ ها در html به دو صورت وجود دارند تگ هایی مانند <html> که نیاز دارند در انتهای مکانی که روی آن اثر می گذارند با اسلش ( / ) بسته شوند مانند <html/> که به آن ها تگ های دوطرفه نیز گفته می شود و نوع دوم تگ هایی که نیاز به بسته شدن ندارند مانند تگ <br> که همانند کلید enter صفحه کلید عمل میکند که تگ یک طرفه نیز نامیده می شوند .

اولین برنامه در html5

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

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

می خواهیم این برنامه را با اندکی تغییرات همراه کنیم . و به این صفحه یک عنوان اضافه کنیم که در نوار عنوان بالای سایت نمایش داده شود . این کار را باید در قسمت <head> و با استفاده از تگ <title> انجام داد.همچنین می خواهیم متن خود را بیشتر کنیم و در دو خط به نمایش بگذاریم .

از تگ <h1> برای تیتر ها و عنوان ها استفاده می شود که از تگ <h1> تا تگ <h6> موجود است ، تگ <h1> بزرگترین اندازه قلم و <h6> کوچکترین اندازه ی قلم را دارا می باشد .

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

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

نکته

امکان دارد که نوشته های فارسی شما درون مرورگری به صورت نا خوانا باز شود . برای این حالت شما باید تنظیمان encoding مرورگر خود را بر روی ( unicode ( UTF – 8 یا unicode قرار دهید . نحوه ی انجام این کار در مرورگر های مختلف فرق می کند . درون اینترنت آموزش انجام این تغییرات وجود دارد . در مرورگر گوگل کروم از منو گزینه ی more tools انتخاب کرده در قسمت encoding گزینه ی مورد نظر را انتخاب کنید . در مرورگر فایر فاکس ( موزیلا ) ( واتر فاکس ) از منوی View گزینه ی character encoding انتخاب کرده و گزینه ی unicode را بر گزینید . در IE نیز می توانید از گزینه ی View گزینه ی Encoding گزینه ی مورد نظر را انتخاب نمایید .

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

رضا روحی

درباره ی رضا روحی

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

یک دیدگاه

  1. Avatar for رضا روحی

    عاالیی داداش رضا

پاسخ دهید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *

*

code