解決網頁設計中的問題

當您遇到設計問題時採取的步驟

如果你曾經建立過一個網站,你可能會發現事情並不總是按計劃進行。 成為一名網頁設計師意味著您需要熟悉您構建的網站的調試問題。

有時,搞清楚你的​​網頁設計出了什麼問題會非常令人沮喪,但是如果你對你的分析有系統的理解,你通常可以找到問題的原因並更快地解決問題。 這裡有一些提示可以用來實現這一點。

驗證您的HTML

當我的網頁出現問題時,我所做的第一件事就是驗證HTML。 驗證HTML有很多原因,但是當你遇到問題時應該是你做的第一件事。 已經有很多人自動驗證每個頁面。 但即使您習慣了這種習慣,在出現問題時檢查HTML的有效性也是一個好主意。 這將確保它不是一個簡單的錯誤,就像造成您的問題的拼寫錯誤的HTML元素或屬性。

驗證你的CSS

下一個最有可能發生問題的地方就是你的CSS 。 驗證你的CSS提供的功能與驗證你的HTML相同。 如果有錯誤,這將確保您的CSS是正確的,這不是問題的原因。

驗證您的JavaScript或其他動態元素

與HTML和CSS一樣,如果您的頁面使用JavaScript,PHP,JSP或其他動態元素,則應確保它們也是有效的。

在多個瀏覽器中測試

這可能是因為您看到的問題是您正在查看的Web瀏覽器的結果。如果您在每個可以測試的瀏覽器中都出現問題,那麼會告訴您一些有關修復問題的信息。 例如,如果您知道問題只發生在某個瀏覽器中,那麼您可以深入了解為什麼只有一個瀏覽器可能會導致問題,而其他問題則可以。

簡化頁面

如果驗證HTML和CSS沒有幫助,那麼您應該縮小頁面以查找問題。 做到這一點的最簡單方法是刪除或“註釋掉”頁面的某些部分,直到剩下的部分成為問題的部分。 你也應該以類似的方式削減CSS。

簡化背後的想法並不是說您只會留下固定元素的頁面,而是要確定導致問題的原因並進行修復。

減去然後再加回來

一旦你縮小了網站的問題範圍,就開始從設計中扣除元素,直到問題消失。 例如,如果您已將問題縮小到特定的

和對其進行了設置的CSS,請首先刪除一行CSS。

每次移除後測試。 如果您已刪除修復程序或完全刪除問題,那麼您知道需要修復的問題。

一旦你確切地知道是什麼導致問題開始將其添加回已更改的項目。 務必在每次更改後進行測試。 當你在做網頁設計的時候,很少有事情能夠改變它,這是令人驚訝的。 但是,如果您不測試每次更改後頁面的顯示效果,即使看起來很小,也可能無法確定問題出在哪裡。

首先設計符合標準的瀏覽器

Web設計師面臨的最常見問題是圍繞在大多數瀏覽器中使頁面看起來相同。 儘管我們已經討論過要讓Web頁面在所有瀏覽器中看起來都一樣,但如果不是不可能的話,它可能非常困難,但它仍然是大多數設計師的目標。 所以你應該首先設計最好的瀏覽器,其中包括符合標準的瀏覽器。 一旦你有他們的工作,你可以與其他瀏覽器一起玩,讓他們工作,包括可能仍然與您的網站的觀眾有關的舊瀏覽器。

保持你的代碼簡單

一旦你找到並解決了你的問題,你應該保持警惕,以防止他們以後再次出現問題。 避免問題的最簡單方法是盡可能簡化HTML和CSS。 請注意,我並不是說你應該避免做一些類似創建圓角的事情,因為HTML或CSS很複雜。 當一個簡單的解決方案出現時,你應該避免做複雜的事情。

得到一些幫助

可以幫助您調試網站問題的人的價值不會被誇大。 如果你一直在看相同的代碼,很容易錯過一個簡單的錯誤。 對代碼的另一個眼睛往往是你可以為它做的最好的事情。

由Jeremy Girard於2/3/17編輯