坚守网页设计师的贞操

 更新时间:2016年9月20日 19:05  点击:2343

这是每个努力的网页设计师都将面临的问题。

早上的一个小调查,让我不能继续沉默。

调查的起因,是公司要求对一个网页三番五次的修改,甚至提供了客户认为比较满意的案例。但我怎么看也不觉得这案例能比自己做的好到哪里。当然这里面有我的偏见,我想。出于对自己的怀疑,我把两个网址同时发给QQ中的数十个好友,想看看大众的目光。这些人中,有专业的网页设计师,也有从事互联网其它工种的IT人,也有与互联网不怎么相干的学生、播音主持、教师、公务员等。调查结果出乎我的意料:近100%的业内人士认为我做的好一些,而大多数业外人士选择了另一个。

这是一个另人震惊的答案!尽管之前,我也清楚地知晓这两者之间是有矛盾的,但我不曾料到,其矛盾会如此激烈。这让我们如何是好?是大众出了问题?还是我们出了问题?做为设计师,应该改变大众的审美观呢?还是顺应敷衍?是川菜引导了中国人的口味?还是中国人的口味造就了川菜?

不要告诉我两者可以调和。我不再相信这种鬼话。这完全不是风格的问题。问题是一个长期从事设计工作的人,和一个普通大众,他所观察的侧重点就不一样。举个例子,男人18岁前看女孩子注意脖子之上的部分,18岁后看女孩子注意脖子以下的部分。所以你认为她不漂亮是因为她脸蛋长得不好;你认为她漂亮是因为她有魔鬼身材。不要告诉我既有漂亮脸蛋又有魔鬼身材的女孩子,因为你认为漂亮的脸蛋放在美国人眼中那就是个垃圾。

我曾经在[乱弹]一文中说过“毕竟天下有99%的食者不是厨师,多数穿衣服的也不是服装设计师,但他们依然有权利挑剔,有权利批评与否定。”网站上传之后,大多数看官不是专业设计师,而是普通大众。所以,普通大众的眼光必须是评判网页好坏的一个非常重要的原则。

然而,然而!

然而,现在多数人认同男女平等,百年前全不如此;现在多数男女大街上拉个手亲个嘴视若家常便饭,几十年前全不如此;现在很多人在网上买东西卖东西,几年前全不如此!时代需要引导,大众需要引导!

做哗众取宠的公众垃圾?还是做特立孤行的业内精品?我们当然选择后者。就目前国内的大势来说,我们必须选择后者。这是一个设计师应有的良知与责任。

曾有文章批评过中国网页的四大特点“长闪挤花”。今天看来,这是对这部分设计师的冤枉。他们只是顺应了潮流而已。然而,他们的妥协也导致了中国网页设计水平的整体下滑。这是他们必须承担的罪名。

改变尽管是一件艰难的事,但总比在沉沦中死掉好一些。毕竟有许多事给了我们希望,比如流行音乐。十年前,我的父辈们觉得在台上边唱边跳那就不是在唱歌,他们觉得像“大海航行靠舵手”那样的才叫歌曲。然而他们如今在看那英王菲张信哲甚至王蓉周杰伦。

互联网没有历史,互联网的历史需要我们这一代人去创造。我们需要有所作为。坚守网页设计师的贞操;同时,努力感染身边每个人的审美观。

这就是我要说的。




< 现在建立个人网站,仅仅用Photoshop和Dreramweaver制作几张漂亮的静态网页是远远不够了,如果我们用动态网站管理程序,平时更新网站内容,管理网站数据都非常方便。其实现在网上的免费系统、免费资源都非常多,只要大家细心的把它们收集、分析、整理出来,找到适合自己的程序和资源,个人用户完全可以用最简单的办法快速创建一个含有后台管理系统的网站。

  今天我们就为大家介绍使用曼波(Mambo)系统和免费资源创建自己的动态网站的方法和步骤。
  主要包括下面几个部分:曼波系统简介、获取免费的PHP空间、安装曼波系统、设置网站基本信息、页面格式排版、站点功能管理、网站模版管理。

  一、曼波系统简介

  曼波是一个开源的网站管理系统(CMS系统),有一套PHP网站程序,用户可以通过使用免费的页面模版、网站模块为网站增加功能,改变网页风格。与传统的网站FTP操作不同,它可以直接在网站后台用图标方式进行站点管理的操作,一切都是以傻瓜方式操作。

  获取曼波中文系统,可以到曼波中国网站免费下载,大家下载Mambo4.5.2 简体中文黄金版即可。下载后将文件解压,然后把所有的文件上传到FTP服务器,注意:服务器必须支持MySQL数据库,这样才能正常运行PHP程序

  虚拟展示技术,通常被用于商品网络化三维展示,也有部分小场景虚拟仿真项目采用WEB3D进行制作3D图形技术并不是一个新话题,它在图形工作站以至于PC上的应用早已瓜熟蒂落。然而互联网的出现,却给3D图形技术注入了新的活力,一些微妙而深刻的变化正在进行中。“web3d”这一新词的出现就反映了这种变化的全貌。没有人严格定义web3d,但我们可以把它理解为互联网上的3D图形技术。

  VRML是3D图形和多媒体技术通用的交换文件的格式,它描述交互式的3D对象和场景的几何对象的尺寸和形状、色彩、材质、灯光、动画及其交互性。它不仅应用在互联网上,也可以用在本地客户系统中,其应用范围极广。国际上有一个VRML(VRML Consortium)协会,承担起了制定互联网上的3D图形标准与规范的任务。1996年,VRML 1.0发布,1997年,VRML 97诞生。VRML 97的重大革新是:在网络上传输的是模型文件,而不是视频图像文件,故其传输量大大减小,可使任何一个3D图形爱好者都能制作可在互联网上实时渲染的3D场景模型。 

  然而,在1997年之后,VRML在3D图形标准上的进展缓慢,远远没有达到人们的期望。究其原因主要有:

● 互联网对3D图形的需求并不迫切,到目前为止,2D图像仍在HTML文件中占主导地位。 
● 网络带宽仍然是制约网上3D图形发展的主要瓶颈。 
● VRML 97过于庞大,它几乎包罗万象。 
● 网站的访问者必须先花费10~15分钟的时间下载插件,然后再像安装软件那样安装这个插件,才能观看一个十分粗糙的3D图形。 

  产品群雄割据 用户苦不堪言 

  由于VRML协会没有及时推出VRML 97的下一代标准,因此很多互联网3D图形的制作软件并没有完全遵循VRML 97标准,许多公司推出了自己的制作工具,使用专用的文件格式和浏览器插件。类似的软件大约有30种之多。这些软件各有特色,在渲染速度、图像质量、造型技术、交互性以及数据的压缩与优化上都有胜过VRML之处。所有的公司都希望自己的解决方案能成为“事实上的国际标准”。 
然而用户却不领它们的情。对用户而言,要在互联网上观看用这些软件制作的3D图形,先要下载1M~7MB的插件,然后安装在网页浏览器上。插件的种类之多,使人无所适从。要观看十个不同的网站,用户就需要下载并安装十个不同厂家的插件。这样烦琐的事情用户实在难以忍受。 

  为什么需要插件? 

  3D图形软件为什么离不开插件?其实插件就是实时渲染引擎,其作用是:解释并翻译实施场景模型文件的语法,实时渲染从服务器端传来的场景模型文件,在网页访问者的客户端逐帧、实时地显示3D图形。把实时渲染引擎做成一个插件,这是互联网3D图形软件厂商目前的通常做法。显然,实时渲染引擎是实施互联网3D图形的关键技术,它的文件大小、图形渲染质量、渲染速度以及它所能提供的交互性都直接反映了其解决方案的优劣。 

  研制更好的实时渲染引擎是各软件厂商竞争的焦点,于是就产生了五花八门的3D图形文件格式与相应的浏览器插件。 

  结束这种混乱局面的最好办法是微软在其IE浏览器中预装一个或几个实时渲染插件,这样用户就不必花费十多分钟的时间去下载和安装插件。然而,微软并未选中任何一家公司作为其合作伙伴,也许有一天微软会推出自己的一整套解决方案,从而保持它在互联网3D图形领域中的霸主地位。 
新一代互联网3D图形 

  标准X3D诞生 

  1997年,VRML协会改名为web3d(Web 3D Consortium),此后web3d这一专用缩写开始在互联网上出现。2001年8月,web3d协会发布了新一代国际标准——X3D (X3D的含义是可扩展的 3D)。 
X3D得到了许多软件厂商的支持,包括3Dlabs、ATI Technologies、Blaxxun、Nexternet、OpenWorlds、ParallelGraphics、Sony Electronics、US Army STRICOM、SGDL Systems等。X3D与MPEG-4和 XML兼容,并将集成到MPEG-4的3D内容之中,使用XML语法。它与VRML 97向后兼容,即X3D能提供标准VRML 97 browser的全部功能。X3D的主要任务是把VRML的功能封装到一个轻型的、可扩展的核心之中。由于X3D是可扩展的,因此任何一个开发者都可以根据自己的需求,扩展其功能。X3D渲染引擎的商业版本也在去年的SIGGRAPH ’2001的年会上推出,Parallel Graphics(web3d技术的领先软件公司)将联合几个公司开发X3D 新技术。 

<

原文出自:A List Apart
中文翻译:onestab [2004.01.25]

要从固定的、基于像素的设计方法转到弹性的、相对的设计方法并不容易。但是如果恰当利用,就可以成为增强亲和力和易用性的一个自然选择,同时又无须做出设计上的牺牲。

像素是计算机屏幕上的不可缩放的点,而一个 em 就是一个字大小的方块。由于字体大小的变化, em 代表用户喜欢的文字大小的相对单位。

采用印刷式的固定设计方案或许要容易些,因为如果尺寸不变,则考虑的东西就相对较少。可是如果采用弹性的设计方法,就可以充分利用电脑的显示器和浏览器。

也许你想你的网站以某种特定的方式显示,但是你的用户想看到的可能不一样。任何强加于用户的东西都不利于易用性,从而对网站的成功造成损害。

为了理解弹性设计,我们必须首先来看看一个似乎与此无关的问题 - 指定文字大小的几种方式。

弹性文本

显然文字是最容易实现的弹性设计的。能够设定喜欢的文字大小是用户最常见的要求,因此不可忽视。

亲和力指的并不只是关于盲人和屏幕阅读器。还有许多人虽然不是盲人,但是有视力障碍 - 你我变老时就会成为他们的一员。使网站变得更具亲和力的一个最简单的方法就是允许用户改变文字大小;拒绝提供这样的选择就剥夺了用户的主导权,很可能使用户无法舒适地阅读。

如果设计者使用像素为单位指定文字大小,大多数的用户将无法缩放文字,因为 Internet Explorer 改变文字大小的方式与别的浏览器不同。Mozilla 和 Opera 可以缩放已经设定像素大小的文字,而Windows 下的IE却不能。

em 存在的问题

Em 似乎是进行文字相对大小设定时的单位,浏览器默认的文字高度是16像素,对大多数设计者来说太大了,不合他们的口味。要使用 em,设计者一般将文字的初始大小设为小于 1em。

例如:

body { font-size: 0.8em; }
h1 { font-size: 2em; }
p { font-size: 1em; }

看起来似乎可行,但有一个问题 - 如果你在 IE 中将“文字大小”设为“较小”或“最小”,文字就会小得难以阅读。由于 IE 如此普及, em 似乎不是可行的选择。

Jeffrey Zeldman过去曾经对此表示质疑,他认为尽管有其不利之处,以像素指定文字大小还是比用 em 好。这个结论是根据 Owen Briggs 所作的深入研究得出的。 Owen Briggs 测试了264种不同的文字缩放方法并演示了 em 之类的相对单位行不通。许多设计人员现在都用像素为单位指定文字大小,不是出于精确控制网页外观的需要,而是似乎没有更为合理的其他选择。

如此看来,要么是难看的大字体,要么无法缩放,好像无法两全。别着急,接着读下去。

另一种“大字体”后备样式

在与无法缩放的像素所带来的亲和力问题的战斗中,许多作者在他们的网页上使用了一种后备样式表的技术,可通过网页上的一个链接进行切换。

这种方法固然不错,但是如果和相对文字大小的措施(比如Wired News所提到的)一起使用,效果会更好。不能指望用户熟悉你的特有界面,用户一般对浏览器的界面更为熟悉,如果他们想看大一点的字体,更倾向于用浏览器来达到而不是用你的界面。而且他们更期望这种方法在各个网站都管用,不想每访问一个网站都改变一次。,比如

  在Web页中嵌入Media Player的方法比较简单,只要用HTML中的<Object></Object>可以了,如下所示。

<OBJECT ID="WMPlay" WIDTH=320 HEIGHT=240
CLASSID="CLSID:22D6f312-B0F6-11D0-94AB-0080C74C7E95"
CODEBASE="http://activex.microsoft.com/activex/controls/mplayer/en/
nsmp2inf.cab#Version=6,4,5,715"
STANDBY="Loading Microsoft? Windows Media? Player components..."
TYPE="application/x-oleobject">
</OBJECT>

  其中ID是对象的名称,当用户在JavaScript要对Media Player进行控制时可以用该对象的名称WMPlay进行访问。CODEBASE指明当用户的浏览器中没有安装Player控件时可以从该URL指定的位置去获取。

  当然在建立Player对象时也可以用<PARAM >来为其指定参数。如下所示:

<PARAM NAME="FileName" VALUE="C:ASFRootWelcome.asf">
<PARAM NAME="ShowControls" VALUE="False">
<PARAM NAME="AutoRewind" VALUE="True">
<PARAM NAME="AutoStart" VALUE="False">

  其中"FileName"参数表示Media Player要播放的文件活或流。"ShowControls"表示在播放时是否显示控制条。Media Player的参数很多,我们在此不再一一详述。读者如果需要了解更详细的内容可以参考Media Player SDK中的相关部分。

  如果用户需要对Media Player进行控制可以用JavaScript进行控制。

  在这个例子中,Media Player嵌入在Web页面中,在Media Player右边有一些按钮,利用这些按钮用户可以控制Media Player的播放活动。这些按钮的HTML代码如下:

<form name="myform">
<input type="button" width="15" value="No Controls " name="NoControls"
OnClick="controlType(false)">
<input type="button" width="15" value="All Controls" name="Full"
Onclick="controlType(true)">
<input type="button" width="15" value=" Small " name="Small"
OnClick="displaySize(1)">
<input type="button" value=" Large " name="Large"
Onclick="displaySize(2)">
<input type="button" width="15" value=" Normal " name="Normal"
Onclick="displaySize(0)">
<input type="button" width="15" value=" Play " name="Play"
Onclick="PlayClick()">
<input type="button" width="15" value=" Stop " name="Stop"
Onclick="StopClick()">
</form>

  相应的JavaScript代码为:

<script language="javascript">
<!--
var g_Browser = navigator.appName;
function controlType (setting)
{
if (g_Browser == "Netscape")
document.WMPlay.SetShowControls(setting);
else
document.WMPlay.ShowControls = setting;
}
function displaySize (setting)
{
if (g_Browser == "Netscape")
document.WMPlay.SetDisplay

<
[!--infotagslink--]

相关文章

  • photoshop设计一幅大鱼海棠动画片海报制作实例教程

    今天小编在这里就来给各位photoshop的这一款软件的使用者们来说一说设计一幅大鱼海棠动画片海报制作的实例教程,各位想知道具体制作步骤的使用者们,那么各位就快来看看...2016-09-14
  • ps怎么制作倒影 ps设计倒影的方法

    ps软件是一款非常不错的图片处理软件,有着非常不错的使用效果。这次文章要给大家介绍的是ps怎么制作倒影,一起来看看设计倒影的方法。 用ps怎么做倒影最终效果&#819...2017-07-06
  • C语言程序设计第五版谭浩强课后答案(第二章答案)

    这篇文章主要介绍了C语言程序设计第五版谭浩强课后答案(第二章答案),小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧...2021-04-02
  • Photoshop设计商务名片的5种常见思路分享

    今天小编在这里就来给Photoshop的这一款软件的使用者们来说下计商务名片的5种常见思路,各位想知道的使用者,那么下面就快来跟着小编一起看一看吧。 给各位Photosho...2016-09-14
  • php根据用户语言跳转相应网页

    当来访者浏览器语言是中文就进入中文版面,国外的用户默认浏览器不是中文的就跳转英文页面。 <&#63;php $lan = substr(&#8194;$HTTP_ACCEPT_LANGUAGE,0,5); if ($lan == "zh-cn") print("<meta http-equiv='refresh' c...2015-11-08
  • 腾讯视频怎么放到自己的网页上?

    腾讯视频怎么放到自己的网页上?这个问题是一个基本的问题,要把腾讯视频放到自己的网页有许多的办法,当然一般情况就是直接使用它们的网页代码了,如果你要下载资源再放到...2016-09-20
  • WPF实现类似360安全卫士界面的程序源码分享

    最近在网上看到了新版的360安全卫士,感觉界面还不错,于是用WPF制作了一个,时间有限,一些具体的控件没有制作,用图片代替了。感兴趣的朋友一起跟着小编学习WPF实现类似360安全卫士界面的程序源码分享...2020-06-25
  • photoshop安卓和苹果界面设计之尺寸规范详解

    今天小编在这里就来给各位photoshop的这一款软件的使用者们来说下安卓和苹果的界面设计之尺寸规范,各位想知道的使用者们,那么下面就快来跟着小编一起看看吧。 给...2016-09-14
  • 基于JavaScript实现网页倒计时自动跳转代码

    这篇文章主要介绍了基于JavaScript实现网页倒计时自动跳转代码 的相关资料,需要的朋友可以参考下...2015-12-29
  • photoshop设计重影效果具体制作教程

    今天小编在这里就来给各位photoshop的这一款软件的使用者们来说一说设计重影效果具体的制作教程,各位想知道具体制作方法的软件使用者们,那么大家就来看下小编带来的教...2016-09-14
  • 网页头部声明lang=”zh-cn”、lang=“zh”、lang=“zh-cmn-Hans”区别

    我们现在使用的软件都会自动在前面加一个申明了,那么在网页头部声明lang=”zh-cn”、lang=“zh”、lang=“zh-cmn-Hans”区别是什么呢?下面我们就一起来看看吧. 单...2016-09-20
  • Illustrator结合photoshop设计可爱的卡通女厨师头像制作教程

    今天小编在这里就来给Illustrator的这一款软件的使用者们来说一说结合photoshop设计可爱的卡通女厨师头像的制作教程,各位想知道具体制作步骤的使用者们,那么下面就快来...2016-09-14
  • PS怎么设计T恤 PS制作T恤教程

    PS怎么设计T恤?很多人都想要在T恤上有自己喜欢的图案,那么自己设计T恤的图案是方法之一,本次为大家带来了详细的ps设计T恤教程,有兴趣的同学快来看看吧。 1、打开PS,新...2016-12-31
  • photoshop设计一张节约用水环保主题海报制作教程

    今天小编在这里就来给photoshop的这一款软件的使用者们来详细的说说设计一张节约用水环保主题海报的制作教程,各位想知道具体制作方法的使用者们,那么下面就快来跟着小...2016-09-14
  • c#实现51单片机频率计的代码分享(数字频率计设计)

    c#实现51单片机频率计的代码分享,大家参考使用吧...2020-06-25
  • C#实现Winform中打开网页页面的方法

    这篇文章主要介绍了C#实现Winform中打开网页页面的方法,涉及WinForm中WebBrowser的相关使用技巧,具有一定参考借鉴价值,需要的朋友可以参考下...2020-06-25
  • photoshop设计蜘蛛侠纹理文字效果制作教程

    今天小编在这里就来给给各位photoshop的这一款软件的使用者们来说一说设计蜘蛛侠纹理文字效果的制作教程,各位想知道具体制作步骤的使用者们,那么大家下面就来跟着小编...2016-09-14
  • Photoshop设计武侠风毛笔字效果教程

    今天小编在这里就来给Photoshop的这一款软件的使用者们说下设计武侠风毛笔字效果得教程,各位想知道到底该怎么射击制作的使用者们,那么下面就快来跟着小编一起看一看制...2016-09-14
  • Go语言通过http抓取网页的方法

    这篇文章主要介绍了Go语言通过http抓取网页的方法,实例分析了Go语言通过http操作页面的技巧,需要的朋友可以参考下...2020-05-05
  • photoshop设计墨西哥亡灵节万寿菊文字特效制作教程

    今天小编在这里就来给photoshop的这一款软件的使用者们来说一说设计墨西哥亡灵节万寿菊文字特效的制作教程,各位想知道具体制作方法的使用者,那么下面就快来跟着小编一...2016-09-14