10 مهارت ضروری برای یک بازاریاب دیجیتالی

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

دانشگاه های ما باید چه چیزی به دانشجویان برای بازاریابی دیجیتالی یاد بدهند؟ 

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

۱- نوشتن و کپی رایت

اولین مورد، مهارت نگارش واضح و قانع کننده است. برقراری ارتباط روشن یکی از مهارت های لازم برای نوشتن پست های وبلاگ، فیس‌بوک و سایر شبکه های اجتماعی است. همچنین یک بازاریاب دیجیتالی باید به قوانین مالکیت معنوی، حق تکثیر و سایر مسایل حقوقی مرتبط با حوزه نگارش نیز اشراف داشته باشد.

۲- وردپرس

هنوز هم برخی از افراد در رزومه شان به مهارت هایی مانند ورد، اکسل یا پاورپوینت اشاره می کنند! اما نیاز امروز تسلط کار با CMS یا مدیریت محتوا هایی مانند وردپرس است. باید بتوانید یک نوشته بسازید یا تصویری مرتبط با آن را مشخص نمایید.

۳- ویرایش تصاویر

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

۴- HTML

بله، HTML ضروری است. برای حل مشکلاتی در متن یک ایمیل یا نوشته ای در وردپرس لازم است تا مفاهیم پایه را بداند و حداقل بتواند تغییر رنگ یک لینک را انجام دهد.

۵- MailChimp

یکی دیگر از مهارت ها تسلط به مفاهیم ایمیل مارکتینگ و ابزارهای مدیریت خبرنامه های ایمیلی است. ساختن یک خبرنامه ایمیلی با ابزارهایی مانند MailChimp یا Aweber برای یک بازاریاب الکترونیکی ضروری است.

۶- Google AdWords

تبلیغات کلیکی مانند گوگل ادوردز (Google AdWords) یکی از بهترین راه های افزایش ترافیک است. مدیریت کمپین های تبلیغاتی در AdWords نیاز به آشنایی با این ابزار دارد، گرچه افراد با استعداد می توانند با شرکت در امتحانات آنلاین رایگان گوگل AdWords Certified شوند.

۷- تبلیغات فیس‌بوکی

بازاریابی در شبکه های اجتماعی مانند فیس‌بوک نیازمند مهارت و تجربه است که با توجه به هزینه های این تبلیغات، اشراف به مفاهیم پایه در تبلیغات شبکه های اجتماعی مانند فیس‌بوک از ضروریات است.

۸- بازاریابی شبکه های اجتماعی

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

۹- بهینه‌سازی موتور جستجو

یکی از مهارت های لازم برای یک بازاریاب دیجیتالی تسلط به مفاهیم سئو یا همان SEO که سرواژه کلمات Search Engine Optimization به معنی بهینه‌سازی سایت برای موتورهای جستجو است. نیاز به آشنایی با مفاهیمی مانند عناوین، تگ ها، متا ها، چگالی کلمات کلیدی و تأثیر هر کدام بر رتبه سایت در موتورهای جستجو دارد.

۱۰- بهینه سازی نرخ تبدیل

واژه CRO که سرواژه کلمات Conversion Rate Optimization یا بهینه سازی نرخ تبدیل است. مهارت و تجربه یک بازاریاب می تواند تعداد بیشتری از کاربران و بازدیدکنندگان فعلی سایت را به مشتریان یا مصرف کنندگان تبدیل کرده و نرخ تبدیل یا همان نسبت مشتریان به نسبت کل بازدیدکنندگان سایت را افزایش دهد.

 منبع :طراحی وب ایران

درباره سرعت لود شدن سایت و تاثیر آن بر سئو چه می دانیم؟

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

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

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

 

در این مقاله سعی داریم راهکارهایی برای افزایش سرعت وب سایت  به شما ارائه دهیم:

 

 

1- بررسی سرعت بارگذاری فعلی صفحات وب سایتتان

در اینجا نخستین کاری که باید انجام دهید ،اینست که سرعت کنونی سایتتان را آنالیز نمائید تا بتوانید بعد از

 تغییرات متوجه بهبود سرعت لود سایت خواهید شد.

ابزارهای بسیاری مانند : Pingdom و Page Speed و  Web Page Test  و ....برای چک کردن  مدت زمان

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

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

 2- بهینه سازی کدنویسی

بهینه سازی کدهای برنامه نویسی مسلما منجر به اجرای سریع تر کد شده و  اشغال حافظه کمتر میشود.هرچه کد سریع تر اجرا شود سرعت بارگذاری صفحات وب سایت نیز بهتر می‌شود.

فایل های HTML ذاتا تعداد زیادی کد تکراری دارند که شما میتوانید با استفاده از این ویژگی و الگوریتم فشرده سازی حجم قابل ملاحظه ای را برای فایل های خود کاهش دهید.  جالب است بدانید که هر چه فایل HTMLشما بزرگتر باشد میزان فشرده سازی نیز بیشتر میشود.

3- از هاست مجازی یا اختصاصی استفاده کنید

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

 

4- عکس ها و تصاویر خود را بهینه سازی کنید

اینکه بدانید چه زمانی باید از چه فرمتی استفاده کنید بسیار حائز اهمیت است.زیراکه تغییر دادن فرم تصاویر بطرز چشمگیری حجم آنها را کم میکند.برای کاهش حجم تصاویر میتوانید براحتی از منوی فایل در برنامه فتوشاپ گزینه  Save For Web را انتخاب نموده و یا دکمه Alt+Ctrl+Shift+S را همزمان فشار دهید و فرمت مورد نظر خود را تست کنید.

فرمت- GIF  برای تصاویری با چند رنگ محدود مانند برخی از لوگوها مناسب است .

فرمت - JPEG برای تصاویر با تعداد رنگ های بالا و دارای جزئیات مانند عکس های یادگاری فرمت مناسبی استفرمت - PNG فرمتی مناسب برای زمانی است که نیاز به کیفیت بالا و پس زمینه شفاف دارید .

5- بهینه کردن و فشرده سازی محتوای صفحات

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

6- استفاده از سیستم کش

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

سایت برای مشاهدات بعدی دوباره لود نشود و همان نسخه قبلی را نمایش دهد . بدین طریق باعث صرفه جویی در منابع CPU و Ram Server  شده که بالطبع در طولانی مدت سبب میشود پهنای باند کمتری مصرف گردد و در نتیجه  سرعت سایت ارتقا یابد.

7- استفاده کردن ازشبکه تحویل محتوا در سایت( CDN)

سورس های CDN بدینصورت عمل می کنند که معمولا در کل جهان سرورهایی دارند و هنگامیکه افرادبه وب سایتی مراجعه  کنند این سرویس ها با بررسی فاصله جغرافیایی فرد مورد نظر،  نزدیک ترین سرور را برای ارسال فایل ها انتخاب میکنند و از این طریق به سریعتر لود شدن وب سایت کمک می نمایندو معمولا تا 60% سرعت سایت را افزایش می دهند

 منبع : زئوس

 

 

         

 

7 نکته ضروری برای طراحی سایت فروشگاه اینترنتی که باید در نظر داشته باشید

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

پس وقتی هدف نهایی که به دنبال آن هستید افزایش فروش هست، اهمیت بهینه سازی سایت بیشتر احساس می‌شود و هر چقدر سایتی که طراحی کرده‌اید بازدید کننده بیشتری داشته باشد، فروش سایت هم افزایش پیدا می‌کند.

مطمئن‌ترین روش برای چنین کاری، بهینه سازی یا سئو سایت هست و همه فروشگاه‌های اینترنتی هم به دنبال آن هستند پس چرا فقط  بعضی سایت ها در این زمینه نتایج موفقی می‌گیرند و بقیه نمی‌توانند؟ در این مقاله 7 نکته ضروری برای طراحی سایت فروشگاه اینترنتی را معرفی می‌کنیم که رعایت آن‌ها در طراحی سایت، تاثیر قابل توجهی بر موفقیت سایت فروشگاهی شما خواهد داشت.

هر چند که اصول سئو برای یک سایت‌ معمولی، تفاوتی با آن چه که برای بهینه سازی فروشگاه‌های اینترنتی باید انجام بدهید ندارد اما توجه داشته باشید که ساختار فروشگاه اینترنتی تفاوت‌هایی با سایر وب سایت‌ها دارد که نیاز به یک استراژی بخصوص برای سئو سایت پیدا می‌کند.  

 

1- در نظر گرفتن متن جاگزین یا Alt Text برای تمامی تصاویر

به طور کلی هیچ روشی برای آنالیز تصاویر وجود ندارد و موتور‌های جستجو نمی‌توانند تفاوتی بین محتوای دیداری آن‌‎ها قائل بشوند. اما صبر کنید، یک راهی هست که به کمک آن می‌توانید این مشکل را برطرف کنید: موتور‌های جستجو مثل گوگل، فقط قابلیت تحلیل متن را دارند پس می‌توانید با نسبت دادن یک عبارت مرتبط به عکسی که در سایت قرار داده‌اید، آن را برای موتور جستجو تعریف کنید.

گوگل هم عکس‌ها را بر اساس همین متن‌های جایگزین تحلیل و یا ایندکس می‌کند. علاوه بر‌این یک ویژگی دیگر که استفاده از Alt text را کاربردی‌ کرده این هست که اگر تصویر به هر دلیلی نمایش داده نشود، بیننده می‌تواند متن جایگزین آن را مطالعه کند و متوجه بشود که این عکس درباره چه بوده.

2- استفاده موثر از وبلاگ

لینک‌ خارجی یکی از تاثیرگذار‌ترین فاکتور‌های موثر در سئو سایت هست. برای این کار بهتر است صفحه‌ای با محتوا مرتبط به سایت شما لینک شده باشد. واقعا فکر می‌کنید صفحه‌ای مرتبط‌ تر از وبلاگ همان سایت هم پیدا می‌شود؟ قطعا نه!

برخی مطالب را فقط در وبلاگ به آن‌ها اشاره کنید و مخاطب را ایجاب کنید که همیشه به وبلاگ سر بزند. این کار باعث می‌شود موتور‌های جستجو امتیاز بیشتری برای سایت شما قائل بشوند و علاوه بر این نوعی ارتباط دائمی هم با مشتریان برقرار کرده‌اید.

3- بهره مندی از لینک‌های داخلی در طراحی قروشگاه اینترنتی

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

4- از نظرات مشتریان حداکثر استفاده را ببرید

 

بازخورد مثبت مشتریان فعلی یک فروشگاه اینترنتی نه تنها باعث افزایش اعتماد مشتریان بالقوه می‌شود بلکه توضیحات متنی بیشتری هم برای محصولاتی که در سایت قرار داده‌اید فراهم می‌کند. دعوت از مشتریان برای ارسال نظرات‌شان به نحوی استفاده رایگان از مخاطب برای بهینه سازی صفحات سایت محسوب می‌شود.

5- برای محصولات مختلف از توضیحات متای منحصربفرد استفاده کنید

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

6- اهمیت تشخیص کلمات کلیدی مناسب

اگر کلمات کلیدی را به درستی انتخاب نکرده باشید حتی استفاده از محتوا متنی و یا تصویری مناسب هم در طراحی و سئو سایت کمک خاصی به شما نمی‌کند. اولین قدم برای تهیه یک محتوای ایده آل، شناسایی عبارات کلیدی هست که متن باید درباره آن‌ها نوشته بشود. پس بیشتر روی این بخش تمرکز کنید و منتظر بهترین بازخورد‌ها باشید.

7- محتوا تکراری هر آنچه که برای سئو سایت رشته کرده‌اید را پنبه می‌کند!

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

تا جایی که امکان دارد تلاش کنید و خلاقیت به خرج بدهید تا محتوای بکر و جدید بر روی سایت قرار بدهید. نتیجه کار، ارزش این همه زحمت را دارد!

سخن آخر

امروزه هر کسی که قصد راه اندازی یک کسب و کار اینترنتی دارد به دنبال راه اندازی فروشگاه اینترنتی هست. البته که طراحی یک فروشگاه اینترنتی موفق، کار غیر ممکن و یا دشواری نسیت ولی برای انجام این کار باید مجموعه‌ای از نکات را همزمان در نظر داشته باشید تا نتیجه بهتری بگیرید. علاوه بر این دقت کنید رقبای زیادی در این وجود دارند پس به فکر ایجاد یک تمایز میان کسب و کار خودتان با سایرین باشید تا مشتری شما را از بین همه فروشگاه‌های اینترنتی که یک محصول یا خدمات بخصوص را ارائه می‌کنند انتخاب کند.  

منبع : آرمانیک

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

وب سایت ها به سرعت در حال تغییر و تحول هستند. توسعه و طراحی سایت توسط تغییرات اخیر در تکنیک ها و شگردهای برنامه نویسی تاثیر می گذارد. در سال 2003، یک برنامه نویس وب سایت HTML وCSS ، با کپی و جابه جا کردن JAVASCRIPT آشنا بود و می توانستند وب سایت های بسازند که در دسک تاپ کامپیوتر نمایش داده شود.

اما حالا! یک برنامه نویس وب سایت شایسته و لایق به خوبی HTML وCSS ، JAVAVSCRIPT وJQUERY، پردازشگرهای CSS، تکنیک های جدید مانند طراحی وبسایت تعاملی و موبایل، و دنیای ابزارهایی برای دیدن وب سایت ها را به خوبی می داند و در این زمینه ها مهارت بالایی دارد.

درست زمانی که شغل برنامه نویسی وب سایت تغییر کرد، کلاس های مقدماتی طراحی وب سایت برای تحصیلات و دانستنی های بیشتر شروع شدند. چگونه باید به دانش آموزانی که هیچ چیز درباره HTML و CSS نمی دانند، آموزش دهیم، به طوری که آن ها درباره طراحی و ساخت وب سایت ها در ابزارهای مستقل دیگر فکر کنند و در ابتدا از تکنینک های مدرن مانند طراحی واکنشی استفاده کنند؟

من 13 سال است که در سیستم آکادمیک و تجاری، طراحی وب سایت مقدماتی را تدریس می کنم، و من از اینکه چگونه باید در دانشکده طراحی سایت دو دوره اساسی و مقدماتی را آموزش دهم، تجارب زیادی کسب کردم. این بحث بسیار مهم است، زیرا تنها منابع کمی برای آموزش طراحی و برنامه نویسی وب سایت وجود دارد. با توجه به کمبود وقت و تحولات سریع در وب سایت ها، خیلی سخت است که دوره های آموزشی طراحی وب سایت را دوباره مرور کنیم و هر سال توسط مواردی آن ها را به روز نگاه داریم.

افزایش همکاری بین پروفسورهای تمام وقت و مدرسان پاره وقت می تواند در بهبود تجربه های دانش آموزان تاثیرگذار باشد.

 

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

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

در این مقاله، من روی دو بخش تمرکز زیادی خواهم کرد: دوره آموزشی مقدماتی طراحی گرافیکی وب سایت و دوره آموزشی مقدماتی HTML و CSS. مفاهیمی مانند برنامه ریزی و استراتژی وب سایت، اطلاعات ساختاری، کاربردی بودن وب سایت، طراحی متمرکز بر کاربران  وب سایت، JAVAVSCRIPT وJQUERY، محتوای سیستم های مدیریتی و غیره همگی ارزشمند هستند و باید در این دوره ها پوشش داده شود. در هر صورت، این موضوعات معمولا در دوره های مجزایی در اکثر دانشکده ها تدریس می شود، از این رو، در اینجا به این مسئله پرداخته نشده است.

 

ایجاد و ساخت طراحی های وب سایت

در اکثر برنامه ریزی های آموزشی، دانش آموزان باید یک دوره ای را درباره ساخت پس زمینه یک طراحی وب سایت با استفاده از نرم افزار گرافیکی مانندPHOTOSHOP  و FIREWORK انتخاب کنند. دانش آموزان ممکن است از تصاویر صفحات وب سایت های فعلی، لایه بندی تصاویر و محتوای آن برای ساخت یک طراحی منحصر به فرد، استفاده کرده و شروع کنند، یا ممکن است از یک پیش طراحی و پیش نویس برای ساخت وب سایت استفاده کنند.

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

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

 

در این بخش، دانش آموزان مکررا با درک اینکه چه اتفاقی در طراحی می افتد، مشکل دارند. اگر پهنای یک طراحی 960 پیکسل باشد، زمانی که مانیتور دسک تاپ 1200 پیکسل باشد، چه اتفاقی می افتد؟ معمولا این موضوع از رنگ پس زمینه و گرافیک های متعدد ناشی می شود. دانش آموزان به ندرت این سوال را می پرسند که چه می شود اگر مانیتور دسک تاپ کمتر از 960 پیکسل باشد.

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

در اینجا دلیلی وجود دارد که دانش آموزان نباید ضرورتا به خوبی HTML و CSS را یاد بگیرند. با حذف برنامه نویسی در روند آموزش، دانش آموزان روی مبانی و اصول طراحی سایت تمرکز می کنند، که شامل طراحی گرافیکی و تجربه کاربر از وب سایت می باشد. زمانی که آن ها در این پروسه آموزشی HTML و CSS را یاد گرفتند، آن ها قطعا می دانند که چگونه با PHOTOSHOP و FIREWORK کار کنند، و آن ها آموزش دیده اند که نقاط منفی و مثبت محیط کامپیوتری چیست_ تمامی این ها تجربه های ارزشمندی می باشد.

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

·         طراحی با اندازه یکسان.

بهترین زمان برای توضیح دادن شبکه ها و چگونگی کار کردن آن ها می باشد. به دانش آموزان بگویید که طراحی را بر اساس شبکه هایی بسازند تا اثبات کنند که این موضوع را فهمیده اند و درک کردند.

·         نسخه های طراحی را نشان دهید

اگر یک نوع طراحی دارای 960 پیکسل بود، چگونه در مانیتور 1200 پیکسلی نشان داده می شود؟ 320؟ 767؟ از دانش آموزان بخواهید این مفهوم را در طراحی شان به کار ببندند و این محیط ها و فضای مختلف صفحه نمایش را دوباره بازسازی کنند. مطمئن باشید که از آن ها چگونگی این تغییرات را می پرسید_ زمانی که طراحی از 767 به 320 پیکسل تغییر می یابد، چه اتفاقی می افتد؟

·         درباره عکس ها سوال بپرسید

چگونه تصویر بزرگ بنر به خوبی در بالای صفحه ی 960 پیکسلی به خوبی 767 پیکسلی بسط داده می شود؟ چه اتفاقی بین این تغییرات از 960 تا 767 پیکسل اتفاق می افتد؟

·         دانش آموزان را تشویق به استفاده از ویژگی لمسی کنید

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

·         تاکید نکردن بر اسلایدها

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

 

آموزش  HTML و CSS

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

" از اینترنت نترسید" یک منبع آموزشی فوق العاده است که قواعد و اصول مفیدی از HTML و CSS یاد می دهد.

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

·         استاندارد و همگون کردن در یک مرورگر.

من کار کردن با FIREFOX یا CHROME را به عنوان مرورگرهای استاندارد در کلاس های آموزشی پیشنهاد می کنم، زیرا با  MAC و PC به خوبی سازگاری دارد و بسیار استاندارد و معقول هستند. به دانش آموزان بگویید که این ها تنها مرورگرانی هستند که برای هدف این کلاس مناسب می باشند. زمانی که دانش آموز به طور کامل فهمید که چگونه در مروگرها HTML و CSS کار می کند، سپس پرداختن به مسائل مربوط به این مرورگرها باید به آینده موکول شود. زمانی که مشکلات این مرورگرها خیلی زود به دانش آموزان معرفی شود، هنرجویان دوره آموزشی طراحی سایت گیج می شوند، و نمی توانند به طور روشن درک کنند که این مشکل مشخص به مرورگرها بستگی دارد یا فقط به صورت نامناسبی برنامه ریزی شده اند.

·         HTML5 را آموزش دهید.

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

·         CSS3 و تمام انواع گزینشگرها را آموزش دهید.

اطمینان حاصل کنید که دانش آموزان نمایش دادن رسانه را یاد گرفته اند. انواع سیستم گزینشگر را معرفی کنید. دوباره می گویم، کم تر نگران پشتیبانی مرورگرها باشید، زیرا این دانش آموزان سال های زیادی را برای فارغ التحصیل شدن پیش رو دارند.

·         استفاده از شبکه.

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

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

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

·         طراحی واکنشی حالا یک مبحث کوتاه است.

هنرجویان آموزش طراحی سایت حالا باید قادر باشند طرح های مبتنی بر شبکه و استفاده از رسانه ها را با هم ترکیب کنند. آن ها در طول این کار با مسئله تغییر اندازه تصاویر هم رو به رو می شوند، ولی اگر این چنین نبود، وقت آن است که در این باره با آن ها به بحث و گفت و گو بپردازید.

·         حالا زمان این است که درباره سازگاری با مرورگرها صحبت کنید.

حالا که دانش آموزان کمی در برنامه نویسی تعاملی، استاندارد، منطبق و معتبر تسلط یافتند، زمان این است که درباره سازگاری با مرورگرها صحبت شود. یک راه معرفی این مسئله این طور می باشد که با تگ هایی که با HTML5 ضعیف پشتیبانی می شود یا با عواملی مانند CSS3 کار کنید.

·         پیش پردازش یک موضوع مبرم و حیاتی CSS.

تمرکز بر متغیرهای CSS بهترین ایده می باشد و به عنوان موضوع اصلی در فراگیری مهارت CSS می باشد که توسط هنرجویان طراحی سایت در یک یا دو سال آینده به طور کامل کسب می شود. متغیرها و استدلال های متمرکز در دوره های آموزش JAVAVSCRIPT وJQUERY یک تغییر محسوس را به وجود آورده است که بسیار اهمیت دارد.

·         پوشش چارچوب طراحی واکنشی، ایده بدی نیست.

اگر در کلاس وقت اضافه ای دارید، این بهترین موضوع برای ارائه به دانش آموزان می باشد. اگر از قبل مبحث LESS را آموزش داده اید، حال موضوع Bootstrap را پیش بکشید، اگر SASS را آموزش داده اید، به سراغ مباحث پایه و اصولی بروید. دانش آموزان یاد خواهند گرفت که چگونه برنامه نویسی وب سایت دیگران را بخوانند( یک مهارت با اهمیت است) و چگونگی خواندن مدارک و اسناد وب سایت را نیز یاد می گیرند؛ سر انجام، آن ها می تواند با هدف خودشان یک وب سایت را شخصا برنامه نویسی کنند.

 

مهارت های فرعی

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

·         فلسفه منابع آزاد

به جای اینکه به هنرجویان دوره آموزشی طراحی سایت یاد بدهید که منابع آزاد، رایگان هستند، به آن ها آموزش دهید که منابع آزاد بسته به نوع استفاده از آن ها برای پروژه های طراحی سایت خودشان بسیار مفید می باشد. به طور مثال، GITHUB و اینکه چگونه مردم می توانند آن را دانلود کنند را معرفی کنید. آشنایی دانش آموزان با جوامع منابع آزاد و امکان تشخیص دادن انواع مختلف استفاده از این منابع بسیار اهمیت دارد.

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

این موضوع سال ها است که در دوره های آموزشی یکپارچه شده است، اما بیشتر برای استفاده طراحان وب سایت نسبت به برنامه نویسان به وجود آمده است. با میزبانی وب، مخاطبان وب سایت می توانند بیشتر از طراحی و منطقی که در پس این طراحی وجود دارد ،به ظواهر طراحی تمرکز کنند. مطمئن شوید که دانش آموزان برای ارسال برنامه شان برای مرور شدن به خوبی وفق یافته اند.

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

·         درک و اصلاح برنامه نویسی دیگران

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

·         دانش چگونگی یادگیری تکنولوژی

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

 

دستورالعمل هایی برای آموزش دانش آموزان دوره های طراحی سایت جدید

اکثر طراحان وب سایت با استعداد و برنامه نویسان وب، آموزش دادن به تازه واردان به عرصه طراحی سایت و برنامه نویسی وب سایت را سخت و طاقت فرسا می دانند. بخشی از مشکل این است که برنامه نویسان وب سایت رتبه بدون اینکه متوجه شوند، اطلاعات زیادی را می دانند. آخرین باری که یک فرد متخصص و حرفه ای به syntax، مدیریت فایل، ترتیب روش ها، نشانه گذاری های صحیح برای یک صفحه وب سایت وغیره فکر کرد و تمرکز کرد، چه زمانی بود؟ حرفه ای ها و متخصصین با این مسائل بارها در طول روز مواجه می شوند، اما همه این موارد برای دانش آموزان تازه وارد جدید و نا آشنا می باشند.

·         ارائه یک نمای کلی

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

·         همراه با کلاس، برنامه نویسی کنید.

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

·         سپس با گذر زمان شروع به برنامه نویسی کنید و مثال ها را پیچیده تر بسازید.

در وهله اول موارد زیادی را معرفی نکنید. برای مثال، زمانی که CSS را معرفی می کنید، شروع به نوشتن سبک هایی برای تگ های HTML نکنید. نشان دهید که چگونه طراحی کردن تگ  های اصلی می تواند تمام صفحه وب سایت را کنترل کند، مانند رنگ پس زمینه، فونت، اندازه و غیره. در هر زمان یکی از ویژگی های طراحی وب سایت را نمایان کنید و تغییرات را ذخیره کرده و در مرورگر مدام نشان دهید، طوری که دانش آموزان دقیقا ببینند که کدام یک از CSS ها کدام یک از عوامل صفحه وب سایت را کنترل می کند.

·         در طول آموزش سوالاتی بپرسید.

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

·         خیلی سخت است که مسائل و موارد این مبحث را ساده سازیم و مانع گیج شدن شان بشویم.

دانش آموزان سوالات پیچیده ای می کنند. برای مثال، آن ها متوجه می شوند که رنگ قرمز می تواند به این دو صورت نوشته شود،" #ff0000 یاrgb (225,0,0 )" و از شما تفاوت ما بین این دو را می پرسند. یک راه برای برنامه نویس رنگ ها ارائه دهید( من#ff0000را پیشنهاد می کنم)، و تا زمانی که در این مسئله تسلط نیافتند، هیچ گاه این موضوع را دوباره بازبینی نکنید. شاید برای شما توضیح تفاوت ها آسان و سریع باشد، اما در ابتدا یادگیری دانش آموزان، ارائه این چنین اطلاعاتی بسیار زیاد و گیج کننده می باشد.

·         Syntax یک چالش می باشد.

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

·         مدیریت فایل ها چالش بر انگیز می باشد.

برای اکثر دانش آموزان در مرحله مقدماتی HTML و CSS، مدیریت فایل هل یک مشکل ثابتی است. برخی ممکن است با تشخیص دادن ذخیره اطلاعات در هارد دیسک در برابر ذخیره در درایو THUMB مشکل داشته باشند و برخی هم ممکن است که تفاوت بیت فایل و یک فولدر را ندانند. شما نیاز دارید که قبل از آموزش چگونگی مدیریت فایل ها در یک وب سایت، موارد پایه و اصولی را آموزش دهید. من سعی می کنم که تمام فایل های یک پروژه را در یک فولدر در دسک تاپ نگه دارم، زیرا دانش آموزان عموما می توانند دسک تاپ را به راحتی بیابند و دسک تاپ آن ها را گیج نمی سازد. تمام HTML، تصاویر و CSS سپس در یک فولدر ذخیره می شوند. در ابتدا این امر باعث می شود که مدیریت بر فایل ها آسان شود، زیرا دانش آموزان در طراحی سایت های اولیه به موارد و فایل های اندکی از این فولدر نیاز دارند. با گذشت زمان دانش آموزان می فهمند که فولدر مکان به هم ریخته ای را برای شان فراهم می کند و به یک مورد بهتر احتیاج دارند. آن ها در این مورد تسلط می یابند که چگونه دو فایل را به هم متصل کنند، عکس هایی را اضافه کنند و غیره. آن ها می فهمند که چگونه یک وب سایت را برای فوق العاده دیده شدن و کاربردی بودن برنامه نویسی کنند.

·         به یاد داشته باشید که شما برای یک مشتری، وب سایت طراحی نمی کنید.

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

·         شما مبانی پایه ای را برای شغل دانش آموزان تان یاد می دهید

طراحی گرافیکی،HTML  و CSS مهارت های حیاتی هستند که طراحان متخصص و حرفه ای هر روزه با آن ها کار می کنند. برنامه نویسی موثر و واضح، درک چگونگی اشکال زادیی، تحقیق کردن درباره راه های بهتر برای مشکلات موجود، حل و فصل مسائل موجود در مرورگرها- تمامی این موارد مفاهیم پایه از زندگی یک برنامه نویس وب سایت می باشد. من دانش آموزان زیادی را دیدم که از نحوه آموزش مقدماتی شان رنج می برد. شغل شما به طرز باورنکردنی مهم و با ارزش است؛ از این رو، موارد جدید را تدریجا آموزش دهید و اطمینان حاصل کنید که قبل از اینکه دانش آموزان به مرحله بعدی راه بیابند، درک عمیقی از مرحله قبل کسب کرده اند.

 

پیش بروید

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

 

منبع : اطلس وب

هزینه طراحی سایت چقدر است؟

هزینه طراحی سایت چگونه محاسبه می شود؟

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

هزینه طراحی سایت چقدر است؟

فرض کنید شما صاحب یک کسب و کار هستید و میخواهید کسب و کار خود را وارد فضای آنلاین کنید ممکن است اولین سوالی که برای شما پیش می آید این باشد که هزینه طراحی سایت چقدر است؟ و شاید اولین کاری که انجام می دهید این باشد که دنبال شخصی یا شرکتی باشید که برآورد هزینه طراحی سایت را برای شما انجام دهد. و یا در موتور جستجوی گوگل دنبال وب سایت شرکت هایی می گردید که یک لیست قیمت طراحی سایت به شما ارائه دهند و ممکن است با تناقض های بسیاری روبرو شوید مثلا وب سایتی را باز کنید که بنر بزرگی در آن وجود دارد و این چنین تبلیغ کرده است راه اندازی وب سایت حرفه ای فقط ۳۰۰ هزار تومان و یا حتی کمتر قیمت گذاری کرده باشد و شما با این دید به شرکت طراحی سایتی که میشناسید مراجعه کنید و بگویید یک وب سایت حرفه ای می خواهید و آنها قیمت یبسیار بالاتر از چیزی که در ذهنیت شما است برای هزینه طراحی سایت از شما طلب کنند مجددا برای روشن شدن قضیه به شرکت‌های دیگر مراجعه می‌کنید و بعضی از آن شرکت‌ها قیمت های ......

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

تصاویر در html

تصاویر در html :

در این جلسه از دوره آموزش html در همراه آی سی تی تصاویر در html را با هم مورد بررسی قرار می دهیم. با ما همراه باشید.

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

تصاویر در صفحات وب بسیار کاربرد دارندو دست یک طراح سایت را برای ساختن یک وب سایت جذاب تر باز می گذارند.

تصاویر ویژگی هایی را به خود می گیرند که در ادامه در موردآنها صحبت خواهیم کرد.

نحوه قرار دادن تصویر درhtml :

تگ <img> به صورت پیش فرض برای تصاویر تعریف شده است.

تگ <img> یک تگ تنها است و تگ انتها ندارد.(single tag)

برای مشخص کردن آدرس یک تصویر در html از ویژگی src استفاده می شود.

منظور از آدرس تصویر آدرسی است که تصویر از آن فراخوانی می شود.

<img src="url">

خصوصیت alt :

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

اگر مرورگر نتواند تصویر را نمایش دهد مقدار ویژگی alt را به کاربر نمایش می دهد.

با استفاده از ویژگی alt می توان متنی در جهت توضیح تصویر به کاربر ارائه داد.

این ویژگی از دید موتورهای جستجو بسیار مهم است و روی سئوی یک وب سایت بسیار تاثیر گذار می باشد.

یک صفحه وب بدون ویژگی alt اعتبار نداردو نمره خوبی از دید موتورهای جستجو نمی گیرد.

<!DOCTYPE html>
<html>
<body>

<h2>Alternative text</h2>

<p>The alt attribute should reflect the image content, so users who cannot see the image gets an understanding of what the image contains:</p>

<img src="img_chania.jpg" alt="Flowers in Chania" width="460" height="345">

</body>
</html>

 

 

تغییر اندازه تصاویر در html با تگ style :

با استقاده از تگ style در html این امکان وجود دارد که عرض و ارتفاع یک تصویر را تغییر دهید.

از تگ استایل به صورت درون خطی درون تگ <img> استفاده می شود تا ویژگی های عرض و ارتفاع را مقدار دهی کرد.

به مثال زیر دقت کنید.

<!DOCTYPE html>
<html>
<body>

<h2>Image Size</h2>

<p>Use the style attribute to specify the width and height of an image:</p>
<img src="img_girl.jpg" alt="Girl in a jacket" style="width:500px;height:600px;">

</body>
</html>

 

تغییر اندازه تصاویر در html با استفاده از ویژگی عرض و ازتفاع :

در html این امکان وجود دارد که تنها با استفاده از ویژگی عرض و ارتقاع سایز تصاویر را تغییر داد. به مثال زیر دقت نمایید.

این ویژگی ها در html به صورت پیش فرض بر حسب پیکسل هستند.

<!DOCTYPE html>
<html>
<body>

<h2>Image Size</h2>

<p>In this example, we specify the width and height of an image with the width and height attributes:</p>

<img src="img_girl.jpg" alt="Girl in a jacket" width="500" height="600">

</body>
</html>

 

 

نکته : همیشه برای تصاویر در صفحات وب عرض و ارتفاع مشخص کنید تا ساختار آن دچار به هم ریختگی نشود.

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

هر دو ویژگی در html معتبر هستند ولی با این حال پیشنهاد می شود که از تگ استایل برای دادن عرض و ارتفاع به تصویر استفاده کنید.

این روش مانع از تغییر اندازه تصاویر در صفحات مختلف وب می شود.به مثال زیردقت کنید.

<!DOCTYPE html>
<html>
<head>
<style>
img { 
    width:100%; 
}
</style>
</head>
<body>

<img src="html5.gif" alt="HTML5 Icon" width="128" height="128">
<img src="html5.gif" alt="HTML5 Icon" style="width:128px;height:128px;">

</body>
</html>

اندازه تصویر ۱۰۰ درصد صفحه وب می باشد و با تغییر صفحه اندازه تصویر هم تغییر خواهد کرد.

وارد کردن آدرس تصاویر از پوشه :

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

معمولا اگر پوشه ای برای تصاویر مشخص نشده باشد مرورگر انتظار دارد در همان پوشه تصاویر را فراخوانی کنددرغیر این صورت

برای فراخوانی تصویر از پوشه به شکل زیر عمل می شود.

<!DOCTYPE html>
<html>
<body>

<h2>Images in Another Folder</h2>
<p>It is common to store images in a sub-folder. You must then include the folder name in the src attribute:</p>

<img src="/images/html5.gif" alt="HTML5 Icon" style="width:128px;height:128px;">

</body>
</html>

فراخوانی تصویر از یک وب سرور دیگر :

برخی از سایت ها هستند که تصاویر وب سایت را در یک سرور جداگانه ذخیره می کنند.

بیشتر این وب سایت ها یا به دلیل مسائل امنیتی این کار را انجام می دهند یا برای لود بهتر وب سایت از این تاکتیک کمک می گیرند.

درهر صورت شما می توانید به تصاویر از هر آدرسی در دنیا دسترسی داشته باشید.به مثال زیر دقت کنید.

<!DOCTYPE html>
<html>
<body>

<h2>Images on Another Server</h2>

<img src="https://www.w3schools.com/images/w3schools_green.jpg" alt="W3Schools.com" style="width:104px;height:142px;">

</body>
</html

تصاویر متحرک :

در html می توان گیف های متحرک ایجاد کرد. به مثال زیر دقت کنید.

استاندار Gif اجازه می دهد تصاویر متحرک باشند.بنابراین برای ایجاد تصاویر متحرک از استاندارد Gif استفاده کنید.

<!DOCTYPE html>
<html>
<body>

<strong>Animated Images</strong>
<p>The GIF standard allows moving images.</p>

<img src="programming.gif" alt="Computer man" style="width:48px;height:48px;">

</body>
</html>

 

Animated Images

The GIF standard allows moving images.

استفاده از تصویر به عنوان یک لینک :

در html این امکان وجود دارد که از یک تصویر به عنوان یک لینک استفاده کنید .

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

برای استفاده از یک تصویر به عنوان یک لینک، تگ <img> را در داخل برچسب <a> قرار دهید:

<!DOCTYPE html>
<html>
<body>
<h2>Image as a Link</h2>
<p>The image is a link. You can click on it.</p>
<a href="default.asp">
 <img src="smiley.gif" alt="HTML tutorial" style="width:42px;height:42px;border:0;">
</a>
<p>Add "border:0;" to prevent IE9 (and earlier) from displaying a border around the image.</p>
</body>
</html>

Image as a Link

The image is a link. You can click on it.

Add “border:0;” to prevent IE9 (and earlier) from displaying a border around the image.

 :تصویر شناور

در مثال زیر یک تصویر را می بینید که در کنار یک پاراگراف شناور شده است.

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

<!DOCTYPE html>
<html>
<body>
<h2>Floating Images</h2>
<p><strong>Float the image to the right:</strong></p>
<p>
<img src="smiley.gif" alt="Smiley face" style="float:right;width:42px;height:42px;">
A paragraph with a floating image. A paragraph with a floating image. A paragraph with a floating image.
</p>
<p><strong>Float the image to the left:</strong></p>
<p>
<img src="smiley.gif" alt="Smiley face" style="float:left;width:42px;height:42px;">
A paragraph with a floating image. A paragraph with a floating image. A paragraph with a floating image. 
</p>
</body>
</html>

 

 

نقشه های تصویر :

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

به این تصاویر نقشه تصویر گفته می شود.درواقع نقشه های تصویر تصاویری با مناطق قابل کلیک هستند.

در html برچسب <map> یک نقشه تصویر را تعریف می کند.

مراحل ایجاد نقشه تصویر به صورت زیر می باشد:

به مثال زیر دقت کنید.

1. ویژگی usemap به تگ تصویر اضافه شده است.
2. یک نام خاص برای تگ map تعریف شده است.  “name=”workmap
3. مقدار usemap برابر نام خاصی که برای تگ map تعریف شده قرار داده شده است.بااین کار ارتباط بین تصویر و نقشه را ایجاد شده است.
4. با تگ <area> و ویژگی هایی که برای آن تعریف شده است مناطق قابل کلیک  مشخص شده است.

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

<!DOCTYPE html>
<html>
<body>

<h2>Image Maps</h2>
<p>Click on the computer, the phone, or the cup of coffee to go to a new page and read more about the topic:</p>

<img src="workplace.jpg" alt="Workplace" usemap="#workmap" width="400" height="379">

<map name="workmap">
 <area shape="rect" coords="34,44,270,350" alt="Computer" href="computer.htm">
 <area shape="rect" coords="290,172,333,250" alt="Phone" href="phone.htm">
 <area shape="circle" coords="337,300,44" alt="Cup of coffee" href="coffee.htm">
</map>

</body>
</html>

 

 

تصویر پس زمینه :

در html می توان یک تصویر را به عنوان پس زمینه برای یک  عنصر صفحه انتخاب کرد.

برای اضافه کردن تصویر پس زمینه ازتگ style که یک تگ css است می توانید استفاده کنید.

در مثال زیر پس زمینه بدنه اصلیصفحه وب را با تعریف تگ استایل درون body و مقدار دهی آن تغییر داده ایم.

 

<!DOCTYPE html>
<html>
<body style="background-image:url('clouds.jpg')">

<h2>Background Image</h2>

<p>By default the background image will repeat itself if it is smaller than the element where it is specified, in this case the BODY element.</p>

</body>
</html>

در مثال زیر پس زمینه پاراگراف صفحه وب را با تعریف تگ استایل درون تگ p و مقدار دهی آن تغییر داده ایم.

 

<!DOCTYPE html>
<html>
<body>

<h2>Background Image</h2>

<p style="background-image:url('clouds.jpg')">
You can specify background images<br>
for any visible HTML element.<br>
In this example, the background image<br>
is specified for this paragraph.<br>
By default, the background-image<br>
will repeat itself in the direction(s)<br>
where it is smaller than the element<br>
where it is specified. (Try resizing the<br>
browser window to see how the<br>
background image behave.
</p>

</body>
</html>

عنصر <picture> :

در html 5 این عنصر تعریف شده است تا انعطاف پذیری را هنگام افزودن منابع تصویر بالا ببرد.

عنصر <picture> حاوی تعدادی از عناصر <source> است که هر کدام به منابع تصویری اشاره دارند.

به این ترتیب مرورگر می تواند تصویری را انتخاب کند که به بهترین شکل متناسب با نمای فعلی یا دستگاه باشد.

هرعنصر source دارای خصوصیاتی است که تصاویر را توصیف می کند تا تصویر متناسب توسط مرورگر انتخاب شود.

مرورگر از اولین عنصر source متناسب استفاده می کند و سایر آنها را نادیده می گیرد.

<picture> 

  <source media="(min-width: 650px)" srcset="img_pink_flowers.jpg">   

<source media="(min-width: 465px)" srcset="img_white_flower.jpg">  

 <img src="img_orange_flowers.jpg" alt="Flowers" style="width:auto;"> 

</picture>

 

 

نکته : مرورگرهایی هستند که از تگ picture پشتیبانی نمی کنند.یا هیچ کدام از تگ های source مطابقت ندارند

بنابراین همیشه سعی کنیدکه در آخر ازتگ img استفاده کنید.

نرم افزارهای خواننده صفحه html :

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

این نرم افزارها برای افرادی که نابینا هستند و یا دارای معلولیت و آسیب دیدگی هستند کاربرد دارد.

خلاصه این جلسه :

1. برای تعریف تصویر در Html از تگ <img> استفاده کنید.
2. از خصوصیت  src برای تعریف URL تصویر استفاده کنید.
3. از خصوصیت alt برای نوشتن متن توضیح برای یک تصویر استفاده کنید.
4. برای تعیین اندازه تصویر از خصوصیت width و height در html استفاده کنید.
5. برای تعیین اندازه تصویر از تگ style که یک تگ css است می توانید استفاده کنید.
6. برای شناور کردن تصاویر از ویژگی float که یک ویژگی css است استفاده کنید.
7. از تگ <map> برای تعریف نقشه تصویر استفاده کنید.
8. از تگ <area> برای مشخص کردن مناطق قابل کلیک در نقشه تصویر استفاده کنید.
9. از تگ usemap عنصر <img> برای اشاره به یک نقشه تصویر استفاده کنید.
10. برای نمایش تصاویر مختلف برای دستگاه های مختلف از تگ  <picture> استفاده کنید.

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

منبع : همراه آی سی تی

 

معرفی عناوین و خصوصیات HTML

اگر قصد داشته باشید با HTML کار کنید، سر و کار داشتن با attributes یا همان خصوصیت در HTML برای شما اجتناب ناپذیر خواهد بود. همچنین مبحث عنوان یا تیتر در HTML هم مقوله‌ای است که می‌تواند هم روی ظاهر سایت شما تاثیرگذار باشد، هم به صورت مستقیم روی سئو سایت تاثیر بگذارد. در قسمت سوم آموزش HTML مقدماتی، با لیداوب همراه باشید تا بیشتر با این عامل مهم طراحی سایت آشنا شوید.

خصوصیات یا attributes در HTML

Attribute یا خصوصیات HTML در واقع اطلاعات بیشتری در مورد عناصر HTML ارائه می‌دهند. تمام عناصر HTML می‌توانند دارای خصوصیت باشند. خصوصیات HTML همیشه در تگ آغازین مشخص شده و در جفت‌های نام/ مقدار (name=”value”) می‌آیند.

خصوصیت href

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

<a href="https://www.lydaweb.com">This is a link</a>

خصوصیت src

تصاویر HTML با تگ <img> مشخص می‌شوند. نام فایل منبع تصویر در خصوصیت src مشخص می‌شود:

<img src="img_girl.jpg">

خصوصیات عرض و طول

تصاویر در HTML دارای مجموعه‌ای از خصوصیات اندازه هستند که عرض و ارتفاع تصویر را مشخص می‌کند:

<img src="img_girl.jpg" width="500" height="600">

اندازه تصویر به صورت پیکسل مشخص می‌شود مثلا width= “500” یعنی عرض تصویر ۵۰۰ پیکسل باشد. 

خصوصیت alt

خصوصیت alt نشان‌دهنده متن جایگزین است که در صورت عدم توانایی مرورگر جهت نمایش تصویر باید به کار رود. مقدار این خصوصیت می‌تواند توسط صفحه‌خوان‌ها خوانده شود.

<img src="img_girl.jpg" alt="Girl with a jacket">

خصوصیت alt در زمانی که تصویری وجود نداشته باشد هم مفید است. در زیر مثالی را خواهید دید که در آن تلاش بر نمایش تصویری می‌شود که وجود ندارد:

<img src="img_typo.jpg" alt="Girl with a jacket">

خصوصیت style

خصوصیت style برای مشخص کردن آرایش و استایل یک عنصر مثل رنگ، فونت، اندازه و سایر موارد به کار می‌رود در زیر یک نمونه از این خصوصیت خواهید دید:

<p style="color:red">I am a paragraph</p>

خصوصیت lang

زبان سند را می‌توان در تگ <html> و با خصوصیت lang مشخص کرد. مشخص کردن زبان برای دسترسی‌پذیری اپلیکیشن‌ها (صفحه‌خوان) و موتورهای جستجو ضروری است:

<!DOCTYPE html>
<html lang="en-US">
<body>

...

</body>
</html>

دو حرف اول (en) زبان را مشخص می‌کند. اگر گویش خاصی مد نظر باشد با دو حرف دیگر (US) مشخص خواهد شد.

خصوصیت title

در اینجا خصوصیت title به عنصر <p> اضافه می‌شود. وقتی اشاره‌گر ماوس را روی پاراگراف قرار دهید، مقدار خصوصیت title به صورت یک تولتیپ (tooltip) نمایش داده خواهد شد:

<p title="I'm a tooltip">
This is a paragraph.
</p>

از خصوصیات با حروف کوچک استفاده کنید

در استاندارد HTML5 نیازی به نوشتن نام خصوصیات با حروف کوچک نیست. خصوصیت عنوان را می‌توان با حروف کوچک (title) یا حروف بزرگ (TITLE) نوشت اما کنسرسیوم وب جهانی توصیه به استفاده از حروف کوچک در HTML می‌کند.

مقادیر خصوصیات را در علامت نقل قول قرار دهید

استاندارد HTML شما را مقید به قرار دادن مقادیر خصوصیات در داخل علامت نقل قول نمی‌کند اما بهتر است این کار را انجام دهید. خصوصیت href که در بالا آمد را می‌توان به صورت زیر نوشت:

<a href=https://www.lydaweb.com>

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

<p title=About lydaweb>

نقل قول جفت یا تکی

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

<p title='John "ShotGun" Nelson'>

یا بالعکس: 

<p title="John 'ShotGun' Nelson">

 عنوان در HTML

عنوان یا Heading در HTML با تگ‌های <h1> تا <h6> تعریف می‌شوند. تگ <h1> مهم‌ترین عنوان و <h6> کم‌ اهمیت‌ترین عنوان را مشخص می‌کنند. در نمونه زیر این ترتیب رعایت شده است:

<h1>Heading 1</h1>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h5>Heading 5</h5>
<h6>Heading 6</h6>

به یاد داشته باشید که مرورگرها به صورت خودکار قبل یا بعد از عنوان کمی فضای سفید اضافه می‌کنند.

عنوان ها مهم هستند

موتورهای جستجو از عنوان‌ها برای ایندکس کردن ساختار و محتوای صفحات وب سایت شما استفاده می‌کنند. کاربران از طریق عنوان‌هایی که برای صفحات خود انتخاب کرده‌اید به محتوای آن‌ها پی می‌برند. بنابراین باید از عناوینی استفاده کنید که ساختار سند شما را نشان دهند. عنوان‌های <h1> باید برای عناوین اصلی استفاده شده و به دنبال آن عنوان <h2> قرار گرفته و پس از آن به ترتیب عنوان‌های کم اهمیت‌تر <h3> و بقیه قرار خواهند گرفت. یادتان باشد که از عنوان‌های HTML برای بزرگ یا برجسته کردن متن استفاده نکنید.

عنوان های بزرگ تر

هر عنوان HTML دارای یک اندازه پیش‌فرض است. البته شما می‌توانید اندازه هر یک از عنوان‌ها را با خصوصیت style مشخص کنید که در زیر یک نمونه از آن را می‌بینید:

<h1 style="font-size:60px;">Heading 1</h1>

ترسیم خط افقی در HTML

تگ <hr> یک شکست در متن موجود در صفحه HTML ایجاد می‌کند و اغلب به شکل یک خط افقی نمایش داده می‌شود. عنصر <hr> برای تفکیک محتوا (یا تعریف یک تغییر) در یک صفحه HTML به کار می‌رود. در زیر یک نمونه استفاده از این تگ را مشاهده خواهید کرد:

<h1>This is heading 1</h1>
<p>This is some text.</p>
<hr>
<h2>This is heading 2</h2>
<p>This is some other text.</p>
<hr>

عنصر <head> در HTML

عنصر <head> در HTML هیچ ارتباطی با عناوین HTML ندارد. این عنصر دربردارنده‌ی متا دیتا یا ابر داده است. ابرداده در واقع داده‌هایی در مورد آن سند HTML است که در صفحه وب سایت نمایش داده نمی‌شود. عنصر <head> بین تگ <html> و تگ <body> قرار می گیرد:

<!DOCTYPE html>
<html>

<head>
  <title>My First HTML</title>
  <meta charset="UTF-8">
</head>

<body>
.
.
.

معمولا متا دیتا عنوان، مجموعه کاراکترها، استایل‌ها، لینک‌ها، اسکریپت‌ها و دیگر اطلاعات سند را تعریف می‌کند.

چطور منبع HTML را مشاهده کنیم؟

تا به حال شده است یک صفحه از وب سایتی را مشاهده کرده و از خود بپرسید سازندگان آن چطور همه ‌آن کارها را کرده‌اند؟ کافی است روی صفحه مورد نظر کلیک راست کرده و گزینه «View Page Source» در مرورگر کروم یا «View Source» در اینترنت اکسپلورر و گزینه‌های مشابه در دیگر مرورگرها را انتخاب کنید. با این کار پنجره‌ای باز می‌شود که حاوی کد منبع HTML آن صفحه است. روی یک عنصر یا در یک ناحیه خالی کلیک راست کرده و گزینه «inspect» یا «inspect element» را انتخاب کنید تا ببینید عناصر از چه کدهایی (HTML و CSS) ساخته شده‌اند. همچنین می‌توانید به عنوان تمرین کدهای صفحه را برای خود تغییر داده و نتیجه را مشاهده کنید (این کدها در وب‌ سایت اصلی ذخیره نخواهند شد).

لینک ها در html

در چهارمین شماره از آموزش HTML، شما با نحوه قرار دادن لینک در صفحه‌هایتان آشنا خواهید شد. بعد از این جلسه شما خواهید توانست صفحات اچ تی ام ال‌ خود را به صفحات دیگر لینک نمایید. برای آشنایی با نحوه چگونگی استفاده از لینک در اچ تی ام ال با ما همراه شوید.در بخش‌های قبلی آموزش اچ تی ام ال با تگ پاراگراف و نحوه نوشتن متن و قرار دادن عنوان در صفحات آشنا شدیم. حالا شما می‌توانید با ساخت یک صفحه اچ تی ام ال (بخش اول)، متن‌های خود را در آن وارد نمایید(بخش دوم) و برای آن‌ عنوان قرار دهید. حالا در انتهای این شماره شما قادر خواهید بود تا صفحات خود را به یکدیگر متصل نمایید. جالب است, نه؟ برای یادگیری قدم به قدم قرار دادن لینک در صفحه, با ما همراه شوید.

قرار دادن لینک در صفحه تگ <a>

;لینک‌ها یکی از پراستفاده‌ترین المان‌های اچ‌تی‌ام‌ال هستند و در واقع این لینک‌ها هستند که کاربران شما را به جایی که 

شما می‌خواهید هدایت می‌کنند. به مثال زیر دقت کنید:

نمونه کد

< a href  = "http://zoomit.ir"> متنی که به عنوان نماینده لینک در مرورگر نشان داده می 

شود</ a >

نتیجه‌ای که مرورگر نمایش خواهد داد

 

 متنی که به عنوان نماینده لینک در مرورگر نشان داده می شود 

برای قرار دادن لینک در اچ تی ام ال مراحل زیر را طی می‌کنیم.

<a href= "آدرس لینک">   link name </a>

مرحله اول: برای اضافه کردن لینک به بخشی از صفحه, ابتدا علامت مخصوص آن، یعنی <a> را قرار داده‌ایم.

مرحله دوم: سپس یک کلمه دیگر به نام href را در کنار لینک قرار داده‌ایم که در واقع مقصد لینک شما را معین می‌کند. 

مرحله سوم: در بین تگ‌های <a href="link"></a> کلمه یا متنی که قرار است  نماینده لینک در صفحه باشد را نوشته‌ایم.

مرحله چهارم:  در نهایت تگ a را  بسته‌ایم <a/>.

< a href  = "(URL)">  نام لینک مورد نظر </ a >

نکته: هر چند نیازی به دانستن این موضوع در این لحظه نیست ولی شاید دوست داشته باشید بدانید که کلمه href که در کنار کلمه a در تگ لینک قرار می گیرد چیست و چه نقشی دارد.

در واقع برخی تگ‌های اچ تی ام ال از جمله تگ لینک, عکس و بسیاری دیگر به صورت پیش فرض برای تعریف شدن و تکمیل شدن به یک مشخصه (Attribute) نیاز دارند که آن‌ها را توضیح می‌دهد و تکمیل می‌کند. در این مثال, کلمه href که مقصد لینک در تگ a را مشخص می‌کند یک صفت تکمیل کننده برای تگ a است.

ما در بخش‌های بعدی از چنین کلماتی به مکرر استفاده خواهیم کرد و شما هم با اهمیت آن بیشتر از پیش آشنا خواهید شد. پس حالا که آشنایی ابتدایی با این تگ پیدا کرده‌اید شما را به خواندن ادامه آموزش‌ها دعوت می‌کنیم.

خلاصه قسمت چهارم:

در این قسمت چیزهایی که یادگرفته‌ایم را به صورت کاملا خلاصه مرور می‌کنیم.

• در قسمت چهارم از آموزش اچ تی ام ال, نحوه لینک گذاری در صفحات اچ‌تی‌ام‌ال را نیز آموختیم.
• تگ لینک به صورت <a/> متن لینک <"آدرس صفحه مقصد در لینک"=a href> نوشته می‌شود.

 نوبت شما

خب نوبتی هم که باشد، دیگر نوبت شما است. پس همین حالا دست به کار شوید و به ما نشان دهید که همه چیزهایی که گفته‌ایم را آموخته‌اید. این شما و ادیتور آنلاین:

امیدواریم که این  آموزش هم، موفق به جلب رضایت شما زومیتی‌های عزیز شده باشد. قسمت‌های قبلی این مجموعه مقالات را از دست ندهید. تجربیات، پیشنهادات و نظرات شما بدون شک در ادامه این مقالات آموزشی تاثیر بسزایی خواهد داشت و قدردانی ما را هم به همراه خواهد داشت. پس لطفا با ما در ارتباط باشید.

تهیه شده توسطزومیت

عناصر پایه ای در HTML

از اینکه احیاناً در مثال ها از تگ هایی که شما نیاموخته اید استفاده می شود نگران نباشید.

در فصل های بعد آنها را خواهید آموخت.

---

عنوان ها (Heading)

 

Wiki

 عنوان ها در HTML به وسیله تگ های <h1> تا <h6> تعریف می شوند.

مثال (عناصر پایه ای در HTML

<h1>This is a heading</h1>
<h2>This is a heading</h2>
<h3>This is a heading</h3>

پاراگراف (Paragraph)

 

Wiki

پارگراف ها در HTML به وسیله تگ <p> تعریف می شوند.

مثال (عناصر پایه ای در HTML)

<p>This is a paragraph.</p>

<p>This is another paragraph.</p>

---

لینک ها (Link)

 

Wiki

لینک ها در HTML به وسیله تگ <a> تعریف می شود.

مثال (عناصر پایه ای در HTML)

<a href="http://www.beyamooz.com">This is a link</a>

توجه: آدرس لینک، در خصوصیت href مشخص می شود.

(در فصل های بعدی این خودآموز راجع به خصوصیت های عناصر، بیشتر خواهید آموخت.)

---

تصاویر (Image)

 

Wiki

تصاویر در HTML به وسیله تگ <img> تعریف می شود.

مثال (عناصر پایه ای در HTML)

<img src="/beyamooz_logo.png" width="104" height="142" alt="beyamooz.com" />

توجه: نام و سایز عکس به وسیله خصوصیت ها مشخص می شود.

  منبع : بیاموز

20 نکته ارزشمند در سئو سایت

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

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

چرا باید سایت مان را سئو کنیم؟

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

بسیاری از دوستان فقط به فکر این هستند که بازدیدکننده از گوگل بگیرند و اصلا به این فکر نمی کنند که بعدش قرار است چه اتفاقی بیافتد! آیا سایتشان برای کاربر بهینه است یا خیر؟ آیا با سایتشان می توانند اطلاعات کاملی در اختیار بازدیدکنندگان شان قرار دهند یا خیر؟ آیا کاربران به آن ها اعتماد می کنند یا خیر؟

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

1.محتوا خیلی مهم است

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

زمانی که سایت شما محتوای خوبی نداشته باشد واقعا سئو کردن آن کاری اشتباه است. محتوای سایت شما ارتباط مستقیم با بسیاری از فاکتورهای مهم در سئو دارد.

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

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

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

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

2.برای مخاطبانتان محتوا تولید کنید نه گوگل!

این که محتوایی که در سایت خود قرار می دهید باید بر اساس سئو باشد را با محتوایی که برای مخاطبانتان تولید می کنید را اشتباه نگیرید. منظور این نیست که محتواتون نباید سئو شده باشد بلکه منظور این است که محتوایی که تولید می کنید در وحله اول باید برای مخاطبانتان اهمیت داشته باشد. خیلی نباید به این فکر کنید که گوگل در مورد محتوای شما چه فکری می کند.

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

اگر محتواتون همان چیزی باشد که کاربرانتان می خواهند مطمئن باشید گوگل عاشق سایت شما می شود.

3.محتوای طولانی تولید کنید

در کشورهای خارجی وبلاگ نویس ها بر سر طول محتوای شان با هم رقابت می کنند. مقالاتی که می نویسند امکان ندارد زیر 4 هزار لغت باشد. شما هم باید طول مقالات خود را بالا ببرید. گوگل محتوایی را کامل و جامع می داند که طول آن زیاد باشد.

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

مطمئن باشید اگر مقالاتی با طول بیشتر از 3000 کلمه تولید کنید گوگل رتبه خوبی به آن ها می دهد. امتحان کنید و نتیجه را ببینید. در بسیاری از مواقع دیگر حتی نیازی به اشتراک گذاری آن ها نیست و به راحتی رتبه خوب می گیرند.

4.به جست و جوی کاربران توجه کنید

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

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

5.بر روی عناوین سوالی کار کنید

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

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

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

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

6.محتوای قدیمی را بروز کنید

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

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

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

7.از کپی محتوا دست بر دارید

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

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

پس همانطور که تا اینجا متوجه شده اید همه چیز محتوا است. سایتی که محتوا ندارد هیچ حرفی هم برای گفتن ندارد.

8.استفاده از سایر فرمت های محتوایی

در تولید محتوا تنوع داشته باشد. تولید محتوا فقط نوشتن مقاله نیست! تولید ویدیو و پادکست هم جزئی از محتواهای مورد علاقه کاربران هستند. سعی کنید مقالات خود را با تنوع بیشتری تولید کنید. مثلا قسمتی از مقاله خود را به صورت صوت یا قسمتی از آن را به صورت ویدیو تولید و در سایت قرار دهید.

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

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

9.به دیگر مقالات خود لینک بدهید

یکی از مهمترین فاکتورها در سئو ارتباط بین صفحات داخلی سایت است. با لینک دادن به دیگر صفحات سایتتان به گوگل می فهمانید که آن صفحات از سایتتان هم مهم هستند.

سعی کنید به خوبی این ارتباط را برقرار کنید. به مقالات مرتبط به مقاله خود حتما لینک بدهید. هم می توانید عینا با همان عنوان مقاله مورد نظر به آن لینک دهید و هم اینکه کلمه کلیدی مهمی که در عنوان مقاله مورد نظرتان که قصد دارید به آن لینک دهید را در محتوای خود پیدا کنید و دقیقا با همان انکر تکست به آن لینک دهید.

تعداد لینک های داخلی نباید زیاد باشد. سعی کنید مثلا در مقاله ای که 1000 کلمه دارد 10 تا لینک داخلی به روش های مختلف به دیگر صفحات سایتتان بدهید.

10.به منابع معتبر لینک دهید

با لینک دادن به منابع معتبر اهمیت مقاله خود را بالا ببرید. سعی کنید تا جایی که ممکن است در مقالات خود به منابع معتبر مثل ویکی پدیا لینک دهید. مثلا اگر در مورد بررسی بک لینک های رقبا مقاله ای نوشتید که در آن به سایت MOZ هم اشاره ای کرده اید به آن لینک مستقیم بدهید. با این کار گوگل می فهمد که مقاله شما ارتباطی با منابع معتبر دارد و اهمیت آن را فوق العاده بالا می برد.

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

11.تعداد بک لینک ها مهم نیستند!

نه اینکه تعداد بک لینک ها مهم نباشند، اما چه بک لینکی؟ خیلی از دوستان فکر می کنند هر چه تعداد یونیک بک لینک هایی که در الکسا می بینند بیشتر باشد اهمیت بیشتری برایشان دارد. در صورتی که اینطور نیست! هیچ گاه کمیت را به کیفیت ترجیح ندهید. کیفیت بک لینک ها هستند که تاثیر گذاری خود را در نتایج جست و جو نشان می دهند نه تعدادشان.

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

12.در ساخت بک لینک ها طبیعی رفتار کنید

در ساخت بک لینک ها باید کاملا طبیعی رفتار کنید. همانطور که می دانید ساخت بک لینک توسط خودتان جزئی از روش های سئوی کلاه سیاه است. پس به خاطر همین باید خیلی طبیعی رفتار کنید تا گوگل به شما شک نکند و پیش خود فکر کند بک لینک ها کاملا طبیعی ساخته می شوند.

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

برای اینکه پروسه لینک بیلدینگ تان کاملا طبیعی جلوه داده شود بهتر است در زمان های مختلف بک لینک های سایت خود را بسازید. همچنین بهتر است از انواع بک لینک ها در پروسه لینک بیلدینگ خود استفاده کنید.

یعنی مثلا هم از سایت های با کیفیت لینک بگیرید و هم از سایت های بی کیفیت. هم از طریق کامنت گذاشتن بک لینک بگیرید هم از طریق اشتراک مقاله در سایت های دیگر.

به این ترتیب می توانید پروسه لینک سازی سایت خود را کاملا طبیعی انجام دهید تا گوگل هم به شما هیچ وقت شک نکند.

13.شبکه های اجتماعی را فراموش نکنید!

فعالیت در شبکه های اجتماعی را هیچ وقت کنار نگذارید. اگر به فعالیت در شبکه های اجتماعی تا الان اعتقادی نداشته اید باید بدانید بزرگترین اشتباه را در سئو مرتکب شده اید. منظور از فعالیت یعنی هر پستی که در سایت خود می گذارید را در شبکه های اجتماعی خود هم به اشتراک بگذارید. کار سختی نیست! با این کار اهمیت سایت شما بسیار بالا می رود و گوگل روی سایت شما حساب جداگانه ای باز می کند.

اشتراک گذاری مقالات سایت در فیسبوک و بویژه گوگل پلاس تاثیر بالایی در افزایش رتبه سایت شما در نتایج جست و جو می گذارد. البته این امر زمان بر است.

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

14.با کاربرانتان در تعامل باشید

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

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

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

15.از هاست با کیفیت استفاده کنید

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

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

16.سرعت سایت خود را بهینه کنید

گوگل سایت های پر سرعت را دوست دارد. سایت هایی که مدت زمان کمی کاربران خود را منتظر ارائه دادن مطالب خود می گذارند. علاوه بر صفحه اول سایت شما، صفحات داخلی سایت تان نیز باید به سرعت باز شوند. اگر وب سایت شما وردپرسی است اصلا جای نگرانی نیست! با افزونه های زیادی که در این زمینه وجود دارند به راحتی می توانید سرعت سایت خود را بالا ببرید.

17.فقط روی یک یا چند فاکتور تمرکز نکنید

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

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

اگر می خواهید اصولی سایتتان را سئو کنید و در نتایج جست و جو ماندگار شوید بهتر است از همان اول روی تمام فاکتورهای مهم در سئو کار کنید.

18.فقط روی صفحه اول تمرکز نکنید

اگر می خواهید از طریق سئو ترافیک سایت تان را چندین برابر کنید و فروش خود را افزایش دهید فقط نباید روی صفحه اول سایتتان تمرکز کنید. اینکه صفحه اول سایتتان در نتایج جست و جو رتبه خوبی داشته باشد بسیار خوب است ولی باید به این نکته هم توجه کنید که صفحات دیگر سایت شما باعث جذب بیشتر مخاطبانتان می شوند خصوصا صفحات فرود سایت شما! مگر صفحه اول سایت تان را نهایتا روی چند کلمه کلیدی می توانید سئو کنید؟

باید سعی کنید بازدیدکنندگان سایتتان را به صفحاتی از سایتتان بکشانید که از آن طریق بتوانید آن ها را به کاربران سایتتان تبدیل کنید. در غیر این صورت سئوی سایت برای تان سود نخواهد داشت.

19.سئو فرایندی دائمی است

سئو کار یکی دو روز نیست! بلکه پروسه سئو روی سایتتان باید روند طبیعی خود را داشته باشد. بعضی از دوستان با رساندن سایت خود به جایگاه مورد نظرشان دست از سئوی سایشان بر می دارند. دیگر خبری از لینک سازی نیست! دیگر مثل قبل محتوا تولید نمی کنند.

در صورتی که این طور نباید باشد. باید مثل قبل روند سئوی سایتتان طی شود. تداوم در سئو خیلی مهم است. هرگز نباید از سئو کردن سایتتان دست بردارید. اگر می خواهید جایگاه سایتتان در نتایج جست و جو همیشگی باشد نباید دست از کار بر دارید. مطمئن باشید رقبای شما هر روز در تلاش اند تا در نتایج جست و جو به شما برسند.

20.صبر داشته باشد

بزرگترین اشتباهی که خیلی از دوستان در سئو مرتکب می شوند این است که صبر ندارند. سئوی سایت مثل دیگر روش های تبلیغاتی زود بازده نیست! سئو مثل تبلیغات گوگل ادوردز نیست. در تبلیغات گوگل هر زمان که پول بدهید در کمتر از 15 دقیقه می توانید سایت خود را در رتبه اول نتایج جست و جو ببینید. ولی سئو اینطور نیست!

برای اینکه بخواهید نتیجه واقعی زحمات خود را در سئو ببینید باید صبر داشته باشید. از سه تا شش ماه یا حتی یک سال باید صبر کنید تا نتیجه واقعی تغییرات را ببینید.

اگر می خواهید در سئو نتیجه بگیرید باید صبر داشته باشید. فرق سئو با دیگر روش ها این است که زمانی که به نتیجه دلخواهتان برسید دیگر کار تمام است. دیگر نیازی به هزینه کردن برای تبلیغات نیست. در واقع در سئو باید برای بلد مدت سرمایه گذاری کنید.

جمع بندی مطالب

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

پیشنهاد می کنم برای یادگیری سئو به صورت حرفه ای حتما وب سایت همیار وب را همیشه دنبال کنید.

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

منبع : http://hamyareweb.co/category/seo/