آموزش طراحی وب سایت با زبان برنامه نویسی HTML قسمت اول

شبکه های کامپیوتری
آموزش تفاوت های بین شبکه های کامپیوتری Domain ، Workgroup و Homegroup
آبان ۴, ۱۳۹۶
VLookup با Drop Down List
آموزش تابع VLookup با Drop Down List نرم افزار Microsoft Excel
آبان ۷, ۱۳۹۶
نمایش همه
HTML قسمت اول

HTML

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

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

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

آموزش نمی تواند همه چیز را به شما نشان دهد. بنابراین این خود شما هستید که با تمرین تمرین تمرین می توانید از ساخت یک وب سایت لذت ببرید.

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

چه چیزهای لازم است؟

نخست یک مرورگر. برنامه ی که امکان مرور و باز کردن وب سایت را فراهم می کند. حال این مرورگر اینترنت می خواهد IE خود سیستم عامل ویندوز باشد یا اپرا، کروم، موزیلا و…

بعد حتما میگویید برنامه لازم طراحی وب سایت چی هست؟ خوب می تواند یک Notepad ساده ویندوز و یا Microsoft FrontPage و Macromedia Dreamweaver یا… باشد. یا نرم افزارهای جانبی دیگر.

آیا لازم هست آن لاین بود؟

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

دیگر چه….

میرویم سراغ اولین آموزش طراحی وب سایت با زبان HTML

از توضیحات اضافی فاکتور بگیریم HTML مخفف “Hyper Text Mark-up Language” است.

  • HyperText روش یا متدی که شما در اطراف یک وب سایت حرکت کنید. با کلیک بروی متن خاصی به نام Hyperlinks که شما را به صفحه ی دیگر هدایت می کند . زمانی تمامی دستورات بصورت خطی انجام میشد. اما الان کافیست بروی یک پیوند کلیک کنید و مکانی دیگر بروید. هیچ دستورالعملی برای انجام کارها وجود ندارد.
  • Mark-up یا نشانه گذاری همان چیزی اس که تگ های HTML به داخل متن آنها انجام میدهد. آنها را به عنوان یک نوع خاص از متن نشان میدهند.
  • Language یک زبان است که دارای کلمات کد و نحوه کاربرد مانند هر زبان دیگری را بیان می کند.

HTML شامل مجموعه ای از کدهای کوتاه تایپ شده بصورت یک فایل متنی که توسط نویسنده سایت برچسب “tag” داده میشود. این tag ها در داخل <angle-brackets> قرار میگیرند. یعنی هر کد یا tag داخل براکت برای نمایش دستور قرار داده میشود.

اعلام <!DOCTYPE> قبل از تگ HTML در سند شما خواهد بود. این اعلام یک تگ HTML نیست. دستورالعملی است به مرورگر وب که در چه نسخه از HTML صفحه وب نوشته شده است.

یک نمونه کد HTML:

همانطور که ملاحظه می کنید اولین تگ بعد از اعلام <!DOCTYPE>  تگ <html> است. هر تگ شامل دو قسمت است. قسمت اول تگ را باز می کنید و قسمتی که تگ را می بندید. البته برخی از این تگ ها استثنا دارند که در جلوتر بدان اشاره خواهیم کرد. برای بستن تگ بایستی همانگونه که در بالا مشاهده می کنید با یک اسلش در براکت آنرا خاتمه دهیم.

tag 01 آموزش طراحی وب سایت با زبان برنامه نویسی HTML قسمت اول

تگ

  • ابتدا و انتهای سند بایستی با تگ HTML بسته شود.
  • بعد از آن تگ <head> می باشد.
  • بعد از آن <title> که برای عنوان صفحه بکار میرود. که بایستی درون تگ <head> قرار گیرد.
  • تگ Body را ملاحظه کنید. مهمترین تگ در زبان HTML می باشد که بایستی تگ های دیگر درون تگ Body برای نمایش در صفحه مرورگر قرار گیرند.

تا بدین جا تگ های بودند که بایستی درون هر سند HTML قرار داشته باشند. پس این تگ ها بصورت پیش فرض هستند.

تگ پاراگراف

اولین تگی که درون تمامی صفحات وب وجود است تگ پاراگراف <p></p> می باشد. پس برای اینکه یک پاراگراف ایجاد کنیم از تگ پاراگراف استفاده می کنیم.

سند HTML بایستی با پسوند htm. یا html. ذخیره شوند(بعنوان مثال:text.htm). برای پشتیبانی از زبان فارسی یونیکد آنرا بایستی بروی UTF-8 قرار دهیم.

htm آموزش طراحی وب سایت با زبان برنامه نویسی HTML قسمت اول

پسوند ذخیره سازی HTML

تگ عنوان

شش تگ عنوان در زبان اچ تی ام ال وجود دارد که بزرگترین تیتر، تیتر ۱ یا h1 و کوچکترین عنوان h6 می باشد. که معمولا برای سرفصل مطالب استفاده می کنیم. توجه داشته باشید برای بهینه بودن سئو سایت از تگ h1 یکبار در کل سایت بیشتر استفاده نشود که معمولا برای عنوان سایت که در چه زمینه ی فعالیت دارد کاربردی است.

tag h آموزش طراحی وب سایت با زبان برنامه نویسی HTML قسمت اول

تگ عنوان

Search Engine Optimization یا همان سئو، برای ارتقاء رتبه سایت در موتورهای جستجو همچون گوگل کلمات یا عبارات خاص کلیدی را در تگ های عنوان خود قرار دهید .تا برای اندازه گیری کیفیت، تجزیه و تحلیل صفحات سایت از طرف موتورهای جستجو بالاترین و بهترین وضعیت را در نتیجه Search موتورهای جستجو شاهد باشید.

پایان HTML قسمت اول

 

منبع: فناوری اطلاعات پارسیا

لطفا برای بهبود کیفیت پاسخگویی، سوالات خود را در انجمن های گفتگو مطرح کنید.

پاسخ دهید

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

*

code