思路篇:将我的构思更直观的表现出来,为我的博客绘制一个简单的设计稿

Fesion · · 568 次点击 · · 开始浏览    
这是一个创建于 的文章,其中的信息可能已经有所发展或是发生改变。

学习golang开发,不应该仅仅局限于golang语言本身。同时我们还应该拓展学习为学好golang而需要应用到的其他方面的知识。比如学习html、css、js,项目架构、画原型图等工作。

这一节,我们就要利用网络工具来给我们的博客画出存在于我们脑子里的博客的基本样子,以便后面我们制作博客网站的时候,可以拿它来做基本的参考,同时也是可以给我们后面分步编写工作提供工作量预估等。

博客首页该长的样子,博客首页的设计图

博客首页

博客首页包含三大块,头部导航、中间主体文章列表内容、页脚信息等。

头部采用常规的网址设置,中规中矩。头部左边显示网址logo和文字,中间为导航按钮,右边为博客管理按钮,登录退出、发布文章等操作。

中间主题部分采用左边大右边小的两栏布局,左边大的部分放置文章列表,文章列表显示文章标题、文章简介、简介显示最多三行,超出部分使用省略号显示。简介下方是次要信息,采用灰色小字体显示文章分类、文章发布时间、浏览量等信息。

中间右侧边栏显示博客信息、文章归类、热门文章等内容,用来扩大内容入口。这里还可以根据需要显示更多的信息,比如最新发布的文章、按年月归档的记录、tag集合等信息。

页脚信息设计的比较简单,这里可以放置版权信息、博客一句话介绍、关于我们等信息,也可以将自己的联系方式,比如微信、qq、邮箱、二维码等挂到页脚这里。

博客文章详情页设计图

文章详情页

文章详情页面主要是用于醒目的展示标题、文章内容,辅助信息如文章分类、发布时间,浏览量等信息,用浅一点的颜色来显示,它没有那么重要,最下方还要放上一篇、下一篇,用来方便蜘蛛爬取和用户连续浏览。右侧放一些相关的文章内容,比如最新发布的文章、本文相关的文章等信息展示。

博客文章发布页面设计图

文章发布页面

博客文章发布页面,集合了文章发布、分类创建等操作。在发布文章的时候,填写上标题、填写文章分类、文章关键词、文章简介、文章内容字段后,点击发布,后台就会根据提交的表单信息,自动判断入库,如果标题已经存在,则这篇文章不会被发布。分类已经存在,则直接使用已存在的分类,如果分类不存在,则创建新分类等。

博客登录管理页面设计图

design-login.png

博客登录页面比较简单,要求填写用户名、密码,通过验证即可开始管理和发布文章了。这里还可以设置得更复杂一些,比如设置一个谁也想不到的随机路径作为登录路径,这样子就不会暴露管理权限路径了。同时增加其他辅助验证,比如图形验证码、12306选图验证、极验验证码验证等方式。这里为了简便,先把其他验证都省了。

博客初始化页面设计图

初始化页面

博客初始化页面需要填写数据库地址、数据库端口、数据库名称、数据库用户名、数据库密码信息,用来将博客的表创建到数据库中,管理数据。

同时,初始化的时候,还需要设置管理员账号和管理员密码,用于初始化完成,博客正常使用管理和发布文章等操作的时候,验证管理权限。


有疑问加站长微信联系(非本文作者)

入群交流(和以上内容无关):加入Go大咖交流群,或添加微信:liuxiaoyan-s 备注:入群;或加QQ群:701969077

568 次点击  
加入收藏 微博
添加一条新回复 (您需要 登录 后才能回复 没有账号 ?)
  • 请尽量让自己的回复能够对别人有帮助
  • 支持 Markdown 格式, **粗体**、~~删除线~~、`单行代码`
  • 支持 @ 本站用户;支持表情(输入 : 提示),见 Emoji cheat sheet
  • 图片支持拖拽、截图粘贴等方式上传