首先前端框架绝对是让前端攻城师鸡冻的东西
目前大部分前端框架都有响应式的设计，比如说经常听到的Bootstrap
布局、样式只要在欲应用的目标上添加一个类就可以完成
栅格系统帮助你更好地去布局网页
但是有的时候只是为了一个按钮而去动用整个框架有点小题大做，你可以在框架中提取出你想要的片段单独应用到你的作品中
虽然我现在写网页不太用框架了...

前端框架当然有用，我用bootstrap主要解决跨平台，跨终端，跨浏览器问题。使任何用户的访问体验基本一样。当然使用前端框架就需要同时符合他的规范，比如bootstrap就提出了关于html代码编写的规范。而且bootstrap还有大量的衍生插件和主题，基本满足简单的设计需求。针对复杂情况再引入其他框架就可以了。真正需要考虑的是大量的框架对服务器的占用，所以需要进行cdn等优化，使用户体验更好。
使用了前端框架，是可以放弃部分设计师工作的。设计师的工作更趋近于在平面化设计的基础上提出标准，诸如字体，文字大小，主体色调，组件间距等等。
同时如果设计师了解了前端框架之后，可以基于框架进行设计，使设计师与开发沟通更紧密，比如bootstrap中的栅格模型，将1行分为12个部分。设计师可以基于模型进行布局，例如左侧图片占3个，右侧文字占9个。而在屏幕大小变化后，例如手机屏幕，该模型会自动进行调整。变成图片现实在上面，文字显示在下面的。（基于css3实现）

网页只提供基本的标签, 以及标签怎样组合,
业务需求和设计师想要的, 是一个整个可以用的页面,
那么, 从基本的标签, 到完成设计师要求的页面, 到实现需要当中的复杂逻辑, 有很大的鸿沟

首先, 要把 HTML 组合到一个成为小的组件, 组件之间定义好退通信的规则,
然后, 要对组件进行美美化, 同时做好组件切换或者切换过程当中的效果,
再然后, 将组件进行组合, 按照业务逻辑直接各种页面跟流程
当然, 这当中还会有大量的意外, 大量的 bug, 需要一点点解决掉

那么多事情, 你又没有三头六臂, 怎么办? 如果你会编程, 好最好的办法就是重用代码!
怎么重用代码呢... 就出现了各种组件, 各种类库, 各种框架
所以, 框架之类提高效率的办法就是看哪些代码可以重用, 包装一个下, 共享

此外, 需要考虑一下, 写网页的办法很多, 你打算怎么写? 哪些是可以重用的?
如果你有重用的部分, 而且这部分别人已经做了共享出来, 那你才可以直接用

设计还是设计，和框架没太大关系，框架只是写好一些常用的组件和通用的界面展示，加快你的开发速度。

我前段时间也有这个疑问来着，想着 Bootstrap 到底有什么好。
自己倒腾了一段时间的博客，抱着顺便学习一下框架的心态，采用了 Bootstrap。有什么好处呢？
比如：
要做一个自适应的导航栏，就得考虑颜色、布局、对不同屏幕大小的适应。但是，如果用 Bootstrap，直接用导航组件就可以了，添加类似 nav-bar 的类。这就是说，我们可以直接使用定义好的组件，并且需要什么组件还是可以定制的。如果用原生的，还可以用 cdn 来加速加载速度。

一般的说来，好处在于：
1、直接使用定义好的组件（按钮、导航等等），并可以实现定制
2、良好的编程风格，团队合作起来更加容易理解。即便是不用，其编程方式也是值得学习的
3、帮你解决一部分兼容问题，自己就不用考虑那么多了
4、更多的附属资源，一个被使用频繁的框架，就衍生出来更多的附属资源

直观一点，你看，自己做个博客，也就写了七八行 css，其他全部 Bootstrap 搞定。

个人的理解是，框架预先写好了很多东西，而如果你使用框架，则可以方面的引入已经写好的那些东西，提高你的开发效率。

不过，由于你并非使用到框架里所有的东西，所以会有不少多余的代码，有部分使用者会考虑对于原始框架进行一次精简。

初次接触前端开发的话，建议还是打好基础。

另外，图片布局设计啥的，和框架没关系。网站是你自己设计的，框架只是为了提高效率，方便你去实现。

库和框架都能够有效的优化工作效率。

其中库主要体现在开发方面，如处理兼容性、封装好了各种接口等等；框架更偏向于工程，如前端项目代码组织架构、模块化和组件化等，也有代码构建相关的。

总体而言都是为了提高效率的，不过和设计图片之类的关系不太大。

使用的话库之类的直接引入就好了，然后按照它文档里的说明使用即可；框架的话可能会影响到你整个的结构，看看它官网的文档，了解它能做哪些事情，再看看适不适合。

框架和比较底层的库迁移成本都挺高，所以使用之前先了解一下是否合适。