Người khiếm thị và sổ tay hướng dẫn thiết kế website: Phần 1

Nội dung tài liệu là một tài liệu hướng dẫn cụ thể và sinh động phục vụ cho những người lập trình và quản trị web có mong muốn xây dựng website cho người khiếm thị. tài liệu gồm 5 chương, phần 1 tài liệu với 2 nội dung chính nhằm tìm hiểu về: Website dành cho người khiếm thị cần những gì, mô hình phát triển website dễ tiếp cận cho người khiếm thị Việt Nam. Mời các bạn cùng tìm hiểu.

HƯỚNG DẪN THIẾT KÊ WEBSITE CHO NGƯỜI KHIẾM THỊ NGUYÊN 3C LIỆU v ũ THỊ HƯƠNG GIANG NGUYỄN THỊ THU TRANG HƯỚNG DẪN THIẾT KÉ WEBSITE CHO NGƯỜI KHIẾM THỊ ■ ĐẠI HỌCTHẢĨNG: TEUNG TẨMHOC NHÀ XUÁT BẢN BÁCH KHOA HÀ NỘI Mã số: 3454 - 2015/CXBIPH/04 - 85/BKHN Biên mục xuất phẩm Thư viện Quốc gia Việt Nam Vũ Thị Hương Giang Hướng dẫn thiết kế website cho người khiếm thị / Vũ Thị Hương Giang, Nguyễn Thi Thu Trang - H : Rách khoa Hà Nội, 2015 - 184tr : bảng, hình vẽ ; 24cm Thư mục: te 181 ISBN: 978-604-938-730-2 niiẠQ, títMUirỊ Thiết kế Website Người khiếm thị 006.70871 -dc23 BKM 0010p-CIP LỜI TỰA “Sống đời sống, cần có lịng" Cuốn sách khơng chi tài liệu khoa học mà mong muốn chia sẻ, cảm thông người tạo lập với cộng đồng người khiếm thị Việt Nam Cuốn sách sản phẩm chuỗi sản phẩm mà người tạo lập thực dành cho người khiếm thị (người mù, người mù màu, người thị lực kém) Nội dung sách tài liệu hướng dẫn cụ thể sinh động phục vụ cho người lập trình quản trị web có mong muốn xây dựng website cho người khiếm thị Các người tạo lập trình bày chi tiết đặc trưng website dễ tiếp cận, chi yếu tố ữong thiết kế làm cho người khiếm thị gặp khó khăn q trình tiếp cận Từ người tạo lập định hướng tạo lập website dựa chuẩn Luật Công nghệ thông tin Việt Nam, Luật Người khuyết tật Việt Nam, luật giới, tiêu chuẩn xây dựng, đánh giá, hướng dẫn khuyến nghị Cuốn sách mơ hình thiết kế nội dung web dễ tiếp cận dành cho người khiếm thị ứng dụng thực tiễn, đồng thời chi số quy trình thiết kế/thiét kế lại web site cách hiệu quả, cơng cụ tiện ích chun dụng cho cơng việc Có thể nói tài liệu hướng dẫn đầy đủ, chi tiết, mạch lạc dễ sử dụng Các người tạo lập hy vọng sách đông đảo độc già tiếp nhận, ủng hộ đóng góp thêm ý kiến để lần xuất bàn sau hồn thiện hơn, góp phần vào mục đích chung chia sẻ, cảm thơng với cộng đồng người khiếm thị Việt Nam, giúp họ kịp bắt nhịp với phát triển xã hội, phát huy đuợc tiềm vai trị hịa đồng với sống Đỗ Văn Uy Trường Đại học Bách khoa Hà Nội MỤC LỤC LỜI TỰ A CHƯƠNG M Ở Đ À U 1.1 THÉ NÀO LẢ w e b s it e d ể t i ế p c n ? 1.1.1 Dễ tiếp thu (Perceivable) 1.1.2 Dễ thao tác (O perable) 1.1.3 Dẽ hiểu (Understandable) 10 1.1.4 Vững (Robust) 11 1.2 NHỮNG ĐỐI TƯỢNG NÀO HƯỞNG LỢI TỪ CÂC WEBSITE DẼ TIÉP CẠN? 11 1.2.1 Người khuyết tật 11 1.2.2 Người khiém thị 12 1.2.3 Người cao tuổi 13 1.2.4 Người dùng phổ thông 14 1.3 NGƯỜI KHIÉM THỊ VIỆT NAM TIẾP CẬN VÀ s DỤNG THÔNG TIN NHƯ THẾ N À O ? 14 1.3.1 Nguòn tin .14 Đ ọ c! 16 1.3.3 Nghe 17 1.4 CẢC YÉU T ố LÀM CÂC WEBSITE TRỞ NÊN KHỐ TIÉP CẬN VỚI NGƯỜI KHIÉM TH|? 19 1.4.1 Người dùng công cụ hỗ trợ 21 1.4.2 Nhà phát triển web công cụ hỗ trợ 24 1.4.3 Nội đung w e b 28 1.5 THÉ NÀO la w e b s it e d ể TIÉP c ặ n v i n g i k h iê m t h i ? 30 1.6 CÀN ĐẢM BẢO TiNH DẼ TIÉP CẬN CHO CÂC THÀNH PHẢN NÀO CỦA W EBSITE? 32 1.6.1 Nội dung 32 1.6.2 Két xuất nội dung 37 1.6.3 Điều hướng 38 1.6.4 Hỗ trợ tương tác 40 1.7 MUỐN ĐẢM BẢO TÍNH DẼ TIÊP CẠN CHO WEBSITE, THI ÉT KÊ VIỂN VÀ LẠP TRlNH VIÊN PHẢI LÀM G l? 42 1.7.1 Phát lỗi khó tiếp cận 42 1.7.2 Ngăn chặn lỗi khó tiếp cận 43 1.7.3 Phục hồi tinh dẻ tiép c ậ n 43 1.8 ĐẢM BẢO TlNH DỂ TIẾP CẠN CHO CẢC WEBSITE Ở NHỮNG CA p Đ ộ NÀO? 44 1.8.1 Luật, tiêu chuản, sách; hướng dẫn 45 1.8.2 Kỹ thuật, công nghệ 51 1.8.3 Giải pháp đặc thù cho website 58 1.9 TRIỂN KHAI CÁC GIẢI PHẢP ĐẢM BẢO TÍNH DẼ TIẾP CẠN CHO CẢC W EBSITE VÀO THỜI ĐIÉM NÀO? 58 1.10 TẠI SAO CẢN q u a n t â m đ é n t Ic h h ợ p D|CH v ụ k h i x â y d ự n g w e b s it e DỂ TIẾP CẠN CHO NGƯỜI KHIẾM TH|? 59 1.10.1 Dịch v ụ 59 1.10.2 Phân loại dịch vụ .61 1.10.3 Tlch hợp dịch v ụ 63 1.10.4 Tlch hợp dịch vụ hướng đối tượng sử dụng 65 CHƯƠNG MƠ HÌNH PHÁT TRIỂN WEBSITE DẺ TIẾP CẬN CHO NGƯỜI KHIẾM THỊ VIỆT N A M 67 2.1 QUY TRlNH PHÁT T R IÊ N 67 2.1.1 Phát triển từ đàu website 67 2.1.2 Cải tạo website cố 69 2.2 M ô HlNH THIÉT LẬP YÊU CẢU DÊ TIÉP CẠN 71 2.2.1 Yêu cầu vè kết xuát nội dung 71 2.2.2 Yẽu cầu nội dung 71 2.2.3 Yêu cầu vè đièu hirớng 72 2.2.4 Yêu cầu hỗ trợ tương tác 73 2.3 MƠ HlNH ĐẢM BẢO TÍNH DỂ TIẾP CẬN 75 2.3.1 Mô tả 75 2.3.2 Áp dụng 77 2.3.3 Mău thlét ké kết xuất nội dung 78 2.3.4 Mẫu thiết ké điều hướng 83 2.3.5 Mẫu thiét ké hỗ trợ tương tác 89 2.3.6 Kiểm tra ttnh dẻ tiép cận 92 2.4 Mô HlNH TlCH HỢP D|CH vụ CHO NGƯỜI KHIẾM T H | 92 2.4.1 Mô tả mô hlnh 92 2.4.2 Kiến trúc cài đặt dịch vụ hỗ trợ người khiếm thi 93 2.4.3 Mẫu thiết kế dịch vụ hỗ trợ người khiếm th ị 95 CHƯƠNG CÁC TIÊU CHÍ DẺ TIẾP CẶN CHO NỌ l DUNG VÀ KẾT XUÁT NỘI D U N G 98 3.1 NỘI D U N G 98 3.1.1 Văn thay thé cho nội dung phi văn b ản 98 3.1.2 Các từ không thông dụng .105 3.1.3 Viết tắ t 106 3.1.4 Ảnh văn b ản .108 3.1.5 Tiêu đè n hân 111 3.1.6 Tiêu đề cho phàn 112 3.1.7 Trinh tự nội dung có nghĩa 114 3.1.8 Mục đích liên két (trong ngữ cảnh) 115 3.1.9 Mục đfch liên két (chl có liên két) 118 3.2 KẾT XUÁT NỘI D U N G 120 3.2.1 Ngôn ngữ trang 120 3.2.2 Ngôn ngữ cùa phần 122 3.2.3 Đièu khiển âm 124 3.2.4 Sử dụng màu sắc 125 3.2.5 Độ tương phản tối thiểu 128 3.2.6 Độ tương phản tăng cường 130 3.2.7 Thay đổi klch thước văn b ản 132 3.2.8 Biểu diễn trực quan 135 3.2.9 Có thể phân tlch .138 3.2.10 Tên, vai trò, giá tri 140 CHƯƠNG CÁC TIÊU CHÍ DẺ TIẾP CẬN CHO ĐIÈU HƯỚNG VÀ TƯƠNG T Á C 142 4.1 ĐIÊU HƯỚ NG 142 4.1.1 Dẻ truy cập bàn phim 142 4.1.2 Bàn phim không bj mắc k ẹ t 145 4.1.3 Bò qua khối 146 4.1.4 Trang web có nhan đ ề .148 4.1.5 Trình tự focus .149 4.1.6 Nhièu cách định vị .152 4.1.7 Focus cố thể nhln tháy .154 4.1.8 Khi focus 155 4.1.9 Khi nhập liệu .156 4.1.10 Điều hướng quán 158 4.2 H ỗ TRỢ TƯƠNG T Á C 159 4.2.1 Thông tin, cáu trúc quan h ệ 159 4.2.2 Có thể đièu chinh thời gian 162 4.2.3 Không giới hạn thời gian 165 4.2.4 Gián đoạn 166 4.2.5 Xác thực lạ i 167 Nhận diộn lỗ i 169 4.2.7 Nhăn d ẫ n 171 4.2.8 Gợi ý lỗ i .172 4.2.9 Ngăn lỗ i .174 4.2.10 Trợ giúp 176 CHƯƠNG KÉT L U Ậ N 177 TÀI LIỆU THAM K H Ả O .181 CHỈ M ỤC 182 Chương MỞ ĐẦU Chương tổng hợp kiến thức tính dễ tiếp cận website, đồng thời giải đáp số băn khoăn người thiết kế lập trình web xây dựng website phục vụ người khiếm thị (people with visual impairments) 1.1 Thế website dễ tiếp cận? World W ide Web (WWW, hay đơn giản Web) từ lâu trở thành phần thiếu đời sống xã hội Web trở thành thứ mà người muốn tiếp cận phải sử dụng chứa yếu tố quan trọng đương thời: thông tin M ôt website đuợc coi dễ tiếp cân khơng tao bắt rào cán cho moi người dùng moi bối cảnh sử dung Mọi người dùng (không phân biệt tuổi tác, lực hành vi, trình độ, kinh nghiệm, nhận thức) nhận biết, hiểu, truy cập, khai thác, tương tác đóng góp thông tin dịch vụ trực tuyến dễ dàng hiệu Website dễ tiếp cận thiết kế để đáp ứng yêu cầu đa dạng từ người dùng, phù hợp với mức ưu tiên sử dụng khác nhau, môi trường tương tác khác (ví dụ: trình duyệt cấu hình trinh duyệt khác nhau, thiết bị vào khác nhau, hệ điều hành khác nhau) Thco ISO 4050Q;2012 (1), inôl website dưuc coi lả dễ liếp cân néu nơi dung web (web content) cung cắp đươc thiết kế xây dựng dua nguyên tấc: dễ tiếp thu, dễ hiếu, dễ thao tác vững Mỗi nguyên tắc gồm nhiều hướng dẫn, hướng dẫn lại gồm nhiều tiêu chí thành cơng Đi kèm theo tiêu chí thành cơng tập kỹ thuật khuyến cáo áp dụng Tổng cộng có ngun tắc, 12 hướng dẫn, 61 tiêu chí thành cơng 499 kỹ thuật Khái niệm nội dung web tham chiếu đến tất thành phần website, bao gồm nội dung văn bản, mẫu biểu, bảng, nội dung đa phương tiện, dịch vụ mà cung cấp hay tích hợp, viết ngơn ngữ lập trình phía server, mã mơ tả kịch (scripts) hay mã đánh dấu (markup code) 1.1.1 Dễ tiếp thu (Perceivable) Thông tin thành phần giao diện website phải đưa cho người dùng theo cách mà họ tiếp thu Tức là, website cần thiết kế cho: (i) có văn thay thế, (ii) có lựa chọn khác để tiếp thu nội dung media (iii) dễ thích nghi, (iii) dễ phân biệt a) Có văn thay Tất nội dung phi văn cần có văn thay Nội dung phi văn phần tử điều khiển tương tác nút bấm hay ô nhập liệu, CAPTCHA, nội dung có thời lượng âm thanh, V V Các văn thay phải dễ dàng chuyển đổi thành dạng người dùng cần, chẳng hạn in khổ lớn, chữ nổi, giọng nói, biểu tượng ngơn ngừ đơn giản b) Có lựa chọn khác để tiếp thu nội dung có thời lượng Cần cho phép người dùng lựa chọn nội dung thay cho nội dung có thịi lượng (tim e-based media) âm thanh, phim ảnh, nội dung trình chiếu v.v Ví dụ, với phim có đầy đủ hình ảnh, âm thanh, lời thoại tiếng Anh, nội dung thay chi gồm toàn âm phần lồng tiếng Việt; tồn phần hình ảnh kèm theo phụ đề tiếng Việt; nội dung phim ban đầu kèm theo phần thuyết minh cử chi c) Dễ thích nghi Các nội dung trình bày theo nhiều cách khác mà không làm thông tin, không làm thay đổi cấu trúc Bằng cách này, người dùng nắm bắt dạng nội dung khác qua nhiều kênh khác (thị giác, thính giác (auditory) ) Các cơng cụ trợ giúp tự động xác định cấu trúc, thông tin - với nội dung mã hóa d) Dễ phân biệt Người dùng dễ dàng phân biệt mắt tai nội dung (foreground) nội dung (background) website Với biểu diễn trực quan, cần phải đảm bảo thông tin biểu diễn đủ tương HOME I TIN TỨC I BÁO C Ể N TƠ I SÁCH NÓI v è Báo Vặ T h ỏ o g T m N g đ i D ù n g I DIẾN V M i I Ttl*H NGƯYỀN VTỂN I T * ợ CtUP I s r r t MAP ị J T I I I T h ỏ a T h u i n v ẽ D ịch Vụ C o p y rig h t 0 b y T am H onV i^tN am n e t Hình 2-7: Ví dụ phàn chân trang c) Hiệu ứng trực quan Việc thiết kế giao diện cho người khiếm thị khơng địi hỏi q nhiều kỹ thuật đồ họa, chủ yếu cần theo nguyên tắc sau: - Đảm bảo tính quán việc xếp nội dung trang Ví dụ: nội dung có mục đích phải thiết kế mẫu hiệu ứng trực quan - Đảm bảo màu sắc độ tương phản hợp lý Sự kết hợp màu màu chữ phải có độ tương phản rõ ràng để hỗ trợ người khiếm thị màu sắc dễ dàng nhận biết Khuyến khích tích hợp công cụ cho phép thay đổi màu tạo tương phản màu - Có thể sử dụng dải màu khác để thiết kế - Có hiệu ứng nhấn mạnh để xác định nội dung - Chi tạo cửa sổ popup có hiệu lệnh từ phía người dùng - Chi lề phải - Các phần tử giao diện khai báo chuẩn HTML 2.3.4 Mẫu thiết ké điều hướng a) Mô tả liên kết Tại hất kỳ trang thơng tin cần có đường liên két đến Trang chủ, mục Giới thiệu/Liên hệ, đồ website Sử dụng thuộc tính tiêu đề để cung cấp thông tin bổ sung giúp làm rõ miêu tả cụ thể mục đích liên kết b) Hướng dẫn điều hướng nhanh Cung cấp hướng dẫn sử dụng chỗ cho tất dịch vụ website cung cấp Kỹ thuật đom giản xây dựng triển khai nội dung web, nhúng vào tất trang web website, hai dạng dễ tiếp cận với NK.T: văn âm thanh, hướng tới mục đích có nội dung huớng dẫn người dùng 83 THƯ \ n Trong kỹ thuật này, đặc biệt cần đến thành phần văn âm thanh, với lý sau: • Phần văn dễ tạo, dễ sửa đổi, chuyển thành dạng tiếng nói tổng hợp với ứợ giúp đọc tiếng Việt • Phần âm có chi phí cao hơn, phải cơng thu âm, biên tập, có chất lượng tiếng nói chuẩn, tiếng nói tự nhiên Hơn nữa, người dùng cỏ thể sử dụng phím tắt bật, tắt, tua hướng dẫn tiếng nói Nội dung hướng dẫn điều hướng nhanh cho trang web bao gồm ba phần chính: i Giới thiệu chung trang web đó: Khơng phải giới thiệu tính trang web, mà cần trang web gì, cung cấp thơng tin cho người sử dụng ii Các tính thực trang web đó, cách thức ngắn gọn để thực tính đó: Gạch đầu dịng ngắn gọn tính Với tính năng, trình bày ngắn gọn bước để thực tính đó, ý kết hợp phím tắt JAWS với phím tắt website mô tả hướng dẫn iii Để xem hướng dẫn sử dụng chi tiết, nhấn phím vào đâu Cần liên hệ với có thắc mắc sử dụng tính trang web (email, điện thoại) Khi phát triển nội dung hướng dẫn điều hướng nhanh, cần ý đến công cụ mà người khiếm thị sử dụng trình thao tác với website (đã xác định phần thiết lập yêu cầu dễ tiép cận) Người phát triển cần giả lập môi trường người khiếm thị tiếp cận khai thác thông tin website để đưa cách hỗ trợ điều hướng phù hợp Ví dụ, cài đặt trình đọc hình JAWS trước thiết kế hỗ trợ điều hướng Sau mô tả nháp cho bước để thực tính đó, cần dùng công cụ hỗ trợ thử nghiệm lại - hồn tồn khơng sử dụng chuột khơng định vị mắt q trình Sau thiết kế hỗ trợ điều hướng chi tiết cho số tính nàng phổ dụng ừên website 84 L Đối vói loại tính xem thơng tin trang web Cần xác định thông tin cung cấp cho người dùng xem thể dạng (thẻ HTML) Có thể sử dụng add-on Firefox (Firebug, Web Developer) để xem xét cho kỹ càng, cẩn thận, tránh sai sót Nghiên cứu cách thức đom giản để đưa hướng dẫn, cách thức truy cập thông tin trang web iù Đối với loại tính tìm kiếm thơng tin trang web Cần có hướng dẫn cho người sử dụng cách thức ngắn đối Chú ý mơ tả số nhập điều kiện tìm kiếm cần (với nhập cần đặc biệt ý cần giải thích thêm, thơng thường khơng cần có giải thích text tương ứng với nhập điều kiện tìm kiếm) Nếu trang web chi có liên kết đến tính tìm kiếm chi tiết, cần hướng dẫn cách đến tính tìm kiếm chi tiết Khơng cần mơ tả bước tìm kiếm chi tiết (vì trang khác rồi, có định hướng vắn tắt riêng) iii Đối với loại tỉnh nhập liệu, cập nhật thơng tin trang web Có thể mơ tả số ô nhập liệu cần (với ô nhập liệu cần đặc biệt ý cần giải thích thêm, thơng thường khơng cần có giải thích text tương ứng với ô nhập liệu) Mô tả ngắn gọn, dễ hiểu chủ yếu sử dụng phím E JAWS, Tab, Shift+Tab để di chuyển ô nhập liệu Enter để thực cập nhật thông tin Có thể mơ tả thêm phần gây lỗi cần iv Các vi dụ minh họa Các ví dụ xây dựng truờng hợp người khiếm thị sử dụng trình đọc hình JAWS Trước hết cần nói qua phím tắt thơng dụng JAWS người khiếm thị sử dụng để điều hướng Để vào quản lý phím điều hướng nhanh (Navigation Quick Key manager), thực bước sau: • Nhấn Insert + F2 để IĨ1Ở danh sách quản lý JAWS; 85 • Nhấn N tìm đến Navigation Quick Keys danh sách quản lý; • Nhấn Enter để mở hộp thoại Navigation Quick Keys Dưới số phím tắt JAWS NKT sử dụng phổ biến trình truy cập khai thác thơng tin website để điều khiển ừỏ JAWS (sau mở hộp thoại Navigation Quick Keys), cần ý trỏ JAWS khơng trùng khớp với trỏ xuất hình người sáng mắt Khi chọn đối tượng Navigation Quick Keys, cần nhấn Enter để lựa chọn đối tượng • u (Unvisited Link): Truy cập vào tất liên kết () chưa vào trang web Sau cỏ thể nhấn Ư liên tục để đến liên kết tiếp theo, nhấn chữ tên liên kết cần truy cập • V (Visited Link): Truy cập vào tất liên kết () vào trang web Sau nhấn V liên tục để đến liên kết tiếp theo, nhấn chữ tên liên kết cần truy cập • Insert + F7: Truy cập vào tất liên kết () có trang web Sau nhấn chữ tên liên kết cần truy cập • L (List): Truy cập vào tất danh sách (

) trang web Sau nhấn L liên tục để đến danh sách tiếp theo, nhấn chữ tên danh sách cần truy cập • H (Heading): Truy cập vào tất tiêu đề ( < h2> ) trang web Sau nhấn H liên tục để đến tiêu đề tiếp theo, nhấn chữ tên tiêu đề cần truy cập • 1, 2, 3, 4, 5, 6: Khi nhấn vào số, trỏ JAWS di chuyền đến tiêu đề tương ứng Ví dụ nhấn số 1, NKT truy cập vào tất tiêu đề mức () trang web • T (Table): Truy cập vào tất cà bảng () trang web Sau có nhấn T liên tục để đến bảng tiếp theo, nhấn chữ tên bảng cần truy cập Khi vào bảng, dùng mũi tên lên xuống để truy cập liệu bảng, đùng phím tắt u , V Insert + F7 để truy cập liên kết có bảng • N (Non Link Text): Đi vào nội dung văn liên kết (thường phần nhiều chữ, chứa liệu) có ừên website Sau có 86 nhấn N liên tục để đến văn tiếp theo, nhấn chữ văn cần truy cập Chi tiết phím tắt khác, tham khảo trên: http://doccenter.freedomscientific.com/doccenter/archives/training/jawskeys trokes.htm Ví dụ 1: Hướng dẫn điều hướng nhanh cho trang chủ web tin tức i Đây trang chủ cung cấp tin tức nhất, đặc biệt hướng tới hữu ích cho người khiếm thị ii Các tính trang web: Xem danh sách chuyên mục, Xem danh sách tin tức Tìm kiếm tin tức Các phím tắt cùa JAWS chi có hiệu lực bạn mờ Navigation Quick Keys JAWS o Để xem danh sách chun mục, nhấn phím L Sau đó, dùng mũi tên để di chuyển nghe chuyên mục danh sách, o Để xem danh sách tin tức nhất, nhấn H để vào tiêu đề Thơng tin kiện Sau đó, nhấn Insert + F7 để vào liên kết tương ứng với tin tức xếp từ xuống dưới, o Để tìm kiếm tin tức, nhấn phím E gõ Enter Sau gõ tót khóa cần tìm kiếm gõ Enter Đe vào kết tìm kiếm, thực thao tác giống tính Xem danh sách tin tức nhất, o Để tìm kiếm tin tức chi tiết, nhấn Insert + F7 (hoặc Ư bạn chưa vào chức bao giờ) Sau nhấn T tìm đến liên kết Tìm kiếm chi tiết, gõ Enter iii Để xem chi tiết hướng dẫn sử dụng cho trang web, nhắn vào Neu thật cần thiết, bạn cỏ thể liên hệ với Nguyễn Văn X, email điện th o i Ví dụ 2: Hướng dẫn điều hướng nhanh cho trang Tìm kiếm chi i tiết Đây trang tìm kiếm tin tức người khiếm thị với nhiều tiêu chí tìm kiếm 87 ii Các tính trang web: Xem danh sách chivên mục, Tìm kiếm chi tiết Các phím tắt JAWS có h:ệj lực bạn mở Navigation Quick Keys JAWS, o Để xem danh sách chuyên mục, nhấn phím L Sau đó, dùng mũi tên để di chuyển nghe ciuyên mục danh sách, o Để tìm kiếm chi tiết: Mặc định trỏ chờ nhập điều kiện tìm kiếm đầu tiên, chưa thấy bạn tứấn phím E gõ Enter Nhập nội dung cho nhập điềi kiện tìm kiếm cần thiết, sử dụng Tab để di chuyển đến C nhập Shift+Tab để di chuyền đến ô nhập liệu trước Gõ Enter tab đến nút “Tim kiếm " để tìm kiếm Đẻ vào kết tìm kiếm, nhấn Insert + F7 để vào CIC liên kết tương ứng với tin tức tìm thấy giống nlất với tiêu chí tìm kiếm xếp từ xuống iv Để xem chi tiết hướng dẫn sử dụng cho trang web nhắn vào Nếu thật cần thiết, bạn liên hệ với Nguyẵn Văn X, e m a i l điện th o i Ví dụ 3: Với trang Gửi viết, xây dựng Định hưcng vắn tắt sau: i Đây trang gừi viết lên mục Tin tức người tđiiếm thị, viết biên tập xuất lên website kâ quà tốt ii Các tính trang web: Xem danh sách chuyêr mục, Gửi viết Các phím tắt JAWS chi có hiệu lực )ạn mở N avigation Quick K eys JAW S o Để xem danh sách chuyên mục, nhấn phím L Sau đó, dùng mũi tên để di chuyển nghe chiyên mục danh sách, o Để gửi viết: • 88 Mặc định trỏ chờ ô nhập liệu đầi tiên, chưa thấy bạn nhấn phím E gõ Enter Nhậ) nội dung cho ô nhập liệu cần thiết, sử dụng Tab để di chuyển đến ô nhập Shifì+Tab để di chivển đến nhập liệu trước đỏ ■ Gõ Enter (không ô nhập Nội dung viết) tab đến nút "Gửi viết” để gửi viết Để vào kết tìm kiếm, nhấn Insert + F7 để vào liên kết tương ứng với tin tức tìm thấy giống với tiêu chí tìm kiếm xếp từ xuống ■ Nếu hệ thống thơng báo có lỗi sau gửi thông tin, bạn đọc kỹ thông báo lỗi để chinh sửa lại liệu nhập cho đắn iii Để xem chi tiết hướng dẫn sử dụng cho trang web, nhắn vào Nếu thật cần thiết, bạn liên hệ với Nguyễn Văn X, email điện thoại 2.3.5 Mẫu thiết ké hỗ trợ tương tác a) Tương tác thông qua phím tắt Chúng tơi đề xuất phím tắt với khả gợi nhớ sau: L Duyệt nội dung Thao tác với nội dung • Vào nhập liệu đầu tiên: Alt+Shift+I (=Input) • Tìm kiếm đơn giản: Alt+Shift+F (=Find) • Tìm kiếm nâng cao: Alt+Shift+A (=Ạdvanced) • Xem nội dung: Alt+Shift+T (=Topic) iL Tạo lập nội dung • Thêm nội dung: Alt+Shift+C (=Compose) • Xem lại thơng tin gửi lên: Alt+Shift+S (=Sent) • Nội dung cần duyệt: Alt+Shift+E (=Edit) • Nội dung cần tổng duyệt trước đăng: Alt+Shift+B (=Publish) Phím tẩt chung: • Phân cơng: Alt+Shift+G (=AssÍ£n) 89 • Khi danh sách bất kỳ, người dùng có quyền thêm/sửa/xóa: o Thêm: Alt+Shift+N (=New) o Sửa: Alt+Shift+U (=Update) o Xóa: Alt+Shift+R (=Remove) o Xem chi tiết: Alt+Shift+D (=Detail) • Hủy (Hủy làm điều đó): Alt+Shift+B (Backspace) • Submit form: Enter Phím tắt cho phần nghe sách: • Ctrl+Alt+P: Chạy/Tạm dừng media (=Play/Pause) • Ctrl+Alt+S: Dừng hẳn media (=Stop) • Ctrl+Alt+M: Tắt/Bật âm (=Mute) • Ctrl+Alt+U: Tăng âm (=Volume Up) • Ctrl+Alt+W: Giảm âm (=Volume Down) • Ctrl+Alt+F: Tua thêm giây (=Forward) • Ctrl+Alt+B: Tua lùi giây (=Backward) • Download sách: Alt+G, sau nhấn Enter b) Đảm bảo tính thống nhất, phù hợp tiêu chuẩn băng thông Sử dụng B ộ mã k ý tự chữ V iệt U nicode theo tiêu chuẩn TC V N 6909:2001 (Unicode dựng sẵn, không dùng lẫn lộn với Unicode tổ hợp) Dữ liệu âm thanh, hình ảnh, tệp download cung cấp trang thơng tin điện tử cần tuân thủ tiêu chuẩn ứng dụng công nghệ thông tin quan nhà nước quy định Quyết định số 20/2008/QĐ-BTTTT ngày 09 tháng năm 2008 Bộ tnrờng Bộ Thông tin Truyền thơng 90 Hình ảnh trang thơng tin nên có kích cỡ nhỏ 30 KJB Nếu kích cỡ ảnh lớn cần sử dụng trượt cung cấp đường liên kết tới trang để trình diễn ảnh với kích cỡ lớn c) Hỗ trợ người khuyết tật tiếp cận thông tin Tích hợp cơng nghệ hỗ trợ người khuyết tật phần mềm đọc hình Phần mềm đọc hình đắt tiền, có thêm cơng cụ đọc phần nội dung trang tiện lợi cho người mắt kém, nhóm người cao tuổi nhóm có tỷ lệ mắt cao Các chức có thề thực từ bàn phím, cung cấp phím tắt đế truy cập tới liên kết quan trọng (Trang chủ, Bản đồ trang thơng tin, Tìm kiếm, Giới thiệu) Cung cấp thông tin tương đương: c ầ n cung cấp dịng văn (text) mơ tả nội dung thông tin tương đương cho đối tượng đối tượng văn biểu tượng, hình ảnh, phím xác nhận, chữ nghệ thuật, biểu đồ, đồ thị, tất liên kết hình ảnh; dịng văn diễn tả nội dung thơng tin đối tượng thông tin âm thanh, video Không sử dụng chữ hay đối tượng nhấp nháy, chữ tự động chuyển động để đảm bảo sử dụng đọc hình cần thiết Trình bày bảng liệu a Cung cấp thơng tin tóm tắt cho bảng liệu để mơ tả bảng thể liệu gì, tên tiêu đề bảng b Đối với bảng liệu có nhiều mức logic tiêu đề hàng hay cột, cần sừ dụng kỹ thuật đánh dấu để liên kết ô liệu với ô tiêu đề tương ứng c Không sử dụng kiểu bảng để mô tả liệu kiểu cấu trúc 91 2.3.6 Kiểm tra tính dễ tiếp cận Việc kiểm tra tính dễ tiếp cận làm theo hai cách: thủ cơng tự động Với cách kiểm tra tự động, việc cần làm lựa chọn công cụ kiểm tra tự động Với cách kiểm tra thủ công, cần xây dựng danh sách tiêu chí cần kiểm tra dựa loại nội dung cần đảm bảo tính dễ tiếp cận 2.4 Mơ hình tích hợp dịch vụ cho người khiếm thị Phần giới thiệu chi tiết mơ hình tích hợp dịch vụ chúng tơi đề xuất cách thức áp dụng để xây dựng website dành cho người khiếm thị 2.4.1 Mơ tả mơ hình minh họa mơ hình tích hợp dịch vụ cho người khiếm thị Việt Nam Mơ hình dựa ngun tắc tích hợp dịch vụ hướng đối tượng sử dụng Các dịch vụ cần truy nhập qua giao diện website dịch vụ web 92 dựa web Các dịch vụ cung cấp chức hồ trợ người khiếm thị tiếp cận sử dụng thông tin cú theo yêu cầu chức website Kết việc tích hợp (ứng dụng đích) ứng dụng web độc lập với bối cảnh mà chúng sử dụng Vậy, đâu điểm khác biệt so với nguyên tắc tích hợp dịch vụ hướng đối tượng sử dụng? Ở đây, ứng dụng đích phát triển theo xu hướng phù hợp với yêu cầu lớp người dùng đặc biệt: người thị lực kém, người mù màu người mù Nhìn từ quan điểm triển khai thực tế, ứng dụng đích có đặc điểm sau đây: Khơng địi hỏi phải cập nhật quy trình nghiệp vụ thường xuyên - Không cần thiết phải lưu trữ dịch vụ sử dụng lại chỗ - Nội dung thông tin vào chức ứng dụng đích cung cấp hiển thị phần tử tương tác giao diện website menu, dialog box, mẫu biểu Các nội dung đảm bảo tính dễ tiếp cận - Bên sử dụng ứng dụng đích thường quan, tổ chức, cá nhân lĩnh vực CNTT, có hiểu biết có kỹ sử dụng chức cung cấp qua giao diện lập trình dịch vụ Các quan, tổ chức, cá nhân sử dụng ứng dụng đích vào việc xây dựng mới/ cải tiến/ nâng cấp dịch vụ hỗ trợ người khiếm thị tiếp cận sử dụng thông tin - Việc cung cấp kiến thức đào tạo kỹ sử dụng dịch vụ tiến hành thông qua hướng dẫn sử dụng dịch vụ trợ giúp trực tuyến 2.4.2 Kiến trúc cài đặt dịch vụ hỗ ượ người khiếm thị Hình -9 minh họa loại kiến trúc cài đặt dịch vụ hỗ trợ người khiếm thị tiếp cận sử dụng thơng tin dựa mơ hình đề xuất phần 93 t t 2lóp ỉlỏp X X ỉlởpvtilý Hình 2-9: Kiến trúc cài đặt dịch vụ hỗ trợ người khiếm thị Phần lớn trang thông tin điện từ cỏ thể cài đặt cách áp dụng kiến trúc lớp Điều có nghĩa dịch vụ tích hợp trực tiếp vào phần trang thông tin theo yêu cầu thiết kế Dịch vụ chi cung cấp giao diện GUI cho người dùng cuối, giao diện giao diện trang thơng tin điện tử Do đó, giao diện GUI vừa dùng để tương tác với người dùng dịch vụ, vừa dùng để hiển thị nội dung thông tin dịch vụ cung cấp, vừa dùng để biểu diễn logic ứng dụng dịch vụ Cách cài đặt có ưu diểm giao diện trang thông tin sê đa dạng bắt mắt, tùy biến theo dịch vụ, tính tương tác với người dùng đặt lên hàng đầu Nhược điểm áp dụng kiến trúc khó để phát triển website (bổ sung, thay đổi, cải tiến nâng cao chất lượng chức nó) theo hướng hỗ trợ người khiếm thị tiếp cận sử dụng thông tin cách đơn giản, hiệu Việc phát triển website theo kiến trúc tạo nhiều thay đổi mặt giao diện, yêu cầu tương tác thay đổi, làm cho người khiếm thị khó tiếp cận Chính lý này, ừong số dịch vụ tích hợp vào website, khơng có dịch vụ xây dựng cách áp dụng kiến trúc lớp Các dịch vụ cài đặt theo mơ hình lớp có ưu điểm việc xây dựng dịch vụ hoàn toàn độc lập với việc xây dựng giao diện hiển thị nội dung thơng tin dịch vụ cung cap (website dịch vụ tích hợp) Tầng giao diện GUI (phục vụ việc tương tác với người dùng dịch vụ, hiển thị nội dung thơng tin dịch vụ cung cấp) dịch vụ tách riêng, ghép cách dễ dàng, linh hoạt 94 đồng vào giao diện trang thông tin điện tử tích hợp dịch vụ Dữ liệu quy trình nghiệp vụ dịch vụ đurợc tách riêng thành tầng Vì có nhu cầu phát triển website (bổ sung, thay đổi, cải tiến nâng cao chất lượng chức cùa nó), cấu trúc giao diện GUI cho người dùng cuối không bị thay đổi Cách thức tương tác với website thứ tự truy cập vào chức có sẵn giữ nguyên, cách thức tương tác với chức hồn tồn giống chức có sẵn, người khiếm thị tiếp cận dễ dàng với chức dựa kiến thức họ biết Hơn nữa, dịch vụ cài đặt theo mơ hình lớp cho phép tạo giao diện riêng cho lập trình viên (API), giúp cho trình phát triển website, xây dựng lại chức website, xây dựng dịch vụ dựa chức có sẵn dễ dàng Chúng khuyến cáo nên áp dụng kiến trúc ba lớp để xây dựng dịch vụ cho phép người khiếm thị tương tác chủ động tạo lập nội dung Ví dụ: diễn đàn cho người khiếm thị Việc cài đặt dịch vụ theo kiến trúc lớp chuyên dụng cho phép tích hợp vào website dịch vụ/thư viện/module phần mềm có sẵn với ưu điểm việc cài đặt dịch vụ theo kiến trúc lớp Ví dụ: dịch vụ hỗ trợ lưu trữ sách nói 2.4.3 Mẩu thiết kế dịch vụ hỗ trợ người khiếm thị Các website cần có tối thiểu chức sau: Sơ đồ trang thông tin điện tử (site map): Đảm bảo thể đầy đủ xác cấu trúc hạng mục thơng tin ữang thông tin điện tử đảm bảo liên kết tới mục thông tin chức tương ứng Chức tiếp nhận thông tin phản hồi để tiếp nhận ý kiến góp ý, khiếu nại, tố cáo, yêu cầu cung cấp thông tin tổ chức, cá nhân Gửi thông báo tiếp nhận thơng tin phản hồi, nêu rõ cam kết thời gian xử lý trả lời cho tổ chức, cá nhân Chức in ấn lưu trữ thơng tin: Người sử dụng in hình hiển thị riêng tồn tin, theo chiều đứng (portrait) theo thiết lập riêng máy in khổ giấy A4 Khuyến khích có thêm chức cho phép lưu trữ tin thiết bị lưu trữ theo tiêu chuẩn văn quy định 95 Quyết định số 20/2008/QĐ-BTTTT ngày 09 tháng năm 2008 Bộ tnrởng Bộ Thơng tin Truyền thơng Hình 2-10: Áp dụng mơ hình tích hợp dịch vụ để xảy dụng trang thơng tin điện từ Hình 2-10 minh họa việc áp dụng mơ hình tích hợp dịch vụ để xây dựng trang thông tin điện tử dành cho người khiếm thị Tầng tầng dịch vụ cung cấp giao diện đồ họa trang thông tin điện tử cho người khiếm thị (GUI service) Giao diện đồ họa thiết kế theo template W3C nhằm hỗ ợ truy cập thuận tiện cho người khiếm thị: chuẩn hóa mặt cấu trúc trang thơng tin, cách trình bày nội dung vị trí (placeholder) hiển thị đầu vào, đầu dịch vụ nghiệp vụ Các dịch vụ tầng tích hợp theo ngun tẳc với mơ hình đề xuất phần 2.4.1 Tiếp theo tầng dịch vụ nghiệp vụ Tầng bao gồm dịch vụ web hỗ trợ người khiếm thị tích hợp theo mơ hình đề xuất phần 2.4.1 Tầng cuối tầng dịch vụ chuyên dụng dịch vụ nghiệp vụ gọi đến trình thực thi chức chúng Các dịch vụ chuyên dụng cung cấp chức kết nối đến sở liệu, đóng vai trị wrapper hay adapter cho dịch vụ có sẵn khác Chúng không thiết phải dịch vụ web hay dựa web Ngồi ra, cịn có số dịch vụ chuyên dụng khác dịch vụ sở hạ tầng truyền thông, dịch vụ 96 phục vụ yêu cầu chức việc đảm bảo an tồn đảm bảo chạy thơng cho trang thơng tin điện từ, v.v Với mẫu này, áp dụng mơ hình ngun dạng để tích hợp dịch vụ tầng nghiệp vụ, áp dụng để tích hợp dịch vụ tầng giao diện người dùng Ngồi ra, việc áp dụng mơ hình để xây dựng website cho phép tách biệt giao diện cho đối tượng người dùng khác nhau: API cho ứng dụng chuyên gia công nghệ thông tin, GUI cho người dùng thông thường người khiếm thị 97 ... 11 1. 2 NHỮNG ĐỐI TƯỢNG NÀO HƯỞNG LỢI TỪ CÂC WEBSITE DẼ TIÉP CẠN? 11 1. 2 .1 Người khuyết tật 11 1. 2.2 Người khiém thị 12 1. 2.3 Người cao tuổi 13 1. 2.4 Người. .. người già V IS O 92 41- 1 71: 2008 Phần 17 1 chuẩn ISO 92 41 dành cho người phụ trách kỹ thuật, thiết kế, phát triển, đánh giá mua sắm tảng phần mềm ứng dụng phần mềm Phần cung cấp hướng dẫn công thái học... 10 6 3 .1. 4 Ảnh văn b ản .10 8 3 .1. 5 Tiêu đè n hân 11 1 3 .1. 6 Tiêu đề cho phàn 11 2 3 .1. 7 Trinh tự nội dung có nghĩa 11 4 3 .1. 8 Mục đích