شروع کار با HTML
چه چیزی نیاز دارید.
در این سایت شما به هیچ ابزاری برای یاد گیری HTML نیاز ندارید.
- به هیچ ویرایشگر HTML ی نیاز ندارید.
- به هیچ سرویس دهنده وبی نیاز ندارید.
- به هیچ وب سایتی نیاز ندارید.
نگارش HTML
HTML می تواند توسط ویرایشگرهای مختلفی مثل Dreamweaver و Visual Studio نگارش و ویرایش شود.
اما در این خود آموز ما به ویرایشگر ساده متنی (مثل Notepad) برای نگارش HTML نیاز داریم. ما بر این عقیده ایم که استفاده از یک ویرایشگر ساده متنی بهترین راه برای یادگیری HTML است.
وب آزمایشی خود را ایجاد کنید.
اگر می خواهید صفحه ای آزمایشی را در رایانه خود ایجاد کنید، تنها باید سه فایل زیر را روی desktop خود کپی کنید.
روی هر یک از لینک های زیر راست کلیک نمایید و گزینه "save target as" یا "save link as" را انتخاب نمایید.
بعد از اینکه فایل های بالا را کپی کردید، می توانید با دابل کلیک روی فایل "mainpage.htm" نخستین صفحه وب خود را در عمل ببینید.
از وب آزمایشی خود برای آموزش استفاده کنید.
ما به شما پیشنهاد می کنیم که هر چه را که از این سایت آموختید با ویرایش فایل وب خود به وسیله یک ویرایشگر متن (مثل Notepad) تجربه کنید.
توجه: اگر وب آزمایشی شما حاوی تگ های HTML است که آنها را نیاموخته اید ناراحت نشوید. شما در فصل بعد همه چیز را در این مورد خواهید آموخت.
پسوند HTM یا HTML
هنگامی که یک فایل HTML را ذخیره می کنید، می توانید از پسوند html یا htm استفاده کنید. تفاوتی نمی کند، این بستگی به شما دارد.
آموزش تصویری مطلب بالا (فیلم آموزش HTML) |
|---|
| درس شماره 2 (شروع کار با HTML) زمان فیلم: 14:58 |
|
خرید و دانلود مستقیم فیلم آموزش HTML - حجم دانلود 766 مگابایت (کلیک کنید +) |
- نوشته شده توسط امیر پهلوان صادق
- بازدید: 126734
دیدگاه‌ها
سلام عالی
سلام
در HTML تگ متا چه کاربردی داره و مخفف چیست؟
سلام
تگ meta نوعاً برای مشخص کردن نویسنده، کلمات کلیدی، آخرین تغییرات، توضیحاتی در مورد صفحه و دیگر داده های Meta استفاده می شود. برای کسب اطلاعات بیشتر به لینک زیر مراجعه فرمایید:
beyamooz.com/html/138-advanced/355-%D8%B9%D9%86%D8%B5%D8%B1-head-%D8%AF%D8%B1-html
با سلام
توی این درس با تمرینی که انجام داده ام و سه صفحه ایجاد کردم . در صفحه سوم که همانطور که در درس گفته شده من به صفحات اول و دوم لینک داده ام . یکی از این لینکها بعد از کلیک بر روی آن به صفحه مورد نظر من می رود . اما لینک دوم وقتی که روی آن کلیک می شود . صفحه page not found ظاهر می گردد . لطفاً راهنمایی فرمایید با تشکر
سلام، مطمئنا آدرس لینک دوم را اشتباه تنظیم کرده اید. بنابراین در کد زیر به قسمت های قرمز رنگ توجه فرمایید:
<html>
<head>
<meta http-equiv="Con tent-Type" content="text/h tml; charset=UTF-8">
<meta name="GENERATOR " content="MSHTML 8.00.7600.16444">
</head>
<body style="direction:rtl">
<h1>این اولین صفحه HTML من است.</h1>
<p>با استفاده از تگ p می توان پاراگراف ها را در صفحه وارد کرد</p>
<a href="/page1.htm">این یک لینک به صفحه شماره 1 است.</a><br/>
<a href="/page2.htm">این یک لینک به صفحه شماره 2 است.</a><br/>
</body>
</html>
با سلام، وقتی متنی را در note pad فارسی تایپ میکنم موقع دیدن نتیجه در مرورگرها طور دیگری غیر از فارسی نمایش داده میشود، چه طور این مشکل را حل کنم، ممنون از راهنماییتون
برای ایجاد صفحات HTML با محتوای فارسی، یکی از دوتا کار زیر را انجام دهید:
1- اضافه کردن تگ meta: در قسمت head صفحه، یک تگ meta با ویژگی های زیر اضافه نمایید.
<meta http-equiv="con tent-type" content="text/h tml; charset=utf-8"/>
2- UTF-8: زمانی که می خواهید فایل HTML را در نات پد ذخیره کنید، گزینه encoding را با مقدار UTF-8 تنظیم نمایید.
نظرتون در مورد نرم افزار براکت چیه؟ بهتر از دریمه آیا؟ یا با همون دریم کار کنم؟
سلام. به نظر بنده به جای dreamweaver یا نت بینز یا هر ide دیگه، بهتره که از همین اوایل کار، با نرم افزار phpstorm کار کرد. چون که phpstorm به راحتی از git و گیتهاب و انواع فناوری های مدرن برای برنامه نویسی php پشتیبانی می کنه.
پسوند htmیاhtmlچیست؟
برای ذخیره کردن فایل های HTML از پسوند htm یا html استفاده می شود و هیچ فرقی بین دو پسوند مذکور وجود ندارد.
سلام. ببخشید من وقتی یه کلمه یا حرف انگلیسی میزارم وسط نوشته فارسیم بهم میزنه متنمو. راهکار های خودتونم اجرا کردم ولی باز هیچ تاثیری نداره
سلام، برای رفع مشکل، از خصوصیت زیر استفاده کنید:
style="direction:rtl"
با عرض سلام و خسته نباشید.
فیلم ارائه شده در مطلب بالا فوق العاده بود. خواستم تشکر کنم.
سلام ببخشید می خواستم بدونم کاربرد اچ تی اام ال در چی هست؟
من تازه شروع کردم و نمی دونم طراحی وب و کار با dream weaver چجوری هست .
ممنون میشم پاسخ بدید
سلام.
HTML در واقع یک زبان نشانه‌گذاری جهت نمایش در مرورگرهای وب هست. سایت‌هایی که شما در اینترنت می‌بینید، در نهایت به صورت HTML نشانه‌گذاری می‌شوند و در مرورگرها قابل نمایش می‌شن.
این زبان از تگ درست میشه و شما میتونید با یک ادیتور ساده این تگ‌ها رو ایجاد کنید. برای کار به صورت حرفه‌ای نیاز به نرم‌افزارهای بهتر جهت ویرایش هست که یکی از این نرم‌افزارها Dream Weaver هست.
سلام لطفا آموزش طراحی سایت با نرم افزار dream weaver v رو قرار بدید
با سلام.
دریم ویور یک نرم افزار برای طراحی سایت هست. گر چه امکان کدنویسی زبانهای سمت سرور رو هم به خوبی ساپورت میکنه، ولی بیشتر برای طراحی به کار میره تا برنامه نویسی.
برای این کار شما صرفا باید به زبانهای تحت وب مسلط باشید، نه خود نرم افزار. وقتی که به زبانهای طراحی سایت مثل HTML ، CSS و ... مسلط باشید، کار کردن با این نرم افزار خیلی سخت نیست.
با سلام و خسته نباشید ...وقتی بخوایم یک صفحه htmlرو به صفحه htmlدیگر لینک کنیم چی کار باید کنیم؟
با سلام و تشکر.
سوالتون خیلی معنی نداره. میتونید با استفاده از iframe یه صفحه html رو در یک صفحه html دیگه لود کنید.
اگه از php استفاده کنید، میتونید از Include استفاده کنید.
کمی بیشتر توضیح بدید.
سلام و خسته نباشید....من متن فارسی وقتی داخل notepadمینویسم و ذخیره می کنم؟؟؟؟؟؟ میشه هم داخل سند و هم وقتی با مرور گر باز می کنم چرا و چی کار باید کنم؟
من قسمت"وب ازمایشی خود را ایجاد کنید"نفهمیدم الان این که برای من باز شده یک صفحه ای با ویژوال استودیو که پایینش حالت هایhtml,body,h1 و....داره چیه؟با این باید چی کار کنیم؟اگر این وب هست پس اون چه ما تو notepadمینویسیم و با مرورگر باز میشه چیه؟
با سلام
برای نوشتن کدهای html نرمافزار های مختلفی مانند notepad,notepad ++,Dream Weaver و... است که ساده ترین آنها همان notepad است. هر چه نرم افزار پیشرفته تری را برای نوشتن کدها انتخاب کنیم امکاناتی که در اخیار ما قرار می گیرد بیشتر است.
در مورد سوالی که ذکر کردید برای رفع مشکل کافی است در هنگام ذخیره فایل مورد نظر در پنجره save گزینه Encoding را با UTF-8 تنظیم کنید.
فایلی که شما از قسمت بالا ذخیره می کنید یک نمونه ساده از یک صفحه وب است که میتوانید بعد از ذخیره کردن آن را با ویرایشگر notepad باز کرده و کد های موجود در ان را مشاهده و یا تغییر دهید.
چیزی که شما در notepad می نویسید نیز همان صفحه وب خودتان است. که در مراحل بعدی میتوانید آن را به یک صفحه کامل تبدیل کنید. فایل ذکر شده در اینجا فقط یک مثال برای درک بیشتر مطلب است.
http://www.w3schools.com/ شما نسخه فارسیشی؟؟!!!!!
با سلام
بیشتر مطالب سایت بیاموز ترجمه مطالب سایت w3schools است.
سلام
تشکر همین طور مطالب رو زیاد کنین
سلام!
من فایل هارو کپی کردم توی کامپیوترم اما هرچی کلیک میکنم باز نمیشه!
سلام، لطفاً چک کنید که پسوند فایل ها htm. یا html. باشد و هر سه فایل را بصورت کامل دانلود کنید.
salam! bebeakhsid site shoma kheili khube ! fahgat 1 soal! man motevaje nashodam vase piade kardane codehaye note pade agar nakhaim az vebe azmayeshi estefade konim ? chetor bas piade sazi konim? tozih midn lotfan?...
sepasgozaram !!! mamnun :)
سلام
برای اجرای مثال های "خودتان امتحان کنید" در کامپیوتر شخصی تان، به صورت زیر عمل فرمایید:
1- ویرایشگر NotePad را اجرا نمایید.
2- محتوای مثال "خودتان امتحان کنید" را کپی و داخل ویرایشگر Past کنید.
3- منوی File -> Save را انتخاب نمایید.
4- در پنجره باز شده، در قسمت File Name نام دلخواه تان را وارد نمایید و پسوند آنرا به htm یا html تغییر دهید.
5- حالا به محل ذخیره فایل برید و روی آن دابل کلیک نمایید.
به همین راحتی، حالا فایل مورد نظر در مرورگرتان باز شده و شما خروجی مثال را مشاهده خواهید کرد.
من این کارا رو کردم ولی دابل کلیک کردم نتیجه نشون نداد فقط همون کدایی که کپی پیس کردم رو نشون داد؟...سوال دومم اینه این قسمت وب آزمایشی خود را ایجاد کنید الان این صفحه ای که باز شده چیهو چی کارش کنیم؟
منم همین مشکل شمارو داشتم چندبار به شیوه های مختلف امتحان کردم درست شد.شما باید تو قسمت اسم فایل یه اسم برای فایلتون انتخاب کنین و بعدش بنویسینhtml.(مث ال test.html)وهمچن ین تو قسمت save as typeگزینهall filesرو انتخاب کنین و بعد save
ممنون کوثر جان نه مشکلو فهمیدم چی بود من با مرورگر باز نمی کردم.
همان طور که آقای صادق فرموده اند باید دقت کنید که پسوند فایل html باشه. و اون فایل ها رو با این پسوند ذخیره کنید. در مورد سوال دومتون، باید بگم که این صفحه ای که باز شده است اولین نمونه ی html شما است.
ولی من با html.سیو کردم....قسمت دوم رو بازم نفهمیدم یعنی چی ؟برای من یه صفحه تو visual studio باز میشه که بالاش نوشتهthis is main page ولی نمی فهمم این صفخه چیه ؟یعنی چی اولین نمونه html?
توجه کنید که صفحات اچ تی ام ال رو باید با مرورگر باز کنید.
میشه بگید که کدوم کدها رو کپی کردید؟ توی این مطلب که هیچ، خودتان امتحان کنیدی وجود نداره!
-----------------------------------
اگه بخواهم یه طور دیگه براتون توضیح بدهم باید بگویم که این صفحه، اولین صفحه ی اچ تی ام ال شما است که یک سرفصل و یک پاراگراف را به همراه دو عدد لینک به نمایش می گذارد.
اجرتان با امام حسین ع
کمک بزرگی به ما کردین
یا حق
اقا از سایت خوبتون قدر دانی میکنم.میشه اموزشهاتونو دانلودم کرد چون دسترسی به اینترنت به صورت مداوم ندارم
ممنون، برای دانلود بسته های آموزشی قابل نصب روی اندروید به لینک زیر برید:
www.beyamooz.com/product/web
سلام ممنون از کار خوبتون ، واقعاً آرزوم بود سایت w3 school رو فارسی ببینم .
من دارم با سایت شما html را یاد می گیرم.
kheili site khubi darin