Как да направите потребителска страница за грешка 404 за вашия уебсайт

…и защо

Това може да бъде грешно въведен URL адрес или прекъсната връзка, която задейства страница с грешка 404, която е отговорът на сървъра на страница, която не съществува. За тези, които не са запознати как изглежда, виждали ли сте страница като тази преди?

Когато потребителят се опита да следва прекъсната връзка, той вижда страница „404 не е намерена“

Гледайки това, можете да си представите колко зловещо би било да се чувствате като потребител, изведнъж да изпадне на празна страница като тази. Нека разделим това бързо на парчета, преди да създадем нашата страница.

Сценарий / проблем: Потребителят се опитва да потърси страница, която не съществува.
Известен контекст: 404 страница не е намерена.
Решение: Приятелска страница, която информира потребителя за случилото се на прост език и им казва какво да правят след това.

Следователно, за да заледявате страхотния UX, който сте итератирали за вашия уебсайт, уверете се, че вземете от случая 404.

Нека се потопим направо.

Стъпка 1: Използвате ли конструктор на уебсайтове като Squarespace или Weebly?

Ако да, тогава вече трябва да има настройка на страница с грешка 404, която можете да използвате директно за качване на изображение и добавяне на бутони. Вие сте доста свършени тук.

В моя случай аз имах моя уебсайт, работещ локално. Ако сте като мен, продължете се!

Стъпка 2: Създайте персонализирана страница 404 в HTML.

404 страница за моето портфолио

Стъпка 3: Потърсете файла „.htaccess“ в основната директория на вашия сървър

FTP на вашия сървър и намерете този файл в главната директория. Ще трябва да го редактирате. Ако не можете да го намерите, ще трябва да го създадете. Назовете го „.htaccess“. Нищо преди и след. Просто „.htaccess“.

Стъпка 4: Редактиране на .htaccess файл

Отворете го и добавете следния ред:

ErrorDocument 404 /not-found-page.html

… Където /not-found-page.html е пълният път към новата персонализирана страница 404, която сте създали.

С този ред ние просто казваме на сървъра, че в случай на грешка 404, върнете този файл в браузъра.

Стъпка 5: Уверете се, че пътят е правилен и го тествайте

Опитайте да потърсите страница, която не съществува на вашия уебсайт. Трябва да получите персонализирана страница 404, която сте обозначили във файла .htaccess.

Стъпка 6: Работи ли? Ако не, актуализирайте настройките на вашия сървър

В моя случай, тъй като локално използвам уебсайта си на Mac, Apache не позволява потребителски .htaccess файл. Трябваше да вляза в конфигурация на Apache и да редактирам настройките.

Ето как го направих за всеки, който се интересува и следва същия начин:

Voilah! Това е доста за създаването на персонализирана страница 404. Тя трябва да работи перфектно за вашия уебсайт. Ако продължавате да се сблъсквате с проблеми, объркайте се с това как можете да промените конфигурациите на вашия сървър, за да имате възможност за персонализирани 404 страници.

Историята и потокът на вашия уебсайт са непълни, ако доведете потребителя до задънена улица като 404. Има толкова много творчески примери, от които можете да се вдъхновите. Не забравяйте да го поддържате просто, но същевременно интересно. :-)

Уведомете ме, ако имате въпроси или имате нужда от повече помощ относно това. Обиколих се опитвайки се да реша това за един ден, докато не го накарах да работи и реших, че ще споделя.