5 essential skills every Web Developer should have?

2023-05-16

The idea here is that most of us should already know most of what is on this list. But there just might be one or two items you haven't really looked into before, don't fully understand, or maybe never even heard of.

Interface and User Experience

  • Be aware that browsers implement standards inconsistently and make sure your site works reasonably well across all major browsers. At a minimum test against a recent Gecko engine (Firefox), a WebKit engine (Safari and some mobile browsers), Chrome, your supported IE browsers (take advantage of the Application Compatibility VPC Images), and Opera. Also consider how browsers render your site in different operating systems.
  • Consider how people might use the site other than from the major browsers: cell phones, screen readers and search engines, for example. — Some accessibility info: WAI and Section508, Mobile development: MobiForge.
  • Staging: How to deploy updates without affecting your users. Have one or more test or staging environments available to implement changes to architecture, code or sweeping content and ensure that they can be deployed in a controlled way without breaking anything. Have an automated way of then deploying approved changes to the live site. This is most effectively implemented in conjunction with the use of a version control system (CVS, Subversion, etc.) and an automated build mechanism (Ant, NAnt, etc.).
  • Don't display unfriendly errors directly to the user.
  • Don't put users' email addresses in plain text as they will get spammed to death.
  • Add the attribute rel="nofollow" to user-generated links to avoid spam.
  • Build well-considered limits into your site - This also belongs under Security.
  • Learn how to do progressive enhancement.
  • Redirect after a POST if that POST was successful, to prevent a refresh from submitting again.
  • Don't forget to take accessibility into account. It's always a good idea and in certain circumstances it's a legal requirement. WAI-ARIA and WCAG 2 are good resources in this area.
  • Don't make me think

Security

  • It's a lot to digest but the OWASP development guide covers Web Site security from top to bottom.
  • Know about Injection especially SQL injection and how to prevent it.
  • Never trust user input, nor anything else that comes in the request (which includes cookies and hidden form field values!).
  • Hash passwords using salt and use different salts for your rows to prevent rainbow attacks. Use a slow hashing algorithm, such as bcrypt (time tested) or scrypt (even stronger, but newer) (1, 2), for storing passwords. (How To Safely Store A Password). The NIST also approves of PBKDF2 to hash passwords", and it's FIPS approved in .NET (more info here). Avoid using MD5 or SHA family directly.
  • Don't try to come up with your own fancy authentication system. It's such an easy thing to get wrong in subtle and untestable ways and you wouldn't even know it until after you're hacked.
  • Know the rules for processing credit cards. (See this question as well)
  • Use SSL/HTTPS for login and any pages where sensitive data is entered (like credit card info).
  • Prevent session hijacking.
  • Avoid cross site scripting (XSS).
  • Avoid cross site request forgeries (CSRF).
  • Avoid Clickjacking.
  • Keep your system(s) up to date with the latest patches.
  • Make sure your database connection information is secured.
  • Keep yourself informed about the latest attack techniques and vulnerabilities affecting your platform.
  • Read The Google Browser Security Handbook.
  • Read The Web Application Hacker's Handbook.
  • Consider The principle of least privilege. Try to run your app server as non-root. (tomcat example)

Performance

  • Implement caching if necessary, understand and use HTTP caching properly as well as HTML5 Manifest.
  • Optimize images - don't use a 20 KB image for a repeating background.
  • Learn how to gzip/deflate content (deflate is better).
  • Combine/concatenate multiple stylesheets or multiple script files to reduce number of browser connections and improve gzip ability to compress duplications between files.
  • Take a look at the Yahoo Exceptional Performance site, lots of great guidelines, including improving front-end performance and their YSlow tool (requires Firefox, Safari, Chrome or Opera). Also, Google page speed (use with browser extension) is another tool for performance profiling, and it optimizes your images too.
  • Use CSS Image Sprites for small related images like toolbars (see the "minimize HTTP requests" point)
  • Busy web sites should consider splitting components across domains. Specifically...
  • Static content (i.e. images, CSS, JavaScript, and generally content that doesn't need access to cookies) should go in a separate domain that does not use cookies, because all cookies for a domain and its subdomains are sent with every request to the domain and its subdomains. One good option here is to use a Content Delivery Network (CDN), but consider the case where that CDN may fail by including alternative CDNs, or local copies that can be served instead.
  • Minimize the total number of HTTP requests required for a browser to render the page.
  • Utilize Google Closure Compiler for JavaScript and other minification tools.
  • Make sure there’s a favicon.ico file in the root of the site, i.e. /favicon.ico. Browsers will automatically request it, even if the icon isn’t mentioned in the HTML at all. If you don’t have a /favicon.ico, this will result in a lot of 404s, draining your server’s bandwidth.

SEO (Search Engine Optimization)

  • Use "search engine friendly" URLs, i.e. use example.com/pages/45-article-title instead of example.com/index.php?page=45
  • When using # for dynamic content change the # to #! and then on the server $_REQUEST["_escaped_fragment_"] is what googlebot uses instead of #!. In other words, ./#!page=1 becomes ./?_escaped_fragments_=page=1. Also, for users that may be using FF.b4 or Chromium, history.pushState({"foo":"bar"}, "About", "./?page=1"); Is a great command. So even though the address bar has changed the page does not reload. This allows you to use ? instead of #! to keep dynamic content and also tell the server when you email the link that we are after this page, and the AJAX does not need to make another extra request.
  • Don't use links that say "click here". You're wasting an SEO opportunity and it makes things harder for people with screen readers.
  • Have an XML sitemap, preferably in the default location /sitemap.xml.
  • Use <link rel="canonical" ... /> when you have multiple URLs that point to the same content, this issue can also be addressed from Google Webmaster Tools.
  • Use Google Webmaster Tools and Bing Webmaster Tools.
  • Install Google Analytics right at the start (or an open source analysis tool like Piwik).
  • Know how robots.txt and search engine spiders work.
  • Redirect requests (using 301 Moved Permanently) asking for www.example.com to example.com(or the other way round) to prevent splitting the google ranking between both sites.
  • Know that there can be badly-behaved spiders out there.
  • If you have non-text content look into Google's sitemap extensions for video etc. There is some good information about this in Tim Farley's answer.

Technology

  • Understand HTTP and things like GET, POST, sessions, cookies, and what it means to be "stateless".
  • Write your XHTML/HTML and CSS according to the W3C specifications and make sure theyvalidate. The goal here is to avoid browser quirks modes and as a bonus make it much easier to work with non-traditional browsers like screen readers and mobile devices.
  • Understand how JavaScript is processed in the browser.
  • Understand how JavaScript, style sheets, and other resources used by your page are loaded and consider their impact on perceived performance. It is now widely regarded as appropriate tomove scripts to the bottom of your pages with exceptions typically being things like analytics apps or HTML5 shims.
  • Understand how the JavaScript sandbox works, especially if you intend to use iframes.
  • Be aware that JavaScript can and will be disabled, and that AJAX is therefore an extension, not a baseline. Even if most normal users leave it on now, remember that NoScript is becoming more popular, mobile devices may not work as expected, and Google won't run most of your JavaScript when indexing the site.
  • Learn the difference between 301 and 302 redirects (this is also an SEO issue).
  • Learn as much as you possibly can about your deployment platform.
  • Consider using a Reset Style Sheet or normalize.css.
  • Consider JavaScript frameworks (such as jQuery, MooTools, Prototype, Dojo or YUI 3), which will hide a lot of the browser differences when using JavaScript for DOM manipulation.
  • Taking perceived performance and JS frameworks together, consider using a service such as theGoogle Libraries API to load frameworks so that a browser can use a copy of the framework it has already cached rather than downloading a duplicate copy from your site.
  • Don't reinvent the wheel. Before doing ANYTHING search for a component or example on how to do it. There is a 99% chance that someone has done it and released an OSS version of the code.
  • On the flipside of that, don't start with 20 libraries before you've even decided what your needs are. Particularly on the client-side web where it's almost always ultimately more important to keep things lightweight, fast, and flexible.

Bug fixing

  • Understand you'll spend 20% of your time coding and 80% of it maintaining, so code accordingly.
  • Set up a good error reporting solution.
  • Have a system for people to contact you with suggestions and criticisms.
  • Document how the application works for future support staff and people performing maintenance.
  • Make frequent backups! (And make sure those backups are functional) Have a restore strategy, not just a backup strategy.
  • Use a version control system to store your files, such as Subversion, Mercurial or Git.
  • Don't forget to do your Acceptance Testing. Frameworks like Selenium can help. Especially if you fully automate your testing, perhaps by using a Continuous Integration tool, such as Jenkins.
  • Make sure you have sufficient logging in place using frameworks such as log4j, log4net or log4r. If something goes wrong on your live site, you'll need a way of finding out what.
  • When logging make sure you capture both handled exceptions, and unhandled exceptions. Report/analyse the log output, as it'll show you where the key issues are in your site.

Other

  • Implement both server-side and client-side monitoring and analytics (one should be proactive rather than reactive).
  • Use services like UserVoice and Intercom (or any other similar tools) to constantly keep in touch with your users.
  • Follow Vincent Driessen's Git branching model

Lots of stuff omitted not necessarily because they're not useful answers, but because they're either too detailed, out of scope, or go a bit too far for someone looking to get an overview of the things they should know. Please feel free to edit this as well, I probably missed some stuff or made some mistakes.

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

5 essential skills every Web Developer should have? 的相关文章

  • `http://localhost` 上的安全 Cookie

    我正在尝试设置安全 cookiehttp localhost 3000 设置 Cookie loggedUser brillout 最大年龄 315360000 路径 仅 Http 安全的 但 Chrome 抱怨道 此 Set Cookie
  • IE 中文本大小列表的实际像素是多少?

    与 IE 中的以下文本大小列表相比 实际字体大小 以像素为单位 是多少 Largest Larger Medium Smaller Smallest 在 Web 应用程序中 我需要提供类似的行为 通过选择上面列表中的任何一个来设置应用程序控
  • 没有 Web 表单的 PHP POST 数据[重复]

    这个问题在这里已经有答案了 有没有一种方法可以在不使用 Web 表单的情况下发送 POST 数据 我正在与第 3 方支付处理商合作 我可以选择手动提交付款 但数据需要采用 POST 格式 我计划将我的脚本作为 CRON 作业运行 因此由于它
  • 如何识别网站中的慢速设备?

    当为移动设备调整网页时 我总是依赖 CSS 媒体查询 最近我不再只担心屏幕尺寸 还担心许多移动设备的 javascript 引擎 一些依赖于窗口滚动或快速 DOM 转换序列的常见 javascript 效果在慢速设备上效果非常糟糕 有没有办
  • 使用 ASP.NET 进行卷曲请求

    我已经阅读了 Stack 上的其他一些帖子 但我无法让它工作 当我在Windows机器上的git中运行curl命令时 它在我的电脑上工作正常 但是当我将其转换为asp net时 它不起作用 private void BeeBoleReque
  • 我可以在为服务器提供 API 的同时提供静态文件吗?

    所以我对网络开发还很陌生 现在我和我更加面向网络的朋友开始了一个项目 他向我扔了各种各样的框架 我们正在做 Vuejs jade stylus 和 jeet 对于新手来说 这当然非常令人困惑 因为没有 Vuejs 示例使用 jade 没有
  • 如何使用Python获取请求中响应的原始内容?

    尝试获取HTTP响应内容的原始数据requests在Python中 我有兴趣通过另一个渠道转发响应 这意味着理想情况下内容应该尽可能原始 这样做的好方法是什么 After requests get 您可以使用r content提取原始字节类
  • 混合命名和未命名函数参数

    我有这个功能来验证 JWT 令牌 不是中间件 它说 package main import net http log fmt github com dgrijalva jwt go func ValidateToken w http Res
  • 在 Foundation 中动态设置 Sass 变量

    如何在 Foundation 中动态设置 Sass 变量 根据他们的文档 http foundation zurb com docs components tables html 您可以借助一些 Sass 变量来自定义表格 settings
  • css位置固定根本不起作用

    我正在寻找一个页脚类型的东西布莱克霍利网站 http www blakehawley com它有一些不同的链接等 它应该是横幅样式 我的意思是它应该停留在底部并被修复 div 是 菜单 这是我的 HTML
  • 表单标签的 CSS 样式

    据我所知 一个
  • 如何解决PHP扩展“0”必须加载的问题?

    我正在尝试在我的服务器上安装 Magento 我做了一切 正如文档中所写的 我有以下错误 必须加载 PHP 扩展 0 当我尝试在浏览器中的第二页上配置 Magento 时 会发生这种情况 你知道如何解决这个问题吗 如果您安装的是 Magen
  • 允许获取请求但仅在我的域中?

    在我的网站上 我可以使用 GET 请求触发某些操作 例如隐藏或删除评论的功能 我不是很担心 但如果有人使用 img src url 设计攻击来删除评论或电子邮件 那会很烦人 有办法防止这种情况吗 我使用 httponlycookies 作为
  • 构建网站翻译文件

    我在建立网站时多次遇到这个问题 我将以使用 PHP 和 Laravel 为例进行解释 但这个问题在多个平台中都很常见 这已经在几个问题中得到了解决 post1 https stackoverflow com questions 317854
  • 网页编码,设置矛盾[重复]

    这个问题在这里已经有答案了 如果一个网页有 但http标头有 Content Type text html charset UTF 8 那么假设什么编码呢 在 HTML5 中 优先级定义为 用户浏览器设置 字节顺序标记 HTTP 标头 or
  • Tomcat 是否立即支持 JAX-RS(它是否支持 JAX-RS)?

    从教材 RESTful Java with JAX RS 中我们可以读到 如果我们的应用程序服务器是 JAX RS 感知的 或者换句话说 与 JAX RS 紧密集成 则声明我们的ShoppingApplication作为 servlet 的
  • 执行预检请求时是否需要 Access-Control-Allow-Origin CORS 标头?

    我们在我们的网站上看到了著名的 CORS 错误 XMLHttpRequest 无法加载https my site com api https my site com api 请求的资源上不存在 Access Control Allow Or
  • 如何将 html 输入到 Flask 中?

    我有这个 html 位
  • JavaScript 中的对象解构[重复]

    这个问题在这里已经有答案了 gt a a true Statement lt a true 上面的语句是赋值true to a 为什么上面的语句在chrome控制台中没有报错 虽然下面的语句给出了错误 gt a a true Stateme
  • WebUSB 和 RFID 读取器

    我想知道是否有人有让 RFID 读取器通过 WebUSB 工作的经验 我使用的阅读器是https www parallax com product 28340 https www parallax com product 28340 根据我

随机推荐

  • 【基于Python的ROS学习】

    基于Python的ROS学习 1 订阅topic def span class token function listener span span class token punctuation span span class token
  • P2P中DHT网络介绍

    一 P2P 及 DHT 网络简单介绍 xff1a P2P在思想上可以说是 internet 思想 精神 哲学非常集中的体现 xff0c 共同的参与 xff0c 透明的开放 xff0c 平等的分享 xff08 让我想起之前学习过的 xff0c
  • C++ 库

    基础类 1 Dinkumware C 43 43 Library 参考站点 xff1a http www dinkumware com P J Plauger编写的高品质的标准库 P J Plauger博士是Dr Dobb 39 s程序设计
  • APM(PX4-v2) 定高模式相关(AltHold)

    1 分析log文件 xff0c 及其消息的赋值 LOG CONTROL TUNING MSG sizeof log Control Tuning 34 CTUN 34 34 Qhhfffecchh 34 34 TimeUS ThrIn An
  • APM的解锁(ARM)流程

    解锁检测函数 解锁检测函数是arm motors check xff08 xff09 xff0c 作为scheduler每秒运行10此 xff0c 定义在motors cpp中 xff0c 定义如下 define ARM DELAY 20
  • 智能运维就是 由 AI 代替运维人员?

    本文整理自 GOPS2017 上海站演讲 从说到做 大型企业智能运维的360度解析 讲师简介 孙杰 xff0c 国内一线运维专家 xff0c 从业十几载的IT老兵 xff0c 专注于系统 运维 云计算和数据中心管理 xff0c 先后在外企
  • AIOps 风向标!GOPS2018深圳站实录(附白皮书及PPT)

    本文相关下载资料 xff1a 本次大会精彩演讲 PPT 企业级 AIOps 实施建议 白皮书 DevOps 标准体系及能力成熟度模型 盼星星盼月亮 xff0c 2018 GOPS 深圳站终于到来了 xff01 hia hia hia hia
  • Linux UART接口调试技巧

    在嵌入式项目中 xff0c UART接口的使用频率很高 xff0c 多种模块 2G通信模组 蓝牙模块 xff0c 等等 都会通过UART接口与主控MCU相连 本文将梳理UART接口调试流程 xff0c 为调试工作提供参考 xff0c 解决调
  • What do software developers age 30 and over know now that they wish they had known in their 20s?

    Here are a few thoughts I 39 d also recommend a thorough read of Joe Wezorek 39 s answer to this question Life is long I
  • 两款主流摄像头OV7620与OV7670 By Demok

    如今 xff0c 市场上提到可以应用在智能车上的摄像头 xff0c 多如牛毛 到底那一款最适合用在智能车上呢 xff0c 这里DEMOK选取了2款典型的摄像头OV7670与OV7620 xff0c 从其特性和性能等角度 xff0c 剖析摄像
  • 树莓派3B+(07):外网访问Pi Dashboard

    外网访问Pi Dashboard Pi Dashboard Pi 仪表盘 是一个开源的 IoT 设备监控工具 xff0c 目前主要针对树莓派平台 xff0c 也尽可能兼容其他类树莓派硬件产品 你只需要在树莓派上安装好 PHP 服务器环境 x
  • 深度学习的GPU:深度学习中使用GPU的经验和建议

    向AI转型的程序员都关注了这个号 大数据挖掘DT数据分析 公众号 xff1a datadw 深度学习是一个计算需求强烈的领域 xff0c 您的GPU的选择将从根本上决定您的深度学习体验 在没有GPU的情况下 xff0c 这可能看起来像是等待
  • Git仓库集成到VScode

    前提是一种安装了Git xff0c 这里就不再介绍安装过程 xff0c 进入Git官网进行下载安装即可 这里用Gitee作为远程仓库演示 xff0c 首先在gitee上新建仓库 新建完毕 xff0c 生成了HTTPS地址 xff0c 复制该
  • Docker镜像打标签(Tag)和保存镜像的操作

    Docker镜像打Tag标签和保存镜像的操作 示例 xff1a docker tag 192 168 180 204 19080 ai box redis soc 1 0 eve redis soc 1 0 保存镜像 示例 xff1a do
  • 我的2013,梦在路上

    我的2013 xff0c 在路上 今年最后一次给姐姐打电话 xff0c 她在那里像我炫耀自己和爸爸妈妈一起跨年 xff0c 说1314的意义 xff0c 而我还在北京苦逼着 回想2013年对于我来说 xff0c 或许是不错的一年 这一年我进
  • MFC 的CList,CPtrList,CObList,CStringList 的用法之CList

    CList 类 C 43 43 中实现通用数据结构 在程序设计当中经常会出现使用同种数据结构的不同实例的情况 例如 在一个 程序中可以使用多个队列 树 图等结构来组织数据 同种结构的不同实例 也 许只在数据元素的类型或数量上略有差异 如果对
  • 事务是什么?

    事务 xff1a 简单来说 xff0c 事务就是几个操作要作为一个处理单元来完成 xff0c 要么全部完成 xff0c 要么全部不完成 事务可以是一条SQL语句 xff0c 也可以是多条SQL语句或者整个程序 事务日志 xff1a 重做日志
  • 各种加解密算法比较

    一 加密 算法介绍 对称加密算法 对称加密算法用来对敏感数据等信息进行加密 xff0c 常用的算法包括 xff1a DES xff08 Data Encryption Standard xff09 xff1a 数据加密标准 xff0c 速度
  • 系统提示缺少libltdl.so.3

    今天安装heartbeat pils 2 1 4 11 el5 i386 rpm时 xff0c 显示 因为重新安装的linux xff0c 所以以前的一些操作都丢失了 xff0c 安装了一大堆的开发工具 34 Development lib
  • 5 essential skills every Web Developer should have?

    The idea here is that most of us should already know most of what is on this list But there just might be one or two ite