Thiết kế web responsive và 3 sai lầm hay gặp phải | Cộng Đồng GSM Việt Nam-Đồng Hành-Hỗ trợ-Thành Công

Trùm vật tư ép kính | Bệnh Viện Điện Thoại 24h | Linh Kiện Tín Thành | Đặt chữ quảng cáo | Đặt chữ quảng cáo | Trùm điện thoại cổ độc

Thiết kế web responsive và 3 sai lầm hay gặp phải

Thảo luận trong 'Các Sản phẩm ngoài lề' bắt đầu bởi ichiase24h, 20/4/16.

  1. ichiase24h

    • Thành Viên
    Gia đình Vietnamgsm
    Làm thành viên từ: 31/3/16
    Bài viết: 3
    Cảm ơn: 0
    Điểm: 0
    M:
    Vietnamgsm GOLD:
    Phương pháp thiết kế web responsive rất có ích cho các nhà phát triển vì chúng cho phép hiển thị các nội dung trên mọi thiết bị mà không cần duy trì các phiên bản riêng biệt của website. Ngoài ra, nó không có một sô hạn chế như thiết kế mở rộng (scaling layout) hay thiết kế “mềm” (fluid layout).
    Bài viết này đưa ra 3 sai lầm khi thiết kế web responsive, song song đưa ra những phương pháp để tránh những sai trái này.
    [​IMG]

    1. Thanh điều hướng

    Nếu bạn dùng một thanh điều hướng ở phía trên cùng của trang, một thiết kế responsive cần phải biểu lộ một cách chuẩn xác nó với một định dạng nhỏ hơn khi website được hiển thị trên một màn hình nhỏ. Điều này đôi khi không hoạt động như bạn mong muốn, bởi các các trình đơn trong menu không thể xếp thành các hàng đồng đều. Điều này thường xảy ra khi thiết kế web bán hàng với nhiều danh mục sản phẩm khác nhau.
    Có một số cách giải quyết vấn đề này. Đầu tiên là giảm thiểu các mục được hiển thị theo chiều ngang trên thanh điều hướng bằng cách phân loại chúng theo các chủ đề, sau đó có thể hiển thị theo cách thả xuống khi một chủ đề được chọn. Bên cạnh đó bạn cũng có thể dùng một menu ẩn, chỉ hiển thị các danh mục khi khách hàng muốn tìm kiếm.

    2. Biến dạng nhân tố
    Đây là trường hợp khi mà các nguyên tố bị đổi thay hệ thống phân cấp khi thiet ke web ban hang responsive. Điều này xảy ra khi các cột chưa được xử lý trở thành một hàng mới khi hiển thị. Đáng ngạc nhiên là cách giải quyết tình huống này vô cùng đơn giản, bạn chỉ cấp thiết lập chiều rộng, chiều cao và khoảng cách giữa các nguyên tố một cách rõ ràng. Nếu nó chuyển di ra khỏi vị trí và bao phủ lên các yếu tố khác. Bạn có thể khăng khăng nó tại nơi bạn muốn bằng cách để nó trong thẻ div và thiết lập lề.

    3. Dùng các bức ảnh với chiều rộng nhất mực
    Phần nội dung thường được thiết lập để có kích tấc tương đối so với màn hình. Nên chi, khi một hình ảnh được cố định chiều rộng lớn hơn so với kích tấc màn hình, hình ảnh này sẽ không thể hiển thị đầy đủ. Trường hợp này thường xảy ra với các banner khi thiết kế website thương mại điện tử. Bạn có thể tránh tình huống này bằng cách sử dụng các đơn vị can hệ để thiết lập chiều rộng của hình ảnh hoặc có thể sử dụng một framework để hỗ trợ như Bootstrap chẳng hạn.
     

    ****************Để giúp forum phát triển,anh em vui lòng share Facebook, Google+ ****************

Thành viên đang xem bài viết này (Thành viên: 0, Khách: 0)

X

Hỗ trợ kỹ thuât >> CHAT ngay !