25 个非常好的网页设计和开发的资源

点这里

Here’s the 25 Best Weekly Web Design & Development Resources #18 Collective that aims to introduce fresh new, trendy and easy-to-use web design & development resources (freebies, codes, graphics, tools, inspiration, etc) from the past week. Have fun with it and remember to share with your friends.

Bukhari Script – Free Font

Bukhari Script is a bold monoline cursive font.

Bobz Type

mono16

Monospaced font made for programming.

FREE MATERIAL DESIGN UI KIT

1000+ Material Design Icons. Set of more than thousand material design icons in over 20 categories, and 7 resolutions. 7000+ files included, and it’s free!!!

1000 MATERIAL DESIGN ICONS

1000+ Material Design   Icons. Set of more than thousand material design icons in over 20 categories, and 7 resolutions. 7000+ files included, and it’s free!!!

Teracy Wireframe Kit

This is the Wireframe kit created to help speed up your wireframing process. This kit includes basics UI elements for web, UI elements for Mobile and other devices will be updated in the future.

Prism Effect   Slider   with Canvas

A tutorial on how to create a slider with a “prism” effect using HTML5 canvas globalCompositeOperation and a layering technique.

Responsible

Responsible.js – Give visitors the choice of what mobile experience they want. Adds Toggle for mobile to desktop switching without page reloads

Pintsize

Pintsize is the ideal place to start your next web project. As well as providing you with the basics to get building quickly, it’s nice and tidy file structure makes it easy to scale your projects efficiently.

wavesurfer.js

Interactive navigable audio visualization using Web Audio and Canvas.

AnchorJS

A tiny JavaScript utility for adding deep anchor links to existing page content.

cta.js

cta.js or “Call to Animation” is a light-weight performant library to animate any element (“action”) onto any other element (“effect”) on the page.

yeti.css

yeti.css is a pattern library consisting of lightweight, reusable modules. It has been built to reflect &yet’s visual and branding guidelines.

Responsive   Waterfall

Responsive waterfall grid   implement in pure javascript without any dependencies. Compatibility: IE9+

Dom Animator

A nifty JavaScript library, used to show small ascii animations within comments in your dom. It’s a little easter egg for anyone inspecting your code. Nothing more, nothing less.

Canvas image slider

Github.js

Github.js is a JavaScript plugin over GitHub APIs v3. It gives an easy way to feature your GitHub open-source contributions on your website or portfolio.

sticky-sidebar

sticky-sidebar is a plugin, written in vanilla JavaScript, using which you can add fully responsive sticky sidebars to your pages or the entire website.

line-chart

Awesome charts for AngularJS. Built on top of D3.js and AngularJS, n3-line-chart  creates beautiful charts in AngularJS applications. It is simple and interactive.

Animating CSS-Only Hamburger   Menu   Icons

A collection of animating CSS-only hamburger menu icons.

zxcvbn

zxcvbn, named after a crappy password, is a JavaScript password strength estimation library. Use it to implement a custom strength bar on a signup form near you! zxcvbn attempts to give sound password advice through pattern matching and conservative entropy calculations. It finds 10k common passwords, common American names and surnames, common English words, and common patterns like dates, repeats (aaa), sequences (abcd), and QWERTY patterns.

React Blur

React component for creating blurred backgrounds using canvas.

HTML-GL

HTML GL solves “the slow DOM problem” by creating WebGL representations of DOM elements and hiding actual DOM after. This speeds up HTML/CSS animations and transformations by using 3D   hardware acceleration and allows to apply OpenGL effects as modern 3D games have.

Autocompeter

A really fast AJAX autocomplete service and widget.

Burger

Burger is a minimal hamburger menu with full-screen navigation. It is created by mblode.

时间: 2024-10-03 09:46:57

25 个非常好的网页设计和开发的资源的相关文章

移动网页设计与开发 HTML5+CSS3+JavaScript

第1章 网络平台1.1 对术语的简短说明1.2 你是谁,你需要知道些什么1.3 了解什么是HTML51.4 真正的HTML51.5 CSS3及其他1.6 浏览器支持1.7 测试,再测试,进行更多的测试总结 第2章 结构和语义2.1 HTML5的新元素2.2 网页易读性倡议的无障碍的富因特网应用程序组件(WAI-ARIA)2.3 语义标记的重要性2.4 微格式2.5 RDFa2.6 微数据2.7 数据属性2.8 Web组件:标记的未来?总结 第3章 设置响应性CSS3.1 媒体查询3.2 Java

网页设计和开发中,关于字体的常识

本文的最新内容将在GitHub上实时更新.欢迎在GitHub上关注我,一起入门和进阶前端. 前言 我周围的码农当中,有很多是技术大神,却常常被字体这种简单的东西所困扰. 这篇文章,我们来讲一讲关于字体的常识.这些常识所涉及到的问题,有很强的可操作性,都是在实际业务中真实遇到的,都是需要开发同学和产品经理.设计师不断重复沟通的. 字体真的只是"系统默认,无从解释"这么简单吗?是产品被忽悠?还是开发在敷衍?二者之间的博弈究竟谁能胜出?学会本文,你就能胜出. 字体分类 常见的字体可以分为两类

Html JavaScript网页制作与开发完全学习手册

篇 HTML技术章 HTML入门 1.1 什么是HTML 1.1.1 HTML的特点 1.1.2 HTML的历史 1.2 HTML文件的基本结构 1.2.1 HTML文件结构 1.2.2 编写HTML文件注意事 1.3 HTML文件编写方法 1.3.1 使用记事本编写HTML页面 1.3.2 使用Dreamweaver编写HTML文件 1.4 网页设计与开发的过程 1.4.1 明确网站定位 1.4.2 收集信息和素材 1.4.3 规划栏目结构 1.4.4 设计页面图像 1.4.5 制作页面 1.

9个GIF,概括网页设计25年历史

Froont,一家为web设计师制作工具的旧金山公司,用9个GIF格式动画来表现网页设计在过去25年的发展历程.如果你想知道为什么CSS这么重要,为什么Flash会逐渐淘汰,这些动画图或许能让你一窥究竟. 网页设计的单色时代,约1989年.想想Lynx和其他以Unix为基础的web浏览器,这些浏览器只会通过网络从这个终端到另一个终端一个字一个字地蹦出来.没有图形用户界面,只有一串字母和一个闪烁的光标. 现代化的开始,约1995年.第一个浏览器,例如Mosaic,允许设计人员在网站上显示图片,但是

自适应网页设计(Responsive Web Design)

转载自:http://www.ruanyifeng.com/blog/2012/05/responsive_web_design.html 随着3G的普及,越来越多的人使用手机上网. 移动设备正超过桌面设备,成为访问互联网的最常见终端.于是,网页设计师不得不面对一个难题:如何才能在不同大小的设备上呈现同样的网页? 手机的屏幕比较小,宽度通常在600像素以下:PC的屏幕宽度,一般都在1000像素以上(目前主流宽度是1366×768),有的还达到了2000像素.同样的内容,要在大小迥异的屏幕上,都呈

如何去设计一个自适应的网页设计或HTMl5

如今移动互联网随着3G的普及,越来越火爆,更多需求跟随而来!APP应用市场和APP应用数量成倍成倍的增长!从而给移动互联网带来新的挑战! 移动设备正超过桌面设备,成为访问互联网的最常见终端.于是,网页设计师不得不面对一个难题:如何才能在不同大小的设备上呈现同样的网页? 手机的屏幕比较小,宽度通常在600像素以下:PC的屏幕宽度,一般都在1000像素以上(目前主流宽度是1366×768),有的还达到了2000像素.同样的内容,要在大小迥异的屏幕上,都呈现出满意的效果,并不是一件容易的事. 很多网站

手机web——自适应网页设计(html/css控制)

一. 允许网页宽度自动调整: "自适应网页设计"到底是怎么做到的? 其实并不难. 首先,在网页代码的头部,加入一行viewport元标签. <meta name="viewport" content="width=device-width, initial-scale=1" /> viewport是网页默认的宽度和高度,上面这行代码的意思是,网页宽度默认等于屏幕宽度(width=device-width),原始缩放比 例(initia

响应式网页设计简单入门(强烈推薦!!!!)

响应式网页设计简单入门 Overview: 构造基本的HTML页面 动态加载样式表 Viewport 字体缩放 侧边栏 导航菜单 图片自适应 其他 总结 说到响应式网页设计(Responsive web design),最近在谷歌加上碰到个奇葩贴子,通过一个原始到无法再简单的网页Motherfucking Website及满屏幕的fuck道出了网页设计的真谛,这孩子不是个激进分子就是个报复社会型的货没错,虽然整篇文章就像是泼妇骂街,但我特么是笑着读完的.. 统计了下全文共用Fuck (包括fuc

HTML5+CSS3的响应式网页设计:自动适应屏幕宽度

这几天都在修改博客上面的样式.本来用的是d83.0的模板.自己又修改了许多地方,其中自己修改的一些地方在手机里面显示的效果不是很理想,于是想改成自适应的效果.对CSS3不是特别的熟练,只能去网上找找案例看了.发现一个不错的文章.写的比较入门,也很仔细.所以拿过来分享给大家.如果还想看图片的响应式案例可以看我找的另外的一篇<分享一个非常有用的HTML5+CSS3响应式图片案例>. 移动设备正超过桌面设备,成为访问互联网的最常见终端.于是,网页设计师不得不面对一个难题:如何才能在不同大小的设备上呈