酷站两连发!网页排版对齐神器Graaf+台湾专属免费图库 - 优设-UISDC

酷站两连发!网页排版对齐神器Graaf+台湾专属免费图库

2017/02/24 5539评论区

当设计师把网页设计稿交给前端开发人员写代码后,页面往往与原稿有些偏着。前端人员写完页面后,还需要截图叠加到设计稿上,去看看偏差比率,这是很麻烦的事情。为了解决这个问题,建议设计师和前端人员看看今天分享的 Graaf 栅格样式工具。

Graaf

Graaf 可以直接在页面上显示栅格线,而且可以自定义栅格结构,大大减少前端或设计师检测页面的烦恼。

产品特色:

1. 直接在WEB页面上显示栅格,方便前端人员实时调整(赞赞赞)
2. 栅格样式支持多个流行布局,如:Bootstrap, BBC News, Dribbble, Github, Medium…
3. 支持定制栅格样式(赞赞赞)

直接在页面上显示栅格线

只需要引入CSS 文件就能直接在页面上显示栅格线,这些既方便查看页面错位,又可以实时刷新调整,再也不用一个个截图到设计稿了。

<link rel="stylesheet" href="https://grids.graaf.space/WIDTH/COLUMNS/GUTTER.css">

自带多个栅格样式

目前自带了有10多个流行的栅格样式,只需要替换对应样式表名称就行,如下图,如果你需要 Bootstrap 的栅格,就点击 bootstrap.css 就能看到样式表链接,然后直接嵌入网页即可。

自定义栅格样式(赞)

如果没有你需要的栅格系统,那么可以简单修改 CSS 链接就可以自定义栅格线了,比如这个链接:

https://grids.graaf.space/793/10/16.css

793/10/16分别是宽度、列数、间隔,你只需要修改对应数值就会即时生效,比如设置为宽度:1200px,列数:3列,间距:30 px,那么链接就这样改动:

https://grids.graaf.space/1200/3/30.css

Taiwan Scenery Gallery

(搭梯子访问)

而且今天重点介绍 Taiwan Scenery Gallery 这个图库资源,特色在于图库里的所有图像均来自台湾,所以设计师们如果想找免费的台湾照片,这是一个很好的资源。

据 FLiPER 报道这是由 2 个广告系台湾本土女生创办,她们时常思考身在台湾,有没有可能为台湾做点什么,为台湾留下美的记录?

水稻 | 摄影:裴

最后她们想到了分享免费图像的行动,因为喜欢照相的台湾人很多,而需要照片的人也很多,特别是设计师们,这个行动不仅可以帮到需要图片的人,同时也在向世界传播着台湾的美。

池上乡,台东县 | 摄影:Eting

这个照片资源全部均为台湾人提供,但…报道前还有100多张,而现在小编看了下,只有44张,也许被购买版权了吧。免费分享的同时,摄影师也能获得额外收入,这也是不错的。

台南海安路(已删)

桃源谷 | 摄影:Eting

澎湖西嶼(已删)

澎湖湖西

新竹柿饼 | 摄影:范育銓

虽然目前只是很少的相片,但我们报道后,也会有不少人的参与进来,未来她会继续成长,敬请关注。

「优设最新神器推荐

  1. 《这款图标神器,让你体验用完即走的畅快感》
  2. 《超过5万张!免费高清可商用图库ZOOMMY 3.0重磅来袭!》
  3. 《超好用的PS字体管理插件FONTAGS(附安装方法)》

原文地址:shejidaren

【优设网 原创文章 投稿邮箱:yuan@uisdc.com】

================关于优设网================
“优设网uisdc.com“是国内人气最高的网页设计师学习平台,专注分享网页设计、无线端设计以及PS教程。
【特色推荐】
设计师需要读的100本书:史上最全的设计师图书导航:http://hao.uisdc.com/book/
设计微博:拥有粉丝量190万的人气微博@优秀网页设计 ,欢迎关注获取网页设计资源、下载顶尖设计素材。
设计导航:全球顶尖设计网站推荐,设计师必备导航:http://hao.uisdc.com

优设大课堂

非特殊说明,本文版权归原作者所有,转载请注明出处
本文地址:https://www.uisdc.com/graaf-space-taiwan-scenery-gallery

发表评论 加载中....

评论加载中....

uisdc

评论区都快饿瘪了,看看我期盼的小眼神...

sketch 优设大课堂 转场动效 设计师 扁平化设计 交互设计师 界面设计 排版布局 职场 平面设计 设计师专访 素材下载 视觉设计 配色 设计流程 web前端开发 AI教程 用户体验设计 设计理论 神器下载 海报设计 字体下载 设计趋势 设计规范 psd下载 动效设计 图标设计 产品设计 logo设计 ICON 神器推荐 职场规划 App设计 字体设计 酷站推荐 交互设计 ui设计 设计师职场 优秀网页设计 用户体验 ps技巧 酷站 PS教程 网页设计 经验分享
wechat

优设官方微信

50万设计师关注

微信号:youshege

把好文章收藏到微信

打开微信,扫码分享
学设计 优设网 在这里