1.你作的頁面在哪些流覽器測試過?這些瀏覽器的內核分別是什麼?css
2.每一個HTML文件裏開頭都有個很重要的東西,Doctype,知道這是幹什麼的嗎?html
答案:<!DOCTYPE> 聲明位於文檔中的最前面的位置,處於 <html> 標籤以前。此標籤可告知瀏覽器文檔使用哪一種 HTML 或 XHTML 規範。(重點:告訴瀏覽器按照何種規範解析頁面)前端
3.Quirks模式是什麼?它和Standards模式有什麼區別jquery
從IE6開始,引入了Standards模式,在寫程序時咱們也會常常遇到這樣的問題,即當某個參數爲真時,咱們就使用新功能,而若是這個參數 不爲真時,就使用舊功能,這樣就能不破壞原有的程序,又提供新功能。IE6也是相似 這樣作的,它將DTD當成了這個「參數」,由於之前的頁面你們都不會去寫DTD,因此IE6就假定 若是寫了DTD,就意味着這個頁面將採用對CSS支持 更好的佈局,而若是沒有,則採用兼容以前的佈局方式。這就是Quirks模式(怪癖模式,詭異模式,怪異模式)web
如何斷定如今是標準模式仍是怪異模式:面試
方法一:執行如下代碼跨域
alert(window.top.document.compatMode) ;瀏覽器
//BackCompat 表示怪異模式
//CSS1Compat 表示標準模式緩存
方法二:jquery爲咱們提供的方法,以下:
alert($.boxModel)
alert($.support.boxModel)安全
區別:整體會有佈局、樣式解析和腳本執行三個方面的區別。
4.div+css的佈局較table佈局有什麼優勢?
5.a:img的alt與title有何異同?b:strong與em的異同?
a:
b:
6.你能描述一下漸進加強和優雅降級之間的不一樣嗎?
7.爲何利用多個域名來存儲網站資源會更有效?
8.請描述一下cookies,sessionStorage和localStorage的區別?
sessionStorage用於本地存儲一個會話(session)中的數據,這些數據只有在同一個會話中的頁面才能訪問而且當會話結束後數據也 隨之銷燬。所以sessionStorage不是一種持久化的本地存儲,僅僅是會話級別的存儲。而localStorage用於持久化的本地存儲,除非主動刪除數據,不然數據是永遠不會過時的。
web storage和cookie的區別
9.簡述一下src與href的區別。
src(source)用於替換當前元素,href(Hypertext Reference)用於在當前文檔和引用資源之間確立聯繫。
10.知道的網頁製做會用到的圖片格式有哪些?
png-8,png-24,jpeg,gif,svg
可是上面的那些都不是面試官想要的最後答案。面試官但願聽到是Webp。(是否有關注新技術,新鮮事物)
科普一下Webp:WebP格式,谷歌(google)開發的一種旨在加快圖片加載速度的圖片格式。圖片壓縮體積大約只有JPEG的2/3,並能節省大量的服務器帶寬資源和數據空間。Facebook Ebay等知名網站已經開始測試並使用WebP格式。
在質量相同的狀況下,WebP格式圖像的體積要比JPEG格式圖像小40%
11.知道什麼是微格式嗎?談談理解。在前端構建中應該考慮微格式嗎?
微格式(Microformats)是一種讓機器可讀的語義化XHTML詞彙的集合,是結構化數據的開放標準。是爲特殊應用而制定的特殊格式。
優勢:將智能數據添加到網頁上,讓網站內容在搜索引擎結果界面能夠顯示額外的提示。(應用範例:豆瓣,有興趣自行google)
12.在css/js代碼上線以後開發人員常常會優化性能,從用戶刷新網頁開始,一次js請求通常狀況下有哪些地方會有緩存處理?
dns緩存,cdn緩存,瀏覽器緩存,服務器緩存。
13.一個頁面上有大量的圖片(大型電商網站),加載很慢,你有哪些方法優化這些圖片的加載,給用戶更好的體驗。
14.你如何理解HTML結構的語義化?
15.談談之前端角度出發作好SEO須要考慮什麼?