اگر شما کار طراحی وب سایت انجام می دهید، به طور حتم تا کنون با ابزارهای مرتبط زیادی در زمینه طراحی وب کار کرده اید. هر یک از این ابزارها به نحوی کار شما را به عنوان طراح وب ساده تر می کنند. مرورگر کروم در طول زمان توانسته جایگاه بسیار مناسبی میان کاربران و همچنین طراحان وب پیدا کند. در این مقاله قصد دارم تا 8 مورد از افزونه یا Extension های کاربردی در زمینه طراحی وب را برای مرورگر کروم خدمت دوستان معرفی کنم. هر یک از این افزونه ها به نحوی به شما در زمینه طراحی وب و بررسی سایت ها کمک خواهند کرد.
شاید یکی از مواردی که طراحان وب با آن زیاد سر و کار دارند، چک کردن وب سایت طراحی شده در سایزهای متفاوت برای بررسی سازگاری با ابزارهای مختلف باشد. این افزونه به شما کمک میکند تا اندازه مرورگر خود را به سایزهای از پیش تعریف شده تغییر داده و سایت خود را در این سایزها چک کنید. این سایزها قابل تعریف و تغییر بوده و همچنین می توانید از تنظیمات این افزونه خروجی گرفته و در سایر کامپیوترها از این تنظیمات استفاده کنید:
فرض کنید در حال مشاهده یک وب سایت هستید و از رنگ یکی از بخش های این سایت می خواهید در کار خود استفاده کنید. بوسیله این افزونه می توانید به صورت پیکسل به پیکسل اقدام به انتخاب رنگ و مشاهده کد Hex آن کنید:
بوسیله افزوهه Page Ruler می توانید سایز المان های مختلف بر روی صفحات وب را مشاهده کنید. با انتخاب این ابزار از نوار بالای مرورگر کروم، با کشیدن یک کادر به دور قسمتی از صفحه که مد نظر شما می باشد، سایز آن قسمت به همراه موقعیت absolute آن بر روی صفحه، در زیر نوار آدرس به شما نمایش داده خواهد شد. همچنین پس از تعیین کادر، امکان جابجایی و تغییر اندازه آن را نیز خواهید داشت. همچنین در صورت فعال بودن حالت Element Mode می توانید با بردن نشان گر موس بر روی المان های صفحه، به صورت خودکار آن قسمت را انتخاب نمایید:
فرض کنید صفحه ای را باز کرده و قصد دارید کد CSS مربوط به قسمتی از صفحه را مشاهده کنید. یک راه آن استفاده از قابلیت Developer Tools مرورگر کروم می باشد. اما اگر به دنبال راه ساده تری می گردید این افزونه کار شما را به سرعت راه خواهد انداخت. کافیست در نوار ابزار بالای مرورگر بر روی آیکون CSSViewer کلیک کرده و سپس با بردن نشان گر موس بر روی هر یک از المان های صفحه کد CSS مربوط به آن را مشاهده کنید:
بوسیله این افزونه، می توانید فرم های صفحات وب سایت خود را با مقادیر مختلف و تصادفی پر کرده و اقدام به تست فرم ها نمایید. این مقادیر می توانند شامل مقادیر پیش بینی نشده، مقادیر ناصحیح و مقادیر تصادفی باشند که به صورت خودکار داخل فیلدهای فرم های صفحات قرار میگیرند. همچنین قابلیت تعریف کردن مقادیر پیش فرض در این افزونه وجود دارد. حتماً زمانی که وب سایتی را طراحی می کنید، فرم های صفحات خود را جهت اطمینان از صحت ورود اطلاعات تست کنید:
وب سایت شما یا سایتی که شما طراحی کرده اید، ممکن است حاوی لینک های بسیاری باشد. بوسیله این افزونه می توانید لینک های وب سایت مورد نظر را چک کرده تا از صحت کارکرد لینک ها اطمینان حاصل کنید. بوسیله این افزونه، امکان مشخص کردن یک وب سایت یا زیر مجموعه های آن به همراه اعمال فیلترهای مختلف جهت بررسی لینک ها وجود دارد. دقت کنید که عملیات بررسی مبتنی بر دسترسی شما به وب سایت داخل مرورگر و بر اساس کوکی ها انجام خواهد شد.
با کمک این افزونه می توانید بر روی بخش از صفحه راست کلیک کرده و سپس گزینه Scrape Similar را کلیک کنید، با این کار، پنجره ای باز شده و لیستی از موارد مشابه با ساختار قسمت انتخاب شده در صفحه به صورت یک جدول به شما نمایش داده خواهد شد:
زمانی که شما از وب سایتی بازدید می کنید اطلاعاتی از سمت شما با نام User Agent برای سرور ارسال می شود. این اطلاعات شامل پلاتفرم مورد استفاده برای مشاهده وب سایت می باشد. بوسبله این افزونه شما قادر به تغییر User Agent برای مشاهده وب سایت خواهید بود. یکی از کاربردهای این افزونه برای وب سایت های داینامیکی که برای موبایل و دسکتاپ نسخه های جداگانه ای طراحی می کنند می باشد:
در این لیست سعی کردم افزونه هایی با بیشترین کاربرد را خدمت دوستان معرفی کنم. افزونه های دیگری نیز وجود دارند مانند EditThisCookie و JSONView که در زمینه مشاهده و ویرایش کوکی ها و فایل های JSON کاربرد دارند. شما از چه ابزارهایی برای انجام طراحی های خود استفاده می کنید؟ توسینسو باشید.
بنیانگذار توسینسو و برنامه نویس و توسعه دهنده ارشد وب
حسین احمدی ، بنیانگذار TOSINSO ، توسعه دهنده وب و برنامه نویس ، بیش از 12 سال سابقه فعالیت حرفه ای در سطح کلان ، مشاور ، مدیر پروژه و مدرس نهادهای مالی و اعتباری ، تخصص در پلتفرم دات نت و زبان سی شارپ ، طراحی و توسعه وب ، امنیت نرم افزار ، تحلیل سیستم های اطلاعاتی و داده کاوی ...
زمان پاسخ گویی روز های شنبه الی چهارشنبه ساعت 9 الی 18
فقط به موضوعات مربوط به محصولات آموزشی و فروش پاسخ داده می شود