در این مطلب قصد داریم به این بپردازیم که چه مواردی توسط یک توسعه دهنده رابط کاربری ( Front-end Developer ) باید رعایت شود.

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

تگ ها ( Tags )

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

به طور مثال به کد زیر توجه کنید:

عنوان یک مقاله

همانطور که در صفحه ویکی مستندات به آن اشاره شده است، تگ 

 در اینجا اضافی است و کاربردی ندارد و باید حذف شود.

تعریف تگ 

:

یک گروه از مواردی که برای معرفی به کار میروند و یا یک سری موارد برای پیمایش ( navigation )

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

 

نقش ها ( Roles )

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

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

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

استایل ها ( CSS )

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

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

جاواسکریپت ( JavaScript )

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

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

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

تصاویر ( Images )

خیلی نمیخواهم در این باره توضیح دهم، زیرا از حوزه تخصص من خارج است؛ اما تمام تصاویری که در وبسایت بارگذاری میشود را کم حجم ( Optimize ) کنید.

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

چند نکته

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

1. روز به روز بر هوشمندی موتورهای جستجو افزوده میشود. بنابراین به طور کل روش های فریباننده را فراموش کنید. شاید امروز از آنها نتیجه بگیرید، اما ممکن است فردا گوگل بفهمد و دیگر از شما خوشش نیاید.
2. اسکریپت ها و استایل ها و حتی الامکان HTML خود را نیز، Minify کنید.
3. هرکاری که باعث بالارفتن سرعت طرح نهایی که شما اجرا کرده اید میشود، انجام بدهید.
4. دانستن معنی تگ ها و استفاده درست از آنها، به جرات نیمی از مسیر است.

نظر شما چیست؟ به نظر شما چه مواردی میتوانست در این مقاله جا داشته باشد که جایش خالی است؟

تگ ها : قواعد سئو که یک متخصص رابط کاربری باید آنها را رعایت کند چه رابطه ای بین سئو سایت و کاربردی بودن آن وجود دارد؟ سئو یا گوگل ادوردز طراحی رابط کاربری تولید محتوا برای سئو باورهای اشتباه در مورد سئو آشنایی با اصطلاحات سئو HEO چیست؟ نکات بنیادی سئو : 22 نکته مهم برای بهینه سازی وب سایت معرفی علم هئو(HEO) در طراحی سایت و تفاوت آن با سئو چرا محتوا از سئو مهم‌تر است؟ اینفوگرافیک: نکات مهم در بهینه سازی و سئو داخلی سایت سایت ساز ایران سئو قوانین مهم طراحی رابط کاربری برای وب مسترها بخش اول سئو چیست؟ سئو سئو سایت چیست؟ و چگونه سئو کنیم متخصص سئو بایگانی: دسته‌بندی نشده الگوریتم های گوگل در طراحی سایت 5 اشتباه رایج طراحان وب سایت در رابطه با سئو بایگانی‌ها طراحی سایت بهینه سازی و سئو سایت ، ایران سایت وبلاگ عمومی متخصص سئو کیست؟ چگونه بهترین متخصص سئو سایت خود را انتخاب سئو چیست سئو داخلی سایت آموزش سئو هر آنچه لازم دارید برای بهینه سازی و سئو سایت سئو و بهینه سازی سایت تولید محتوای مناسب برای سئو وب سایت سئو ، مهمترین عامل پیشرفت کسب و کار اینترنتی چگونه سئو کنیم مقالات بایگانی – طراحی سایت طراحی وب سایت سئو آرمانیک مقالات سئو و بهینه سازی وردپرس با افزونه SEO SQUIRRLY – وب چین بایگانی‌ها آموزش سئو مقالات طراحی سایت آیا تضمین خدمات سئو واقعی است و متخصص سئو قول می دهد؟ به سئو نیاز بایگانی‌ها سئو میر سئو سایت چیست : آوردن سایت به صفحه اول گوگل به صورت طبیعی سئو دانش است یا هنر؟ آموزش نوشتن مطالب بهینه سازی شده توسط افزونه سئو Yoast 50 دلیل برای جریمه کردن وب سایت توسط گوگل ایرانیها سایت ساز بهینه سازی سایت خدمات سئو انجام سئو رتبه سایت کیمیاگری و چاپ اسکناس با سئو سایت سئو سایت چیست ؟ فست سئو نمایش موارد بر اساس برچسب: سئو راهنمای جامع به روز رسانی الگوریتم های سئو گوگل (بخش1) اطلاعات سئو از کجا نشات و چه کسانی آنها را تولید می کنند؟ سئو ویکی پدیا Espinas Web (Iran)'s comments from طراحی سایت اسپیناس (showing 1 رابطه ی بین سئو وب سایت و کاربردی بودن آن بایگانی‌ها مقالات سئو اخبار سئو و طراحی سایت گلستان عوامل موثر در رتبه گوگل بر طبق یک میلیون نتیجۀ جستجو طراح رابط کاربری وب و موبایل UI Designer آموزش سئو وردپرس: چگونه به رتبه #1 گوگل برسیم؟ اصول طراحی سایت حرفه ای کنکاش درباره رابطه وردپرس و سئو! وبلاگ 10 محتوایی که برای شما لینک طبیعی می آورد 15 تکنیک آموزشی سئو داخلی سایت +اینفوگرافیک سئوی داخلی On Searches related to قواعد سئو که یک متخصص رابط کاربری باید آنها را رعایت کند