Archive for 十二月, 2006

一个用户登录，犯得着全都模仿吗？

十二月 29th, 2006


最先看到的应该是163的。

后来雅虎改成这样了。

百度也是这样的。

还有很多小网站更是照搬过来改个名字就用了。。。

 

Posted in 产品设计

Tags:

0 Comments

 

Google的一个小错误

十二月 29th, 2006

电子邮件:
密码：
哈哈。一个半角一个全角。

 

Posted in 资讯分享

Tags:

0 Comments

 

2006圣诞网站Logo大阅兵

十二月 26th, 2006












































以下是Flash版
网易
attachments/month_0612/f2006122602227.swf
雅虎
attachments/month_0612/r2006122602235.swf
泡泡网
attachments/month_0612/x2006122602245.swf
雅虎
attachments/month_0612/z2006122602252.swf
Dangdang换得最快,一转眼就换成元旦的了。

 

Posted in 资讯分享

Tags:

0 Comments

 

Merry Christmas

十二月 25th, 2006

Merry Christmas

 
今天下班，你一定要吃蛋炒饭，但只能吃饭不能吃蛋，如果你能达到蛋饭分离的境界，必能“剩蛋快乐”！如果你能把炒饭中的蛋再变回原来完整的蛋，“圆蛋快乐”！！
 
图片来源：蓝色经典
图片作者：lain2k
 

Posted in 简单生活

Tags:

0 Comments

 

[分享]CSS页码效果

十二月 24th, 2006


不知道网上有没有做成这样的，纯粹是不小心做出来的。
最终效果说明：
页面结构是这样的

<li><a href="#">1</a></li>

最终看到的彩色下划线是根据li的背景色显示出来的

li{background:#f60;}

而鼠标移上去的色彩变化是根据

a:hover{background:#f93}

当然关键的地方在于

li{width:20px;height:20px}

定义li的高度时由于没有定义line-height:20px，所以会造成a标签在显示时下方会留空几个像素。正在由于这个错误，无意中产生了这个效果

请运行下段代码看效果。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="gb2312">
	<head>
		<title>代码基地博客站</title>
		<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
		<meta name="Keywords" content="CSS页码链接" />
		<meta name="Description" content="CSS制作的页码链接效果" />
		<meta name="Author" content="jxdawei,jxdawei@gmail.com" />
		<style type="text/css">
			body{
				font-size:62.5%;
			}
			h1{
				font-size:1.4em;
			}
			h2{
				clear:both;
				font-size:1.2em;
			}
			#pageClass{
				clear:both;
				font-size:1.2em;
			}
			#pageClass ul{
				list-style:none;
			}
			#pageClass li{
				float:left;
				width:20px;
				height:20px;
				line-height:20px;
				border:1px solid silver;
				margin:0 3px;
			}
			#pageClass a{
				display:block;
				text-align:center;
			}
			#pageClass a:link,#pageClass a:visited{
				background:white;
				text-decoration: none;
				color:gray;
			}
			#pageClass a:hover,#pageClass a:active{
				text-decoration: none;
				background:gray;
				color:white;
			}

		/*第二个效果*/
			#pageClass2{
				clear:both;
				font-size:1.2em;
			}
			#pageClass2 ul{
				list-style:none;
			}
			#pageClass2 li{
				float:left;
				width:20px;
				height:20px;
				border:1px solid silver;
				margin:0 3px;
			}
			#pageClass2 a{
				display:block;
				text-align:center;
			}
			#pageClass2 a:link,#pageClass2 a:visited{
				background:white;
				text-decoration: none;
				color:gray;
			}
			#pageClass2 a:hover,#pageClass2 a:active{
				text-decoration: none;
				background:gray;
				color:white;
				line-height:14px;
			}
		/*第三个效果*/
			#pageClass3{
				clear:both;
				font-size:1.2em;
			}
			#pageClass3 ul{
				list-style:none;
			}
			#pageClass3 li{
				float:left;
				width:20px;
				height:20px;
				border:1px solid silver;
				background:#f60;
				margin:0 3px;
			}
			#pageClass3 a{
				display:block;
				text-align:center;
				line-height:16px;
			}
			#pageClass3 a:link,#pageClass3 a:visited{
				background:white;
				text-decoration: none;
				color:gray;
			}
			#pageClass3 a:hover,#pageClass3 a:active{
				text-decoration: none;
				background:#f93;
				color:white;
				line-height:16px;
				}
		</style>
	</head>

	<body>
		<h1>页码效果</h1>
		<h2>这是我原本想要去做的效果</h2>
		<div id="pageClass">
			<ul>
				<li><a href="http://www.iwcn.net/default.asp?cateID=3">1</a></li>
				<li><a href="http://www.iwcn.net/default.asp?cateID=4">2</a></li>
				<li><a href="http://www.iwcn.net/default.asp?cateID=5">3</a></li>
				<li><a href="http://www.iwcn.net/default.asp?cateID=6">4</a></li>
				<li><a href="http://www.iwcn.net/default.asp?cateID=8">5</a></li>
				<li><a href="http://www.iwcn.net/default.asp?cateID=9">6</a></li>
				<li><a href="http://www.iwcn.net/default.asp">7</a></li>
			</ul>
		</div>
		<h2>做完之后成这样了</h2>
		<div id="pageClass2">
			<ul>
				<li><a href="http://www.iwcn.net/default.asp?cateID=3">1</a></li>
				<li><a href="http://www.iwcn.net/default.asp?cateID=4">2</a></li>
				<li><a href="http://www.iwcn.net/default.asp?cateID=5">3</a></li>
				<li><a href="http://www.iwcn.net/default.asp?cateID=6">4</a></li>
				<li><a href="http://www.iwcn.net/default.asp?cateID=8">5</a></li>
				<li><a href="http://www.iwcn.net/default.asp?cateID=9">6</a></li>
				<li><a href="http://www.iwcn.net/default.asp">7</a></li>
			</ul>
		</div>
		<h2>改了改成这样了</h2>
		<div id="pageClass3">
			<ul>
				<li><a href="http://www.iwcn.net/default.asp?cateID=3">1</a></li>
				<li><a href="http://www.iwcn.net/default.asp?cateID=4">2</a></li>
				<li><a href="http://www.iwcn.net/default.asp?cateID=5">3</a></li>
				<li><a href="http://www.iwcn.net/default.asp?cateID=6">4</a></li>
				<li><a href="http://www.iwcn.net/default.asp?cateID=8">5</a></li>
				<li><a href="http://www.iwcn.net/default.asp?cateID=9">6</a></li>
				<li><a href="http://www.iwcn.net/default.asp">7</a></li>
			</ul>
		</div>
	</body>
</HTML>
 

Posted in Web技术

Tags:

0 Comments

 

Asp.Net中读取QQWry.Dat进行IP查询的方法

十二月 16th, 2006

如何用QQ数据库(QQWry.Dat)制作在线IP查询功能

[开发环境]VS.Net 2003
[编程语言]VB.Net

1.为什么要使用QQWry.Dat做为数据源来开发IP查询功能？
由于QQWry.Dat数据准确，且时常更新，较为方便。

2.如何读取QQWry.Dat中的数据？
以Asp.Net为例，详细介绍步骤：
a.新建一个web项目。
b.将QQWry.Dat保存到database目录下(可自己更改别的目录)
在Google中查找最新的QQWry.Dat
c.将IPLocation.dll下载保存到Bin目录下。如下图：
点击下载IPLocation.dll

d.在项目中添加引用，引用IPLocation.dll。
e.在程序代码前添加一行：

Imports IPLocation.IPLocation

f.调用函数IPLocate进行IP查询。

IPLocate(Byval StrConn as string,Byval StrIp as string)
'StrConn 为数据库连接字符串，如：Server.MapPath("database/QQWry.Dat")
'StrIP      为查询IP

完整例子下载：SkyDrive存储

 

Posted in Web技术

Tags:

0 Comments

 

博客男女-根据博客判断主人性别

十二月 15th, 2006

发现一个有意思的网站，yodao网的一个博客男女，能通过博客的rss文件猜测出博客主人的性别。

大家可以去看一下

我自己的博客测试结果：

代码基地博客站
100.0%男性倾向,0.0%女性倾向
   
评点：您的文风冷静而镇定，言语间展现出强悍的思辨能力与恢宏的胸襟，一个男子汉的阳刚形象跃然纸上。
yodao | 博客男女

 官方介绍：

“博客男女”其实是通过机器后台，读取博客日志中的文本内容，分析语言，与系统的内部模型进行比对，找出男女倾向系数。所以提交测试的博客必须是能够公开匿名访问的，也必须带有RSS feed，才能准确抓去和分析相关信息。由于博客文本内容的变更，测试结果随着时间也可能会发生变化。人有千差万别，系统的模型描述能力却是有限的，因此有可能出错。通过博客来进行性别测试，只是一个闲暇之余供君莞尔的小游戏。

 

Posted in 资讯分享

Tags:

0 Comments

 

Asp.Net中对Cookie的基本操作

十二月 15th, 2006

语言：vb

Imports System.Web.HttpContext
Public Class CookieFramework
    '写入单个Cookie
    Public Shared Function WriteCookie(ByVal CookieName As String, ByVal CookieValue As String, ByVal ExpiresDate As Integer) As Boolean
        Dim aCookie As New HttpCookie(CookieName)
        aCookie.Value = CookieValue
        aCookie.Expires = DateTime.Now.AddDays(ExpiresDate)
        System.Web.HttpContext.Current.Response.Cookies.Add(aCookie)
    End Function

    '给Cookie集合添加子项
    Public Shared Function WriteCookies(ByVal CookieName As String, ByVal CookieItem As String, ByVal ItemValue As String, ByVal ExpiresDate As Integer) As Boolean
        Dim aCookie As HttpCookie
        If Current.Request.Cookies(CookieName) Is Nothing Then
            aCookie = New HttpCookie(CookieName)
        Else
            aCookie = Current.Request.Cookies(CookieName)
        End If
        aCookie.Values(CookieItem) = ItemValue
        aCookie.Expires = DateTime.Now.AddDays(ExpiresDate)
        System.Web.HttpContext.Current.Response.Cookies.Add(aCookie)
    End Function
    '读取单个Cookie
    Public Shared Function ReadCookie(ByVal CookieName As String) As String
        If Current.Request.Cookies(CookieName) Is Nothing Then
            Return Nothing
        Else
            Return Current.Request.Cookies(CookieName).Value
        End If
    End Function

    '读取Cookie集合中的子项内容
    Public Shared Function ReadCookies(ByVal CookieName As String, ByVal CookieItem As String) As String
        If Current.Request.Cookies(CookieName) Is Nothing Then
            Return Nothing
        Else
            If Current.Request.Cookies(CookieName).Values(CookieItem) Is Nothing Then
                Return Nothing
            Else
                Return Current.Request.Cookies(CookieName).Values(CookieItem)
            End If
        End If
    End Function
    '删除整个Cookie
    Public Shared Function DeleteCookie(ByVal CookieName As String) As Boolean
        Dim aCookie As New HttpCookie(CookieName)
        Dim i As Integer
        Dim limit As Integer = Current.Request.Cookies.Count - 1
        For i = 0 To limit
            aCookie = Current.Request.Cookies(i)
            aCookie.Expires = DateTime.Now.AddDays(-1)
            Current.Response.Cookies.Add(aCookie)
        Next
    End Function
    '删除Cookie集合中的子项
    Public Shared Function DeleteCookies(ByVal CookieName As String, ByVal ItemName As String) As Boolean
        Dim aCookie As HttpCookie = Current.Request.Cookies(CookieName)
        aCookie.Values.Remove(ItemName)
        aCookie.Expires = DateTime.Now.AddDays(1)
        Current.Response.Cookies.Add(aCookie)
    End Function
End Class
 

Posted in Web技术

Tags: ,

0 Comments

 

[转载]web可用性检查列表

十二月 12th, 2006

The ultimate webdesign usability checklist

    Technical

  1. Did you validate your (X)HTML using W3C Markup Validation Service?
  2. Did you validate your CSS using W3C CSS Validation Service?
  3. Did you check your website in at least IE, FF, Opera and Safari?

    Images

  4. Did you add the ALT and TITLE attributes to all your important images?
  5. Did you add the LONGDESC attributes to all your image that need a description?
  6. Did you write effective ALT text?
  7. Did you make the size of your pages less then 50KB?
  8. Did you choose the appropriate filetype for your images?
  9. Did you add a description to images that support your content?
  10. Did you use plain text instead of images for important content?

    Content

  11. Did you use a sans-serif typeface with a decent font size for your body text?
  12. Did you adjusted the leading and tracking, if necessary, to increase readability?
  13. Did you align your body text to the left? (depends on language)
  14. Did you use EM or percentages instead of PX?
  15. Did you make sure that there are no whole sentences in uppercase?
  16. Did you use less then 78 characters, including spaces, per line?
  17. Did you make brief and precise paragraphs with explanatory titles?
  18. Did you use lists to sum things up?
  19. Did you write your conclusion first and then your explanation?
  20. Did you create enough contrast between the text and the background?
  21. Did you make your website also accessible for text-only browsers?
  22. Did you make sure that there are no ‘under construction’ pages?
  23. Did you include a print function on pages with a large amount of text?
  24. Did you include a print stylesheet?
  25. Did you replace all special characters with the ISO Latin-1 codes?
  26. Did you spell check your content and did you proofread for grammar errors??

    Navigation

  27. Did you make sure that all your links work? W3C Link checker does the job.
  28. Did you include a link to all your main pages on your homepage?
  29. Did you include your main navigation on every page?
  30. Did you use no more then 8 items in your main navigation?
  31. Did you distinguish the active and nonactive page in the menu?
  32. Did you use self explanatory link text instead of ‘click here’?
  33. Did you use self explanatory link text instead of business terms?
  34. Did you make a distinction between visited and non-visited links?
  35. Did you make a distinction between links and plain text?
  36. Did you add the TITLE attribute to all your links?
  37. Did you use breadcrumbs if you have a large amount of pages?
  38. Did you include a search option if you have a large amount of pages?
  39. Did you make your logo link to your homepage?
  40. Did you make a skip to content link at the top of your pages?
  41. Did you make a skip to menu link at the top of your pages?
  42. Did you make it possible to browse your website using SHIFT-TAB and RETURN?
  43. Did you make sure you didn’t use any javascript links?

    Structure

  44. Did you make a consistent page structure?
  45. Did you place your logo at the top left?
  46. Did you place an explanatory tag line next to your logo?
  47. Did you place your search box at the top right?
  48. Did you place important content above the fold/scroll?
  49. Did you make your design on a grid system?
  50. Did you make your design fluid using percentages?
  51. Did you make your website also viewable on low resolutions?
  52. Did you make custom titles (as in TITLE tag) for all your pages?

    Forms

  53. Did you make sure that users don’t return to an altered form after an error?
  54. Did you make a friendly and informative error page?
  55. Did you make a friendly ‘thank you’ page with a confirmation email?
  56. Did you add only a ’submit’ button and no ‘reset’ button?
  57. Did you tell the user what to expect after clicking the submit button?
  58. Did you split long forms up into multiply pages?
  59. Did you gave the user room to type?
  60. Did you place an asterisk when a field is compulsatory?
  61. Did you keep the standard look of input fields that is generated by the browser?
  62. Did you create a logical order of asking information?
  63. Did you use double input fields for passwords only?
  64. Did you let the computer, not the user, handle information formatting?
  65. Did you make sure that users can fill in the entire form using the TAB key?
  66. Did you explain to the user why you ask certain information?
  67. Did you explain to the user what you are going to do with that information?
  68. Did you use realtime validation using AJAX?
  69. Did you use the LABEL tag?
  70. Did you place the LABEL above the input field, instead of next to it?
  71. Did you choose the correct input type for different data?
  72. Did you make the top input field automatically active using setfocus?
  73. Did you destinguish the active field from non-active fields using input:focus?
  74. Did you use the FIELDSET and LEGEND entities when appropriate?
  75. Did you check if your forms also work with Javascript turned off?

    Multimedia

  76. Did you make sure that essential information/navigation is not made in Flash?
  77. Did you make sure that music and videoclips don’t start playing automatically?
  78. Did you make sure that music and videoclips can be turned off at any time?
  79. Did you inform the user about the size and length of your music and videoclips?

    Extra features

  80. Did you make a custom 404 page?
  81. Did you make a site map?
  82. Did you make a rss feed? (if you add content regularly)
  83. Did you make a high contrast version of your website?
  84. Did you make good looking URL’s (like this one)?
  85. Did you make sure that there are no frames on your website?
  86. Did you make sure that there are no pop ups on your website?
  87. Did you make a contact form instead of just an email link?

    Any suggestions?

  88. Add number 88 by giving a comment on this post!
 

Posted in 产品设计

Tags: ,

0 Comments

 

基于标准的web项目开发模式探讨

十二月 12th, 2006

本文讨论的是如果开发一个符合w3c标准的web站点，重点探讨在新的设计与开发模式下，web项目组中的美工/页面制作人员/后台程序员三者之间如何有效地配合。为了便于阅读，制作了一个微缩型的项目。大家可以先预览一下最终效果。

本文适合于对web标准已经有了初步了解的同行共同研究。对此感兴趣的朋友欢迎在博客里发表您的评论。

项目内容：首页上的一个新闻列表。

项目人员：网站美工一名/页面制作人员一名/程序员一名。（有很多人是三者合一的，哈哈。）

美工主要负责出效果图，截图。如下图：

然后对该图进行提取，得到相应的背景图片，见项目img文件夹。

程序员的工作有几下几点：

  • 根据需求设计网站数据库结构。
  • 定义底层相应的对象，如：user/news等等。
  • 定义数据访问层，包括访问数据库、编写存储过程等。
  • 提供表现层读取数据的方法供调用。

我这里定义的程序员几乎可以不了解html代码/javascript脚本/css样式。相对比较独立。
项目中的程序员工作部分被我简化了，想了解的朋友可参考vs.Net2003中自带的几个例子，分层做得很有借鉴价值。

页面制作人员的工作：（PS:我给页面制作人员的定义可能有些超纲了。）
一：对美工的效果图进行初步的页面实现，如根据上边的效果图，初步可写成以下代码：

<h4>八卦新闻</h4>
<ul>
<li>大学生为啥争当农民</li>
<li>TVB制造8大极品女明星</li>
<li>上流社会秘密旅馆的真相</li>
<li>大学生洗鸳鸯浴被曝光</li>
<li>男明星性感阳刚露点</li>
<li>明星挖鼻抠脚丑态</li>
<li>陈好是怎样变成美女的</li>
<li>X光揭秘魔术师&#34;吞剑&#34;</li>
<li>西安一村“喝尿”强身</lil>
<li>汪明荃青春惊艳旧照片 </li>
</ul>

二：将需要动态生成的部分换成程序员提供的相应接口，如例子中的代码为：

<ul>
<%
Call LoadTopNews()
%>
</ul>

如果程序员对html代码不熟悉，表现层的很多程序代码也应该由页面制作人员来实现，如上边的LoadTopNews()中涉及到了html代码，此部分如页面制作人员完成不了，也应该与程序员共同协商。根据页面制作人员的需要写出相应的程序代码。

三：CSS的页面效果实现。（略）

四：Javascript脚本的编写。本例子中仅设计了新闻的折叠显示功能，详见项目中js/common.js。（略）

写得有点粗糙，欢迎同行一起探讨！

源代码下载：一个简单的基于标准的web项目。

 

Posted in Web技术

Tags:

0 Comments

 
« Older Entries