کدنویسی و طراحی با لبخند

بخندید و برنامه نویسی یاد بگیرید!

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

هدف ما اینست که سهم هر چند کوچک در آموزش طراحی و برنامه نویسی داشته باشیم و همراه با خنده و تفریح آموزش بدیم!

مشاهده آموزش ها
کل آموزش ها
25
نظرات و عقیده
11
وردپرس
8
آموزش طراحی
5

مراحل طراحی یک قالب وردپرس

طراحـــــی ، قدرت تخیلی در قالب کد

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

"<yoastmark

 

منظور از سئو چیست؟

 

سئو مخفف واژه‌ی Search engine optimization می‌باشد؛ می‌توانیم بهینه‌سازی سایت برای موتور‌های جستجوگر را معادل فارسی این واژه در نظر بگیریم. سئو انواع مختلفی دارد، از جمله سئو کلاه سفید، سئو کلاه خاکستری و سئو کلاه سیاه؛ استودیو ابافت به هیچ عنوان سئو کلاه‌سیاه و سئو کلاه‌خاکستری را توصیه نمی‌کند؛ چرا که هدف از سئو باید صرفا بهینه‌سازی باشد و شما در واقع به گوگل کمک کنید که بهترین نتایج را به کاربر نشان دهد نه این که سعی کنید گوگل را گول بزنید؛ این امر باعث جریمه‌شدن سایت شما از طرف گوگل می‌شود؛ شاید مدت کوتاهی در حد چند ماه فروش یا بازدید شما را بیشتر کند ولی در نهایت با خطر پنالتی مواجه هستید. پنالتی از طرف گوگل یعنی اینکه سایت شما به کل از نتایج جستجو حذف شود و عملا هیچ جایگاهی در اینترنت نداشته باشید.

اول و مهمترین موضوع در سئو قالب شماست؛ در مقاله‌ای با عنوان ویژگی‌های یک قالب ایده‌آل وردپرس چیست این موارد را توضیح داده‌ایم، می‌توانید مطالب آن مقاله را مطالعه کرده و دوباره به این مقاله برگشته و ادامه دهید.

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

 

سرعت لود سایت نکته‌ی مهم در سئو

نقش سرعت لود در سئو چیست؟

 

آموزش افزایش سرعت لود سایت

 

فشرده سازی کد‌های HTML,JS,CSS

 

اولین قدم برای افزایش سرعت لود، فشرده‌سازی کد‌های استایل، اسکریپت‌ها و حتی خود کد‌های اچ‌تی‌ام‌ال قالب است، با این‌کار حجم کد‌های سایتتان به قدر قابل توجهی کاهش می‌باید و این باعث افزایش سرعت لود و سئو شما می‌شود. برای مینیفای و فشرده کردن کد های اچ‌تی‌ام‌ال از ابزار سایت تکست فیکسر، و برای مینیفای کردن کد های استایل از سایت سی‌اس‌اس مینیفر و برای جاوا اسکریپت از سایت جاوا اسکریپت مینیفر استفاده کنید؛ البته اگر از سیستم مدیریت محتوای محبوب وردپرس استفاده می‌کنید، روش منطقی‌تر این است که از افزونه‌ای به نام WP-Rocket استفاده نمایید. این افزونه قابلیت های زیادی دارد که فقط یکی از آن‌ها فشرده‌سازی سورس‌کد‌هاست. با این افزونه سرعت لود سایتتان را می‌توانید در حد خیلی بالایی بهبود ببخشید و قاعدتا سئو آن را بالا ببرید؛ اگر نمی‌دانید چگونه از ابزار‌های معرفی شده استفاده کنید، پاسخ خیلی ساده است؛ تنها کافیت در پنل دایرکت‌ادمین یا سی‌پنل خود فایلهای مربوطه را Edit کرده و بعد از کپی پیست به ابزار‌های معرفی شده خروجی آن‌ها را به جای کد‌های موجود قرار داده و فایل را ذخیره کنید. به همین سادگی!

 

نقش ادغام فایلها در سئو چیست؟

 

اگر بپرسید راه‌دیگر افزایش سئو چیست؟ باید بگویم این است که تعداد Request ها یا درخواست‌هایی که از مرورگر به سرور می‌شود را کاهش دهید. اما ربط این موضوع به سئو چیست؟ ببینید هر چقدر تعداد ریکوئست کاربران به سرور بیشتر باشد زمان لود سایتتان بیشتر خواهد شد و این یعنی Block Time سایتتان زیادتر خواهد شد؛ بلاک تایم یعنی زمانی که کاربر باید صبر کند تا سایتتان به طور کامل لود شود تا بتواند با آن تعامل داشته باشد. این موضوع هم در ابزار گوگل اسپید که پیشتر معرفی کرده بودیم و هم در سایت جی‌تی‌متریکس قابل مشاهده است؛ اما توجه کنید که در جی‌تی‌متریکس بر‌اساس موقعیت سرور هاست خود، سرور تست را تنظیم نمایید در غیر این‌صورت نتیجه دریافتی اشتباه خواهد بود؛ مثلا استودیو ابافت در سرور اروپا قرار دارد و اگر با سرور کانادا آن را تست کنید، اطلاعات صحیحی را دریافت نخواهید کرد، در حالی که سرعت لود سایت ما چیزی در حدود ۲.۹ ثانیه می‌باشد.

برای ادغام فایل‌ها می‌توانید کل کد‌های js را در یک فایل .js و کل کد‌های CSS را در یک فایل .css فراخوانی کنید؛ البته دقت داشته باشید اگر از کتابخانه‌ی جاوا اسکریپتی یا از بوت استرپ استفاده می‌نمایید؛ این کد‌ها‌را قبل از سایر کد‌ها قرار دهید؛ وگرنه در زمان مناسب فراخوانی نمی‌شوند و این برای شما دردسر‌ساز خواهد شد.

 

فونت آیکون‌ها و SVG حجم کم ولی کیفیت و انعطاف بالایی دارند

عکس‌ها را با فونت آیکون و SVG جایگزین کنید

 

فونت آیکون‌ها دقیقا مانند فونت‌هایی هستند که در سایت برای نگارش متون از آن‌ها استفاده می‌کنید و وقتی یک‌بار در سیستم کاربر لود شود بلافاصله در حافظه‌ی کش مرورگر وی برای فراخوانی‌های بعدی ذخیره می‌شود این موضوع باعث می‌شود سرعت لود سایت شما خیلی افزایش یابد در حالی که اگر از تصاویر استفاده کنید در خوشبینانه‌ترین حالت اگر ۱۰ عدد تصویر در سایت خود داشته باشید و هر کدام ۱۰۰ کیلوبایت حجم داشته باشند، ۱ مگابایت حجم سایت شما بیشتر خواهد شد و اگر سرعت اینترنت کاربری ۱۰۰ کیلوبایت در ثانیه باشد این یعنی اینکه برای لود کامل سایت شما ۱۰ ثانیه بیشتر زمان نیاز است، در حالی که باید زمان لود کل سایت شما کم‌تر از ۳ ثانیه باشد، با این تفاسیر می‌توانید این فاجعه را درک کنید!

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

 

استفاده از بارگذاری تنبل تصاویر

 

گاهی اوقات شما مجبور هستید از تصاویر در سایت استفاده کنید؛ این موضوعی قابل درک است و من شما را کاملا درک می‌کنم! برای انجام این موضوع می‌توانید از چیزی به نام Images LazyLoad استفاده کنید که معادل فارسی آن، بارگذاری تنبل تصاویر می‌‌باشد. البته اسم با‌کلاسی دارد ولی یک چیز واقعا ساده هست؛ یعنی اینکه کاری کنیم تا عکس‌ها در لود اولیه سایت ما لود نشوند و کاربر وقتی برای دیدن عکس‌ها و محتوای سایت شما، به پایین اسکرول می‌کند این ریکوئست به سرور ارسال شده و همزمان با رسیدن کاربر به هر عکس، همان عکس بارگذاری شود. می‌توانید با چند ده سطر جاوا اسکریپت ساده این کار را انجام دهید و یا می‌توانید از همان افزونه WP-Rocket در صورت استفاده از سیستم مدیریت محتوای وردپرس با چند کلیک ساده این ویژگی را پیاده‌سازی کنید.

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

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

به نظر می رسد که شما نوتیفیکیشن را مسدود کرده اید!
اشتراک گذاری
شاید این مطالب را نیز بپسندید
دیدگاه یا سوال خود را مطرح کنید
guest
0 نظر/ سوال و جواب
Inline Feedbacks
View all comments
0
اگر سوال یا دیدگاهی دارید ، مطرح کنید!x
()
x