DesignyourlifewithWebStandards_Div+CSS教程
教程Tag:暫無(wú)Tag,歡迎添加,賺取U幣!
示例代碼 [www.hl5o.cn]
Design your life with Web Standards,
Web標(biāo)準(zhǔn)不僅僅是你做頁(yè)面的境界,
還是你做人的境界,耐心地去體驗(yàn),積極地去思考,
你會(huì)發(fā)現(xiàn)你在重構(gòu)網(wǎng)站的同時(shí)也在重構(gòu)你的人生。
Web標(biāo)準(zhǔn)不僅僅是你做頁(yè)面的境界,
還是你做人的境界,耐心地去體驗(yàn),積極地去思考,
你會(huì)發(fā)現(xiàn)你在重構(gòu)網(wǎng)站的同時(shí)也在重構(gòu)你的人生。
分享一下體會(huì)阿,首先我的確是說(shuō)體會(huì),不是說(shuō)教,也不是把web標(biāo)準(zhǔn)如何如何神化。
作為基于web標(biāo)準(zhǔn)的頁(yè)面制作人員or重構(gòu)工程師
應(yīng)該具備兩項(xiàng)利器:CSS和XHTML。
CSS,你要做的是忠實(shí)的還原UI,不管你把Web標(biāo)準(zhǔn)技術(shù)吹得在天花亂墜,不能還原UI的制作=垃圾,其次兼容,要兼容你所需要兼容的設(shè)備,這是你的CSS能力的看點(diǎn),再次,無(wú)懈可擊,預(yù)防未來(lái)可能出現(xiàn)的威脅,使用背景圖片的時(shí)候要注重字節(jié),質(zhì)量,打開(kāi)一個(gè)頁(yè)面的并發(fā)鏈接熟。
XHTML,是你的結(jié)構(gòu),承載著對(duì)于web來(lái)說(shuō)最終的東西——信息,所以一個(gè)隱藏在背后,卻是根本的結(jié)構(gòu),結(jié)構(gòu)是不可見(jiàn)的,很難在短期考核出你的結(jié)構(gòu)是否優(yōu)劣,但是它確是是根本,面向SEO的語(yǔ)義化,面向UI的龐大的接口,不會(huì)束縛CSS的發(fā)揮。
其次是JS啦,我理解的JS是救火隊(duì)員,他總扮演著串接的作用,當(dāng)結(jié)構(gòu)和CSS不能解決當(dāng)前問(wèn)題的時(shí)候,JS就會(huì)出現(xiàn),它可以隨意的改變DOM樹(shù),也可以隨意的改變樣式。就像被稱贊的AJAX技術(shù)描述的:標(biāo)準(zhǔn)化的HTML,CSS,異步,最后用JS把他們串接起來(lái)。
作為人
XHTML是你的原則,是你在長(zhǎng)期的成長(zhǎng)中形成的價(jià)值觀和人生觀,是你做人不變的原則。你能走多遠(yuǎn),能取得多大的成就和你的人生哲學(xué),你的價(jià)值觀原則有著根本的聯(lián)系,套用一句俗話“日久見(jiàn)人心”
CSS是你的處世謀略,圓滑之道,讓你在不同的境地和場(chǎng)合暢行無(wú)阻,讓你在不背離原則的條件下做事更順,更如魚(yú)得水。而假如你過(guò)多地花精力放在這個(gè)上面,你會(huì)很空虛,很迷茫,很孤獨(dú),很沒(méi)有底氣(曾經(jīng)的我,多次想放棄Web標(biāo)準(zhǔn))。
JS,我更多的將其理解為口才,當(dāng)原則和行為發(fā)生沖突的時(shí)候,要用你優(yōu)良的溝通能力去彌補(bǔ)過(guò)失,去說(shuō)服對(duì)方。
再多一點(diǎn)
UI集成了交互,CSS在還原UI的時(shí)候自然擁有它的交互哲學(xué)
XHTML是信息架構(gòu),擁有著萬(wàn)變不離其宗的信息,而且服務(wù)器端的View如何呈現(xiàn)受制于你良好的結(jié)構(gòu),SEO的獲取數(shù)據(jù)甚至Microformats的快速數(shù)據(jù)提取也取決你的良構(gòu)。
所以做Web標(biāo)準(zhǔn),能看得更多,看得更廣,看得更遠(yuǎn)。歡迎大家也分享一下自己的Web標(biāo)準(zhǔn)故事。
鳴謝Twinsen Liang,是他點(diǎn)醒了我。
相關(guān)Div+CSS教程:
- DIV+CSS設(shè)計(jì)的誤區(qū)
- CSS基礎(chǔ):常用CSS英文字體介紹
- IE6和IE7中border邊框斷線現(xiàn)象
- border:none;與border:0;的有什么不同?
- div+css下js對(duì)聯(lián)廣告不隨屏幕滾動(dòng)的解決方法
- HTML元素的ID和Name屬性的區(qū)別
- divcss教程:深入了解css的行高Line Height屬性
- CSS文檔流,塊級(jí)元素和內(nèi)聯(lián)元素
- 5個(gè)你該知道的CSS3新技術(shù)
- 用正則表達(dá)式替換a標(biāo)記href值
- 30個(gè)優(yōu)秀的CSS導(dǎo)航和按鈕設(shè)計(jì)教程
- css中px和em有什么區(qū)別
Div+CSS教程Rss訂閱Div+Css教程搜索
Div+CSS教程推薦
猜你也喜歡看這些
- 10個(gè)很酷的涂鴉風(fēng)格國(guó)外網(wǎng)店設(shè)計(jì)展示
- 鼠標(biāo)指住(hover)變色的按鈕演示demo
- jquery模擬瀏覽器滾動(dòng)條效果
- Web標(biāo)準(zhǔn)實(shí)戰(zhàn)CSS網(wǎng)頁(yè)布局Google首頁(yè)
- DIV CSS布局入門(mén)示例(三)頁(yè)面頂部制作
- DIVCSS菜單:超炫的菜單一張圖片實(shí)現(xiàn)鼠標(biāo)的兩種狀態(tài)及CSS當(dāng)前頁(yè)效果
- 用CSS打造評(píng)分星級(jí)效果的一個(gè)實(shí)例
- 用css制作有滾動(dòng)條的居中彈出框
- CSS去除表格td默認(rèn)間距及制作1px細(xì)線表格
- CSS布局教程:用DIV CSS實(shí)現(xiàn)國(guó)內(nèi)經(jīng)典式三行兩列布局
- 相關(guān)鏈接:
- 教程說(shuō)明:
Div+CSS教程-DesignyourlifewithWebStandards
。