Вирішення проблем у веб-розробці та дизайні

Якщо ви коли-небудь створювали веб-сайт, ви, ймовірно, виявили, що все не завжди йде за планом. Бути веб-дизайнером означає, що вам потрібно освоїтися з зневаджувальними проблемами сайтів, які ви створюєте.

Іноді з'ясувати, що не так з вашим веб-дизайном, може бути дуже складно, але якщо ви систематично ставитеся до свого аналізу, ви часто можете знайти причину проблеми і усунути її швидше. Ось кілька порад, які ви можете використовувати, щоб це сталося.

Перевірте ваш HTML

Якщо у вас є проблема з вашою веб-сторінкою, перше, що потрібно зробити, це перевірити HTML. Є багато причин для перевірки HTML, але коли у вас є проблема, це повинно бути першим ділом. Вже є багато людей, які перевіряють кожну сторінку автоматично. Але навіть якщо у вас є звичка, корисно перевірити правильність вашого HTML, коли у вас виникнуть проблеми. Це гарантує, що це не проста помилка, як елемент або властивість HTML з помилкою, яка викликає вашу проблему.

Підтвердіть свій CSS

Наступне найімовірніше місце, де у вас будуть проблеми, це ваш CSS. Перевірка вашого CSS виконує ту саму функцію, що й перевірка вашого HTML. Якщо є помилки, це гарантує, що ваш CSS правильний, і це не є причиною ваших проблем.

Validate Your JavaScript or Other Dynamic Elements

As with HTML and CSS, if your page uses JavaScript, PHP, JSP, or some other dynamic elements, you should make sure that they are valid as well.

Test in Multiple Browsers

It may be that the problem you’re seeing is a result of the web browser you’re viewing it in. If the problem occurs in every browser you can test, that tells you something about what you have to do to fix it. For example, if you know that the problem only happens in a certain browser, you can dig deeper into why just that one browser may be causing an issue while others are fine.

Simplify the Page

If validating the HTML and CSS doesn’t help, then you should narrow down the page to find the problem. The easiest way to do this is to delete or «comment out» portions of the page until all that is left is the portion with the problem. You should also cut the CSS down in a similar fashion.

The idea behind simplifying is not that you’ll leave the page with only the fixed element, but rather that you’ll determine what is causing the problem and then fix it.

Subtract and Then Add Back

Once you have narrowed down the problem area of your site, begin subtracting elements out of the design until the problem goes away. For example, if you’ve narrowed down the problem to a specific <div> and the CSS that styles it, begin by removing one line of CSS at a time.

Test after every removal. If what you’ve removed fixes or completely removes the problem, then you know what you need to fix.

Once you know exactly what is causing the problem, begin adding it back with items changed. Be sure to test after every change. When you’re doing web design, it’s surprising how often little things can make a difference. But if you don’t test how the page looks after every change, even seemingly minor ones, you may not determine where the problem is.

Design for Standards Compliant Browsers First

The most common problems that web designers face revolve around getting pages looking the same in most browsers. While we’ve discussed that it can be very difficult, if not impossible, to get web pages to look the same in all browsers, it is still a goal of most designers. So you should start by designing for the best browsers first, which includes those that are standards-compliant. Once you have them working, you can play with the other browsers to get them working, including older browsers that may still be relevant to your site’s audience.

Keep Your Code Simple

Once you’ve found and fixed your problems, you should stay vigilant to keep them from cropping up again later. The easiest way to avoid problems is to keep your HTML and CSS as simple as possible. Note that this doesn’t mean you should avoid doing something like creating rounded corners simply because the HTML or CSS is complicated. Only that you should avoid doing complex things when a simpler solution presents itself.

Get Some Help

The value of someone who can help you debug site problem cannot be overstated. If you have been looking at the same code for a while, it becomes easy to miss an easy mistake. Getting another set of eyes on that code is often the best thing you can do for it.

Edited by Jeremy Girard.