正如语言风格指南一样，模式库有两个主要用途。首先，是它们提供了一组编码或设计标准，Web 开发团队可以在整个网站中应用，有助于保持一致的编码实践和外观；其次，对于要学习网页设计最佳实践来说是宝贵的财富。

　　在本文中，我想与大家分享7个网页设计风格指南和模式库，这些都是 Web 设计和开发过程中的最佳实践经验，值得借鉴。

您可能感兴趣的相关文章

Google HTML & CSS Style Guide

首先给大家推荐的是 Google 公司的编码建议，告诉开发人员应该怎么写和格式化 HTML 和 CSS 代码。如果你是一个新手，它是一个有益的开端，帮助您培养良好的编码风格。

Yahoo Pattern Library

这个是一个真正的设计模式库，正因为如此，它试图提供解决方案来解决所有网页设计师将碰到的问题，包括雅虎的设计师来处理导航，交互和布局。

A List Apart Pattern Library

A List Apart 可能是最知名的网页设计博客。他们最近发布了他们自己的模式库作为努力开源他们的网站的一部分。该模式库包括该网站设计上的解决方案以及 HTML 代码片段的问题。

Responsive Web Design Patterns

这是一个响应式设计的模式库，你可以从中学会响应式设计的细节，它涵盖了从布局到简单易懂的示例图像。

Interaction Design Pattern Library – Welie.com

这个网站的设计虽然老旧，但它确实提供了众多的设计模式的资料。这是我见到的最全面的模式库，涉及了设计者将面临的每一种情况。

MailChimp Pattern Library

MailChimp 模式库是作者在创建响应式，灵活，直观的应用程序过程中的副产品。不断迭代既需要一个高效的工作流程和明确的，可以快速集成新的用户界面，而不必增加新的技术或者设计原子元素的集合。

Starbucks Style Guide

最后登场的是 Starbucks 公司网站的风格指南，包括网格框架的使用、布局和组件的使用等等。

本文链接：有助于提高你的 Web 开发技能的7个模式库

编译来源：梦想天空 ◆ 关注前端开发技术 ◆ 分享网页设计资源

有助于提高你的 Web 开发技能的7个模式库的更多相关文章

  1. [置顶] 提高生产力：Web开发基础平台WebCommon的设计和实现

    Web开发中,存在着各种各样的重复性的工作.为了提高开发效率,不在当码农,我在思考和实践如何搭建一个Web开发的基础平台. Web开发基础平台的目标和功能 1.提供一套基础的开发环境,整合了常用的框架 ...

  2. 提高生产力：Web开发基础平台WebCommon的设计和实现

    Web开发中,存在着各种各样的重复性的工作.为了提高开发效率,不在当码农,我在思考和实践如何搭建一个Web开发的基础平台. Web开发基础平台的目标和功能 1.提供一套基础的开发环境,整合了常用的框架 ...

  3. Web 开发精华文章集锦（jQuery、HTML5、CSS3）【系列二十七】

    <Web 前端开发精华文章推荐>2014年第6期(总第27期)和大家见面了.梦想天空博客关注 前端开发 技术,分享各类能够提升网站用户体验的优秀 jQuery 插件,展示前沿的 HTML5 ...

  4. 前端文摘：Web 开发模式演变历史和趋势

    今天的<前端文摘>给大家分享一篇玉伯的文章.文章详细介绍了 Web 开发的四种常用模式以及未来可能成为流行趋势的 Node 全栈开发模式,相信你看了以后一定会有收获. 您可能感兴趣的相关文 ...

  5. web开发快速提高工作效率的一些资源

    前端学习资源实在是又多又广,在这样的一个知识的海洋里,我们像一块海绵一样吸收,想要快速提高效率,平时的总结不可缺少,以下总结了一些,排版自我感觉良好,推送出来,后续持续跟新中...... 开发工具 H ...

  6. iOS——学习网址收集+如何提高iOS开发技能

    1 一个比系统自带的终端好用的软件:http://www.iterm2.com 2 学习和遇到技术问题可以去的网站: CocoaChina      http://developer.cocoachi ...

  7. Ionic进行PC端Web开发时通过脚本压缩提高第一次加载效率

    1. 问题 1.1. 问题上下文描述: 基于Ionic进行PC端的Web应用开发: 使用Tomcat作为最终服务发布容器. 1.2. 问题描述: 编译后main.js的大小为4-6MByte.(集成第 ...

  8. 极大提高Web开发效率的8个工具和建议（含教程）

    面对复杂的 Web 应用的开发,良好的流程和工具支持是必不可少的,它们可以让日常的开发工作更加顺畅.更加高效.本文介绍了6个Web开发利器以及相关的教程,帮助你在开发.调试.集成和发布过程极大地提高效 ...

  9. Web开发人员vs网页设计师

    Web开发人员vs网页设计师 我们都遇到过,但实际的区别是什么?如果您是该领域的新手,请阅读详细内容,这些内容比您想象的更重要. 经过几周(或几个月)的规划和准备,进行市场调查,与其他企业家交谈,现在 ...

随机推荐

  1. Android permission

    1. users-permission Users-permission is the permission that this app should acquire, so that the app ...

  2. 第1章 C#类型基础

    1.1值类型和引用类型 1.1.1 值类型 使用值类型之前需要对值类型的所有元素初始化(普通值类型和结构体). 结构还有一个特性:调用结构上的方法前,需要对其所有的字段进行赋值,为了避免对结构体中所有 ...

  3. 爬虫--scrapy--windows上安装

    关于scrapy的安装网上有一大把教程,但是比较麻烦,各种包----------,这里给大家介绍一款神器: 下载地址:http://continuum.io/downloads 根据自己电脑的系统选择 ...

  4. html css一些记录

    1.忽略将页面中的数字识别为电话号码 <meta content="telephone=no" name="format-detection" /> ...

  5. linux 下部署 redis

    Redis是一种高级key-value数据库.它跟memcached类似,不过数据 可以持久化,而且支持的数据类型很丰富.有字符串,链表,集 合和有序集合.支持在服务器端计算集合的并,交和补集(dif ...

  6. sqlserver,mysql,oracle通用的模拟和改进的全文搜索算法

    问:数据库效率最低的地方是什么? 答:表扫描 问:表扫描常见的情况是 答:like '%a%' 这类查询 如果使用全文检索引擎,又无法满足我们的需求的时候怎么办,比如要从 一个商品名称 "农 ...

  7. QEMU命令创建KVM Guest(bridge桥接)

    1. Check QEMU version [root@pqsfc018 ~]# /usr/bin/qemu-system-x86_64 -version QEMU emulator version ...

  8. linux下杀死进程（kill）的N种方法

    常规篇: 首先,用ps查看进程,方法如下: $ ps -ef ……smx       1822     1  0 11:38 ?        00:00:49 gnome-terminalsmx   ...

  9. mysql数据库查询pdo的用法

    最早的php对mysql数据库查询是mysql和mysqli方法,后来php的新版本进一步封住了该方法,于是又pdo,抛开php框架,使用pdo查询数据,使用也是相当简便 <?php ini_s ...

  10. Intellij IDEA 根据数据库自动生成pojo和hbm

    新建一个项目,每次写hibernate部分,就觉得pojo和hbm.xml部分很蛋疼.今天搜索了半天,终于知道如何根据数据库自动生成了. Intellij IDEA14创建maven时并不能勾选各种支 ...