جهنم وب !

مجموعه‌ای از خز ترین کار های ممکن در طراحی یک سند وب

https://HTMHell.ir
...

می‌دونیم توی جهنم طراحی هستیم وقتی می‌بینیم :

انیمیشن های بی‌مورد

انیمیشن های بی‌خود و مسخره هم مثل متن چشمک‌زن، تمامی فاکتور های خز و خیل بودن را دارند، علاوه بر اینکه متن چشمک‌زن حداقل نصف اوقات دیده نمیشه و از شر اش در امان هستیم، ولی این لامصب همیشه جلو چشممون هست و مغزمون رو میخوره

متن متحرک

بعد از متن چشمک‌زن و انیمیشن های بی‌خود، متن های متحرک هم واقعا روی مخ هستند و باعث میشن تمرکز کاربر از محتوا سلب بشه و چشم‌اش دنبال یک متن بی‌اهمیت بره چون متحرک هست و ممکنه دیگه نتونه بخونه، درست مثل زیرنویس شبکه های تلوزیونی که باعث مختل شدن دیدن کامل فیلم میشه

پس‌زمینه خز و خیل

پس زمینه های نامناسبی که در ترکیب با محتوا جالب دیده نمی‌شوند، باعث عدم خوانایی متن می‌شوند و توصیه به انتخاب پس‌زمینه نسبتا ملایم و سازگار با محتوا هست

شباهت رنگ متن و پس‌زمینه

زمانی که کنتراست بین رنگ متن و پس‌زمینه‌اش نزدیک باشه، همینی میشه که می‌بینید ! همین متنی که دارید زور می‌زنید بخونید

استایل های متنی خز

عنوان مسخره

یکی از خز ترین کار های ممکن استفاده از استایل های متنی مشابه این هست، که باعث کم‌شدن خوانایی متن میشه و به‌مقدار انبوهی به مسخره بودنش اضافه می‌کنه، اگه دارید CSS یاد می‌گیرید اشکالی نداره توی تمرین هایی که می‌زنید از استایل های متن استفاده کنید، ولی استفاده از این استایل های خز و خیل فقط باعث مسخره دیده شدن متن شما میشه

سایت را با فلان ببینید

برای نمایش این قسمت باید با موبایل وارد وبسایت بشید، چون من بلد نیستم سایت ریسپانسیو بزنم که هم توی موبایل درست نمایش داده بشه و هم توی دسکتاپ و تبلت

برای نمایش این قسمت باید با دسکتاپ وارد وبسایت بشید، چون من بلد نیستم سایت ریسپانسیو بزنم که هم توی موبایل درست نمایش داده بشه و هم توی دسکتاپ و تبلت

جدول های عرض ثابت

خب، من یه جدولی قرار دادم اینجا، برام هم مهم نیست که شما می‌تونید کل اش رو ببینید یا نه، به من چه، برید یه تلوزیون ۶۰ اینچ بگیرید و سایت رو با اون باز کنید تا بتونید جدول من رو ببینید

نام نام‌خانوادگی سن جنسیت متاهل شماره همراه شماره موبایل
فلان فلانی ۱۹ مرد خیر یه شماره مسخره یه شماره مسخره‌تر
فلان فلانی ۱۹ مرد خیر یه شماره مسخره یه شماره مسخره‌تر
فلان فلانی ۱۹ مرد خیر یه شماره مسخره یه شماره مسخره‌تر
فلان فلانی ۱۹ مرد خیر یه شماره مسخره یه شماره مسخره‌تر
فلان فلانی ۱۹ مرد خیر یه شماره مسخره یه شماره مسخره‌تر
فلان فلانی ۱۹ مرد خیر یه شماره مسخره یه شماره مسخره‌تر

حاشیه بی‌مورد

یه بوردر و پدینگ شدید برای یه متن مسخره که شاید اصلا هم مهم نباشه، ولی طراح‌وب ما تازه‌کار هست و دوست داره هر متنی که می‌نویسه رو قاب بگیره و بزنه دیوار اتاقش و ذوق کنه

منو های ایمیج‌مپ

این مورد از خز ترین و قدیمی‌ترین کار های ممکن در طراحی وب هست، هنوز هم که هنوزه خیلی از وبسایت های سازمانی از این تکنیک‌ها در توسعه وبسایت‌شون استفاده می‌کنند و از عکس برای منو و ... استفاده می‌کنند و بعد با تکنیک Image Mapping بهشون لینک میدند که این‌کار واقعا حال به هم زن هست و هیچ‌جوره نمیشه ریسپانسیوش کرد

Humor News

تغییر بی‌مورد نشان‌گر

هیچ کاربری از تغییر پیش‌فرض‌ها خوشش نمیاد، هیچ‌کاربری انتظار نداره وقتی روی این متن Hover می‌کنه با نشانگر موس Busy مواجه بشه

...

می‌دونیم توی جهنم ساختاری هستیم وقتی می‌بینیم :

خودارضایی با جاوا اسکریپت

طراح های وب تازه‌کاری که دوست دارند هر فریمورکی که می‌بینند رو امتحان کنند و هر کتابخونه‌ای که می‌بینند رو به‌صورت ترکیبی توی یک پروژه استفاده کنند، ترکیب ReactJS با JQuery و Lodash و ThreeJS و هزار تا JS دیگه، فقط برای اینکه میخواد یه سایت شخصی برای خودش بزنه، از استاندارد های وبسایت ایده‌آل و حجم مصرف شده هم صرف‌نظر کنیم باز هم وبسایت حداقل چند ثانیه طول می‌کشه تا کد های JS رو Parse کنه و از حالت رندر بلاکینگ دربیاد، تا تازه شروع کنه ادامه قضیه رو رندر کنه و ما بعد از ۳۰ ثانیه انتظار تازه Paint اولیه صفحه رو ببینیم

استفاده از آی‌فریم

الان سال ۲۰۰۰ نیست دوست عزیز من، الان حداقل ۲۰ سال از اون دوران گذشته که توی وبسایت‌ها از iframe ها استفاده می‌کردند برای بخش های مختلف وبسایت، طرف توی وبسایتش گوگل رو آی‌فریم لود می‌کرد و حال می‌کرد که موتور جستجو راه‌اندازی کرده توی وبسایت خودش ! از اینکارا نکنید، آی‌فریم نه‌تنها لود تایم بالایی داره، بلکه جلوه خوبی هم به وبسایت نمیده و شما عملا کنترل آنچنانی بر روی فریم و محتواش نمی‌تونید داشته باشید، ضمن اینکه اگه کاربر قراره آی‌فریم ببینه توی وبسایت شما، چرا اصلا بیاد توی وبسایت شما ؟ خب میره به همون سایتی که آی‌فریم‌اش کردید

استفاده از فلش

وبسایت Adobe چند سال هست که فلش رو منسوخ اعلام کرده ولی با این‌حال باز هم هستند افرادی که توی وبسایت‌هایی که طراحی می‌کنند از فلش استفاده می‌کنند، اینکار رو نکنید، کاربر رو وادار نکنید سه ساعت توی اینترنت دنبال نحوه نصب فلش‌پلیر و تنظیم کردنش توی مرورگرش بگرده تا بتونه وبسایت شما رو باز کنه و بعد از سه ساعت معطلی به محتواتون دسترسی داشته باشه، چرا ؟ چون شما محتواتون رو بلد نبودید با CSS استایل بدید و اومدید با فلش انیمیت‌اش کردید

کد های منسوخ W3

وبسایت هایی که از نظر W3 استاندارد نیستند و دارای اشکالات ساختاری دارند، مثلا داخل li از div استفاده کردند یا یادشون رفته تگی که باز کردند رو ببندند ولی چون مرورگر هوشمند هست و به درستی رندر می‌کنه متوجه خطاشون نمیشن، ولی از لحاظ W3 این‌کار اصولی نیست

تبلیغات پاپ‌آپ

باز هم باید یادآوری بشه که الان سال ۲۰۰۰ نیست و حداقل ۲۰ سال از اون تایم می‌گذره، مرورگرها به‌صورت دیفالت دارای پاپ‌آپ بلاکر هستند، ولی باز هم اگه یک کاربری بهتون اعتماد می‌کنه و دسترسی پاپ‌آپ میده به صفحه‌تون، دلیل نمیشه هرجا کلیک کرد براش سیصد تا پاپ‌آپ تبلیغاتی باز کنید، یا اصلا اون تبلیغ‌دهنده‌ای که در قالب پاپ‌آپ تبلیغ می‌کنه باید چقدر گاو باشه تا نفهمه که تبلیغات اجباری پاپ‌آپی نرخ تبدیل‌شون واقعا صفر حدی هست

ابزارک های خز و خیل

ابزارک هایی مثل بارش برف در وبسایت، فال حافظ آنلاین، آب و هوای آنلاین، اوقات شرعی و ... توی وبسایت شما نه تنها امتیاز محسوب نمی‌شوند، بلکه به‌شدت حرکت مسخره‌ای هست، مگه کاربر اومده توی وبسایت شما سیزده‌به‌در کنه که این‌همه چرت و پرت نامرتبط براش فراهم می‌کنید، کاربر برای محتوای اختصاصی شما میاد توی وبسایت شما و وقتی محتوا رو دید از وبسایت شما خارج میشه، به‌همین سادگی !

...

می‌دونیم توی جهنم محتوایی هستیم وقتی می‌بینیم :

پخش خودکار رسانه

صفحاتی که بدون اجازه شما و به‌صورت خودکار شروع به پخش ویدیو یا موزیک می‌کنند، مثلا وقتی من ۱۰ تا ویدیو رو همزمان توی یوتیوب باز می‌کنم به این معنی هست که میخوام همه‌شون رو به‌ترتیب ببینم، لزومی نداره شروع کنی هر ۱۰ تا ویدیو رو همزمان پخش کنید و صدای همشون ترکیب بشه و من برم دونه‌دونه Pause شون کنم

محتوا به‌صورت PDF

صفحاتی که بعد از دو ساعت سرچ بهشون می‌رسیم و به‌جای محتوای متنی، با یک فایل PDF مواجه میشیم که یا باید دانلود کنیم و یا داخل صفحه نمایش داده میشه، نه امکان سرچ درست و حسابی بین محتوا رو داریم و نه می‌تونیم مثل آدم متن رو سلکت کنیم

بازدید شمار

"شما بازدید کننده x ام این صفحه هستید" یا "x کاربر امروز از این صفحه بازدید کرده اند" و سایر خزعبلات، خب که چی بشه ؟ واقعا فکر می‌کنید برای ما مهم هست که بدونیم چند نفر از این صفحه‌ای که زدی بازدید کردند یا اینکه ما چندمین نفر خوشبختی هستیم که این صفحه رو داریم میبینیم ؟ قراره جایزه بدی به اونایی که زودتر بازدید کردند ؟

خبرنامه

"برای دریافت جدیدترین اخبار وبسایت عضو خبرنامه ما بشید" ، واقعا چی باعث میشه که فکر کنید یک نفر مشتاق هست تا جدیدترین اخبار وبسایت شما رو توی ایمیل هاش دریافت کنه ؟ اصلا کسی ایمیل های وبسایتی‌اش رو چک می‌کنه توی این دور و زمونه ؟ تنها ایمیل هایی که چک میشن برای تایید اکانت یا گفتگوی عادی هستند، کاش این رو درک کنید و از این تله های جمع‌آوری ایمیل برای اسپم نزارید

صفحات دائما در حال ساخت

صفحاتی که ده سال هست در حال ساخت هستند و به‌زودی قراره تکمیل بشن و در دسترس قرار بگیرند، تازه بعضی‌هاشون تایمر روز شمار هم دارند و هر ۶ ماه یک‌بار مجددا ریست و تمدید میشن و میره تا ۶ ماه دیگه

کمبود اطلاعات تماس

وبسایت هایی که صفحه درباره‌ما یا تماس باما ندارند و تنها اطلاعاتی که ما ازشون داریم اینه که سازنده‌اش یک انسان هست و روی زمین زندگی می‌کنه، اگه هم بخواهیم بهشون پیام یا انتقاد یا پیشنهادی بفرستیم باید به خود خدا بگیم تا خدا بهشون دایرکت بده

این‌ها لیستی از مجموعه مواردی بود که یک وبسایت رو تبدیل به جهنم میکنه برای کاربر، اگه شما هم چیزی مد نظر دارید می‌تونید اضافه کنید (: ، وبسایت بر روی گیت‌هاب و به‌صورت اوپن‌سورس در دسترس و قابل‌ویرایش هست، می‌تونید توی توسعه مشارکت داشته باشید


لیست پروژه‌ها