آزمایش یک برنامه وب محتوای محور
با مجموعهها، منظم بمانید
ذخیره و طبقهبندی محتوا براساس اولویتهای شما.
آزمایش برای اطمینان از عملکرد، کیفیت، دسترسی، امنیت و عملکرد برنامه وب مبتنی بر محتوای شما بسیار مهم است. آزمایش به شما امکان می دهد تجربه کاربر را ارزیابی کنید و تعیین کنید که آیا توسعه بیشتر لازم است یا خیر. برنامه وب شما باید استانداردهای کیفیت را داشته باشد و مطابق انتظار عمل کند.
این راهنمای تست اولیه را برای شما فراهم می کند تا برنامه وب خود را در دسترس و کاربر پسند قرار دهید.
اجزاء |
---|
تضاد رنگ | اطمینان حاصل می کند که نسبت کنتراست برای خوانایی بهینه شده است. برای انواع مختلف کوررنگی و رنگهای اجباری کنتراست بالا تعریف شده توسط کاربر، باید بررسیها انجام شود. |
تایپوگرافی | تعیین می کند که آیا برنامه دستگاه ها و تنظیمات مختلف را در خود جای می دهد یا خیر. با استفاده از اندازه قلم نسبی و مقیاس غیر خطی، تایپوگرافی همچنان می تواند در حداکثر اندازه قابل استفاده باشد. |
تصاویر | اطمینان حاصل می کند که تصاویر با کیفیت هستند و می توانند به سرعت بارگذاری شوند. مهم است که برای رزولوشنهای بالاتر، بازگردانیهای صحیح بدون شبکه و داراییهای بهینهسازی شده را بررسی کنید. |
جهت یابی | اطمینان حاصل می کند که ناوبری واضح و قابل استفاده با ناوبری ماوس، لمسی و صفحه کلید است. بررسی api تاریخچه اطمینان حاصل می کند که پیمایش عقب و جلو نیز به درستی حفظ می شود. |
جستجو کردن | تأخیر کم در زمان پاسخ به سؤالات را در پارامترهای پرس و جو URL و قسمت جستجو بررسی کنید. |
فرم | اطمینان حاصل می کند که تمام فرم ها برای تکمیل و ارسال کاربر پسند هستند. در صورت لغو ارسال فرم پیشفرض، رویدادهای صحیح باید گوش داده شوند و برای بازنشانی صحیح فرم و محافظت در برابر ورودیهای کاربر مخرب بررسی شوند. |
کارایی | تضمین می کند که برنامه کارآمد و پاسخگو است، با بارگذاری سریع. این باید بخش مهمی از تست رگرسیون نیز باشد. |
ابزارهای زیادی وجود دارد که می توانید برای بررسی دسترسی به وب استفاده کنید. استفاده از روشهای متعدد به منظور پوشش گستره مولفههای دسترسی مهم است. حتماً برچسبهای ARIA، a11y در عناصر DOM، ناوبری صفحهکلید و استفاده از صفحهخوان را بررسی کنید.
فریم ورکهای تست فرانتاند، مانند Jest ، Vitest ، Cypress ، Mocha یا Jasmine به شما کمک میکنند تا تستها را کارآمد بنویسید و از توسعه مبتنی بر رفتار و آزمایشمحور پشتیبانی کنید. با ادغام در خطوط لوله CI/CD میتوانید تستهای خود را خودکار کنید و به جلوگیری از اشکالات رگرسیون در commitها کمک کنید.
چارچوبهای Runner، مانند Web Test Runner ، Playwright ، Web Driver یا Test Runner در Node.js به شما امکان میدهند این تستها را به طور موثر اجرا کنید و از آزمایش در محیطها و پلتفرمهای مختلف پشتیبانی کنید. این یک لیست جامع نیست و بسته به چارچوبی که استفاده می کنید، ممکن است تست داخلی وجود داشته باشد.
جز در مواردی که غیر از این ذکر شده باشد،محتوای این صفحه تحت مجوز Creative Commons Attribution 4.0 License است. نمونه کدها نیز دارای مجوز Apache 2.0 License است. برای اطلاع از جزئیات، به خطمشیهای سایت Google Developers مراجعه کنید. جاوا علامت تجاری ثبتشده Oracle و/یا شرکتهای وابسته به آن است.
تاریخ آخرین بهروزرسانی 2025-07-24 بهوقت ساعت هماهنگ جهانی.
[null,null,["تاریخ آخرین بهروزرسانی 2025-07-24 بهوقت ساعت هماهنگ جهانی."],[[["\u003cp\u003eTesting is essential for ensuring the functionality, quality, accessibility, security, and performance of your web application, ultimately enhancing user experience.\u003c/p\u003e\n"],["\u003cp\u003eKey components of web application testing include color contrast, typography, images, navigation, search, forms, and performance.\u003c/p\u003e\n"],["\u003cp\u003eUtilize a variety of accessibility testing tools and methods to cover a comprehensive range of components like ARIA labels, keyboard navigation, and screen reader compatibility.\u003c/p\u003e\n"],["\u003cp\u003eLeverage front-end testing frameworks such as Jest, Vitest, Cypress, Mocha, or Jasmine to efficiently write and automate tests, supporting both behavior-driven and test-driven development.\u003c/p\u003e\n"],["\u003cp\u003eEmploy runner frameworks like Web Test Runner, Playwright, Web Driver, or Node.js's Test Runner for executing tests across multiple environments and platforms.\u003c/p\u003e\n"]]],["Testing should evaluate web application accessibility, functionality, and performance. Key actions include checking color contrast for readability, ensuring relative typography scaling, and verifying image quality and load times. Navigation should be usable via mouse, touch, and keyboard. Search response times should be fast, and forms must be user-friendly with appropriate event handling. Performance, including fast load times, is vital. Multiple tools and front-end frameworks (e.g., Jest, Cypress) can aid in this process, and automation via CI/CD pipelines is recommended.\n"],null,["# Testing a content-driven web app frontend\n\nTesting is crucial to ensuring the functionality, quality, accessibility,\nsecurity, and performance of your content driven web application. Testing lets\nyou assess the user experience and determine if further development is\nnecessary. Your web application should meet quality standards and perform as\nexpected.\n\nThis provides basic testing guidance for you to consider to make your web\napplication accessible and user-friendly.\n\n| Components ||\n|----------------|-------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|\n| Color contrast | Ensures that the contrast ratio is optimized for readability. Checks need to be done for various types of color blindness and user defined high contrast forced colors. |\n| Typography | Determines if the application accommodates different devices and settings. By using relative font size and non linear scaling the typography can still be usable on the max size. |\n| Images | Ensures that the images are high quality and can load quickly. It is important to check for correct fallbacks with no network and optimized assets for higher resolutions. |\n| Navigation | Ensures that the navigation is clear and usable by mouse, touch and keyboard navigation. Checking the history api ensures the back and forward navigation is also preserved correctly. |\n| Search | Check for low latency in response times to queries in the URL query parameters and search field. |\n| Form | Ensures that all forms are user-friendly to complete and submit. If overriding the default form submission the correct events need to be listened to and checked for proper form reset and protection against malicious user input. |\n| Performance | Ensures that the application is efficient and responsive, with fast load times. This should be an important part of regression testing too. |\n\nThere are [many tools](https://www.w3.org/WAI/ER/tools/) you can\nuse to check web accessibility. It is important to use multiple methods in order\nto cover the range of accessibility components. Be sure to check for ARIA\nlabels, a11y on DOM elements, keyboard navigation, and screen reader use.\n\nFront end testing frameworks, such as [Jest](https://jestjs.io/),\n[Vitest](https://vitest.dev/),\n[Cypress](https://www.cypress.io/),\n[Mocha](https://mochajs.org/) or\n[Jasmine](https://jasmine.github.io/) help you write tests\nefficiently and support behavior-driven and test-driven development. With\nintegrations into CI/CD pipelines you can also automate your tests and help\nprevent regression bugs in commits.\n\nRunner frameworks, such as [Web Test\nRunner](https://modern-web.dev/docs/test-runner/overview/),\n[Playwright](https://playwright.dev/), [Web\nDriver](https://webdriver.io/) or the [Test Runner in\nNode.js](https://nodejs.org/api/test.html) let you execute these\ntests efficiently and support testing across multiple environments and\nplatforms. This is not an exhaustive list and depending on the framework you are\nusing there could be testing built-in."]]