• آموزش HTML فصل اول

    آموزش مقدماتی بدنه HTML و آموزش تگ نویسی و محتویات تگ در HTML

    بدنه اصلی تگ

    بدنه اصلی HTML رو مجموعه ای از تگ ها تشکیل میدن. تگ چیه ؟ تگ یعنی نشونه، علامت، اینجا مفهومش اینه که : یک بخش به همراه نشانه
    HTML این نشانه ها رو شناسایی میکنه و تبدیل میکنه به گرافیک های بصری، اصطلاحا Render میکنه
    توجه : در نوشتن تگ ها از حروف کوچک استفاده کنید.
    توجه : در نوشتن تگ ها از علامت <> کوچکتر و بزرگ تر استفاده می کنند.
    توجه : در نوشتن صفت ها از علامت " استفاده کنید، البپته الزامی به نوشتن حتما " این علامت نیست اما شما این قانون رو از الان برا خودتون بگذارید.
    نمونه یک تگ رو براتون اینجا مینویسم تا بدونید منظور از تگ چیه.

    <h1 class="header">عنوان شماره 1</h1>

    enlightened h1 یک تگ هست و به مرورگر میفهمونه که داخل این تگ همیشه یک عنوان(title) وجود داره.
    enlightened کلمه class یک صفت برای تگ h1 هست
    enlightened کلمه بین " که header هست یک مقدار صفت برای تگ h1 هست
    enlightened و در نهایت عنوان شماره 1، مقدار اصلی تگ h1 هست که شما این متن رو با عنوان تگ h1 به مرورگر نشان میدهید

    نکته قابل توجه این هست که بعضی از تگ ها در برگیرنده مقدار هستند و بعضی ار تگ ها ثابت هستند و مقدار درون خوردشون نمیپذیرند
    مثال تگ br مخفف break معادل شکستن خط هست که بصورن ثابت نوشته میشه و نمیتونه مقداریو درون خودش نگهداره و نوشتارش این شکلیه :

    <br/>

    اما اکثر تگ ها مقدار درن خودشون نگه میدارن، مثال h1 که در بالا توضیح دادیم.

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

    <html>
    	<head>
            هدر ارسال شونده به مرورگر
    	</head>
    	<body>
            محتوای وبسایت
    	</body>
    </html>

    سند اولیه HTML به همین صورت نوشته میشه و دارای یک تگ html  که دارای دو تگ زیرمجموعه head , body هست.
    enlightened html : که شروع کننده سند HTML هست
    enlightened head : یک تگ برای ارسال اطلاعات قبل از لود شدن و نمایش صفحه به کار میره و به مرورگر میفهمونه که شما قبل از اجرای دستورات در body، میتونی اطلاعات داخل head رو لود کنی. خیلی تگ وجود داره در تگ head اما این تگها فقط جنبه اطلاعات پیش بارگذاری یا منابع صفحه هستند، مثل نام صفحه، کد پیج صفحه، نوع نمایش عمودی افقی، توضیحات، عکس صفحه، لینک، کمک کننده های موتور جستجو و ....
    مثال پر کاربردش این میتونه باشه که شما مثلا Style یا Script های صفحه رو لود کن و بعد از فراخوانی اونها، محتویات اصلی رو به کاربر نشان بده.
    enlightened body : این تگ ، تگ اصلی نمایش دهنده اطلاعات به کاربر هست. مرور گر هر اطلاعاتی که در این تگ وجود داشته باشه رو به کاربر نمایش میده
    نکته : Style ها و Script های درون صفحه میتونه در تگ body وجود داشته باشه اما تفاوتش با Head اینه که همزمان با اجرای دستورات و نمایش به کاربر، کتابخانه های مورد نیاز لود میشه و این کار باعث در هم ریختگی فرامین برای مرورگر میشه، در کل کار غلطی نیست، اما حتی الامکان کتابحانه هایی که لزوما Static هستند رو در Head قرار بدین.

    محیط ویرایش اسناد HTML

    دقت داشته باشید برای نوشتن و ویرایش اسناد HTML هیچ نرم افزار انحصاری وجود نداره و کافیه با هین نرم افزار Notepad یا یه کم قوی تر Notepad++ یا دیگه خیلی حرفه ای Dream Viewer یا دیگه خیلی خفن تر Visual Studio استفاده کنید. حالا با هر کدوم که راخت تر هستین، هر کدوم از این نرم افزار های یک جور ویژگی خاص خودشون رو دارند. پس یه کم تحقیق کنید در موردشون و بهترین رو برای خودتون انتخاب کنید.

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

    صلی تگ

    بدنه اصلی HTML رو مجموعه ای از تگ ها تشکیل میدن. تگ چیه ؟ تگ یعنی نشونه، علامت، اینجا مفهومش اینه که : یک بخش به همراه نشانه
    HTML این نشانه ها رو شناسایی میکنه و تبدیل میکنه به گرافیک های بصری، اصطلاحا Render میکنه
    توجه : در نوشتن تگ ها از حروف کوچک استفاده کنید.
    توجه : در نوشتن تگ ها از علامت <> کوچکتر و بزرگ تر استفاده می کنند.
    توجه : در نوشتن صفت ها از علامت " استفاده کنید، البپته الزامی به نوشتن حتما " این علامت نیست اما شما این قانون رو از الان برا خودتون بگذارید.
    نمونه یک تگ رو براتون اینجا مینویسم تا بدونید منظور از تگ چیه.

    <h1 class="header">عنوان شماره 1</h1>

    enlightened h1 یک تگ هست و به مرورگر میفهمونه که داخل این تگ همیشه یک عنوان(title) وجود داره.
    enlightened کلمه class یک صفت برای تگ h1 هست
    enlightened کلمه بین " که header هست یک مقدار صفت برای تگ h1 هست
    enlightened و در نهایت عنوان شماره 1، مقدار اصلی تگ h1 هست که شما این متن رو با عنوان تگ h1 به مرورگر نشان میدهید

    نکته قابل توجه این هست که بعضی از تگ ها در برگیرنده مقدار هستند و بعضی ار تگ ها ثابت هستند و مقدار درون خوردشون نمیپذیرند
    مثال تگ br مخفف break معادل شکستن خط هست که بصورن ثابت نوشته میشه و نمیتونه مقداریو درون خودش نگهداره و نوشتارش این شکلیه :

    <br/>

    اما اکثر تگ ها مقدار درن خودشون نگه میدارن، مثال h1 که در بالا توضیح دادیم.

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

    <html>
    	<head>
            هدر ارسال شونده به مرورگر
    	</head>
    	<body>
            محتوای وبسایت
    	</body>
    </html>

    سند اولیه HTML به همین صورت نوشته میشه و دارای یک تگ html  که دارای دو تگ زیرمجموعه head , body هست.
    enlightened html : که شروع کننده سند HTML هست
    enlightened head : یک تگ برای ارسال اطلاعات قبل از لود شدن و نمایش صفحه به کار میره و به مرورگر میفهمونه که شما قبل از اجرای دستورات در body، میتونی اطلاعات داخل head رو لود کنی. خیلی تگ وجود داره در تگ head اما این تگها فقط جنبه اطلاعات پیش بارگذاری یا منابع صفحه هستند، مثل نام صفحه، کد پیج صفحه، نوع نمایش عمودی افقی، توضیحات، عکس صفحه، لینک، کمک کننده های موتور جستجو و ....
    مثال پر کاربردش این میتونه باشه که شما مثلا Style یا Script های صفحه رو لود کن و بعد از فراخوانی اونها، محتویات اصلی رو به کاربر نشان بده.
    enlightened body : این تگ ، تگ اصلی نمایش دهنده اطلاعات به کاربر هست. مرور گر هر اطلاعاتی که در این تگ وجود داشته باشه رو به کاربر نمایش میده
    نکته : Style ها و Script های درون صفحه میتونه در تگ body وجود داشته باشه اما تفاوتش با Head اینه که همزمان با اجرای دستورات و نمایش به کاربر، کتابخانه های مورد نیاز لود میشه و این کار باعث در هم ریختگی فرامین برای مرورگر میشه، در کل کار غلطی نیست، اما حتی الامکان کتابحانه هایی که لزوما Static هستند رو در Head قرار بدین.

    محیط ویرایش اسناد HTML

    دقت داشته باشید برای نوشتن و ویرایش اسناد HTML هیچ نرم افزار انحصاری وجود نداره و کافیه با هین نرم افزار Notepad یا یه کم قوی تر Notepad++ یا دیگه خیلی حرفه ای Dream Viewer یا دیگه خیلی خفن تر Visual Studio استفاده کنید. حالا با هر کدوم که راخت تر هستین، هر کدوم از این نرم افزار های یک جور ویژگی خاص خودشون رو دارند. پس یه کم تحقیق کنید در موردشون و بهترین رو برای خودتون انتخاب کنید.

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

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