طراحی سایت – آموزش html – مقدمه

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

HTML مخفف Hyper Text Markup Language هست ، اگه معنیشو نمیدونید معنیش میشه زبان نشانه گذاری فرا متنی!!!
زبان نشانه گذاری میگن چون ساختار دستوراتش بر اساس یکسری نشانه tag هست و فرامتنی میگن چون از متنی که تویه کاغذ نوشته میشه توانایی بیشتری داره…

HTML زبانیه که به مرورگر میگه که صفحات رو باید چطور نمایش بده! میشه گفت داره صفحات وب رو توصیف میکنه.

 وقتی این همه برنامه برای ساخت صفحات وب هست چرا باید خودمو تو دردسر بندازم اچ تی ام ال یاد بگیرم!؟؟؟؟

اول اینکه html بسیار ساده هست و خیلی سریع میتونید اونو یاد بگیرید و بهش مسلط بشید و دوم اینکه وقتی که جلوتر بریم میبینیم که موقع نوشتن خیلی از برنامه های تحت وب مثلا با php نیاز دارید که با html هم آشنا باشید. یادتون باشه هرچی که قرار باشه کاربر ببینه باید معمولا در صفحه HTML نمایش داده بشه!

مواد لازم:
هیچی! همون برنامه notepad تویه ویندوز کافیه! البته اگر برنامه notepad++ رو دانلود کنید میتونید تگ های html رو به صورت رنگی ببینید و امکانات بیشتری داشته باشید!

خوبه شروع کنیم دیگه! تویه notepad(++) یه سند جدید ایجاد کنید و توش کد زیر رو بنویسید:

<!DOCTYPE html>
<html>
<head>
     <title>In Onvane Safhast</title>
</head>
<body>
     In Ham Matne Safheye Avvle!
     Vay Khoda Daram Html Yad Migiram....
     <a href="http://webfocus.ir/">Webfocus.ir</a>
</body>
</html>

حالا اونو با یه نام دلخواه ذخیره کنید مثلا من به نام safeheye1.html ذخیره کردمش! حالا باید نتیجه تلاشمون رو ببینیم فقط کافیه که روی فایلمون (منظورم safheye1.html) دابل کلیک کنیم! اگر نتوستید صفحه رو باز کنید برید مرورگر رو باز کنید و از منوی File گزینه Open یا Open File رو انتخاب کنید و بعد هم فایلی که ایجاد کردید رو انتخاب و باز کنید!

اگه تا اینجا رو با دقت خونده باشید به نکات زیر حتما رسیدید:

1. هر صفحه html از یک فایل متنی تشکیل میشه که با پسوند html یا htm ذخیره میشه!
2. دستورات html ساختاری به صورت <دستور/>……<دستور> دارن!
3. ساختار هر فایل html  به صورت زیر هست که از دو قسمت اصلی تشکیل میشه: head  که توش عنوان title و یکسری اطلاعات دیگه قرار میگیره و body که توش عناصر صفحه قرار میگیرن!

<html>
    <head>
    </head>
    
    <body>
    </body>
</html>

4. دستورات html خودشون متن هستند و برای اجرا باید به کامپیوتر کاربر منتقل بشن. میتونید این موضوع رو امتحان کنید فقط کافیه تویه همین صفحه که هستند راست کلیک کنید و بعد گزینه View Source یا View Page Source رو انتخاب کنید. واسه همینه که میگن html یک زبان سمت کاربر هستش!
5. توانایی متون html از متون کاغذی خیلی بیشتره به عنوان مثال دیدید که با کلیک رویه کلمه Webfocus.ir صفحه اول سایت وب فوکوس بازشد!

شما ممکن است این را هم بپسندید

پاسخ دهید

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