محتوا
این مقاله اولین بار در شماره 229 مجله .net منتشر شد - پرفروش ترین مجله جهان برای طراحان و توسعه دهندگان وب.
یکی از مهمترین مواردی که می توانید هنگام تنظیم صفحه در HTML / CSS روی آن تمرکز کنید ، ریتم عمودی است - الگوی تصویری که بلوک های نوع یا خطوط نوع آن هنگام اسکن کردن صفحه ، به آن شکل می گیرند.
موارد دیگر می توانند در این ریتم تأثیر بگذارند مانند عناوین ، موارد لیست ، تصاویر و غیره. داشتن ریتم عمودی خوب از اهمیت بالایی برخوردار است زیرا به خوانایی و قابلیت اسکن صفحه (های) شما کمک می کند.
تعداد زیادی آموزش عالی (برای مثال اینجا و اینجا را ببینید) در وب وجود دارد که می توانید در مورد چگونگی دستیابی به ریتم عمودی مناسب با استفاده از سیستم های اندازه گیری ارتفاع و یادگیری اینکه چه چیزی نوع شما را "فاز" نگه دارد ، بیابید. به معنای.
سلسله مراتب
موارد اساسی که باید بسیار به آنها توجه کرد ، ارتفاع خط بین عناصر و سلسله مراتب بصری کلی صفحه است. تنظیم مناسب ارتفاع خط می تواند یک تمرین طراحی درگیر باشد اما تسلط بر آن مهم است. سلسله مراتب نیز از این جهت مهم است که تصاویر و عناصر متن باید از نظر بصری با یکدیگر هماهنگ باشند - مهمترین موارد معمولاً بزرگتر بوده و در صفحه اول قرار می گیرند.
طراحان چاپ سالها با ایده ریتم عمودی سر و کار داشته اند و تنها در گذشته اخیر بوده است که طراحان وب مجبور شده اند واقعاً وارد این موارد شوند. با افزایش روزافزون نیاز به ساخت وب سایت ها با استفاده از طرح بندی شبکه و توجه به پیاده سازی های پاسخگو برای قرار دادن چندین صفحه روی صفحه ، اکنون از منظر طراحی بصری اهمیت بیشتری دارد ، احتمالاً بیش از یک دیدگاه فنی.
پنج مثال برای بررسی
1. عناصر سبک تایپوگرافی این کتاب از رابرت برینگ هورست استانداردی برای مطالعه تایپوگرافی است. آن را بخوانید ، مصرف کنید ، هر طور که می توانید در مغز خود بریزید.
2. فرانک کیمرو گذشته از اینکه به طور کلی کاملاً شگفت انگیز است ، در طراحی مجدد اخیر وب سایت شخصی طراح Frank Chimero ریتم عمودی فوق العاده ای به نمایش گذاشته شده است. وقتی صفحه را به سمت پایین پیمایش می کنید ، از اثر اختلاف منظر برای کمک به حرکت ریتم به خانه استفاده می کند.
3. دن سدهرهلم برای مثال خوبی از ریتم عمودی تایپوگرافی عالی ، نگاهی به وبلاگ Dan Cederholm بیندازید. طول خط کپی و سرفصل ها کاملاً متناسب است.
4. آزمایشگاه تمرکز شرکت طراحی وب و مارک تجاری Focus Lab از سلسله مراتب برای کمک به برقراری ارتباط با مهمترین موارد برای بازدید کننده استفاده می کند.
5. تایپوفاندری وب سایت Typofonderie Typography Studio دارای ریتم عمودی عالی با تصاویر و متن خود است. فاصله بین عناصر در کل وب سایت متناسب است و سلسله مراتب بین تصویر اصلی و تصاویر / بخش های دوم کاملاً مناسب است.
10 نمونه شگفت انگیز از طراحی تجربی را در Creative Bloq کشف کنید.
