რა არის საპასუხო დიზაინი? (ახსნა ვიდეო და ინფოგრაფიკა)

საპასუხო ვებ დიზაინი

ამას ათწლეული დასჭირდა საპასუხო ვებ დიზაინი (RWD) მას შემდეგ, რაც მეინსტრიმში გადავა პირველად კამერონ ადამსმა წარადგინა კონცეფცია. იდეა გენიალური იყო - რატომ არ შეგვიძლია შევქმნათ საიტები, რომლებიც მოერგება მოწყობილობის ხედვის სურათს, რომლის ნახვაც ხდება?

რა არის საპასუხო დიზაინი?

საპასუხო ვებდიზაინი (RWD) წარმოადგენს ვებდიზაინთან დაკავშირებულ მიდგომას, რომლის მიზანია საიტების შექმნა, ოპტიმალური ნახვის გამოცდილება - მარტივი კითხვა და ნავიგაცია მინიმალური ზომის შეცვლით, შეცვლით და გადახვევით - ფართო სპექტრის მოწყობილობებზე (მობილური ტელეფონებიდან დესკტოპის კომპიუტერი) მონიტორები). RWD– ით შექმნილი საიტი ადაპტირებს განლაგებას ნახვის გარემოში თხევადი, პროპორციაზე დაფუძნებული ქსელების, მოქნილი სურათების და CSS3 მედია მოთხოვნების გამოყენებით, @media წესის გაფართოება.

Wikipedia

სხვა სიტყვებით რომ ვთქვათ, სურათების მსგავსი ელემენტები შეიძლება მორგებული იყოს, ისევე როგორც ამ ელემენტების განლაგება. აქ მოცემულია ვიდეო, რომელიც განმარტავს რა არის საპასუხო დიზაინი, ასევე რატომ უნდა ახორციელებდეს მას თქვენი კომპანიები. ჩვენ ახლახანს განვავითარეთ DK New Media საიტი უნდა იყოს საპასუხო და ახლა ვმუშაობთ Martech Zone იგივე გააკეთოს!

საიტის რეაგირების მეთოდოლოგია ცოტა მოსაწყენია, რადგან თქვენ უნდა გქონდეთ იერარქია თქვენი სტილისთვის, რომელიც ორგანიზებულია ხედვის პორტის ზომის მიხედვით.

ბრაუზერები აცნობიერებენ თავიანთ ზომას, ამიტომ ისინი ატვირთავენ სტილის ფურცელს ზემოდან ქვევით, ეკითხებიან ეკრანის ზომის შესაბამის სტილებს. ეს არ ნიშნავს, რომ თქვენ უნდა შექმნათ სხვადასხვა სტილის ფურცლები თითოეული ზომის ეკრანისთვის, თქვენ უბრალოდ უნდა გადაიტანოთ საჭირო ელემენტები.

მობილური-პირველი მენტალიტეტით მუშაობა დღეს საბაზისო სტანდარტია. კლასის საუკეთესო ბრენდები ფიქრობენ არა მხოლოდ იმაზე, არის თუ არა მათი საიტი მობილური, არამედ მომხმარებლის სრული გამოცდილების შესახებ.

ლუსინდა დანკალფი, მონეტატის აღმასრულებელი დირექტორი

იხილეთ ინფოგრაფია Monetate- სგან, რომელიც ასახავს პოტენციურ სარგებელს მრავალი მოწყობილობისთვის ერთი საპასუხო დიზაინის შექმნისას:

საპასუხო ვებ – დიზაინის ინფოგრაფიკა

თუ გსურთ რეაგირებადი საიტის მოქმედებაში ნახოთ, მიუთითეთ თქვენი Google Chrome ბრაუზერი (მე მჯერა, რომ Firefox- ს იგივე თვისება აქვს) DK New Media. ახლა აირჩიეთ View> Developer> Developer Tools მენიუდან. ეს ბრაუზერის ბოლოში ჩაიტვირთება ინსტრუმენტების ჯგუფში. დეველოპერული ხელსაწყოების მენიუს ზოლის მარცხნივ, მარცხნივ, დააჭირეთ მობილურის პატარა ხატულას.

რეაგირების ტესტირება-ქრომი

შეგიძლიათ გამოიყენოთ ნავიგაციის პარამეტრები ზემოდან, რომ შეცვალოთ ხედი ლანდშაფტიდან პორტრეტზე, ან თუნდაც აირჩიოთ წინასწარ დაპროგრამებული ხედვის პორტის ზომის ნებისმიერი რაოდენობა. შეიძლება გვერდის გადატვირთვა მოგიწიოთ, მაგრამ ეს მსოფლიოში ყველაზე მაგარი იარაღია თქვენი რეაგირების პარამეტრების გადამოწმებისთვის და თქვენი საიტის ყველა მოწყობილობაზე შესანიშნავად უზრუნველსაყოფად!

3 კომენტარები

  1. 1

    ვებდიზაინი აღარ წარმოადგენს ვებ – მასტერების არჩევანს, ახლა მათთვის სავალდებულოა. გმადლობთ ამ ინფორმაციული პოსტის გაზიარებისთვის.

  2. 2

    დიდი მადლობა დუგლასს ამ კარგად განმარტებული სტატიისთვის. ამას უნდა დავეთანხმო, თუმცა შინაარსობრივი თვალსაზრისით. საიტების უმეტესობისთვის, ჩვენ ვქმნით საპასუხო განლაგებას, არ იქნება საკმარისი. ჩვენ გვჭირდება საპასუხო შინაარსი. უფრო მეტი ვებსაიტისთვის, ჩვენ დარწმუნებული ვიქნებით, გამოიყენოთ თქვენი კარგად დოკუმენტირებული სტატია, თუ როგორ უნდა მოგვარდეს ეს!

რას ფიქრობთ?

ეს საიტი იყენებს Akismet- ს, რათა შეამციროს სპამი. შეისწავლეთ თქვენი კომენტარის მონაცემები დამუშავებული.