آموزش HTML

[Keyla Shapoori]

اموزش خوبی بود

 

[mcdeltateta]

Meta Tag ها

متاتگ ها (Meta Tag) در واقع اطلاعاتی هستند که برای موتور های جستجوگر وب مانند گوگل و یاهو نوشته می شنود تا در هرچه بهتر ایندکس کردن صفحات استفاده شوند.استفاده ی درست از این متاتگ ها تاثیر بسیار زیادی بر ایندکسینگ و شناخت بهتر موتور های جستجو مثل گوگل و یاهو و ... از سایت ما دارد تا با این روش که در بخش آموزش سئو (Seo) و بهینه سازی سایت برای موتور های جستجو به طور کامل به ان پرداخته می شود ، سایت شما و صفحات شما در رتبه ی بالایی در گوگل و یاهو و ... قرار بگیرند.نکته ی مهم : بیش از 70 % بازدید کنندگان سایت ها به طور متوسط از طریق موتور های جستجو مثل گوگل و یاهو وارد سایت ها می شوند.شکل کلی آن و خصوصیات مشترک آنها بصورت زیر است :
<meta http-equiv="مقدار" name="مقدار" content="مقدار" />
در ادامه لیست کاملی از اصلی ترین متاتگ ها (Meta Tag) به همراه نحوه ی نگارش و دلیل استفاده ی آن ها را می آوریم :متاتگ فارسی سازی صفحه (Utf-8) :

برای تعیین نوع رمزنگاری صفحه یا encoding صفحه از این متاتگ استفاده میشود. در صورت استفاده ننمودن از این متاتگ و encoding utf-8 ، در بعضی از مرورگرها و یا سیستم های کاربرانی که encoding فارسی ندارند ، متن های فارسی به صورت علامت سوال (؟) نشان داده می شوند.بنابراین این متاتگ از جمله ی مهمترین متاتگ ها می باشد . طریقه ی استفاده از آن برای فارسی سازی صفحه Html از کد زیر استفاده نمایید :
<meta http-equiv="content-type" content="text/html;charset=utf-8" />
متاتگ کلمات کلیدی (Keyword) :

مهمترین متاتگ برای موتورهای جستجوگر این متاتگ می باشد. استفاده ی درست از آن در رتبه ی موتورجستجوگر گوگل و یاهو و ... بسیار تاثیر گزار است.نکات مهم در استفاده از کلمات کلیدی :1 - محتوای Content این متاتگ نباید در حالت حروف فارسی از 200 کاراکتر و در حالت حروف انگلیسی از 400 تجاوز کند .2 - توصیه می شود که حداکثر از 10 کلمه ی کلیدی مرتبط با متن که فکر میکنید کاربران بیشتر آنها را در موتورهای جستجوگر سرچ میکنند ، استفاده نمایید .برای بدست آوردن این کلمات کلیدی از سایت زیر میتوانید استفاده کنید :​

Keyword Density Checker - Keyword Cloud​

3 - کلمات کلیدی را با ویرگول انگلیسی (,) بدون هیچ فاصله ای (Space) از هم جدا نمایید.توضیحات ریز در مورد این متاتگ در بخش آموزش سئو (Seo) بیان شده است.طریقه ی استفاده از آن بصورت زیر است :
<meta name="keyword" content="کلمه1,کلمه2,کلمه3,..." >
متاتگ توضیحات (Description) :

در صورتی که کاربران با استفاده از سرچ در موتورهای جستجوگر به لینک سایت شما در آنها بر بخورند ، توضیحی که در زیر لینک سایت شما به آنها نمایش داده می شود متنی است که شما در متاتگ توضیحات (Description) صفحه وارد نموده اید.با این توضیح باید متنی که در این بخش انتخاب میکنید توضیحی باشد در مورد صفحه.نکته ی مهم این است که در جملاتی که استفاده میکنید از کلمات موجود در کلمه های کلیدی (Keyword) صفحه ی خود استفاده نمایید.بهتر است تعداد کاراکتر در این بخش حداقل 150 و حداکثر 200 کاراکتر در حالت فارسی انتخاب شود.طریقه ی استفاده از آن بصورت زیر می باشد :
<meta name="description" content="این متن توضیحی در مورد صفحه ی جاری می باشد">
متاتگ سازنده ها و بروز کننده های صفحه :

این متاتگ ها صرفا برای آشنایی با سازنده ی صفحه ، نرم افزار سازنده و بروز کننده ی صفحه می باشد.طریقه ی تعریف آنها بصورت زیر است :
<meta http-equiv="Designer" content="نام نرم افزار سازنده">
<meta name="Generator" content="نام سازنده صفحه">
<meta name="Author" content="نام بروز کننده">

متاتگ زبان مورد استفاده (Content-Language) :

این متاتگ صرفا برای دسته بندی زبانی برای موتورهای جستجوگر می باشد و توصیه می شود استفاده گردد .طریقه ی تعریف آن برای زبان فارسی بصورت زیر است :
<meta http-equiv="Content-Language" content="Fa">
متاتگ کنترل کش (cache-control) :

این متاتگ برای عدم ذخیره ی صفحه در کش مرورگر می باشد. متاتگ کنترل کش (cache-control) برای آن دسته صفحاتی مفید است که بطور دایم اطلاعات آن به روز می شود و باید اطلاعات بصورت مداوم از سرور فراخوانی گردد.طریقه ی استفاده از متاتگ کنترل کش (cache-control) برای عدم کش کردن و ذخیره در مرورگر بصورت زیر می باشد :
<meta http-equiv="cache-control" content="no-cache" />یا
<meta http-equiv="pragma" content="no-cache" />

متاتگ روبوت های جستجوگر (ROBOTS) :

متاتگ Robots برای کنترل ایندکس کردن صفحه توسط موتورهای جستجوگر می باشد.این متاتگ به 3 صورت استفاده میشود :1 - حالت پیش فرض : ایندکس کردن صفحه و لینک ها توسط موتورهای جستجوگر :
<meta NAME="ROBOTS "CONTENT="ALL" />
2 - با استفاده از متاتگ Robots زیر به موتورجستجوگر اعلام میکنیم که صفحه را ایندکس کند ولی لینک ها را دنبال نکند. این کد برای دسته صفحاتی که از محتوای موجود در لینک های موجود در آن مطمین نیستید استفاده می شود تا در صورت بی ربط بودن آنها با موضوع صفحه ی شما ، تاثیری در رتبه ی سئو شما نگذارد :
<meta NAME="ROBOTS" CONTENT="INDEX,NOFOLLOW" />
3 - متاتگ Robots زیر برای صفحات مدیریت و یا صفحاتی که نمیخواهید در موتورهای جستجوگر ایندکس شوند استفاده میشود. بدین صورت که به Robots های جستجوگر میفهمانید که صفحه ایندکس نشود :
<meta NAME="ROBOTS" CONTENT="NONE" />یا
<meta NAME="ROBOTS" CONTENT="NOINDEX,NOFOLLOW" />

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

طراحی سایت​

 

[pouria.kad]

این مطالب برای یادگیری html5 و css3 خیلی مفید هستش ، پیشنهاد میکنم 4 تاش رو دانلود کنید حجمش هم کمه:

http://www.sapoco.com/uploads/pdf/HTML5_And_CSS3_Training_In_Project.zip
http://www.sapoco.com/uploads/pdf/Learning_Html_Css_JavaScript.zip
http://www.sapoco.com/uploads/pdf/HTML5 Cheat Sheet.zip
http://www.sapoco.com/uploads/pdf/CSS3 Cheat Sheet.zip

توضیحاتش هم که این ها چه مقالاتی هستند:

مقالات گروه طراحی وب سایت ساپو

 

[mousavi71]

دمت گرم

Sent from my Nexus 4 using Tapatalk 4 Beta

 

[mr.s3ri0s]

سلام دوستان

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

من جدول قرار میدم 2تا جدول کنار هم نمیرن میرن زیر هم.

http://upload7.ir/images/43985228514365571818.jpg

 

[وبیم]

با تشکر از مطالب خوبتون

 

[mjebrahimi]

سلام دوستان

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

من جدول قرار میدم 2تا جدول کنار هم نمیرن میرن زیر هم.

http://upload7.ir/images/43985228514365571818.jpg

برای جدول هاتون در css ، مقدار float رو right یا left قرار بدین (بسته به چپ چین یا راست چین بودن صفحه) ، کنار هم قرار میگیرند

 

[oranoos_mta]

امضامو ببینید....

 

[ratin]

سلام دوستان عزیز دنبال یه طراحی سایت متفاوت میگردم میشه راهنمایی کنید

 

[ratin]

دوستان عزیز دنبال یه طراحی سایت متفاوت می گردم امکانش هست راهنمایی کنید

 

[ratin]

سلام دوستان عزیز دنبال یه طراحی سایت متفاوت میگردم میشه راهنمایی کنید

نمونه کار هم داشته باشه لطفا
خرید نرم افزار crm

 

[idnavmooknedr]

این HTML شبیه کدوم زبان برنامه نویسیه؟

 

[nicEngineer]

این HTML شبیه کدوم زبان برنامه نویسیه؟

html زبان برنامه نویسی نیست، زبان نشانه گذاری ابرمتن هستش،
در واقع html از تعدادی تگ تشکیل شده و این تگ ها هر کدام دلیلی برای استفاده دارن، مثلا برای وارد کردن عکس از تگ img استفاده می کنیم، حالا برای اینکه مرورگر بفهمه این تگه نه متن از علامت های <> استفاده می کنیم که میشه <img> و برای وارد کردن عکس هم لینکش رو با توجه به آدرس دهی مطلق یا نسبی میزاریم داخل تگ منبع عکس یعنی source که به اختصار از ویژگی src استفاده میشه، که کلا میشه

<img src="http://google.com/logo.png">

هر تگی یه خاصیتی داره مثلا برای متن تگ های مختلفی هست مثل h1 تا h6 و span و p و میشه به هر کدوم خاصیت داد، این تگها می توانند توسط css تغییر ظاهری و مکانی داشته باشن، مثل رنگ، سایه و ... که میشه هر تگ رو با تعریف خاصیتی بعنوان id یا class توسط css یا javascript کنترل کرد.
با javascript کارایی مثل متحرک سازی، فرم ولیدیشن (نیاز به این مورد با تعریف نوع ورودی ها در html5 کاهش یافته)، ایجاد آلرت و ... انجام داد.
سعی کردم توضیحات ساده باشه، امیدوارم مفید واقع بشه.
موفق باشید.

 

[e-gol]

مرسی از اموزش خوب و کاربردی که در اختیار گذاشتید.
از سایت خرید گل ما هم دیدن فرمایید
www.e-gil.ir

 

[roz70]

من کارشناسی مدیریت بازرگانی خوندم و هیچ اطلاعاتی در زمینه طراحی html و وبسایت ندارم. به نظر شما میتونم با کلاس طراحی وب سایت رفتن یاد بگیرم ؟حتی با فتو شاپم تاحالا هیچ کاری نکردم:-

 

[roz70]

قصد آموزش دیدن بصورت مجازی را ندارم .اما میخوام بدونم که کلاس طراحی htmlبرای شخصی مثل من. بدون دیدن دورهای پیشنیازی ،جای امیدی هست یا حتما برای طراحی نیاز به گذراندن دوره ی پیشنیازی هست ؟؟؟؟

 

[Supexinst]

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

بتوانیم یک قالب جذاب، زیبا و شیک طراحی کنیم و حتی از آن درآمدزایی کنیم. به همین منظور دوره ای از صفر تا صد جهت آموزش طراحی

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

مدرس رسمی اندروید و استاد دانشگاه.
برای ثبت نام و یا کسب اطلاعات بیشتر شماره زیر تماس حاصل فرمایید. (ظرفیت محدود)
شماره تماس : 22946542

www.mehrdadnaderi.com

مزایای آموزشگاه سوپکس نسبت به دیگر آموزشگاه ها
• تدریس توسط استاد مهرداد نادری با رزومه مذکور و تنها نماینده رسمی مایکروسافت در ایران
• در انتهای هر کلاس فیلم آن جلسه در اختیار دانشجو قرار میگیرد یعنی دانشجو دیگر دغدغه فراموش کردن یا از دست دادن نکات ریز کلاس یا

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

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

نباشید.
• اگر تمایل به گرفتن مدرک داشته باشید استاد نادری شما را برای حضور در آزمون های بین المللی آماده نموده و به جای اخذ مدارک کم ارزش

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

 

[satiseven]

ممنون خیلی عالی بود برای یادگیری بیشتر طراحی سایت با html مراجعه کنید
طراحی وب سایت

 

[iwheel]

سایت مبنا هم بخش مقالاتش نسبتا کامله اگر دوست داشتید سر بزنید شایید به دردتون بخوره
آموزش html
آموزش css
آموزش php
آموزش html5
آموزش css3
منبع : طراحی سایت مبنا

 

[MSDMRDN]

سلام
دوستان عزیز کسی میتونه بگه مشکل این کد چیه؟

[HTML]<center><input class="large button green" style="FONT-SIZE: 8pt; FONT-FAMILY: Tahoma;border:0" onclick="window.location='[cb:post_href]';" type="button" value="[cb:post_continue_link] [cb:post_title] "></center>[/HTML]

در وبلاگ میهن بلاگ و فقط برای پست هایی که ادامه مطلب دارند اینطوری نشون داده میشه:
<a href='/post/668'>ادامه مطلب</a> عنوان مطلب

در پست هایی که ادامه مطلب ندارند درست نشون میده. و مشکلی نیست. پیشاپیش از کمکتون ممنونم.