一个网站的诞生- MagicDict开发总结1 [首页]

news/2024/5/19 16:50:38/文章来源:https://blog.csdn.net/weixin_34029680/article/details/93556941

    能够自己拥有一个 个人网站,可能是很多人的梦想。在这个阶级固化的时代,我们需要一个梦想和目标。。。。

    由于本职工作不算忙碌,自己对于动手制作网站有兴趣,所以,从去年9月底开始,萌生了制作一个个人网站的念头。

    一直从事COBOL,PL1等非面向对象的工作,借着开发网站的机会,过过面向对象的瘾.使用VB10年了(VB6-VB2010),这次作为挑战,同时为了以后择业面考虑,开发语言也准备用C#。至于网站的内容嘛,由于工作需要日语,同时处于一个对日外包的圈子,以及对现有在线字典的有些不满,所以准备自己开发一个日语词典网站。目标是能够成为沪江小D那样的伟大的网站。

    一个伟大网站,需要有一个好的首页。一个好的首页,我的定义是:整洁干净,导航明确,有自己的风格。

    怎么做出一个好的首页呢?

    由于自己是做技术出身的,对于设计,视觉效果,不是非常精通。好在我们是一个善于山寨的民族,借鉴一下成功的网站设计,是一条成功的捷径。由于想成为沪江小D,所以,先从他开始山寨。于是乎,第一个山寨首页在2010-10-2日诞生了。

[还好,以前有手写HTML,CSS,JS的功底,HTML还是很熟悉的。不过,兼容性还是将我打败了,这个话题以后再写了]

这个可是网站的原始设计图阿,清汤挂面,没有使用任何CSS,如果什么时候网站IPO了(醒醒,这里不是美国,别做美国梦了),这个可是具有历史意义的图片阿。

    首页,要干净,颜色尽量少一些。千万不能太花哨了。花哨其实就是不专业的代名词。

    简约不简单,这个是永远的王道。就像黑色和白色是永远最安全的衣服颜色一样。

    最初的网站,就是一张图片,一个输入框,2个检索按钮,用惯了Google的同学们一下子就知道怎么检索了。

    同时为了表示向沪江小D的致敬,也放了热门检索词的联结(其实,到现在为止,热门词不是统计出来的,是本人手工设定的。。。)

    最初的东西,总归很纯真,简单,就像爱情一样。

    不过随着时间的推移,功能的增加,首页也开始注入新的色彩了。CSS是必须的。在用户体验上,增加了输入检索词语的同时,下拉列表框显示提示词语的功能,首页也变得丰富多彩了。下图是2011年1月28日的截图

    关于如何实现 边输入 边提示候选列表,这个如果大家需要的话,将在下一篇文章中介绍。

  (做这个功能的时候 ,我第一次开始感觉到万恶的浏览器兼容性问题,向所有前台程序员致敬)

   其实做到这里,总结下来就是,

       第一:如果你不知道什么样的设计是好的设计,你的网站不是以设计为卖点的,最好的方法是,借鉴前辈成功的同类型网  站的设计。

(就像所有的团购网,都是商品图片加一个带有价格的标签一样,我虽然不是设计最好的,但是和大家保持一致,不会吃亏)

        第二:HTML一定要手写,别用什么自动工具,一来没有冗余代码,二来,你知道所有代码的含义。

                FireBug是前台的法宝,JS,CSS,都靠这位同学了

        第三:IE,FF,Chrom,这三个浏览器兼容性很不好,所以,前台的同学,伤不起阿

  最后到了现在,首页又增加了很多内容,并且加了Google的广告和来访者统计,变成了下面这个样子了。

  坦白说,广告栏一加,首页的档次下了一个台阶了,不过,为了体验一下广告系统,还是加了(广告费,对于小网站来说,根本就可以忽略不计,不过,有一点灰色收入,能从伟大的Google 那里拿点钱,还是很有趣的。。。。)

   

 

在开发网站的时候,每个阶段都会截一张图做纪念。看着首页的变化,能够回忆起一些制作时候的快乐和郁闷。

做网站就像十月怀胎一样,制作的时候很苦,做成的时候很兴奋。

可能现在自己的网站人气不高,不过,怎么说也是自己的孩子,打上了自己烙印了。

 

因为是第一篇文章,又是谈谈我不擅长的设计,所以可能篇幅不够长,下面的文章会谈谈技术和数据库设计。

 

另外,觉得一个人做网站太苦了,有人愿意加入网站开发吗?日语单词检索网站,ASPNET开发的。

有兴趣的写信给我 root#magicdict.com   [convert # to @ ]

或者加MSN mynightelfplayer@hotmail.com

网站地址 http://www.magicdict.com/

 

(文章有推广自己网站的嫌疑,请猴子手下留情阿。。。。) 

 

转载于:https://www.cnblogs.com/TextEditor/archive/2011/05/28/2060840.html

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.luyixian.cn/news_show_851578.aspx

如若内容造成侵权/违法违规/事实不符,请联系dt猫网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

通过脚本方式导出SharePoint网站集用户及其角色列表

这是课堂上的一个例子,分享出来给大家参考用。如果你管理一个或者多个网站集,那么这个脚本将有助于你快速地了解用户信息。 管理员们,懂点脚本还是很有用的哦,呵呵 将下面的脚本保存为一个ps1文件function Get-UsersWebPermission…

Java爬虫实践--爬取CSDN网站图片为例

实现的效果,自动在工程下创建Pictures文件夹,根据网站URL爬取图片,层层获取。在Pictures下以网站的层级URL命名文件夹,用来装该层URL下的图片。同时将文件名,路径,URL插入数据库,便于索引。 第一…

在线小说网站的设计与实现(附源码)

最近在做一个课程设计,在线小说网站的设计,以下是课题要求,需要项目练手的童鞋可以试试身手。 由于最近新学了JavaEE,所以采用了jspservlet来写,前端部分用了少量的js和jQuery处理,数据库用了MySQL&#xf…

最新LAMP×××网站平台PHP5.5.1 + Apache2.4.6 + mysql5.6.12

记录一下,今天配置的这台网站服务器,大部分都是在官方找的最新版源码包。1.下载安装所需要的最新软件源码包,包括最新的apache、mysql、php以及相关库文件的源码包。httpd-2.4.6.tar.gz:http://mirrors.cnnic.cn/apache//httpd/ht…

淘宝网采用什么技术架构来实现网站高负载分析

2019独角兽企业重金招聘Python工程师标准>>> (中国电子商务研究中心讯)时间过得很快,来淘宝已经两个月了,在这两个月的时间里,自己也感受颇深。下面就结合淘宝目前的一些底层技术框架以及自己的一些感触来说说如何构建一个可伸缩&…

另类解决 无法在发生错误时创建会话,请检查 PHP 或网站服务器日志,并正确配置 PHP 安装

安装了PHPStudy,在登录PHPMyAdmin时,出现“无法在发生错误时创建会话,请检查 PHP 或网站服务器日志,并正确配置 PHP 安装”的提示,而无法进入数据库的问题。 在试过了N多网上的解决办法之后,终于觉醒,网的…

ASP.NET MVC5 网站开发实践(二) Member区域 - 咨询管理的架构

咨询、留言、投诉等功能是网站应具备的基本功能,可以加强管理员与用户的交流,在上次完成文章部分后,这次开始做Member区域的咨询功能(留言、投诉都是咨询)。咨询跟文章非常相似,而且内容更少、更简单。 目录…

onmouseout,mouseover经过子元素也触发的问题解决方案

在mouseout与mouseover的冒泡问题上,相信有很多朋友都遇到过。今天这里就总结一下 关于mouseover和mouseout冒泡问题的解决方案: 首先,看下event.relatedTarget的用法。 relatedTarget 事件属性返回与事件的目标节点相关的节点。 relate…

25个精美的创意机构和设计工作室网站案例

浏览器创意机构和设计工作室为他们自己设计的网站是一件非常有趣的事情。这些人设计的网站,代表着整个领域的最新趋势,值得网页设计人员去跟随。 有人可能会认为他们会用最疯狂,过于超前的设计。但你会惊讶地知道,这些创意机构和设…

个人网站盈利的几种方式

之前看到一篇讲述个人网站盈利的10种方法的文章,原文在这里:http://www.sitepoint.com/10-ways-earn-money-from-your-site/ ,但不太适合中国国情,不够接地气。本文就说几个接地气的个人网站盈利的几种方法。(主要针对IT个人网站)…

大型网站系统架构演化之路

大型网站系统架构演化之路 前言 一个成熟的大型网站(如淘宝、天猫、腾讯等)的系统架构并不是一开始设计时就具备完整的高性能、高可用、高伸缩等特性的,它是随着用户量的增加,业务功能的扩展逐渐演变完善的,在这个过程…

微网站|h5弹窗|手机网站 html5 弹窗、弹层、提示框、加载条

为了精确体验,您可通过Chrome设备模式浏览。或通过[url]手机扫二维码进入[/url] layer mobile是为移动设备(手机、平板等webkit内核浏览器/webview)量身定做的弹层支撑,采用Native JavaScript编写,完全独立于PC版的lay…

访问jira网站中已解决问题链接时跳转到另一IP的解决办法

迁移完Jira后,以普通用户进入jira,点击Jira中已解决问题的链接,发现跳转到的IP是迁移前的IP,以下为解决办法。 第一步:使用管理员用户进入Jira,点击“管理”-->"通用设置"; 第二步…

Wordpress 网站搭建及性能监控方法详解!

2019独角兽企业重金招聘Python工程师标准>>> ######前言 说到 Wordpress,大家往往想到的是博客,其实,如今的 WordPress 已经成为全球使用量最多的开源 CMS 系统。并且,如果你有一定的技术基础稍加改动,就可…

IIS 7 发布网站

1.先按F6编译通过。 2.操作如下列图上所示: 3. IIS 的配置 部署完毕 如有问题请留言,大家一起解决。

支付宝手机网站支付接口API之C#版

一、准备工作 1、使用企业支付宝签约手机网站支付 2、下载支付宝官方demo 文档地址:https://doc.open.alipay.com/doc2/detail?treeId60&articleId103564&docType1 下载地址:http://aopsdkdownload.cn-hangzhou.alipay-pub.aliyun-inc.com/demo…

JQuery仿购物网站放大镜特效所遇问题及思考

JQuery仿购物网站放大镜特效所遇问题及思考 先贴下效果图,然后描述起来也就不会不知道我在说什么了。 我碰到的问题一: 一开始我自己总结了是因为两个小原因导致的①使用了mouseover,mouseout事件②因为层叠样式(z-index)的原因。一开始的HTM…

bind、click、mouseover、mouseout及简写实现显示与隐藏效果

1、$().bind("click", function() {...........});也可以写成 $().click(function() {..........}); 2、$().bind("mouseover", function() {...........}) .bind("mouseout", function() {...........}); 也可以写成 $().mouseover(function…

如何修改XAMPP默认网站目录

XAMPP默认网站目录保存在...\xampp\htdocs文件夹下,修改目录步骤: 1.XAMPP面板,点击Apache服务器Config按钮,选择Apache(httpd.conf); 2.在打开的记事本中,使用快捷键CtrlF进行查找&…

nodejs微信公众号开发——9.爬取网站素材定时推送消息

上一篇文章:nodejs微信公众号开发——8.群发消息,介绍了高级群发接口的实现,并通过一个简单例子加以说明。本节的内容可能和微信公众号开发本身关系不大,只是我小项目中涉及到的内容,知识点包含nodejs爬虫和定时模块。…