轩枫阁

首页 / 搜索标签: 主题

轩枫阁V3主题设计开发总结—技术篇

前言

轩枫阁V3.0主题已上线,自2013年上线发布,V1-V3,3年。3个月完成V3主题PC端、移动端交互原型、网页重构、功能开发、工具一键上线。

本次主题的更新,对整站进行优化,主要包括设计改版、性能优化、体验优化。

本文主要针对主题各类技术开发进行总结:

  • 主题分离篇
  • 重构篇
  • 图片优化篇
  • 开发篇
  • 构建篇
  • 加载篇

设计篇:轩枫阁V3主题设计开发总结—设计篇 查看全文

2016/09 06  周二

轩枫阁V3主题设计开发总结—设计篇

前言

轩枫阁V3.0主题已上线,自2013年上线发布,V1-V3,3年。3个月完成V3主题PC端、移动端交互原型、网页重构、功能开发、工具一键上线。

本次主题的更新,对整站进行优化,主要包括设计改版、性能优化、体验优化。

本文主要针对设计进行介绍:

  • 重新思考设计整站UI
  • PC端与移动端相分离
  • 文案、设计排版、细节表现更加细致

PC端

主颜色

主色调选用浅白、深灰、浅黑、天蓝、青色,使页面简洁、扁平、纯粹。

color-main 查看全文

2016/08 21  周日

wordpress移动端自动切换主题代码

前言

H5持续火热,随着微信公众号、朋友圈、微博等途径可导入大量阅读量,博客网站移动端自适应势在必行。

下面介绍基于wordpress的网站如何实现移动化。

响应式布局

响应式网站设计(Responsive Web design)的理念是:集中创建页面的图片排版大小,可以智能地根据用户行为以及使用的设备环境(系统平台、屏幕尺寸、屏幕定向等)进行相对应的布局。

优点:一套代码,能够适应不同分辨率设备访问,易于维护。

缺点:受限于同一套HTML结构,导致很多差异化布局不好进行扩展,对于小屏设备往往采用隐藏方式减少内容。

自适应框架如Bootstrap、UIKit、Adobe Edge Inspect、Foundation、Responsablecss等。

响应式网站展示:http://mediaqueri.es/http://flatdesignluv.com/

响应式布局的实现方式为通过CSS3的媒体查询Media Queries,针对不同分辨率做断点,使用不同的样式。

常用断点查询:屏幕尺寸大全UI设计规范 查看全文

2016/08 20  周六

Chrome主题插件制作方法

前言

用久了Chrome,发现已经厌倦简洁的New Tab新标签页。而Chrome应用商店的主题又不是很符合自己的口味,不够个性化。我们的需求也很简单,能自定义张壁纸就好。就此研究了下,Chrome主题插件的制作方法。

编写插件

安装http://xuanfengge.com/demo/201505/chrome-theme/xuanfeng-theme.crx

特点:主要对背景图、按钮颜色、标签栏颜色做优化 查看全文

2015/05 17  周日

纸飞机许愿

x

钢琴节奏

请选择弹奏的曲谱

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 1
    • 2

    [返回曲谱列表]

    点击开始录制,可以录制弹奏的曲子