不久前看到一篇介绍定制网页浏览的方法,当时就想着,我把我的博客页也修改下,在手机浏览的时候,也能漂亮的显示出来。以后写的文章的话,也可以分享的微信朋友圈里面和朋友分享。

具体步骤参考:http://www.cnblogs.com/lvdabao/p/5245247.html

我按照上面的做了,但是,手机浏览起来,还是跟一坨屎一样,不得不佩服自己的UI制作能力。

前台功底不行呀,HTML标签一知半解,js也就那样,css基本不动,你叫我咋样,咱只能一步一部来了。所以,今天就先分析下模板画面的大致结构,日后有空一点一点的把画面做的美丽些。

那么下面进入想表达的主题:博客模板的wireframe解剖

我使用的模板:MoonlightInk ⇒http://www.cnblogs.com/Skins.aspx

■用到的工具/技术

1,Enterprise Architect

一个相当不错的UML工具,wireframe只是它的一个小小的扩展(ver12开始支持)

官方网站:http://www.sparxsystems.cn

2,wireframe

线框图是整合在框架层的全部三种要素的方法:通过安排和选择界面元素来整合界面设计;通过识别和定义核心导航系统来整合导航设计;通过放置和排列信息组成部分的优先级来整合信息设计。通过把这三者放到一个文档中,线框图可以确定一个建立在基本概念结构上的架构,同时指出了视觉设计应该前进的方向。

※摘抄于百度百科:http://baike.baidu.com/view/1977536.htm

■画出来的效果

上也不说了,客官看看图得了

我的博客模板(线框图wireframe)的更多相关文章

  1. 第41篇 推荐一个jekyll博客模板

    本人用的模板是基于Codeboy的博客模板改造模板,(由于本人可能会有很多样式修改,所以不再将修改pullrequst到原项目,在此对codeboy模板表示感谢).功能改造如下: 添加微信支付宝打赏 ...

  2. 基于Jekyll的博客模板

    代码地址如下:http://www.demodashi.com/demo/13147.html 效果 环境配置 环境 Windows 10 Git Bash 安装ruby 下载rubyinstalle ...

  3. 使用CSS/JS代码修改博客模板plus

    之前对CSS/JavaScript了解还不深,只是把模板的CSS胡乱修改了几个属性.最近正好也在做一个网站的前端,学习了不少东西,再来改一改~ 上次最后之所以铩羽而归,是因为从CSS里找不到那些#和. ...

  4. 简洁侧边wordpress博客模板

    模板描述:商务领航,尽现成熟稳重的个人小站风格     响应式Web设计,自适应电脑.平板电脑.移动设备     图标字体库,自适应各种终端设备,保证图形图标清晰无锯齿,支持Retina(视网膜屏幕) ...

  5. flask实战-个人博客-模板 --

    模板 personalBlog采用典型的博客布局,左侧三分之二为主体,显示文章列表.正文:右侧三分之一为边栏,显示分为类列表.社交链接等.现在的工作是将HTML文件加工为模板,并创建对应的表单类,在模 ...

  6. 解决Hexo博客模板hexo-theme-next的翻页按钮不正常显示问题

    用Hexo搭了个Gitpage的博客,兴冲冲的发了11篇博文后发现翻页按钮不正常显示,显示为<i class="fa fa-angle-right"></i> ...

  7. 使用CSS代码修改博客模板

    在修改设置使公告栏里的头像更新为新的头像时发现里边还有“页面定制CSS代码”这一选项,查了一下发现这东西可以对页面做一些个性化的调整.正好目前我使用的这个模板标题和导航栏的字体实在难看,顺手修改了一下 ...

  8. 查看博客模板的css代码

    1.可以去模板列表里选择一个模板 http://www.cnblogs.com/Skins.aspx 目前使用的模板是http://www.cnblogs.com/SkinUser.aspx?Skin ...

  9. 博客模板更新CSS

    采用了作者#a的模板BlueSky进行了些许修改 在原有基础上加了三个样式,使页面显示风格统一些 #home{ background-color:#fff; } #main{ background-c ...

随机推荐

  1. [Express] Level 1: First Step

    Installing Express Let's start building our new Express application by installing Express. Type the ...

  2. 如何在HTML5 图片预览

    HTML5的 File API允许浏览器访问本地文件系统,借助它我们可以实现以前无法实现的本地图片预览功能. 先介绍下该API实现了那些接口: 1.Blob接口,表示原始的二进制数据,通过它可以访问到 ...

  3. centos6.4使用man查找命令时,报错No manual entry for xxxx

    前提:安装man的命令 yum -y install man 使用man报错 [root@localhost objs]# man fcntlNo manual entry for fcntl[roo ...

  4. Linux高级字符设备驱动

    转载:http://www.linuxidc.com/Linux/2012-05/60469p4.htm 1.什么是Poll方法,功能是什么? 2.Select系统调用(功能)      Select ...

  5. ngrok 2016版

    1. 先到http://www.ngrok.cc/下载客户端 2.进管理页面 注册登录 3.绑定域名 新增: 复制客户端id 打开该目录 按住shift 右键->在此处打开命令窗口 输入 sta ...

  6. 自定义强大的C#网络操作基础类(NetHelper)

    using System; using System.Text;using System.Net.Sockets;using System.Net.Mail;using System.Net; nam ...

  7. 利用VBA+OO4O构造CTAIS开放式通用平台

    利用VBA+OO4O构造CTAIS开放式通用平台 2010-06-08 14:59:28 | 来源:税务信息化论文集 | 作者:于非 易飞 摘  要:文立足于CTAIS系统体系,探讨如何通过OO4O技 ...

  8. D. Ilya and Escalator

    D. Ilya and Escalator time limit per test 2 seconds memory limit per test 256 megabytes input standa ...

  9. Unity3D 4.61 实现淡入淡出的场景过渡方法。

    还在学习过程中,如果有大大看到请指点. orz原来官方就有了更好的处理方法的教程,具体查看下面视屏. [Unity官方实例教程 秘密行动] Unity官方教程<秘密行动>(五) 屏幕渐变效 ...

  10. 转js contains 方法

    function Jcontains(root, el) { if (root.compareDocumentPosition) return root === el || !!(root.compa ...