HTML مخفف Hypertext Markup Language است و یک زبان نشانه گذاری استاندارد است که برای ایجاد صفحات وب استفاده می شود. HTM; ساختار اولیه صفحات وب را فراهم می کند. در HTML از مجموعهای از عناصر و تگها برای توصیف ساختار یک صفحه وب و محتوای آن، از جمله سرفصلها، پاراگرافها، پیوندها، تصاویر، ویدیوها و موارد دیگر استفاده میکنیم. HTML یک زبان نسبتاً ساده برای یادگیری است و برای هر کسی که می خواهد کد نویسی وب را یاد بگیرد HTML اولین گام و ضروری است.
برای درک بهتر یک وب سایت را تشبیه می کنیم به بدن انسان HTML ساختار اولیه یا چهارجوب و اسکلت وب سایت شما را تشکیل می دهد پس در نتجه HTML به تنهایی برای ساخت یک وب سایت کافی نیست در کنار HTML زبان های دیگری همچون CSS , JS برای ما در ساخت یک وب سایت کامل و چیزی که کاربر می بیند کمک می کنند مثلا CSS به وب سایت رنگ و استایل می دهد عین لباس و پوست و مو در بدن انسان و در همین حال JS نقش هوشمند سازی و هدایت وب سایت را بر عهده دارد عین مغز و عصاب در انسان
حال برای یادگیری طراحی سایت زبان HTML اولین گام می باشد.
تگهای HTML (HyperText Markup Language) برای نشان دادن ساختار و محتوای صفحات وب استفاده میشوند. این تگها دارای دو بخش میباشند: بخش باز شدن تگ که با یک علامت “<” شروع میشود و نام تگ را دنبال میکند، و بخش بستن تگ که با یک علامت “</” شروع میشود و نام تگ را دنبال میکند. بین این دو بخش محتوایی که باید به عنوان محتوای تگ نمایش داده شود، قرار میگیرد.
برای مثال، تگ <p> برای نمایش پاراگرافها در HTML استفاده میشود. تگ باز شدن آن به صورت <p> و تگ بستن آن به صورت </p> نوشته میشود. همچنین، برای تعریف عنوان صفحه از تگ <title> و برای اضافه کردن تصویر از تگ <img> استفاده میشود و…
کد نویسی html در چهارچوب بالا انجام خواهد شد کد های بالا در تمامی اسناد HTML وجود دارند و چهارچوب اصلی را تشکیل می دهند که تگ ها اضافه بین این ها اضافه می شود. حالا با دقت به کد بالا نگاه کنید تا تک تک برسی کنیم:
<!DOCTYPE html>
به مروگر مشخص می کند که این سند یک سند HTML5 است.
تگ <html>
عنصر اصلی یک صفحه HTML است. و در ابتدای صفحه باز و در انتها بسته می شود.
این <head>
تگ حاوی اطلاعات متا در مورد صفحه HTML است.
این <body>
نگ بدنه سند را تعریف می کند و کد های تمامی محتویات قابل مشاهده در این بخش است، مانند سرفصل ها، پاراگراف ها، تصاویر، لینک ها، جداول، لیست ها و غیره.
لHTML چندین گزینه برای اضافه کردن عنوان و قالب بندی متن ارائه می دهد. تگ های Headings برای ایجاد سرفصل ها و عنوان ها در صفحه وب استفاده می شوند تگ <p> برای پاراگراف ها و…
1. تگ های عنوان ( <h1>
به <h6>
): HTML شش سطح از تیتر را ایجاد می کنند <h1>
که مهم ترین و <h6>
کم اهمیت ترین هستند. می توانید از این تگ ها برای ایجاد عنوان و عنوان فرعی برای صفحات وب خود استفاده کنید.
2. تگ پاراگراف ( <p>
): از تگ<p>
برای ایجاد پاراگراف های متن استفاده می شود. می توانید از آن برای گروه بندی چندین جمله یا کلمه با هم استفاده کنید تا یک بلوک متن ایجاد کنید.
3. تگ پررنگ ( <b>
): از <b>
تگ برای پررنگ کردن متن استفاده می شود. اغلب برای برجسته کردن کلمات یا عبارات مهم استفاده می شود.
4. تگ کج ( <i>
): از <i>
تگ برای ایتالیک کردن متن استفاده می شود. اغلب برای تأکید یا تأکید بر کلمات یا عبارات خاص استفاده می شود.
5. تگ Underline ( <u>
): از این <u>
تگ برای خط کشیدن زیر متن استفاده می شود. اغلب برای برجسته کردن یا تأکید بر کلمات یا عبارات استفاده می شود.
6. تگ Strikethrough ( <s>
یا <strike>
): از تگ <s>
یا <strike>
برای ایجاد افکت متن خطی استفاده می شود. اغلب برای نشان دادن اینکه متن حذف شده یا دیگر معتبر نیست استفاده می شود.
در HTML، میتوانید از کامنتها برای اضافه کردن یادداشتها و توضیحاتی که قابل مشاهده برای کاربران نیستند، استفاده کنید. کامنتها در HTML با علامت “<!–” شروع میشوند و با علامت “–>” پایان مییابند و محتوای آنها به عنوان توضیح برای کد میتوانند استفاده شوند.
به عنوان مثال، اگر میخواهید یک توضیح کوتاه درباره یک بخش خاص از صفحهی HTML بگذارید، میتوانید از کامنت استفاده کنید. برای نمونه، کد زیر نحوه استفاده از کامنت در HTML را نشان میدهد:
افزودن تصاویر و رسانه در HTML یک فرآیند ساده است. در اینجا مراحل آن را برسی می کنیم:
1. از تگ <img>
برای افزودن تصویر استفاده کنید. تگ <img>
یک باز است و یعنی تگ بسته ندارد. بخش src
URL مسیر فایل تصویر را مشخص می کند. alt
ویژگی یک توصیف متنی جایگزین از تصویر ارائه میکند که در صورت بارگیری نشدن تصویر، نمایش داده می شود.
2. برای افزودن صدا یا ویدیو می توانید به ترتیب از تگ <audio>
و <video>
استفاده کنید . صفت src
URL مسیر فایل را مشخص می کند. تگ <source>
را در داخل تگ ها <audio>
و <video>
برای ارائه انواع فایل های قرار می دهیم
ایجاد لینک در HTML یک فرآیند ساده است. جلوتر برسی می کنیم
1.از تگ<a>
برای ایجاد لینک استفاده کنید . صفتhref
نشانی اینترنتی مقصد را مشخص می کند که کاربر با کلیک بر روی پیوند به آن هدایت می شود.
2. برای ایجاد یک لینک داخلی در وب سایت خود، می توانید از یک URL نسبی استفاده کنید. به عنوان مثال، اگر می خواهید به صفحه ای به نام “about.html” که در همان پوشه فایل HTML فعلی شما قرار دارد پیوند دهید، می توانید از کد زیر استفاده کنید:
در HTML، فرم ناحیه ای است که کاربر می تواند اطلاعاتی را وارد کند که می تواند برای پردازش به سرور ارسال شود. فرمها برای جمعآوری و پردازش ورودیهای کاربر برای اهداف مختلف مانند تماس با مالک وبسایت، پرداخت یا ثبتنام در خبرنامه ضروری هستند. یک فرم به کاربران اجازه می دهد تا داده ها را وارد کرده و با یک وب سایت تعامل داشته باشند.
در اینجا مثالی از یک فرم اصلی آورده شده است:
در این مقاله سعی بر این شد که به چیستی و مقدمه ایی از html بپردازیم و سپس به یکسری از تگ های اولیه و مهم html پرداختیم. ممنون که تا اینجا همراهی کردید.
در وب سایت جویا لرن دوره ایی با عنوان دوره مقدماتی تا پیشرفته HTML توسط خانوم رومینا قربانی به صورت کاملا رایگان در حال ضبط می باشد و در طول دوره پشتیبانان سایت از طریق تیکیت پاسخگوی سوالات تخصصی شما هستند. با مراجعه به لینک زیر می توانید در دوره شرکت کنید.