loading...
گرافیک فا
آخرین ارسال های انجمن
‏‎Admin‎ بازدید : 693 جمعه 25 شهریور 1390 نظرات (0)
آموزش HTML – -Graphicfa.r98.irجلسه اول

سلام دوستان

سری آموزش HTML از امروز آغاز شد و هر جلسه به بخشی از این سری آموزشی پرداخته می شود .سعی کرده ام حجم زیادی از مباحث رو به مثال های مختلف اختصاص بدم و همه چیز از پایه توضیح داده شده است .

اگر می خواهید وارد دریای بیکران طراحی وب شوید سری آموزش HTML نقطه آغاز شما خواهد بود .

پیش نیاز شما برای این دوره آشنایی با زبان شیرین فارسی :) و کمی هم آشنایی با سیستم عامل هست و نه چیز دیگر . پس نگران نباشید چون همه چیز از پایه یا به قول خارجیا from scratch گفته شده و فرض کرده ام که شما اصولا تا حالا از طراحی وب فقط اسمش را شنیده اید .(اگر هم نشنیده بودید خوب حالا شنیدید :) )

یک نگاه به صفحه ای که دارید می خوانید بیندازید ، در سمت راست سایت یک منو هست و چندین عکس در قسمت های مختلف قرار دارند و همچنین لینک ها را داریم و هر کدام از این اجزا در سر جای خودشان قرار گرفته اند و توسط مرورگر (یا browser) شما نمایش داده شده اند(مثلا در firefox یا IE) . آیا تا به حال از خودتون پرسیده اید که مرورگر از کجا میفهمه که مثلا فلان عکس را در کجا قرار دهد و یا یک متن را به چه رنگی نمایش دهد و به بیان دیگر مرورگر از کجا میفهمه که در صفحه سایت چه اجزایی قرار دارند و هر جزء در کجا قرار دارد .

همه این سوال ها یک پاسخ دارد : با استفاده از HTML

HTML مخفف عبارت Hyper Text Markup Language و به معنای زبان نشانه گذاری می باشد .یعنی ما با HTML می توانیم عناصر صفحه وب و محل قرارگیری آنها را تعیین کنیم و یا اینکه ویژگی های آنها را مانند رنگ متن تغییر دهیم .

روی همین صفحه کلیک راست کنید و بر روی view sourceکلیک کنید تا کد HTML پشت صفحه را ببینید .در واقع مرورگر شما از سرور این کد HTML را دریافت کرده و با استفاده از اون صفحه وب را به شما نمایش داده است .

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

خوب وقت آن را رسیده است که دستهایتان را گرم کنید و چند خط کد بنویسید .

نرم افزار notepad را باز کنید و کدهای زیر را درون آن بنویسید :

<html>
<head>
<title>
اولین مثال
</title>
</head>
<body>
این اولین صفحه وب من است
</body>
</html>

سعی کنید کدها را کپی نکنید و خودتان بنویسید .حال بر روی file و سپس sva as کلیک کنید و صفحه را با نام firstsample.html در مکان دلخواهتان ذخیره کنید .پسوند html. مربوط به فایل های html می باشد .حال صفحه وبی را که ساختید از جایی که آن را ذخیره کردید اجرا کنید و اولین صفحه وبتان را مشاهده کنید و لذت ببرید .دقت کنید که به علت استفاده از زبان فارسی encoding را روی UTF-8 قرار دهید .

همونطور که مشاهده می کنید کد ما از عناصری تشکیل شده که بین دو کاراکتر < و > می باشد ، به این عناصر تگ (tag) می گوییم .اکثر تگ ها زوج هستند یعنی وقتی که باز شدند باید یکجا تمام شوند و بعضی از تگ ها فرد هستند یعنی دیگر به طور جداگانه بسته نمی شوند .در کدی که ما نوشتیم همه تگ ها زوج هستند .اولین تگ ما تگ <html> هست که در آخر کد ما این تگ به شکل <html/> بسته شده است .پس برای بستن یک تگ بعد از “>” یک کاراکتر “/” اضافه می شود .در درون تگ <html> ما تگ های <head> و <body> را داریم .در درون تگ head اطلاعاتی مربوط به صفحه مثل عنوان صفحه قرار دارد و همونطور که ملاحظه میکنید تگ <title> درون تگ <head> قرار دارد و در درون آن عنوان صفحه قرار گرفته است .درون تگ <body> مربوط به کلیه عناصری است که قرار است در صفحه وب ما نمایش داده شود و کلیه متن ها ، عکس ها و لینک ها و … درون این تگ قرار خواهد گرفت .در این مثال ما درون تگ <body> یک متن ساده را نوشتیم .

متن و عنوان صفحه را به دلخواه تغییر دهید و بعد از ذخیره ، صفحه وب خودتان را refresh کنید و صفحه جدید را مشاهده کنید.برای ذخیره سریعتر کد html که در محیط notepad نوشتید می توانید از ترکیب دکمه های CTRL + S استفاده کنید .

خوب اولین جلسه آموزش HTML خیلی زود به پایان رسید و امیدوارم استفاده کرده باشید .

منبع :kamyabi.us

مطالب مرتبط
ارسال نظر برای این مطلب

کد امنیتی رفرش
درباره ما
Profile Pic
از اینکه این سایت را انتخاب کردید از شما عزیزان ممنونیم این سایت راه اندازی شده تا بتونیم بهترین ابزار و آموزش هایی که برای شما دوستان وجود دارد را از سرتاسر وب جمع کنم و به صورت رایگان در اختیار شما عزیزان قرار دهیم.
اطلاعات کاربری
  • فراموشی رمز عبور؟
  • لینک دوستان
  • بیر وب دیزایین
  • رایان موب
  • دانلود فيلهاي ايران و جهان با بهترين كيفيت
  • کلفت کردن آلت مردان
  • ๑۩۞۩๑بهترينهاي اينترنت๑۩۞۩๑
  • دانلودستان
  • مطالب آموزنده و جالب
  • نت گراف
  • سایت تفریحی البرز پاتوق
  • >> CGAREF
  • film2film
  • گرافیک برای تو
  • فروشگاه ShopBox
  • جوک و sms
  • آلامتو
  • برترین سایت طراحی در ایران
  • تفریحی و سرگرمی.مطالب 18+
  • سئو قالب
  • فقط گرافیکـ
  • .: ابــــــــزار وبــلــاگ :.
  • برو شنبه صبح بیا
  • آهنگسازی با اف ال استودیو
  • فارس گرافیک | مرجع گرافیک و طراحی ایرانیان
  • بست رنكl افزايش بازديد وبلاگ و سايت
  • نويان ترفند
  • هک و امنیت و مبانی کامپیوتر
  • یاور دانلود
  • دنیای طراحی و فتوشاپ
  • برنامه نویس ایرانی
  • کاریز گرافیک
  • کوتاه کننده لینک
  • بهینه سازی وب سایت
  • خرید شارژ ایرانسل
  • تبلیغات رایگان
  • فروشگاه سنگهای معدني زينتي
  • بهترين سايت تفريحي ايران
  • تبادل لینک
  • دایرکتوری تبادل لینک
  • تبادل لینک
  • وب سایت پاداش
  • فروشگاه بزرگ پیام گرافیک
  • بزرگترین و بهترین فروشگاه اینترنتی
  • هکر ایرانی
  • هیجان دانلود
  • طراحی رایگان
  • بزرگترین سایت دانلود ابزار گرافیکی
  • دانلود سریال جدید
  • قیمت روز خودروی شما
  • آخرین مطالب ارسال شده
  • نظرسنجی
    بیشتر دوست دارید چه مطالبی در سایت قرار بگیرد ؟
    پیوندهای روزانه
    آمار سایت
  • کل مطالب : 306
  • کل نظرات : 180
  • افراد آنلاین : 5
  • تعداد اعضا : 457
  • آی پی امروز : 139
  • آی پی دیروز : 133
  • بازدید امروز : 392
  • باردید دیروز : 448
  • گوگل امروز : 1
  • گوگل دیروز : 2
  • بازدید هفته : 3,660
  • بازدید ماه : 11,784
  • بازدید سال : 71,353
  • بازدید کلی : 1,174,977