前端开发学习指南

Posted 2023-03-31 qq^^614136809

理想的状况是用html5 DOCTYPE，所有现代的浏览器都支持它，即使是不支持HTML5的浏览器，例如IE6,IE7，也会由此转入标准模式。 参见来源。

编写合法且语义清晰的标记
用整洁、语义清晰的HTML编写网站代码是我们一直孜孜以求的。有时我们会发现前人配置页面的方式限制了我们，或者有时我们编写的是HTML格式的email模板。但永远不要偏离HTML的规范，即使是为了解决特定浏览器兼容性的bug。

所有的标题应该从

开始分层级创建，文字段落应该总是放在

标签里，诸如此类。如果你编写的HTML的语义清晰，产生的页面会更整洁、简练，而且易于被搜索引擎爬虫解析。这是你能做到的最简单的SEO修补方式。

来看看下面的段落，你觉得哪个更整洁？是这个？
A Heading



Lorem ipsum dolor sit amet. …



还是这个？

A Heading

Lorem ipsum dolor sit amet. ...

鼠标中键点击的应变方式 现代web应用最令人郁闷的可用性缺陷之一是超链接功能的变种。 一些看起来像是超链接的元素可能是通过javascript映射的单击功能，这就破坏了鼠标中键点击（在新的tab中打开链接页面）的功能。即使它们能在新的标签页打开，它们只带有一个 # 的href又会把你带回到同样的页面。

深刻诠释了该问题的一个现代热门网站的例子就是Twitter。在它的整个应用里，鼠标中键点击用户名或头像会得到完全不同的结果。

另一个替代方案是使用 # 引导的路径，它会把普通的url映射为 # 引导的链接，然后通过AJAX来获取页面片段。提供此功能的库应该能够在鼠标中键点击的时候正常显示页面，或者在左键点击时把该页面内容加载到指定的区域。不过这样也要慎重行事，有很多人都认为 #链接正在破坏web应用。

用Microformats格式表示联系人信息
Microformat是一种便于机器读取联系人信息的方式。hCard类（不是vCard）用来定义元素里包含的内容类型。这些内容会被浏览器提取并突出显示。

home: +1.415.555.1212 如果你曾经浏览采用此格式的网页，你会注意到类似skype的程序可以轻松检测到网页上的哪些数字是电话号码。在ios设备上的Safari浏览器也可以做到类似的事情。

有关Microformat的更多信息请参阅http://microformats.org/wiki/hcard

图片需要设 ‘Alt’ 文本
标签需要 alt 文本，以便检查并满足可读性的要求。 在 alt 属性中的文本必须能够说明图片显示的内容或要达到的效果，除非该图片不重要。

如果图片只是一个列表中的着重号或者其他无关紧要的图标，最好是给 alt 属性一个空字符串，但还是留着它。这样屏幕阅读器会忽略它，而不是把"着重号"连读20次。

只对表格数据用table标签 table标签永远只应该用在表格数据的展示上。唯一的例外是当编写HTML格式的邮件时，这种情况下可能table是某些坑爹的邮件客户端唯一支持的样式了。

为了可读性，表格头永远要使用 元素。同时切记要设置cellpadding, cellspacing 和 border 的值为 0 ， 因为这些样式由CSS来控制更容易确保一致性。

Cell Header
Cell Item

使用 jQuery 和 jQuery UI Widgets jQuery 和 jQuery UI 被做成尽可能在不同浏览器上表现出几乎相同的外观和功能。 jQuery UI 被设计为符合 WAI WCAG 2.0 及 WAI ARIA， 因此采用该框架可以避免在你的站点上运行的插件或脚本的所有不确定性。

JavaScript
代码留空和格式
任何关于代码格式、留空和大括号位置的讨论都会引起激烈辩论。对此，我想最简单的规则就是，除非你愿意把整个代码文件重新格式化，不然还是尊重并保持已有代码文件的格式。这意味着如果你看到一个JS文件里的大括号没有换行写，那你的代码也要继续保持大括号不换行。如果你的代码没有和代码文件里的其他部分保持一致，那么你的代码就不应该通过代码审查流程。

一致的代码格式让代码更加易读，同时也意味着代码容易用查找/替换命令进行修改。谢天谢地，我们自己形成的编程习惯和jQuery正式推荐的方式非常相似。细微的差异也是有的，不过，那些是个人问题或者我们觉得没法维护的一些东西。 参阅jQuery核心样式指南

字符间距
// 不好
if(blah===“foo”)
foo(“bar”);

// 好 😃
if (blah === “foo”)
foo(“bar”);

大括号不换行
// 不好
if (foo)

bar();

// 好 😃
if (foo)
bar();

总是用大括号
// 不好
if (foo)
bar();

// 好 😃
if (foo)
bar();

字符串处理
引用字符串永远要用双引号。 有些人非常喜欢用C语言风格的字符串（单引号），但这种习惯会导致脚本内部的风格冲突。C语言风格的字符串处理要求空字符串和单字符包在单引号里，而短语和单词必须包在双引号内。

注释
往代码里玩命加注释的需求是由各种经理、主管及其他很少接触代码的人们引领的。这种需求无非是雇员们考核指标中的一个勾选栏，花在这上面的时间基本没有带来什么回报。 如果那些从善如流的开发者能遵循本文档中提出的建议，他们的代码会变得相当易于阅读，一目了然，以至于再用注释描述这些代码会多余得令人尴尬。来看下面的例子。在这里，布尔变量被作为问题提出，而函数也有直观的命名。

if (user.hasPermission)
editPage();

至少在这个场景中，注释是完全没有必要的。

注释重要的情况
一个项目里，永远会有某些部分难以查阅和理解。比如一个复杂的正则表达式，或者一个对角度进行计算或在度和弧度单位之间切换的数学函数。没有上面的注释，初级或中级的读者将对脚本的含义毫无头绪。

// 校验美国电话号码的正则表达式，号码格式是 (XXX) XXX-XXXX (减号、空格和括号都是可选的，可以有也可以没有)
var phoneRegEx = /^(?(\\d3))?[- ]?(\\d3)[- ]?(\\d4)$/;
总是使用 === 比较符
使用 == 比较符可以让令人郁闷的bug消失于无形。它允许在 JavaScript花园 中有清楚解释的弱类型。使用严格的 === 比较符不会执行类型强制转换，从而能够严格地评估两个对象之间的差别。再说一遍，更多详细信息请参见 JavaScript花园。

var zeroAsAString = “0”;

if (zeroAsAString == 0)
// 这样也能判断为true，呵呵…

if (zeroAsAString === 0)
// 判断为false

例外
在和null进行比较的时候，允许使用 == 比较符，因为它会检测null和undefined两个属性。如果你不完全理解这个原理，那我还是建议你用 === 比较符为好。

var foo = null;

// foo 是 null, 但 bar 是 undefined ，因为它尚未被声明
if (foo == null && bar == null)
// 上面的判断还是成立的

使用 .parseInt() 的时候，总是指定第二个 ‘radix’ 参数
把字符串解析为整数的时候，有个好习惯是指定第二个基数参数 – 它会确定该字符串被转换成几进制。当字符串以 0 开头的时候，默认情况下会触发 16 进制作为基数。大部分初级和中级用户只会用到 10 这个基数。 感谢 João Moreno 记录的这个 勘误。

alert( parseInt(“08”) ); // alerts: 2

alert( parseInt(“08”, 10) ); // alerts: 8
避免比较 true 和 false
直接比较 true 和 false 的值是没有必要的。有时候也许明确一下有好处，但它还是额外的代码。

if (foo === true)
// 用了 === 倒是不错，可这是多余的

if (foo)
// 赞！

if (!bar)
// 反过来也赞

避免污染全局命名空间
过分依赖全局变量是我们组所有人 – 特别是我自己 – 特别有负罪感的一件事。关于为啥全局变量不好的讨论是相当直接的：这增加了脚本和变量冲突的概率，而且源文件和命名空间本身都会充斥着数不清的命名模糊的变量。

Douglas Crockford 坚信一个Javascript应用的代码质量可以用其中使用的全局变量数来评价，越少越好。由于并不是什么都可以定义成local的（不过要诚实，其实你现在考虑的那个是可以的，别偷懒），你需要想办法整理你的变量以避免冲突，并把命名空间的膨胀减到最小。最简单的方法就是采用单变量或者把用到这些全局变量的模块尽可能减少。 Crockford提到YUI只用了一个全局变量，YAHOO。他在他的博文 “全局统治” 中讨论了更多的细节问题。

考虑这种情况：对于小型web应用，全局变量通常用于保存应用级的设置，可以用你的项目名或者settings作为命名去定义一个对象，这样总的来说会更好。

// 被污染的全局命名空间
var settingA = true;
var settingB = false;
var settingC = “test”;

// 用 settings 作为对象命名
var settings =
settingA: true,
settingB: false,
settingC: “test”

不过，如果我们可以通过避免使用全局变量来减少冲突概率，但是把命名空间标准化成一样的，岂不是会增加各个应用之间产生冲突的概率么？呃，这个担忧确实有道理。所以，建议你用自己特定的应用名作为全局变量的命名空间，或者用和jQuery采取的 $.noConflict() 模式相同的方法重新分配你的命名空间.

var myAppName =
settings:
settingA: true

//访问全局变量
myAppName.settings.settingA; // true
驼峰法变量命名
JavaScript变量的驼峰法命名在大部分编程环境中都是作为标准的。有读者在评论中提出了唯一的例外，就是要用大写字母加下划线来指代常量。

var X_Position = obj.scrollLeft;

var xPosition = obj.scrollLeft; // 更好，更简洁

SCENE_GRAVITY = 1; // 常量
循环的性能 - 缓存数组长度
循环估计是Javascript性能调优最重要的部分了。在一个循环内部节省个一两毫秒的，说不定总体就省出好几秒来了。这里有一招就是把数组的长度缓存，这样在循环里就无需每次迭代的时候都计算一遍了。

var toLoop = new Array(1000);

for (var i = 0; i < toLoop.length; i++)
// 败家玩意 - 长度会反复算 1000 次你知道不？

for (var i = 0, len = toLoop.length; i < len; i++)
// 会过日子 - 长度只计算一次，然后缓存了

例外
如果你对一个数组做循环来查找并删除某个元素，这就会改变数组长度。任何时候你只要会在循环内部增加或删除元素来改变数组的长度，你就给自己带来了麻烦。这种情况下，你要么每次改变后重新设置数组长度，要么就别缓存它了。

循环的性能 - 使用 ‘break;’ 和 ‘continue;’
跳过和跳出循环的能力对于避免开销很大的循环周期是非常有用的。

如果你是在循环内部查找，查找成功以后你会做什么？比如1000个元素的循环执行到一半，你就找到了你要的东西。你不管三七二十一，即使知道后面的if语句不会再有符合的机会，还是让循环继续把剩下的500个元素迭代完么？不！你应该跳出循环，必须的！

var bigArray = new Array(1000);

for (var i = 0, len = bigArray.length; i < len; i++)
if (i === 500)
break;

console.log(i); // 这样只会输出 0 - 499

另一个问题是跳过某个特定的迭代，然后继续循环。虽然说类似于奇偶数这样的条件可以通过把 i++ 替换成 i + 2 的办法来管理，有些条件还是需要具体检测，然后触发跳过操作。任何能够避免执行完整的迭代过程的东西都是很有用的。

var bigArray = new Array(1000);

for (var i = 0, len = bigArray.length; i < len; i++)
if (condition)
continue;

doCostlyStuff();

函数调用不要传输太多的参数
对于可读性而不是其他因素来说，下面这种方式真是糟透了：

function greet(name, language, age, gender, hairColour, eyeColour)
alert(name);

下面的例子预先构建了一个对象作为参数，或者把内联对象传递过去，这样就好多了。

function greet(user)
alert(user.name);

greet(
name: “Bob”,
gender: “male”
);
把 ‘this’ 映射为 ‘self’
在编写面向对象（OO）Javascript代码的时候, 必须了解 this 的作用范围. 不管你用来构建伪类的设计模式是什么，对 this 的引用是指向一个实例的最简单办法。当你开始把jQuery的helper方法和你的伪类集成的时候，你就会注意到 this 的作用范围变化。

Bob.findFriend(“Barry”);

Person.prototype.findFriend = function(toFind)
// this = Bob
$(this.friends).each(function()
// this = Bob.friends[i]
if (this.name === toFind)
// this = Barry
return this;

);

在上面的例子里， this 经历了从对 Bob 的引用，变成对他的朋友 Barry 的引用的过程。 了解 this 的取值在一段时间发生的变化是很重要的。在原型函数内部， this 指向所在伪类的当前实例（这里是 Bob ）。而一旦我们进入 $.each() 循环， this 就会重新映射为被解析数组的第 i 个元素。

解决办法是把 this 的值重新映射为 self 或者 _self。虽然 self （不带下划线）并不是 保留字, 但它 确实是 window 对象的一个属性。虽然我上面用到 self 的例子是从jQuery源代码中挑的，但他们也认识到了这个错误，正打算 修正目前的状况 ，也就是改用 _self。我个人还是喜欢用 self ，不为别的，就因为它的简洁 – 不过它可能会冒出一些非常令人困惑的bug。总之，用 self 有风险，使用需谨慎。

在下面的例子中，我会更好地利用在 $.each() helper 中提供的参数，同时重新映射 this 的值。

Bob.findFriend(“Barry”);

Person.prototype.findFriend = function(toFind)

// 就这一次用到了 "this"
var _self = this;

$(_self.friends).each(function(i,item) 
    if (item.name === toFind) 
        return item;
    
);

我能用 Boolean 吗？
布尔变量必须能够很容易通过命名来识别。可以用类似于 is, can 或者 has 的前缀来形成一个问句。

isEditing = true;

obj.canEdit = true;

user.hasPermission = true;
尽量减少重新绘制和重新布局
重新绘制和重新布局与重新渲染DOM的过程关联，这个过程会在特定属性或元素被改变时发生。重新绘制是在某个元素的外观被改变但没有对布局进行调整的情况下触发的。 Nicole Sullivan 在一篇全面的 博文 中把这些改变描述为诸如是否可见或背景色变化之类的样式改变。重新布局则是开销更大的操作，由调整页面布局的一些改变引发。例如增加或删除元素，改变某个元素的宽度或高度，甚至是改变浏览器窗口的大小。最糟糕的情况是重新布局导致先辈、兄弟和孩子节点元素也需要重新布局的多米诺骨牌效应。

毫无疑问，重新绘制和重新布局应该尽量避免，但是如何做到呢？

重新布局的例子
其实也不是说下面的代码就很糟糕啦。不过我们先假定数组 arr 有10个元素

var myList = document.getElementById(“myList”);

for (var i = 0, len = arr.length; i < len; i++)

myList.innerHTML += "<li>" + arr[i].title + "</li>"; //重新布局 -- 增加到元素

在上面的 for 循环里，每次迭代会触发一次重新布局。10次迭代就是10次重新布局。

现在考虑下面的代码：

var constructedHTML = “”;

for (var i = 0, len = arr.length; i < len; i++)
constructedHTML += “

• ” + arr[i].title + “
• ”; //没有重新布局 - 增加到字符串
  

  document.getElementById(“myList”).innerHTML = constructedHTML; //在这里重新布局
  在这个场景里，需要增加的元素是在一个字符串里构建的。循环里边没有产生任何重新布局，因为DOM并没有变化。只有当数组被完全循环完毕，构建的字符串被应用到某个对象的 innerHTML ，这才产生函数里唯一的一次重新布局。

  有无数种重新布局和重新绘制是可以避免的，希望你幸运地了解了那些诀窍。这方面的阅读材料汗牛充栋，不过大部分的材料都会引用到 Nicole Sullivan的这篇 博文 ，这是一个完美的起点。除了这里的经验，在涉及到"web 3.0"和HTML5时代的多种技术术语的时候，还有其他重要的经验教训值得汲取。上面的分析直接适用于写jQuery代码。在捣腾 canvas 的时候这些原则也很重要，另外尽量保持帧频在30-60的范围内。

  不要用微秒来产生唯一的ID
  自打web开发早期开始，就流行一种产生唯一ID的方法。具体做法是把从1970年1月1日开始计算的微秒数加到你的静态ID后面，如下所示：

  var myID = “static” + new Date().getTime();
  这本来是相当万无一失的方法，因为即便两段这样的代码连续执行，在它们执行的间隙也会有几毫秒。可是现在新的浏览器带着新的Javascript引擎，伴随着一直在提升的主频。到现在，上面的代码产生相同的毫秒数的可能性会比产生间隙的可能性更大。

  这会导致传统方法难以debug的bug。因为你的DOM是在运行中创建的，对页面源代码进行传统的测试无法确定多个重复ID的错误。Javascript和jQuery的错误处理机制会把第一个匹配的作为ID并忽略其他的重复ID。所以它甚至都不会抛出JS错误！

  这样不行，唯一真正的方法是逐行设断点和log，但是如果断点的位置不对，你的毫秒数又不会冲突了！

  好消息是有很多产生唯一ID的替代方法。学究气一点的说法是，计算机的随机数函数其实并不是真正随机的，因为它还是来源于系统时间，虽然这一点值得注意，但是随机数冲突的可能性是微乎其微的。

  var myID = “static” + Math.round(Math.random() * 10000);
  我个人更偏爱人工产生GUID方法。从技术角度说，GUID是根据你的硬件创建的，不过下面的Javascript函数做得相当棒。这是我从 stack overflow 的一个帖子 里偷来的，相当顺手的一个函数。

  function S4()
  return (((1+Math.random())*0x10000)|0).toString(16).substring(1);
  
  function guid()
  return (S4()+S4()+“-”+S4()+“-”+S4()+“-”+S4()+“-”+S4()+S4()+S4());
  
  var myID = “static” + guid();
  检测特性，而不是检测浏览器类型
  用户的浏览器是否支持地理信息？用户的浏览器是否支持web works？HTML5 视频？HTML5 音频？答案曾经是这样的：

  if ($.browser.msie)
  // 哦，是IE啊，那肯定不支持
  
  但是世界在快速变化。最新版的IE几乎能算是现代浏览器了，但它依旧给前端开发带来痛苦。更早版本的IE基本上和它之前的版本一样烂，这就让偷懒的Javascript程序员习惯于检测 if (ie) 然后执行一些微软专用的破语法。现在IE9已经废弃了这些专用函数，那些原来的 if (ie) 老古董就反而会坏事了。

  那么，如果能检测每个特性而不用检测（既不可靠又能伪装的）user-agent，你觉得咋样？

  如果你的回答是 “那相当靠谱”, 那你就说对了。

  用 Modernizr 吧，这是行业梦幻级大师Paul Irish参与开发的一个Javascript库。该库集广泛应用、轻量级和海量文档三大优势于一身，实施无需动脑，实为居家旅行、杀人灭口必备。它会产生一个 Modernizr 对象，其中包含了它所有检测测试的结果，这样检测某个特性的支持与否就和下面的例子一样简单：

  // 检测浏览器是否支持canvas的老办法
  if (!!document.createElement(‘canvas’).getContext) …

  // 用 Modernizr 检测
  if (Modernizr.canvas) …
  使用可读的毫秒数
  毫秒数的一种方便的写法是写成可读的。对于初学者这很棒，但是大部分情况下其实只是一个噱头。

  // 这是3秒，30秒还是300秒啊？
  var timeout = 30000;

  // 增加了额外的计算开销，但是读和修改会更容易
  var timeout = 30 * 1000;
  关于jQuery代码
  像疯狗一样串接
  jQuery最好的特性之一就是它的函数串接。你可能已经用过一点，也许把一些简单的调用一个接一个串起来…但是你是否曾经像头疯狗一样在DOM里上蹿下跳地遍历呢？还是花点时间来熟悉一下 .end() 函数。等你从起始选择器开始在DOM里上蹿下跳的时候，这个函数会很关键。

  $(“.quote”)
  .hide()
  .find(“a”).text(“Click here”).bind(“click”,doStuff).end()
  .parent().removeClass().addClass(“testimonial”).draggable().end()
  .fadeIn(“slow”);
  上例中，每次我们完成对某个DOM对象的操作，要反向遍历DOM返回我们引用的原始对象的时候，就需要使用 .end() 函数。然后我们就顺藤摸瓜扎回原来DOM里的位置了。

  使用 data-* 属性
  你们当中那些已经写了很长时间Javascript（原生的，不是jQuery）代码的同学，很可能都熟悉各种属性吧。你们想办法设置它们，获取它们，或者滥用 rel 和 title …

  别说HTML5 或者 jQuery 没帮上忙哦。新的描述中允许在HTML元素中使用 data- 前缀来指明包含数据的属性，jQuery会把指定的字符串转换成正确的Javascript数据类型，这活干的非常漂亮。我们来创建一个带有某些数据属性的 DIV 。

web前端开发需要学习什么?需要哪些开发工具?

今天来和大家讲讲web前端开发需要学习什么?前端开发又需要用到哪些开发工具?然后分享一些前端开发的视频教程给大家,然后也简单的和大家介绍下前端开发的前景和薪水工资情况.

　　首先封程中自己是java开发工程师,目前是搞服务端(后端开发)的,但是之前也做过2年的javaweb前端开发,所以经验还是有一些的,下面就简单和大家介绍下我的经验吧,说的不好,大家勿喷,学习该学习的,忽略该忽略的就好.

web前端工程师其实在不同的公司,有不同的职能,但是称呼都是类似的

　　1.做网站设计、网页界面开发

　　2.做网页界面开发

　　3.做网页界面开发、前台数据绑定和前台逻辑的处理(我是属于这种的)

　　4.设计、开发、数据

　　web前端开发需要掌握的技术：

　　1.学习html,这个是最简单的,也是最基础的.要熟练掌握div、form table、ul li 、p、span、font这些标签,这些都是最常用的,特别是div和table,div用于布局、table也可以用于布局,但是不灵活,基本 table是用来和数据打交道.

　　2.学习css,这里说的css不包括css3,一般我们看到web前端开发工程师的要求里面,有一个会使用css+html 或者 css+div 来进行界面布局,所以css是用于辅助html来布局和展示的,我们称之为“css样式”,为什么会说css+div呢?因为我上面说了div就是 html主要用于布局的东西,所以div就是核心掌握的东西!那么css肯定必须要配合div来使用才好.css要熟练掌握float、 position、width、height，以及对于的最大最小、会使用百分百、overflow、margin、padding等等,这些都是跟布局 有关系的样式,一点要掌握.

　　3.学习js. 可能前两个大家觉得还过的去,看到js就蛋疼了,其实吧,js入门很简单的,不需要会很多东西的,只要会根据某个id、或者name拿到网页dom或者样 式、或者值,然后会给某个id或者name的元素标签赋值、或者追加数据、追html,这个是跟数据有关系的操作,然后数据逻辑判断,效果方面的,无非就 是跳转、弹框、隐藏什么的,把这些全部结合其他就是实际用途了,代码一点都不难,会了这些基础js,其他的直接百度就好了.然后看多了,用多了,就什么都 不是问题了.

　　4.学习jquery.jquery是相当于把js封装了一套的一个js插件,目的就是操作起来更方便,代码写的更少,jquery入门也很简单,那些是入门需要学的和js一样,只是换成了jq的代码.其他的一样百度就够了.

　　5.最好会点后台语言,比如java、php,为什么呢?因为我们前台界面的数据都是从后台来的,如果会点后台代码,就知道怎么跟后台交互数据是最好的, 这样节约时间,也可以让前端代码更规范.不然可能因为你的写法和后端给来的数据不能结合上,那么前端代码又得重新写,那就更蛋疼了.

　　6.学习css3+html5,为什么这个放最后呢?哈哈,因为我自己也不太会,毕竟术业有专攻嘛,虽然这个很流行,但是我是搞后端的,在工作中用不到 它,只有在自己网站需要改样式,或者朋友网站样式出问题的时候,我才会去临时去研究下.但是如果你们是准备专门搞前端,那么最好还是学一下的.

　　上面6点,基本是一个搞web前端开发工程师需要掌握的技术,然后我也尽量的把自己的一点点经验告诉了大家,但是大家不要以为上面6点就只有我说的那么容 易,不,他们之所以被人使用,之所以这么火,就是因为强大!我说的这么简单仅仅是打消你们觉得很难的原因,万事开头难,我讲的都是入门的方法和技巧以及需 要知道的东西.另外告诉大家一个秘密,不要以为代码很难敲,现在什么语言都有自动提示代码的功能,只需要输入一个字符,两个字符,后面的代码都会弹出来让 你选择!还怕啥呢?所以你也不要怕你英语不好了.封程中从来不骗人的.

　　web前端开发需要视频教程以及资料：

　　这个我免费做个广告吧,视频大家可以主要看“传智播客”的视频,因为我当时学技术专业知识的时候,就是经常课后去看传智播客的视频,讲的确实不错,我最喜欢里面的 韩顺平老师,不过我当时看的是java,如果他也有讲上面css、html什么的,你们也可以看看.

　　另外我们搞编程都会经常查阅一个叫api的东西,这个相当于使用手册,比如java api 、php api 、js api 什么的,大家直接这样百度,html+css的api 应该是可以找w3c的一个网站,对新手学习很不错.

　　web前端开发需要用到的工具:

　　最常用的就是dreamweaver,推荐大家使用dreamweaver cs6,cs6之前的貌似问题挺多的,cs6目前是功能最强大,问题最少的了,dw有一个比较方便的就是可视化编程,可以边看效果边敲代码,还有自动提示 代码的功能.还有就是ediplus,这个其实就相当于一个字体有颜色的记事本,我就是用这个,因为我感觉dw占用内存太多了,搞的电脑卡,所以我直接用 ediplus写代码,至于这个有没有代码自动提示功能我就不知道了,大家可以百度下是否有相关插件.还有就是eclipse可以写java、php还有 上面的各种代码!Zend Studio 是专门写php的,但是上面这2种工具比较专业,是我们专业开发人员用的,所以大家自己看着办.Photoshop这个就不用说了.

　　web前端开发的前景:

　　web前端开发的前景肯定是非常好的,我们不管的做网站还是做什么项目,现在都讲究的一个用户体验,人家说如果你的网站界面做的好看,那么你们的网站、项 目就已经成功3/4了!所以现在很多人都说web前端开发的前景要稍微好于后端开发.但是我打个对比,前端开发技术学到顶级,后端开发技术开发技术也学到 顶级,那后端开发工资是肯定远远高于前端的,但是后端开发技术到了一定程度会有个很大的瓶颈的,所以初中级程序员,前端开发要稍微比后端开发要好,高级程 序员的话就完败了。

　　web前端开发的薪水工资:

　　这个是个敏感的话题,我是在上海这边,2年工作经验的web前端开发工资差不多6K~8K,如果你会些后台技术,并且前端技术很牛逼的话,到10K也是可 能的.这个工资的多少主要取决于你的技术情况,所以工资也不一定的.但是北上广的一个web前端工程师的市场价差不多就是这样,如果是二线省会城市,可能 就是4K~7K,也是不错的.我们搞技术这个行业,工资的多少取决于你技术的好坏,技术这一行不能比,因为人比人气死人,大牛的一个上面有一个的,努力学 习才是晚到,技术这行学无止境的.封程中也是跳过几次槽的人,所以说说大概的情况,觉得价格少的勿喷,上海也没多牛,大部分人都还是处于被压榨的码农.

　　web前端开发的一个介绍就到这了,封程中写了2个多小时,写的不好,但是也付出了时间来分享,所以希望大家不要喷,希望可以帮助到需要帮助的朋友.

扫码加下方大牛微信，获取最新编程学习视频及面试技巧，备注数字 2，一定要备注数字2