Страница 404 — лучшие практики и вдохновение для дизайна
Если вы еще не знакомы с этим термином, страница ошибки 404 — это страница, которая уведомляет пользователя о том, что ссылка, по которой он пытался получить доступ, не работает или не существует. Излишне говорить, что получение страницы с ошибкой 404 раздражает каждого пользователя, который с ней сталкивается.
Чтобы сделать это явление более терпимым для пользователей, многие дизайнеры веб-страниц взяли на себя задачу настроить свою страницу с ошибкой 404, чтобы она выглядела более «забавной» и уникальной. Обычно они делают это, добавляя юмор, остроумие и дизайн, который содержит творческую оригинальность на своей странице.
Если у вас также есть план создать свою собственную страницу 404 таким образом, просмотр некоторых примеров уже созданных пользовательских страниц 404 может послужить для вас хорошим источником вдохновения. Поэтому мы решили поделиться списком остроумных и уникальных примеров страниц ошибок 404, которые могут помочь вам при создании.
Как должна выглядеть страница ошибки 404
Во-первых, упомянем некоторые характеристики, которыми, по нашему мнению, должна обладать пользовательская страница ошибки 404. Некоторые из этих стратегий фактически применялись многими влиятельными веб-сайтами.
1 Он должен соответствовать общему стилю вашего веб-сайта.
Если вы спросите нас, это должно быть легкой задачей. Существует так много тем WordPress, которые специально созданы для соответствия определенному типу бизнеса или характеру услуг или продуктов, которые продвигает сайт. Поэтому вполне естественно, что вы должны адаптировать дизайн страницы 404 как к шаблону вашего веб-сайта, так и к общей теме вашего веб-сайта. Например, если вы являетесь веб-сайтом ресторана, который специализируется на изысканных блюдах, было бы неплохо включить изображение необычного блюда, а также его название на страницу с ошибкой 404. Таким образом, ваши посетители, по крайней мере, не забудут, что вы подаете хорошую еду, несмотря на неудобства, с которыми они столкнулись в текущий момент. Благодаря множеству бесплатных веб-сайтов и многочисленным ресурсам с векторными иллюстрациями.вы можете улучшить внешний вид страницы с ошибкой 404 в соответствии с вашими потребностями.
2 Он должен содержать некоторую форму извинения
Появление всплывающей страницы с ошибкой 404 не только раздражает, но и то, чего не должно было произойти в первую очередь. Вот почему всегда полезно включить какое-то извинение на страницу с ошибкой, где вы подчеркнете, что действительно сожалеете о проблемах пользователя.
3 Страница с ошибкой 404 должна содержать строку поиска
Это также может быть хорошей практикой. Если вы добавите панель поиска на страницу с ошибкой 404, это может заставить пользователей остаться на вашем сайте, чтобы продолжить изучение.
4 Попробуйте добавить ссылку
Как и панель поиска, полезная ссылка может принести больше пользы, чем вреда. Это может быть любая ссылка, которую вы считаете важной, например, ваш блог, страница контактов или даже ваша домашняя страница. Кроме того, добавить ссылку в WordPress очень просто.
5 Разбавьте ситуацию юмором
Мы уже упоминали о юморе ранее. Будь то остроумный, самоуничижительный или просто странный, использование юмора в таких ситуациях действительно может значительно улучшить настроение или поднять настроение вашему посетителю. Кто знает, ваш непринужденный и комедийный подход может привести к тому, что у них сложится более положительное впечатление о вашем бренде в целом.
Короче говоря, если у вас есть хорошая идея для остроумной строки, которая может быть на вашей странице с ошибкой 404, не стесняйтесь добавлять ее, поскольку многие приветствуют юмористический подход. И даже если ваши посетители не находят это забавным, всегда лучше сохранять беззаботность, чем вести себя как машина.
Вы также можете установить перенаправление на страницу с ошибкой 404. Например, если произойдет ошибка, ваша страница может быть просто перенаправлена на вашу домашнюю страницу. Это, однако, не лучшее решение, потому что, если что-то не так с вашей домашней страницей, вы вернетесь к исходной точке.
Но прежде чем вы погрузитесь в лучшие примеры, которые мы подготовили, найдите время, чтобы освежить вашу память о создании страницы 404 в WordPress:
Наша ошибка 404 Страница вдохновения
Теперь, когда вы знаете, из каких элементов может состоять хорошая страница с ошибкой 404, мы также предоставим вам несколько примеров страниц с ошибкой 404, которые привлекли наше внимание своим чувством юмора и общим влиянием их дизайна.
Надеюсь, то, как выглядит эта страница с ошибкой 404, не отражает того, как вы будете реагировать, когда столкнетесь с этой проблемой. Компания Pixar решила добавить персонажа по имени Печаль из популярного фильма «Головоломка» 2015 года с сообщением, которое советует вам не принимать подобные вещи слишком близко к сердцу. Мы не могли не согласиться.
После запуска нового фирменного стиля и дизайна Mailchimp также изменил внешний вид своей страницы ошибок. Веб-сайт, который специализируется на услугах рассылки новостей по электронной почте, решил включить нетрадиционное изображение осла, чья голова зарыта глубоко в яму, что указывает на то, что он обыскал каждую щель сайта и просто не нашел ни одной страницы. Что ж, очевидно, что осел действительно изо всех сил старался найти эту страницу для вас, поэтому на самом деле нет смысла слишком расстраиваться из-за этого.
Этот профессиональный веб-сайт, основанный на фотографии, специализируется на съемке портретов новорожденных, свадеб и других семейных мероприятий. Так что вполне уместно, что они решили включить фотографию перемазанного малыша, закатывающего истерику на странице 404. Несмотря на то, что на картинке видно, что ребенок в итоге съел торт, текст намекает на то, что страница, которую вы искали, тоже была съедена. Но как можно злиться на плачущего ребенка? Это было просто любопытно и закончилось тем, что случайно сожрал вашу страницу!
В дизайне 404 страницы Blizzard Entertainment есть своя изюминка. Помимо разбитого окна и искаженного меню (которое, кстати, до сих пор работает), есть сообщение, обвиняющее в ошибке пользователя. Они были немного смелыми в своем подходе, потому что это определенно отличается от обычных сообщений с извинениями, которые обычно появляются на страницах ошибок. Тем не менее, он по-прежнему уникален и освежает, так что, по крайней мере, некоторые люди будут удивлены этим неожиданным поворотом столов.
Увидеть полностью побежденного антагониста Angry Birds на экране официального сайта этой игры только потому, что страницу невозможно найти , это может оказать утешительное воздействие на человека, который ее просматривает. В конце концов, это не кто иной, как Плохой поросенок, который может иметь отношение к вашему несчастью.
Flywheel — компания, специализирующаяся на помощи разработчикам и дизайнерам в создании веб-сайтов на WordPress. Их страница 404 упрощена по своей природе, но состоит из нескольких привлекательных элементов веб-дизайна. Есть «это действительно отстой!» сообщение, которое на самом деле является умным каламбуром, учитывая, что число ноль на самом деле является анимированной черной дырой, которая засосала то, что кажется ноутбуком с разбитой страницей.
Каждый хороший UX-дизайнер признает, что, хотя вы в первую очередь фокусируетесь на решении самых больших проблем, с которыми сталкивается пользователь, вам также нужно приспосабливаться, когда они выходят за рамки сценария. Вот почему скромные люди из carwow создали потрясающую страницу 404 с гоночной игрой на случай, если страницы не загружаются, как планировалось.
Британский юмор часто не воспринимает себя слишком серьезно. Сами владельцы компании — британцы, так что в этой ситуации они фактически наносят удар по себе. Они сделали это, нарисовав двух шикарных персонажей, которые глубоко погружены в разговор о неработающей странице. Все это время они дают пользователю советы о том, что ему делать дальше, используя британские фразы, которые в данном контексте звучат откровенно комично.
Лично мы потеряли его, когда они назвали страницу «Четыреста четвертое сообщение об ошибке» и когда они прокомментировали, что «их веб-дворецкий исправит их ошибку в пустяках».
Slack — это платформа для совместной работы, которая помогает предприятиям и компаниям работать вместе и двигаться вперед. Но если вы попадаете на их страницу 404, считайте себя действительно потерянным. Их страница ошибок имеет красивую анимацию, которая также перемещается, если вы перетаскиваете указатель мыши по экрану. Несмотря на то, что это визуально привлекательно, это пример страницы, которая не имеет никакого отношения к содержимому веб-сайта, но все же хорошо выполняет свою работу.
Получите вдохновение и будьте готовы к экспериментам
Помимо тщательно созданных примеров страниц 404, используемых известными брендами, есть много других замечательных шаблонов, к которым вы можете обратиться. Разработанные опытными художниками с вниманием к каждой детали, это наши фавориты.
Этот шаблон, разработанный Леной Зайцевой, является отличным примером интерактивного, нетипичного макета страницы с ошибкой 404. Минималистичный, но эффективный, он сочетает в себе белый и желтый цвета с анимированными текстами. Слова с названием сайта разделены цифрой «404». При этом ваше основное сообщение вместе с кнопкой возврата появляется внизу страницы. Это решение отлично подходит для современных веб-сайтов и творческих ниш.
Хотя на первый взгляд эта страница 404 может показаться простой, это хороший пример того, как простота может быть эффективной. С преобладающим синим оттенком и умной 3D-иллюстрацией он показывает, что оригинальные, нетрадиционные страницы 404 могут иметь реальное значение. Если вы хотите, чтобы ваша онлайн-презентация выделялась, это может подойти.
Страницы ошибок 404 в основном заставляют нас чувствовать, что мы потерялись в космосе. Основываясь на этой метафоре, этот пример страницы 404 является мощным способом перенаправления посетителей веб-сайта на домашнюю страницу. Прекрасная графика и плоские элементы являются основным акцентом этого шаблона. В случае, если вам нужна страница 404, которая представляет собой небольшое произведение искусства и может идеально работать для любого креативного веб-сайта, не стесняйтесь попробовать этот макет.
Этот смелый макет из 404 страниц, разработанный Кэролайн Ли, отлично подойдет всем, кто предпочитает многоцветный ретро-стиль. Атмосфера этого шаблона напоминает нам о новаторских видеоиграх и старой доброй эпохе телевидения. Сочетание ярких цветов, таких как розовый, желтый, синий и зеленый, а также различных размеров форм подойдет для любой дизайнерской или игровой студии.
Если есть одно слово, которое может описать этот макет, это будет желтый! Вдохновленный эстетикой американского поп-арта, этот экземпляр 404 сочетает в себе два оттенка желтого, знаковые точки и полосы. ЕСЛИ вы хотите добавить немного искусства на страницу такого типа, это то, что вам нужно.
Простота иногда так много может предложить. Этот шаблон является лучшим доказательством. С левой стороны есть изображение гитариста с гитарой с порванной струной. Сильный символизм этой иллюстрации идеально подходит для контекста страницы с ошибкой 404. С другой стороны есть простое сообщение с кнопкой «Назад».
Просмотр уже существующих страниц с ошибкой 404 может быть забавным, но создание такой страницы может оказаться совсем другой историей. Для работы требуется остроумие, креативность и немного непредубежденности. Тем не менее, мы надеемся, что некоторые из наших предложений, по крайней мере, помогут вам получить хороший старт.