sisvietnamvn_01/sisvietnamvn_current/sisvietnam_components_analysis.md

Phân tích Cấu trúc Giao diện: sisvietnam.vn

Báo cáo chi tiết số lượng và loại thành phần giao diện (UI Components) đang được sử dụng trên trang web Bệnh viện Đa khoa Quốc tế S.I.S Cần Thơ (https://sisvietnam.vn/).

1. Bố cục khung (Layout Structure)

Trang web sử dụng hệ thống chia cột dạng Grid (khả năng cao là Bootstrap) để dàn trang.

• <header> (Đầu trang): 1 thẻ
• .header (Lớp giao diện đầu trang): 2 class
• <footer> (Chân trang): 1 thẻ
• .footer (Lớp giao diện chân trang): 21 class (Footer được chia làm rất nhiều cột nhỏ)
• <section> (Phân khu): 1 thẻ
• .container (Vỏ bọc nội dung): 18 class
• .row (Hàng): 15 class
• .col (Cột): 47 class

2. Các thành phần tương tác (UI Components)

• .slider & .carousel (Trình chiếu ảnh trượt): 13 class .slider và 5 class .carousel (Sử dụng thư viện Owl Carousel).
• <img> (Hình ảnh): 46 thẻ
• .banner (Biểu ngữ quảng cáo): 2 class
• .menu (Thanh điều hướng): 32 class
• <a> (Đường liên kết): 66 thẻ
• <ul> / <li> (Danh sách): 7 danh sách (<ul>) với 36 mục (<li>)
• .btn (Nút bấm): 10 class
• <form> (Biểu mẫu): 3 thẻ (Sử dụng plugin Contact Form 7)
• .widget (Khối tiện ích): 3 class
• <iframe> (Bản đồ / Nhúng ngoại vi): 1 thẻ

3. Phân tích kỹ thuật (Technical Tags)

• <div> (Thẻ khối cơ bản): 190 thẻ
• <h2> & <h3> (Thẻ tiêu đề): 3 thẻ <h2> và 7 thẻ <h3>
• <script> (Mã Javascript): 58 thẻ (Google Analytics, Tag Manager, Facebook Pixel...)
• <style> (CSS Nội tuyến): 10 thẻ

Tip

Đánh giá Kiến trúc: Trang web được xây dựng bằng WordPress, sử dụng hệ thống Grid để cấu trúc bố cục tĩnh, kết hợp với các Carousel/Slider để làm sinh động giao diện. Phần thu thập dữ liệu khách hàng được xử lý qua các Form. Nếu bạn dùng các công cụ như Pinegrow hoặc Webflow, kiến trúc này có thể dễ dàng sao chép bằng cách sử dụng cấu trúc Container -> Row -> Column.