2012-01-12 77 views
2

我是網頁設計和網站開發領域的新手,現在我開始對HTML,CSS,Javascript,AJAX和PHP感到相當舒服,想知道從哪裏可以獲得一個完整的跨瀏覽器設計和開發參考。網頁設計和開發的跨瀏覽器/平臺的完整參考

我在其他網站設計師的博客/個人網站上學到了很多東西,每次他們解釋跨瀏覽器兼容性問題和解決方案時,我總是想知道他們從哪裏得到這些信息,他們如何知道瀏覽器以及它們如何保持最新(尤其是瀏覽器經常更新,隨着硬件(顯示器,平板電腦,智能手機等)的發展而變化的分辨率)。

任何網頁設計師願意給他們的任何參考? 是否有任何(完整)參考來了解這些情況?

我是否應該廣泛學習關於現代瀏覽器,關於Gecko,Webkit等等,或者它對於我想要使用的技術來說太過於技術精明/複雜/耗時?我還想了解更多關於安全性的現代瀏覽器,所以我實際上並不介意從哪裏開始學習有關瀏覽器內部技術以及它們如何運行等方面的建議。

非常感謝您事先的任何意見/答案/參考(網站,書籍,播客,飼料,在Twitter上,G +等大師)

PS:我感興趣的跨瀏覽器(IE, (PC,Mac,Linux,移動設備,潛在的平板電腦)

+0

我不認爲有一個簡單的方法來回答這個問題。您將廣泛的兼容性要求命名爲很多問題。 Dojo是使應用程序交叉/瀏覽器友好的好框架(http://dojotoolkit.org/),但我不確定它會滿足您的胃口。祝你好運。 – Alex 2012-01-12 15:02:25

回答

2

我建議你關注目前最常用的東西。

如果我是你,我會專注於學習如何用現代瀏覽器做事,然後轉向快速響應式設計,最終只會繼續嘗試使用舊版瀏覽器進行工作。

據我所知,關於跨設備&跨瀏覽器測試/開發沒有完整的參考。這就是爲什麼你可能想在這裏或那裏挑選一些東西,並嘗試寫出自己的筆記,你自己的參考。

讓事情與舊的瀏覽器上運行:

現在,在2014年,我們可以看到,IE8仍然是在網絡上使用 - 我懷疑,因爲大公司誰不升級的標準操作系統的大部分(&自帶的標準瀏覽器),這使得員工別無選擇,只能使用IE8。

在任何情況下,我都會專注於學習IE9的跨瀏覽器解決方案& IE9。 IE10 +比以前的版本工作得更好,即使它還不如其他瀏覽器。 Firefox,Safari & Chrome通常是最新的,所以不需要擔心太多。通常情況下,你可以通過一些谷歌搜索找到一個在這些瀏覽器上工作的CSS。 CSS技巧也是一個很好的參考,即。http://css-tricks.com/snippets/css/cross-browser-opacity/

同樣,爲了節省時間,一個好辦法就是寫自己的筆記,或保存鏈接大文章/代碼片段。無論哪種方式適合你,在Evernote上,在你的博客上,或其他。

這裏是我的筆記,https://sites.google.com/site/adrienitnotes/html-css,我幾乎每天都在使用它們。

最好的事情是通過實踐學習,但更好的是通過做更多的研究學習額外的工作,閱讀&實驗。沒有那麼多人花時間做這件事......但它可以做很大的改變。

關於跨瀏覽器測試,您可以使用browserstack。通過讓你有遊離的3個月的試(適用於Windows操作系統的網絡瀏覽器)http://www.modern.ie/en-us/virtualization-tools

我創建了關於在browserstack IE瀏覽器測試了這個問題,微軟現在是「支持」 browserstack:Internet Explorer versions testing in February 2014: browserstack, saucelabs, ghostLab, spoon & other tools

關於跨瀏覽器的功能兼容性,使用Modernizr絕對是最好的選擇:modernizr幫助您測試Web瀏覽器支持的功能,然後相應地執行操作(即加載庫,或者最壞的情況,顯示「不支持Web瀏覽器」的錯誤消息)。但是,您只希望將其用於「某些」功能,每當您加載一個額外的庫時,它將使您的頁面加載速度變慢,可能與另一個庫發生衝突&。這取決於適合你的妥協。

我寫了一些東西(注意到約真的)關於HTML5,CSS3,Modernizr的,& Polyfills(填充工具:JS墊片,它複製的標準API舊版本瀏覽器):https://sites.google.com/site/adrienitnotes/html-css/html5

另一個提示:讀了很多的相關SO問題&有非常好的評價(僅!)的答案,即。 How do I give text or an image a transparent background using CSS?

祝你好運!

編輯

下面是來到我的腦海裏在過去幾個月裏,一些事情:

  • 嘗試發現的質量&重點在這些網站上:有很多在互聯網上的內容不準確,請確保你確實瞭解以質量着稱的網站(即csstricks,caniuse.com,mozilla.org,sitepoint.com,html5rocks.com,aListApart.com)。同樣,你想知道普通網站上來尋找一個話題,但那些質量差的時候,也有很多這樣的(即W3Schools的,見w3fools.com

  • 研究的作者/開發商誰是領導在你的領域,試着找到他們的博客,他們的書籍,他們的視頻,他們的演示文稿,他們的互動課程(如果他們給予任何)。即。 http://davidwalsh.name/

  • 瞭解的良好做法。這將使您節省大量的時間,無論是在您的項目&作爲開發人員您的職業生涯。只需google「html良好做法」或「javascript良好做法」或「jQuery良好做法」或「jQuery良好做法」

  • 瞭解相同語言中相似「事物」之間的差異,您很可能會以更快的速度學習這種方式。 (即。「jQuery:fadeIn()和fadeTo()之間有什麼區別?」)。細節有所不同。

  • 嘗試一些在線學習工具,現在有很多,只是嘗試一對夫婦:teamtreehouse.com和teamtreehouse.com/library,tutsplus.com,codecademy.com,www.coursera.org,gibbon.co/flows #programming,khanacademy.org/computing/cs,udacity.com,academicearth.org,memrise.com/courses/english/computers-engineering/,edx.org,ocw.mit.edu,codeschool.com

  • 試着找一份你有導師的工作,有人可以指導你,提醒你,鼓勵你。根據我的經驗,學習有好的導師(誰每天都有一點的時間)雙重或三重你的學習速度