上一章,我们创建了首页。
下面我们准备开始做主页。
先新建一个页面:home.htm
主页相对于展现个性的首页,内容要多很多,那么就要讲究排版了。
当时流程的排版还是用 table,div 大概是 2003 - 2004 年慢慢流行起来的。
整个首页页面从上到下,分为:页眉(Header)、内容(Body)、页脚(Footer)
页眉(Header)
一般占据一行,大约有 60px 那么高。 分为 3 列,从左到右依次为: Logo(88 * 31)、Banner(550 * 100)、Contact。
大概就是这样:
引入之前创建的:main.css 文件
内容区(Body)
内容区我简单的分了上层和下层
上层,增加了主要栏目的导航栏
本站导航→→→ | 紫云轩 | 文学茶社 | 星座小屋 | 游戏专区 | 老站回顾1 | 老站回顾2 | BBS论坛 new!
下层,使用表格将内容区分为了左侧和右侧
左侧分了40%的宽度,用于展示功能 | 右侧分了60%的宽度,用于展示详细的内容 |
---|
页脚(Footer)
页脚一般就是写一些版权信息,关于我们等,随性发挥即可。
最后,大体框架,就已经成型了!
接下来,就去找素材来填充内容区了。
一般个人小站的内容都是搜刮自己感兴趣的或者有现成的。我用了当时电脑杂志附带的光盘里的内容,复制粘贴到小站里。
最后根据自己的喜好,换一下网页背景,加一些 Javascript 动画等等
最终的效果:
在页面里,可以看到提供了一些“互动”的功能:
- 学友社区(学校校友社区,不是张学友。。。)
- “我要买”服务区
这个学友社区,其实是在
免费论坛社区、免费轻量论坛、免费网络投票系统,提供各类免费网站应用服务-互动力量www.activepower.net申请的,它提供了留言板、计数器、论坛、社区等功能,都是免费的。
对于当时的个人网站来说,是必不可少的。
第二个是用的老外写的:Applet Web Password 2 工具生成的。
它的原理就是通过这个软件,预设了用户名和密码,以及跳转的页面(某个html页面),然后生成一个class文件,在页面加载。
这两个工具,或多或少有点缺点:
- 免费社区,数据不在本地,说不定哪天就不提供服务了
- 用户名和密码是写死了的,而且目标页面没有做过期验证,只要知道了目标页面,下一次就可以绕过登录直接查看了
那么下一期,我会给小站,加一点属于自己的真正的互动功能:使用ASP + Access编写一个留言板。
songday:如何做一个2000年风格复古的个人网站(1)开发环境准备zhuanlan.zhihu.comsongday:如何做一个2000年风格复古的个人网站(2)创建个人小站-首页zhuanlan.zhihu.comsongday:如何做一个2000年风格复古的个人网站(4)留言板保存留言功能zhuanlan.zhihu.comsongday:如何做一个2000年风格复古的个人网站(5)留言板查看功能zhuanlan.zhihu.com