HTML5标签测试完毕

对本站使用HTML5标准或不兼容IE的行为有任何不满的人,请仔细阅读此文后再和偶讨论偶对还是不对的问题,以上
虽然暂时目前市面上只有Firefox 3.5和Safari 4支持HTML5标准,8过鉴于HTML5的video和audio标签实在是非常方便,因此本人决定对本博客从今天开始的所有文章一律遵照html5规范编写 baozib13 也就是说,使用较早版本的Safari、较早版本的Firefox以及其他浏览器(诸如IE云云)可能在浏览今后本博客的内容可能会出现一定的问题,解决的办法就是更新你的浏览器至上述两种浏览器,或者等待你的浏览器出现更新 baozib13
目前已知Chrome将会在今后的更新当中逐步完美对HTML5的支持,Opera也已经开始了对HTML5的支持,剩下的问题就是IE何时会支持——至少偶现在还没得到准确消息,希望有知情人士告知 喝茶

说到IE的各种缺点,今天在Twitter上看到一个信息,简单来说就是推销一个网站的,那个网站的宗旨就是“IE6 Must Die”,好吧怎么看怎么像邪教,于是偶没加 baozib13
要说的话,偶的确不喜欢IE6,甚至偶自己做的主站也就从一开始就没提供IE6支持,但为虾米偶不加入这个“组织”呢 o_o? 原因其实很简单——偶不喜欢IE6,偶不做IE6的支持,仅仅是因为这是偶的网站,所以偶可以建议上偶的网站/博客的人不使用IE浏览偶的网站/博客,但不能让他们绝对不能用IE,就好像COMIKE的主办方不能因为不推荐大家自己开车前往会场就要求大家全部坐地铁上班一样,哪怕COMIKE主办方有一万个理由,比如什么环境污染什么的——那个是负责环境保护的人做的事,不是COMIKE做的事,再说IE6这种过时的东西,微软自己也迟早会废掉对他的支持,用不着偶来操心 喝茶

8过遵照html5规范编写的最大问题就是html5大幅度削减了font标签的应用,原本在html4当中常常使用的font size=?和font color=?标签在html5当中均已停用,官方称是因为CSS的导入的缘故,这些样式均可以在CSS当中定义,然而问题出现了——有时候偶们只是临时需要应用一个字体样式,难道就为了那一次还要跑去修改CSS不成?
用不着,HTML5标准虽然移除了几乎所有的font标签,但还留着一个,就是font style标签,通过这个标签就可以临时定义文字样式了,使用方法可以参照这里 baozia07

以下是本人今天测试video/audio标签时做的截图,比如这是视频标签
HTML 5 Video Tag

如果打开了controls选项,那么在鼠标移至视频区域的时候就会显示出控制条
HTML 5 Video Tag

如果audio标签打开了controls选项,就能显示出一个控制条;否则的话就啥都看不见
HTML 5 Audio Tag

8过今天经过长久测试,发现Firefox的audio/video仅支持开源的ogg,相反Safari的audio/video则是支持长久以来“事实上”的标准的mpeg,因此似乎暂时还无法做出让两者都能满意的东西出来(事实上,Safari4的欢迎界面Firefox打不开;而Firefox的audio tag测试页面Safari载入不能)

嘛,扯了这么多关于HTML5的闲话,接下来让偶们好好享受一下偶们偶最期待的HTML5中的标签——video和audio标签把XD
首先来点音乐好了,第一首是偶多次用来测试音频选项的时候(比如曾经测试WP的wp_player插件的时候)用的曲目:ave;new的True My Heart:

然后是来自于PC游戏Kanon的混音辑Kanon arrange best album “recollections”当中的Kanon的同名BGM朝影,这个重新混音之后的版本比原版更舒服哦(这首曲目需要MPEG4-AAC支持)

最后再来一首前段时间玩到不能自拔的PCiPhone OS游戏Gift中的插曲予報のない嵐

音乐弄完了,接下来是视频 baozie03 可惜的是苹果的WWDC和Macworld实在太大了,对于中国大陆的同学来说载入恐怕需要花极长的时间,因此上传一些小东西好了(以下视频除最后一个采用MPEG编码以外其余均采用H.264编码)
首先上个胡戈做的阿里巴巴的广告——虽然个人对阿里巴巴不熟,8过这个广告做的超赞的 baozia03

然后是第二回红白梦寐合战里面的参赛作品Sight Rhyme Ensemble——其实第二回红白里面好多很出色的作品,自己也实在犹豫了很久要上传哪一个,后来最终决定还是上传一个自己很少推广的一个作品把 baozia02

最后再上传两个前段时间玩到不能自拔的Gift的Intro movie和Demo movie,以此来纪念推广一下这部个人认为很不错的作品 消失

Author: 星野恵瑠

Mac user, Niji-Ota, Chinese, Now working in Japan at MAGES. Inc., Future's aim is that one day my name can be listed in Wikipedia

64 thoughts on “HTML5标签测试完毕”

  1. 不知是什么时候有个人跟我说font确实是该失去的标签……
    主要的font功能确实都可以用css完成的吧,没必要去改主题css文件,直接加在博文里不就行了,比如之类

  2. @大萌神:
    嗯,为了测试这个问题,特意跑去装了一个Firefox 3.5来,然后测试了N久之后发现一个重大事实——Firefox只支持ogg系,而Safari只支持mpeg系,因此Safari能打开的audio/video tag在Firefox上打不开;而Firefox能打开的audio/video tag在Safari上打不开 baozie02
    真是的,其他的h264啥的偶也没啥好说的,8过居然连mp3都不支持这个也太有点说不过去了把 baozie02

  3. @Lovee:
    你想在哪用font就在哪加嘛……比如改变某字体字号 文字,先前用font的话则是文字
    另外我承认刚才打错字了…… ⌠ーー

  4. Ariagle:
    @Lovee:
    你想在哪用font就在哪加嘛……比如改变某字体字号 文字,先前用font的话则是文字
    另外我承认刚才打错字了……

    没留意到提交的时候砍掉了标签……
    文字
    文字

  5. Ariagle:

    Ariagle:
    @Lovee:
    你想在哪用font就在哪加嘛……比如改变某字体字号 文字,先前用font的话则是文字
    另外我承认刚才打错字了……

    = =好吧我继续三连……没法打出标签
    没留意到提交的时候砍掉了标签……
    文字
    文字

  6. @小明猪:
    嗯,FF3.5的那个问题偶也测试了好久才发现,原来Firefox站在了ogg那边 寒っ
    于是,音乐文件还好办,视频方面要转格式的话,这台可怜的小白需要花很长的时间 寒っ

  7. @小明猪:
    都差不多,H.264在码率/质量和Theora其实都差不多,Firefox这次没有支持H.264的缘故估计是因为H.264是商业性质的MPEG搞的,Mozilla一直是开源阵营所以支持了开源性质的ogg把或许 tuzji20
    8过Safari还好办,本来就有Theora的插件,但是偶暂时还没找到让FIrefox支持mpeg系格式的方法 寒っ

  8. @小明猪:
    设置了一个标签里面的文字编码之后,这个标签始终都是用这个编码来显示哦 喝茶 其实遇到这个问题的,基本上都是因为源文件里面没有指定文字编码或者没有指定正确的文字编码造成的 寒っ 幸好WP都是用的U码,所以从来没问题

    p.s. 嗯嗯 tuzji20 反正至少偶升级Safari 4之后觉得它实在是比3强大多了

  9. @小明猪:
    嗯!U码美啊!!!Mac上连软件都是用的U码,所以日文的软件用在中文的系统上都不会有乱码哈哈 baozia03
    好吧其实事实上是Mac从系统到软件都是多语言的,仅根据用户设置的语言优先度来变换显示出来的语言 baozib02

  10. @Lovee:
    其实嘛我感觉U现在是国际通用了,再用GBxx什么的落伍了,前两天开了个GB2312的站,连FF下都是乱码一片..我很无奈,什么时代了还用GBxx tuzji15

  11. @小明猪:
    不知道Windows啥时候才能真正开始推广U码 ⌠ーー 现在WIndows上完全用U码写的软件几乎找不到,特别是Galgame清一色都是用的JIS码

  12. @小明猪:
    Safari 4其实个人认为,比起Top Sites,那个历史搜索才是真正最赞的啊 baozie03
    嗯,Safari当然肯定能看到,他的欢迎界面(http://www.apple.com/safari/welcome/)就是用了audio和video标签

  13. @小明猪:
    没有,8过Pimp My Safari这个网站上有很多Safari的插件,似乎Cocoa Gestures这个插件可以给Safari提供鼠标手势 喝茶
    嘛,虽然其实偶从来不用鼠标手势,偶用键盘快捷键更多——偶连右手都是80%的时间是在键盘上,只有20%的时间在鼠标上 baozie01

  14. @Lovee:
    我左手倒是都在键盘上乖乖呆着,右手嘛,除非打字,似乎经常都在鼠标上了,快捷键的确是超方便的说,不过浏览网页的快捷方式用惯手势了,我去找找看~ baozib13

  15. @小明猪:
    嘛,区分重度Mac用户和轻度Mac用户/Windows用户的最简单的方法之一就是看他是键盘用得多还是鼠标用得多呢 tuzji20 Mac因为cmd鍵的键位设置的非常方便,因此快捷键的使用频率要大大超过Windows 喝茶
    8过说起来,第一个真正将鼠标应用在民用操作系统上的明明是苹果 ーー汗 (准确来说GUI也好鼠标也好都并非苹果的发明)

  16. @Lovee:
    其实我有一点不大明白,浏览网页的时候你们是用方向键来控制页面的上下滚动吗?还有就是页面元素,提交什么的,都在网页中间我想不到怎么用快捷键点击链接的说…lovee赶快解答~~ tuzji09

  17. @小明猪:
    Reply这些工作还是要靠鼠标来完成的 喝茶 用Tab切换太慢
    滚动自然也是用的鼠标的滚轮,8过主要是因为偶触控板坏了,不然用触控板滚动页面超级方便——苹果的触控板两根手指滑动就是滚动页面 baozie03
    嘛,新的本本的触控板更强大 baozie03 还有三指手势和四指手势,鼠标都基本不需要了

  18. @Lovee:
    昨晚就看到了你的本本资料,应该是好几年前买的了吧?我这本本的触控板就羞涩多了,右边一条是滚轮效果,但是手往下一滑,网页直接从页头彪到尾巴,我记得我的当时的第一反应就是:啊?这就到底了? ーー? 从此将触板功能屏蔽… tuzji19

  19. @小明猪:
    =v=咋看的偶的本本的资料的 baozib03
    嘛,购买是3年前,机器型号是4年前的机子,并且即将随着10月份苹果发布Snow Leopard而宣告被苹果抛弃(因为Snow Leopard不支持PowerPC处理器)

  20. @Lovee:
    纳尼!?你居然不知道?about里面不是写的清清楚楚吗?配置都写出来了.. tuzji12 看配置差不多就知道是个老古董了,不过如果昨天没看到about页面,只看到你给我的那些照片的话,那些照片里的本本看上去还是好新…保养的很好啊 baozie03

  21. @小明猪:
    原来真的有人去看about页面啊 baozib05
    其实,偶只是在拍照之前擦了一下机身而已 baozia03 顺便一说,强烈推荐“擦擦可林”这个东西,家乐福应该有卖(偶在国内的时候就是在家乐福买的),洁净能力超强啊 baozie03 只是使用的时候一定要注意把水挤干,偶就是这样废掉偶的键盘的方向键的 ⌠ーー

  22. 你太乐观了,html5还只是草案,你就急着要去做。
    起码要在等个10年半载的,并且现在各个浏览器支持程度不一样,
    并非ff3.5和sf4支持最好,别忘了op。

  23. @LEUNG:
    准确来说,是已经基本成型了的草案 喝茶
    Mac用户对于标准的追求始终是走在前列的,当初在802.11n标准还只是草案的时候苹果就将全线的笔记本的硬件提供了802.11n的支持,然后在11n的标准正式确定下来才使用的软解锁 喝茶
    另外,Opera的正式版现在还没有提供完整地HTML5支持,偶这里所说的所有浏览器都是指的正式版,否则的话Chrome都能算在里面了 tuzji18

  24. @Lovee:
    纳尼!?昨天晚上睡前比较闲而已,就像今晚,能跟你在这版聊..于是就在你这边悠悠,看看有没有什么神奇的东西等着我去发现~ tuzji19 擦擦可林…你的键盘该不会被侵蚀了吧 -_,-|||

  25. @Lovee :
    苹果对标准支持,那是另外的事情,中国最多的用户不是mac而是pc,主流不在mac身上,冒然使用html5是危险的。

    而且,html5只是一个样子而已,未来怎么变都不好说。就算成型了,终归是草案,测试可以,实际使用还是算了吧。

  26. @LEUNG:
    偶从来就没想过要去“迎合主流” 喝茶 事实上浏览偶的博客的人里面仍然IE6占有最大的使用率,这点在偶每个月的博客访问月报里面都能看得出来,毕竟这点数据不论是偶的空间商后台还是Google Analytics都是能很快查出来的,但即使如此,偶也从来没有打算过为偶的博客提供IE6的支持 tuzji20
    偶对于网络的理解是标准高于主流,因此偶从来不在乎IE用户的体验,甚至当年偶用百毒的博客的时候还故意为了降低IE用户的体验而使用了alpha通道半透明的png图片

    之于HTML5标准,事实上是早在很多年以前就已经被提出来了,现在的草案已经基本定型,最终的定案也不会比现在的草案偏差多少,毕竟还有这么多的浏览器公司的压力在,W3C不可能突然一个180度态度大转变,例如基本的audio/video tag的语法和font tag的淘汰都已经在事实上成为定局了 喝茶

  27. @Lovee :
    一些纯表现的标签是注定要淘汰的,没得讲。抛开html5,我也讨厌ie6,但是还是要去兼容,这不是你愿不愿意的问题了。如果你是前端开发的人,你只能站在用户角度去做。

    如果你是开发者而且不去兼容ie6,套别人的话,你就是自私的开发者。

  28. @LEUNG:
    说到“用户”的角度,让偶们来看看偶所拥有的网站和博客
    偶的主站是Mac软件汉化站,也就是说偶的主站的“客户”从根本上来说是Mac用户,而Mac用户用什么?绝大部分用Safari,还有一部分用Firefox,这两部分加起来超过95%的客户只需要更新他们的浏览器即可;剩余的Opera,10 beta也提供HTML5的完整支持;而Mac上没有Trident内核的浏览器,因此完全没有照顾IE用户的必要性
    偶的博客呢,说白了只是偶的一个“吐槽”点,说得好听点就是“纯属个人兴趣”而搭建的地方,没有任何商业气息(包括偶的主站也是如此),也就是说对于偶来说,这个地方有没有人经常过来玩在物质上没有任何区别,唯一的区别可能仅仅就是“偶内心上是否会因为没人来而空虚”而已,也就是说建这个地方偶可以完全依照自己的喜好来建设,没有任何的客源包袱,或者换句话说,偶的博客并没有所谓的“用户”,偶的博客也并非偶“开发”出来的东西

    这就是所谓的没有商业利益纯凭个人兴趣做事的好处,难听点的话说,就是你有不来的自由,就好像偶有不做对你的支持的自由一样,用现实的例子来说,7zip是一个开源的压缩程式,没有任何商业因素在里面,但是官方的开发并没有做出对Mac的支持,因此偶有不选择使用它的自由(虽然有第三方工具),但是这并不能妨碍到官方有不开发对Mac的支持的自由一样

  29. @Lovee :
    跑题了,商业上,站在主流角度,主流可以指大多数用pc的用户,同样可以指mac用户,你的产品做给谁的,谁就是主流。至于个人博客,那就另当别论,商业是盈利的,事情就是靠着盈利的方向做。

    正如你主站做的是mac方面的,pc就不可能用你的东西,汉化也算。偶尔pc用户撞进去,也没什么的。mac用户才是你的主流。既然可以基本百分百确定用户是用支持html5的浏览器,那么你改用html5不是不可以,而是有必要,因为你不会再面对太多问题了。

    何况,用html5是推动标准发展,无可厚非的事情。所以,所说的自私的开发者,指不考虑现实的问题而一意孤行的人。

  30. 如果这篇文章是站长写的,偶确实要说两句
    首先,做网站不是给你自己玩的,你按HTML5做出来的东西,别人看不了就==你白做~~~,不考虑用户体验的网站必定是失败的网站。
    其次 FONT标签早在HTML4的时候就已经有在业内有很多意见了,所以很多网页制作人员都已经用其他标签所代替,偶用span+style 呵呵
    最后,虽然说HTML5 对于我们来说,的确是个很期待的东西,但一切都要听市场,市场说了算 60%的人不用兼容HTML5的浏览器,谁还会用HTML5来开发网站。

    所以说 HTML5的普及,没个5年的估计还不行~~ 5年后是不是还在做网页,谁知道

  31. 我的FF3.5无法显示视频……不过我有多久没用font color这样的写法了……我写文章需要临时定义一些效果的时候都是采用加入style来进行定义

  32. @ZeroDream:
    恩,这个问题涉及到浏览器的上家的态度问题了——虽然FF和Safari都支持video标签,8过Safari支持的是实际上用途更广泛但是可能涉及到商业性质的mpeg编码,而FF则是支持纯开源性质的ogg编码,然后偶机子上也只有mpeg的视频,然后偶当时又懒得转视频 寒っ

Leave a Reply to Lovee Cancel reply

Your email address will not be published. Required fields are marked *

To create code blocks or other preformatted text, indent by four spaces:

    This will be displayed in a monospaced font. The first four 
    spaces will be stripped off, but all other whitespace
    will be preserved.
    
    Markdown is turned off in code blocks:
     [This is not a link](http://example.com)

To create not a block, but an inline code span, use backticks:

Here is some inline `code`.

For more help see http://daringfireball.net/projects/markdown/syntax

(;;) (:D) (!!!!) (……) (^o^;) (==) (OoO) (=v=o) more »Note: Commenter is allowed to use '@User+blank' to automatically notify your reply to other commenter. e.g, if ABC is one of commenter of this post, then write '@ABC '(exclude ') will automatically send your comment to ABC. Using '@all ' to notify all previous commenters. Be sure that the value of User should exactly match with commenter's name (case sensitive).