طراحی - CSS

بررسی واحدهای REM -EM – VH- VW و تفاوت بین آنها

برای مدت های طولانی طراحان و توسعه دهندگان وب سایت ها برای اندازه گذاری فونت، حاشیه و یا هر عنصر دیگری از واحد px که نشان دهنده پیکسل بود استفاده می کردند. اما امروزه با توجه به گسترش استفاده از دستگاه های مختلف مانند موبایل و تبلت برای نمایش وب سایت ها لزوم استفاده از واحدهایی که کنترل بیشتری به توسعه دهنده و طراح بدهد بیشتر شد. از این رو واحدهای rem و em تقریبا جای واحد px را گرفت.

css-custom-property
طراحی - CSS

تعریف و استفاده از متغیرها در CSS

مانند سایر زبان های برنامه نویسی که از متغیر ها برای نگهداری مقداری استفاده می شود که بتوان بعدا در هر زمان به آن مراجعه کرد، در سی اس اس هم برای نگهداری و یا ذخیره سازی مواردی مانند رنگ ها، نام فونت، اندازه فونت و … استفاده می شود و می توان در جاهای مختلف فایل سی اس اس آن را صدا کرد و از مقدار آن استفاده کرد. اسم رسمی و صحیح این متغیرها custom properties می باشد که معمولا در بین توسعه دهندگان و برنامه نویسان به نام متغیر جا افتاده است.

نصب و استفاده از npm
طراحی - CSS

نصب و استفاده از NPM

NPM مخفف Node Package Manager است. یک پکیج منیجر یا مدیریت پکیجی است که برای NodeJs نوشته شده است. (npm قسمتی از پلتفرم NodeJs است) البته این به معنای آن نیست که حتما باید در پروژه هایی که با NodeJs نوشته می شوند از NPM استفاده کرد بلکه در خیلی از موارد دیگر هم می شود از آن استفاده کرد. اجرای دستورات NPM از طریق خط فرمان (Command line) صورت می گیرد. دانستن ان پی ام به تنهایی کاربردی ندارد اما پیش نیاز خیلی از تکنولوژی های دیگر وب است.

طراحی - CSS

چرا و چگونه باید از Microdata در HTML5 استفاده کنیم

توسط microdata دقیقا مشخص می کنیم که محتوای سایتمان چی هست. موتورهای جستجو دقیقا متوجه می شوند که سایت ما چه اطلاعاتی دارد. آیا کتاب معرفی کرده یا فیلم یا هر چیزی دیگری که باشد برای ماشین ها و موتورهای جستجو کاملا قابل فهم می شود. توسط مایکرودیتا (microdata) دقیقا نوع محتوا را مشخص می کنیم نه فقط شکل و شمایل نمایش آن را.

عمومی

نسخه بندی معنادار

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

وسط چین کردن عناصر html
طراحی - CSS

مرکز قرار دادن المنت ها با استفاده از CSS

معمولا وسط چین کردن (centralize) المنت های اچ تی ام ال برای خیلی از طراحان وب سایت کار ساده ای نیست و طراحان وب سایت ها از اینکه از چه روشی استفاده کنند سردرگم می شوند. من سعی می کنم تمام روش های معمول و استانداردی که برای وسط چین کردن استفاده می شود را همراه با مثال توضیح دهم. برای اینکه بهتر متوجه فرایند کار شوید پیشنهاد می کنم مثال هایی که زده شده است را خودتون تست کنید تست کنید تا درک کاملی از روند کار داشته باشید.

user agent stylesheet
طراحی - CSS

User Agent Style Sheet چیست؟

user agent style sheet به معنای استایل (style) پیشفرض (default) است. مرورگرها استایل پیشفرض خودشان را به عناصر یا المنت های html می دهند. برای مثال اندازه فونت (font-size) تگ h2 از تگ p بیشتر است. این استایل های پیشفرض که مرورگر به تگ های اچ تی ام ال می دهند از کمترین اهمیت برخوردا هستند، بنابراین به راحتی توسط استایلی که طراح صفحه می نویسد جایگزین می شوند.