web程序怎么团队开发
Building a website or app and making it available for the world is a complex business. A number of factors must come together to ensure the final product is successful. That means attracting and keeping visitors, meeting business goals, and minimizing problems. You can deliver a better product with the help of web development checklists.
建立网站或应用程序并将其提供给全世界是一项复杂的业务。 必须结合多种因素来确保最终产品成功。 这意味着吸引和留住访客,实现业务目标并最大程度地减少问题。 您可以借助Web开发清单提供更好的产品。
As in everyday life, checklists can be a great organizational tool. They keep web development teams on track. They also ensure important tasks aren’t overlooked in the rush to complete a project.
就像在日常生活中一样,清单可以是一个很好的组织工具。 他们使Web开发团队保持跟踪。 它们还确保重要的任务在紧急完成项目时不会被忽略。
We searched the web for the most useful web development checklists. They cover everything from front-end and performance to SEO and marketing.
我们在网络上搜索了最有用的Web开发清单。 它们涵盖了从前端和性能到SEO和市场营销的所有内容。
A practical checklist that includes:
实用清单包括:
design elements to look out for before launch 发布前要注意的设计元素 functionality 功能性 cross-browser testing 跨浏览器测试 SEO and content editing SEO和内容编辑This is a nice checklist tool built by Glasgow developer Fraser Boag.
这是由格拉斯哥开发人员Fraser Boag构建的一个不错的清单工具。
This tools lets you:
该工具可让您:
check items as you complete each task 完成每个任务时检查项目 grey out an item if it’s not applicable 如果某项不适用,则将其灰显 reset the checklist to get it ready for the next project. 重置清单以使其准备好用于下一个项目。Changes will be saved using cookies, so you can easily use the checklist throughout the duration of your project.
更改将使用Cookie保存,因此您可以在项目的整个过程中轻松使用清单。
The checklist covers content, benchmarks and performance, compatibility, accessibility, analytics, and more. Items in the list include, among other things:
该清单涵盖了内容,基准和性能,兼容性,可访问性,分析等等。 列表中的项目包括:
content editing 内容编辑 navigation usability 导航可用性 links testing 链接测试 GDPR compliance 符合GDPR HTML and CSS validity HTML和CSS的有效性 styles and scripts minification 样式和脚本最小化Ben Cheng presents “… a simple launch checklist for web and mobile apps … for product managers to quickly test performance of their apps.”
Ben Cheng展示了“……针对Web和移动应用程序的简单启动清单……供产品经理快速测试其应用程序的性能。”
Not only does the author include important tasks to complete before launching, he also explains the why behind his choices.
作者不仅在发布前包含了重要的任务,还解释了为什么选择之后的原因 。
The list presents items belonging to the following areas:
该列表显示了属于以下领域的项目:
performance 性能 security 安全 broken links 断开的链接 compatibility 兼容性 SEO/social SEO /社交 nice to haves, such as a 404 page, print stylesheets, and more. 很不错,例如404页,打印样式表等。For data persistence, you most likely need a database. The smooth running and integrity of the database are crucial to a fast and secure website or app. In this checklist, you’ll find items relating to:
为了保持数据持久性,您很可能需要数据库。 数据库的平稳运行和完整性对于快速安全的网站或应用程序至关重要。 在此清单中,您将找到与以下内容有关的项目:
database integrity 数据库完整性 stored procedures 存储过程 field validation 现场验证 constraints 约束 security 安全 transactions and more. 交易等等。These are stack-agnostic guidelines for best practices that encompass various back-end architectures. It’s comprehensive, including best practices on:
这些是涵盖各种后端体系结构的最佳实践的与堆栈无关的指南。 它是全面的,包括以下方面的最佳实践:
data storage solutions 数据存储解决方案 security 安全 server environments 服务器环境 application monitoring, and much more. 应用程序监视等等。Towards the end of the document, you’ll find a responsibility checklist to organize your team’s work. You’ll also find a release checklist for the launch of your website or app.
在文档末尾,您将找到一份责任清单以组织团队的工作。 您还将找到发布网站或应用程序的发布清单。
If you code landing pages, Fred Rocha’s deployment checklist is what you need. It’s succinct and to the point. It includes technical front-end items such as:
如果您对着陆页进行编码,则需要Fred Rocha的部署清单。 简洁明了。 它包括技术前端项目,例如:
checking performance 检查表现 validating the markup 验证标记 checking the console for JavaScript errors, and more. 检查控制台中是否有JavaScript错误等。It describes itself as “perfect for modern websites and meticulous developers”. This is an online interactive tool that allows you to enter the project’s URL and get a complete report on the following areas:
它称自己为“完美的现代网站和细致的开发人员”。 这是一个在线交互式工具,可让您输入项目的URL并获取以下方面的完整报告:
head 头 HTML HTML webfonts 网络字体 CSS CSS JavaScript JavaScript images 图片 accessibility 可及性 performance 性能 SEO 搜索引擎优化The check is thorough and reveals which items in the various areas deserve high, medium or low priority.
该检查是彻底的,并揭示了在各个领域中哪些项目应具有高,中或低优先级。
This is a list of tasks you need to complete before your React app is ready for production.
这是您需要在React应用准备投入生产之前完成的任务列表。
This is a six-item checklist with fun and clear explanations of how to go about implementing each of the tasks on the list for a blazing fast React app.
这是一个包含六个项目的清单,其中包含有趣而清晰的说明,说明了如何快速实现出色的快速React应用程序中列表中的每个任务。
Deeksha Agarwal offers a top-notch checklist to ensure your website or app works and looks as intended in all browsers and platforms on your local dev environment before the launch. Among the items you’ll find in this list are:
Deeksha Agarwal提供了一个一流的清单,以确保您的网站或应用在发布前在您本地开发环境中的所有浏览器和平台上都能正常工作和显示。 您将在此列表中找到以下项目:
element alignment, and other HTML and CSS cross-browser issues 元素对齐以及其他HTML和CSS跨浏览器问题 font rendering 字体渲染 API connections, and much more. API连接等等。Rajkumar offers this handy checklist where he mentions all the items you need to test on multiple operating systems and browsers.
Rajkumar提供了这个方便的清单,其中提到了您需要在多种操作系统和浏览器上测试的所有项目。
This W3C checklist includes all the items you need to consider so that more people can access and use your site. The items are grouped according to a priority number from one to three.
该W3C清单包括您需要考虑的所有项目,以便更多的人可以访问和使用您的网站。 根据优先级编号从1到3对项目进行分组。
It covers:
它涵盖:
providing text for non-text elements 为非文本元素提供文本 organizing documents so they can be read without stylesheets 组织文档,以便无需样式表即可阅读它们 color contrast 颜色对比 appropriate structure and elements for HTML documents HTML文档的适当结构和元素 expanding acronyms and abbreviations the first time they appear 首次出现缩写词和缩写时 logical tab navigation, and more. 逻辑标签导航等等。This checklist presents WebAIM’s (Web Accessibility in Mind) accessibility recommendations for those seeking WCAG conformance.
此清单为寻求WCAG一致性的用户提供了WebAIM(“ Web Accessibility in Mind”)的可访问性建议。
This A11Y Project checklist organizes items under the following headings:
该A11Y项目检查表将项目组织在以下标题下:
content 内容 global code 全局代码 keyboard 键盘 images 图片 headings 标题 lists 清单 controls 控制项 tables 桌子 forms 形式 media 媒体 appearance 出现 animation 动画 color contrast 颜色对比 mobile/touch. 手机/触摸。This checklist is presented in a great, user-friendly table where items are grouped on the basis of their accessibility priority level in accordance with WCAG 2.0 guidelines:
此检查表以简洁易用的表格呈现,该表格根据WCAG 2.0准则根据可访问性优先级对项目进行分组:
Level A makes your website or app accessible to some users
级别A使某些用户可以访问您的网站或应用
Level AA makes it available to almost all users
AA级使几乎所有用户都可以使用
Level AAA makes it available to all users.
AAA级使其对所有用户可用。
There’s hardly anything that puts users off more than a slow website or app. Here’s another great checklist by David Dias. He labels his checklist “The only front-end performance checklist that runs faster than the others”. For each rule, you’ll have an explanation of why it’s important and how you can fix that specific issue. Also, items in this checklist have priority indicators. There are three levels of priority: low, medium and high. Finally, David also lists a number of useful tools that you can use to test or monitor your website or app’s performance.
除了缓慢的网站或应用程序,几乎没有什么能使用户失望。 这是大卫·迪亚斯(David Dias)撰写的另一份很棒的清单。 他将自己的清单标记为“唯一比其他人运行得更快的前端性能清单”。 对于每条规则,您都将解释为什么它很重要以及如何解决该特定问题。 另外,此清单中的项目具有优先级指示符。 优先级分为三个级别:低,中和高。 最后,David还列出了许多有用的工具,可用于测试或监视网站或应用程序的性能。
Vitaly Friedman offers “an updated overview of the issues you might need to consider to ensure that your response times are fast, user interaction is smooth and your sites don’t drain user’s bandwidth”. Items in this thorough checklist are under the following headings:
Vitaly Friedman提供了“有关可能需要考虑的问题的最新概述,以确保您的响应时间很快,用户交互顺畅并且您的站点不会浪费用户的带宽”。 此详尽清单中的项目位于以下标题下:
Getting ready: planning and metrics 准备:计划和指标 Setting realistic goals 设定切合实际的目标 Defining the environment 定义环境 Assets optimizations 资产优化 Build optimizations 构建优化 Delivery optimizations 投放优化 HTTP/2 HTTP / 2 Testing and monitoring 测试与监控 Quick wins. These are 15 issues that you can quickly resolve if you have just one hour to gain significant performance results. 快速获胜。 如果您只有一个小时的时间来获得显着的性能结果,则可以快速解决这15个问题。Ben Halpern recommends Addy Osmani’s performance checklist, taken from one of Addy’s AMAs. Among the suggestions you’ll find in this list are:
Ben Halpern建议从Addy的AMA之一中摘取 Addy Osmani的性能清单。 您会在此列表中找到以下建议:
code-splitting 代码分割 lazy loading non-critical resources 延迟加载非关键资源 file compression 文件压缩 caching, and much more. 缓存等等。There are different reasons why you would want to migrate your website. You may have changed from HTTP to HTTPS, changed domain names, or opted for a new framework or CMS. SEMRush offers a free online interactive checklist for managing this process. You can also download it in PDF format.
您要迁移网站的原因有多种。 您可能已从HTTP更改为HTTPS,更改了域名,或选择了新框架或CMS。 SEMRush提供了免费的在线交互式清单来管理此过程。 您也可以下载PDF格式的文件。
The main sections under which items are grouped in this checklist are:
在此清单中将项目分组的主要部分是:
Pre-migration 迁移前 Post-migration 迁移后SEO concerns take center stage in this checklist. It covers reviewing analytics data, gathering key metrics and trends, monitoring top pages, and so on.
SEO问题在此清单中处于中心位置。 它涵盖了查看分析数据,收集关键指标和趋势,监视首页等等。
This is a comprehensive website migration checklist which groups its items under a
这是一个全面的网站迁移清单,将其项归类为
pre-launch roadmap 发布前的路线图 launch day 发射日 post-launch phase 发布后阶段This is a super comprehensive SEO checklist by Backlinko that includes multiple checklists. In particular, you’ll find:
这是Backlinko的超级综合SEO清单,其中包括多个清单。 特别是,您会发现:
an SEO basics checklist SEO基础清单 a keyword research checklist 关键字研究清单 an on-page SEO checklist 页面上的SEO检查清单 a technical SEO checklist SEO技术清单 a content checklist 内容清单 a link building checklist 链接构建清单As a bonus, you’ll also get some advanced SEO tips and tactics and some case studies and examples.
作为奖励,您还将获得一些高级SEO技巧和策略以及一些案例研究和示例。
ClickMinded’s Tony Griffith lists a “step-by-step SEO checklist that you can use immediately. It’s a very direct, straightforward process that will drive more traffic and more customers to your website as quickly as possible.”
ClickMinded的Tony Griffith列出了一个“逐步的SEO清单”,您可以立即使用它。 这是一个非常直接,直接的过程,将尽快吸引更多流量和更多客户访问您的网站。”
With great visuals and clear explanations, this checklist covers the tasks involved in:
该清单以出色的视觉效果和清晰的说明涵盖了以下任务:
basic SEO 基本SEO keyword research 关键字研究 technical SEO 技术搜索引擎优化 content SEO, and more. 内容SEO等。This is a massive but extremely user-friendly, 66-point checklist that focuses on optimizing a website for Google in 2020.
这是一个庞大但极为人性化的66点清单,重点在于2020年为Google优化网站。
On-page SEO is the process of optimizing a single page on your website, which is very important for getting a great Google ranking. Nathan Gotch of GotchSEO shows his step-by-step, on-page SEO checklist, which takes into account:
页内搜索引擎优化是优化网站上单个页面的过程,这对于获得良好的Google排名非常重要。 GotchSEO的Nathan Gotch显示了他的分步式SEO检查清单,其中考虑了以下内容:
SEO performance SEO表现 crawling and indexing 检索和索引 keywords 关键字 content 内容 images 图片 video 视频 links 链接 user experience (UX) and design and user interface (UI) 用户体验(UX)以及设计和用户界面(UI) ranking your page in the local pack 在本地包中对页面进行排名 structured data 结构化数据 and more 和更多Here’s a practical checklist to ensure your digital marketing supports your business. A brand-centered, responsive, and Google-friendly website is first up on the list, of course.
这是一个实用的清单,可确保您的数字营销支持您的业务。 当然,首先要考虑以品牌为中心,响应Swift且对Google友好的网站。
Here’s an 8-point 2020 digital marketing checklist by Clear Blue Sky Digital. It walks through:
这是Clear Blue Sky Digital发布的2020年8点数字营销清单。 它通过:
the look, feel, and security of your website 网站的外观,感觉和安全性 its SEO and SEM (search engine marketing) strategies 其SEO和SEM(搜索引擎营销)策略 your social media marketing approach. 您的社交媒体营销方式。GDPR compliance is a must for most businesses inside the European Union or dealing with countries in the European Union. Its rationale is to give EU citizens more control and transparency over their data. This checklist covers GDPR requirements and what your business needs to do to ensure compliance.
对于欧盟内部或与欧盟国家打交道的大多数企业,必须遵守GDPR。 其理由是使欧盟公民对其数据有更多的控制权和透明度。 该清单涵盖了GDPR要求以及您的企业为确保合规性而需要做的事情。
GDPR regulations are not a walk in the park for big businesses, let alone medium to small ones. If you’re struggling, here’s a checklist that can help your business fulfill its requirements.
对于大型企业,更不用说GDPR法规了,更不用说中小型企业了。 如果您正在苦苦挣扎,这是一份清单,可以帮助您的企业满足要求。
As you can see, some lists include items from different categories. Items under the Performance heading are present under the SEO heading. This is so because page load speed is a key component in achieving top search engine rankings. All aspects of a web presence must work together to achieve the desired end result. With these checklists, that kind of coordination is much easier.
如您所见,某些列表包含不同类别的项目。 性能标题下的项目是SEO的标题下。 之所以如此,是因为页面加载速度是获得顶级搜索引擎排名的关键因素。 网络存在的所有方面必须共同努力才能达到理想的最终结果。 使用这些清单,这种协调变得容易得多。
翻译自: https://www.sitepoint.com/web-development-checklists/
web程序怎么团队开发