ویرگول
ورودثبت نام
مهدی توکلی
مهدی توکلیمتخصص سئو هستم. اطلاعاتم را با شما به اشتراک می گذارم. وبلاگ شخصی من: https://mahditavakoli.com
مهدی توکلی
مهدی توکلی
خواندن ۲ دقیقه·۲ سال پیش

مقدمات HTML: راهنمایی برای شروع کار با زبان برنامه‌نویسی HTML

مقدمه:

HTML (Hypertext Markup Language) یکی از اصلی‌ترین زبان‌های برنامه‌نویسی است که برای ساختاردهی و نمایش اطلاعات در وب استفاده می‌شود. با استفاده از تگ‌ها و عناصر مختلف، می‌توانید صفحات وب را طراحی و ساخت کنید. در این مقاله، به معرفی مفاهیم اولیه HTML می‌پردازیم و برخی از قسمت‌های مهم آن را به طور کامل آموزش می‌دهیم.

1. ساختار اولیه یک صفحه HTML:

هر صفحه HTML باید به یک ساختار اولیه توسط تگ‌ها (tags) شروع شود. دو تگ اصلی در این مرحله مورد نیاز هستند: `<html>` و `<head>`.


```html

<!DOCTYPE html>

<html>

<head>

<title>عنوان صفحه</title>

</head>

<body>

<!-- اینجا قسمت محتوای صفحه قرار می‌گیرد -->

</body>

</html>

```

مقاله پیشنهادی: آموزش HTML Links

- `<!DOCTYPE html>`: این خط به مرورگر اطلاع می‌دهد که از نسخه‌ی HTML5 استفاده می‌شود.

- `<html>`: تگ اصلی صفحه HTML است و تمام محتوای صفحه درون آن قرار می‌گیرد.

- `<head>`: این تگ شامل اطلاعات مربوط به صفحه است که در بخش نمایشی اصلی قرار نمی‌گیرد، مانند عنوان صفحه.


2. عنوان صفحه:

عنوان صفحه در تگ `<title>` درون بخش `<head>` قرار می‌گیرد. این عنوان در نوار عنوان مرورگر نمایش داده می‌شود و مهم است برای بهبود سئو و شناسایی صفحه توسط موتورهای جستجو.


```html

<head>

<title>عنوان صفحه</title>

</head>

```

مقاله پیشنهادی: HTML Paragraphs

3. محتوای صفحه:

محتوای اصلی صفحه در بخش `<body>` قرار می‌گیرد. این بخش شامل عناصر HTML است که به کاربران نمایش داده می‌شود.


```html

<body>

<h1>سلام، دنیا!</h1>

<p>این یک پاراگراف است.</p>

<a href="https://example.com">لینک به مثال</a>

</body>

```


- `<h1>`: تگ عنوان اصلی است و برای ساختاردهی به عناوین استفاده می‌شود. عنوان‌ها از `<h1>` تا `<h6>` قابل استفاده هستند.

- `<p>`: این تگ برای ساختاردهی به پاراگراف‌ها استفاده می‌شود.

- `<a href="https://example.com">`: تگ لینک، به صفحات دیگر یا منابع خارجی لینک می‌دهمراجعه کنید. هر لینکی که درون این تگ قرار داده می‌شود، به آدرس مقصد لینک می‌شود.

4. تصاویر:

برای اضافه کردن تصاویر به صفحه، از تگ `<img>` استفاده می‌شود. این تگ باید دارای مشخصات `src` (آدرس تصویر) و `alt` (متن جایگزین تصویر برای قرائتگرها) باشد.


```html

<img src="image.jpg" alt="توضیح تصویر">

```

5. جدول‌ها:

تگ `<table>` برای ساختاردهی به جدول‌ها استفاده می‌شود. این تگ شامل تگ‌های دیگری مانند `<tr>` (ردیف) و `<td>` (سلول) است.


```html

<table>

<tr>

<th>عنوان ستون 1</th>

<th>عنوان ستون 2</th>

</tr>

<tr>

<td>مقدار 1</td>

<td>مقدار 2</td>

</tr>

</table>

```


- `<tr>`: تگ ردیف جدول است.

- `<th>`: تگ سرستون جدول است و برای عناوین ستون‌ها استفاده می‌شود.

- `<td>`: تگ سلول جدول است و برای مقادیر جدول استفاده می‌شود.

نتیجه‌گیری:

در این مقاله، به معرفی مفاهیم اولیه HTML پرداختیم و نمونه‌هایی از قسمت‌های مهم آن را آموزش دادیم. با این اطلاعات، شما می‌توانید صفحات وب ساده‌ای را با استفاده از HTML طراحی و ساخت کنید. البته، HTML دارای بسیاری از عناصر و ویژگی‌ها است که در این مقاله به آن‌ها پرداخته نشد. برای به‌دست آوردن اطلاعات بیشتر، بهتر است به منابع آموزشی مربوطه مراجعه کنید.

آموزش طراحی سایتhtml
۰
۰
مهدی توکلی
مهدی توکلی
متخصص سئو هستم. اطلاعاتم را با شما به اشتراک می گذارم. وبلاگ شخصی من: https://mahditavakoli.com
شاید از این پست‌ها خوشتان بیاید