آموزش طراحی سایت(جلسه ۱) : html چیست؟

HTML چیست ؟

دورره آموزش طراحی سایت با HTML

– HTML به معنای زبان نشانهگذاری ابرمتن است.
– یعنی هر چند ما در این زبان یک سری متن را تایپ میکنیم اما این متون، معنایی فراتر از ابرمتن متن دارند.
– در این دوره ، HTML5 تدریس میشود.
– هر چند html به حروف کوچک و بزرگ حساس نیست اما بهتر است نام تگها و نام صفات با حروف کوچک انگلیسی نوشته شوند.
سادهترین برنامه به زبان HTML :

<!DOCTYPE html>
 <html>
 <head> 
<title>First Page</title>
 </head>
 <body> 
<h1 align="center">Hello World!</h1>
 </body> 
</html>

Hello World!

اولین گام در طراحی سایت:
اولین گام در شروع به طراحی، ایجاد یک پوشه برای آن سایت است. این پوشه میتواند به هر نامی انتخابشود اما چه بهتر که همنام دامنهی سایت باشد؛ مثلاً aftab.cc .

اما نکته مهم این است که با خودتان قراردادکنید که هر چیزی که قرار است در سایت شما استفاده شود، باید به این پوشه منتقل شود. عکسها، ویدئوها،اصوات و … همه باید ابتدا به این پوشه منتقل شوند سپس در کدنویسی به آنها اشاره شود. یعنی میشودیکی در درایو C شما باشد، یکی در درایو D شما، یکی روی دسکتاپ شما!!در این پوشه، زیرپوشههای مرتبط با محتوای خود بسازید. مثلاً پوشهای به نام img برای عکسهای سایت.پوشهای به نام video برای ویدئوهای سایت…

نحوهی اجرای کدهای HTML :

برنامه بالا را در NotePad تایپ کرده و در پوشه سایت که قبلاً ساختهایم، با نام index.html و باEncoding ، UTF-8 ذخیره میکنیم. )توجه داشته باشید که Encoding پیشفرض یعنی ANSI زبانفارسی را پشتیبانی نمیکند.(۱ Hyper Text Markup Language

مفهوم tag در طراحی سایت :

– تگ یعنی برچسب
– ما عناصری داریم؛ مانند عکس، متن، ویدئو و … قرار است آنها را با برچسبها به دیوار سایت خودبچسبانیم.
– در HTML محدودهی عناصر با تگها مشخص میشوند.مانند {}و () که برای مشخص کردن یکمحدوده در زبان هستند

تگها و اجزای تشکیل دهنده آن:

Hello world!

– صفتها به تگ دستور میدهند که به چه روشی عمل کنند. در html درج صفتها به این صورت
است:

عنصر/ Element
Attribute / صفت
Content / محتوا
Closing tag
Opening tag
name="value"

نام صفت =”مقدارصفت ”
– مقدار هر صفت باید در دابلکوتیشن “قرار بگیرد.
– قبل از نام هر صفت، یک فاصله بزنید.

فضای سفید در طراحی سایت :

در HTML هر تعداد فاصله Space که بیش از یک فاصله باشد، یک فاصله به حساب میآید. یعنی به طور مثال اگر در بخش کد نویسی بین دو کلمه، ۱۰۰ فاصله وارد کنیم در مرورگر یک فاصله بیشتر نمایش داده نمیشود. برای درج فاصله های بیشتر از یکی، از عبارت استفاده کنید.