چگونه کدنویسی کنیم تا در تمامی مرورگرها ظاهر سایت به شکل منظم و مرتب دیده شود؟ استفاده از گیت ها این قابلیت را برای شما فراهم می سازد.
چگونه کدنویسی کنیم تا در تمامی مرورگرها ظاهر سایت به شکل منظم و مرتب دیده شود؟ استفاده از گیت ها این قابلیت را برای شما فراهم می سازد.
برخی از وب سایت ها را وقتی با مرورگرهای مختلف بررسی می کنیم ظاهرشان یکسان نیست. مثلا در گوگل کروم وبسایت فوق العاده عالی است اما در موزیلا بهم ریخته می شود چرا؟
ما قبلا در رابطه با Cross Browser توضیح داده بودیم که چی هست و کارش چیه اما در این مقاله می خواهیم تخصصی تر نگاه کنیم.
یکی از دلایل بهم ریختگی سایت ها ناهماهنگی کدهای سی اس اس با مرورگر می باشد. یعنی در کدنویسی طراح سایت به این نکته توجه نکرده است یا سینتکس های لازم در رابطه با استانداردهای آن کد را برای مرورگرهای مختلف مطالعه نکرده است به همین دلیل این مشکل ایجاد شده.
برای مثال اگر بخواهید از کد Flex در سایت خود استفاده کنید باید بدانید چه نسخه ای از مرورگر ها از این کد پشتیبانی می کنند.
برای نسخه هایی که از آن پشتیبانی نمی شود چکار باید کرد؟ پس بزارید قدم به قدم پیش بریم
برای جواب به این پرسش یکی از سایت های مطرح در این زمینه w3schools است. شما پس از ورود به این سایت کد مورد نظر را در قسمت جستجو وارد می کنید و مشاهده می نماید نسخه چه مرورگرهایی از کد پشتیبانی می کند.
سوال بعدی
گیت هایی وجود دارد که برای هر مرورگر تعریف شده و با استفاده از آنها شما می توانید آن کد را برای مرورگر خاص بهینه کنید. گیت ها به شرح زیر است :
-webkit- <!-- for Webkit browsers (chrome, Safari) --> -moz- <!-- for FireFox --> -o- <!-- for Opera --> -ms- <!-- for Internet Explorer -->
همانطور که در بالا مشاهده می کنید هر کدام از گیت ها برای استفاده در مرورگر های خاص می باشد که ابتدا و انتهای آنها دش قرار گرفته است.
مثال :
در زیر می خواهیم کدی بنویسیم که بکگراند را گردینت بکند یعنی مثلا از سمت راست یک رنگ به سمت چپ تغییر کند.
background-image: linear-gradient(right, #000, #FFF);
در حالت عادی کد به شکل فوق نوشته می شود اما برای نمایش در اینترنت اکسپلورر و اوپرا باید کدهای زیر را هم به کد بالا اضافه کرد.
background-image: -ms-linear-gradient(right, #000, #FFF); background-image: -o-linear-gradient(right, #000, #FFF);
برای بررسی کدها می توانید از ویرایشگر آنلاین ایتروز استفاده نماید.
منبع » آکادمی ایتروز
آیا AEO جایگزین SEO می‌شود؟ با تحلیل حرف سم آلتمن و بررسی روند جستجو در آینده، پاسخ این سؤال را در مقاله‌ای کامل و سئو شده بخوانید.
AEO چیست و چرا آینده سئو به آن وابسته است؟ در این مقاله به صورت کامل و کاربردی با مفهوم بهینه‌سازی برای موتورهای پاسخ‌گو آشنا شوید.
بررسی مهم ترین نکات سئو در جدیدترین الگوریتم گوگل 2025 RankBrain، BERT و Helpful Content Update
نحوه گرفتن بک لینک توسط گوگل آلرتس یا google alerts روش 2020 برای دریافت پیوندهای جدید که در سئو سایت شما بسیار موثر است.
AEO چیست و چرا آینده سئو به آن وابسته است؟ در این مقاله به صورت کامل و کاربردی با مفهوم بهینه‌سازی برای موتورهای پاسخ‌گو آشنا شوید.
هوش مصنوعی چگونه تصمیم می‌گیرد؟ نگاهی جامع و جذاب به مدل‌های یادگیری ماشین و نحوه عملکرد آنها در دنیای واقعی برای عموم مردم.
وقتی صحبت از خلاقیت هست دقیقا راجب sora صحبت می کنیم یا ChatGPT ؟ پس برای درک بهتر بهتره مقایسه کنیم.
بررسی کامل برای درک موضوع متاورس چیست؟ موضوع مهم این روزها که ما آن را از تمامی زوایا بررسی می نمایم.
نظرات (0)