Không thể hiển thị hình ảnh HTML

Người xưa có câu “một bức tranh đáng giá ngàn lời nói. " Khẩu hiệu này tỏa sáng trên web, nơi mà khoảng thời gian chú ý nổi tiếng là ngắn—hình ảnh phù hợp có thể tạo ra hoặc phá vỡ một trang web bằng cách thu hút sự chú ý phù hợp và thu hút khách truy cập trang

Tuy nhiên, khi một hình ảnh không tải được, nó sẽ làm cho thiết kế bị lỗi và trong một số trường hợp, có thể làm giảm trải nghiệm người dùng trên trang web đó. "Ngàn lời" mà bức ảnh vỡ gửi đến chắc chắn không phải là điều tích cực

1. Đường dẫn tệp không chính xác

Khi bạn thêm hình ảnh vào tệp HTML hoặc CSS của một trang web, bạn phải tạo một đường dẫn đến vị trí trong cấu trúc thư mục nơi các tệp đó nằm. Đây là mã cho trình duyệt biết nơi tìm và lấy hình ảnh từ. Trong hầu hết các trường hợp, điều này sẽ nằm trong một thư mục có tên hình ảnh. Nếu đường dẫn đến thư mục này và các tệp bên trong nó không chính xác, hình ảnh sẽ không tải đúng cách vì trình duyệt sẽ không thể truy xuất các tệp chính xác. Nó sẽ đi theo con đường mà bạn đã chỉ dẫn, nhưng nó sẽ đi vào ngõ cụt và thay vì hiển thị hình ảnh thích hợp, nó sẽ trống không

2. Tên tập tin sai chính tả

Khi bạn kiểm tra đường dẫn tệp cho các tệp của mình, hãy xác minh rằng bạn đã viết đúng chính tả tên của hình ảnh. Tên không chính xác hoặc lỗi chính tả là nguyên nhân phổ biến nhất gây ra sự cố tải hình ảnh

3. Phần mở rộng tệp sai

Trong một số trường hợp, tên của tệp có thể được viết đúng chính tả, nhưng phần mở rộng của tệp có thể không chính xác. Nếu hình ảnh của bạn là một. jpg, nhưng HTML của bạn đang tìm kiếm một. png, sẽ có một vấn đề. Sử dụng loại tệp chính xác cho từng hình ảnh, sau đó tham chiếu cùng phần mở rộng đó trong mã trang web của bạn.  

Ngoài ra, hãy tìm trường hợp nhạy cảm. Nếu tệp của bạn kết thúc bằng. JPG, với tất cả các chữ cái được in hoa, nhưng tham chiếu mã của bạn. jpg, tất cả đều là chữ thường, một số máy chủ web xem hai cái đó là khác nhau, mặc dù chúng là cùng một bộ chữ cái. Số lượng phân biệt chữ hoa chữ thường

Cách tốt nhất là luôn lưu tệp với các chữ cái viết thường. Làm như vậy cho phép chúng tôi luôn sử dụng chữ thường trong mã của mình, loại bỏ một vấn đề có thể xảy ra với các tệp hình ảnh của chúng tôi

4. Thiếu tập tin

Nếu đường dẫn đến tệp hình ảnh của bạn là chính xác, tên và phần mở rộng tệp cũng không có lỗi, hãy kiểm tra xem các tệp đã được tải lên máy chủ web chưa. Bỏ qua việc tải tệp lên máy chủ đó khi trang web được khởi chạy là một lỗi phổ biến rất dễ bỏ qua

Tải lên những hình ảnh đó, làm mới trang web của bạn và nó sẽ ngay lập tức hiển thị các tệp như mong đợi. Bạn cũng có thể thử xóa hình ảnh trên máy chủ và tải lên lại. Đôi khi các tệp bị hỏng trong quá trình chuyển (e. g. , bằng văn bản thay vì truyền nhị phân trong FTP), vì vậy phương pháp "xóa và thay thế" này đôi khi hữu ích

5. Trang web lưu trữ hình ảnh bị sập

Thông thường, bạn sẽ lưu trữ hình ảnh mà trang web của bạn sử dụng trên máy chủ của riêng bạn, nhưng trong một số trường hợp, bạn có thể đang sử dụng hình ảnh được lưu trữ ở nơi khác. Nếu trang web lưu trữ hình ảnh đó bị hỏng, hình ảnh của bạn cũng sẽ không tải được

6. Sự cố chuyển nhượng

Cho dù tệp hình ảnh được tải từ miền bên ngoài hay từ miền của riêng bạn, thì luôn có khả năng xảy ra sự cố truyền đối với tệp đó khi được trình duyệt yêu cầu lần đầu. Vấn đề này không phải là một sự cố phổ biến (nếu có, bạn có thể cần tìm một nhà cung cấp dịch vụ lưu trữ mới), nhưng đôi khi nó có thể xảy ra

Một lý do phổ biến cho sự cố này là máy chủ bị quá tải và không thể phục vụ tất cả nội dung trang đủ nhanh trước khi hết thời gian yêu cầu. Bạn sẽ thấy vấn đề này phổ biến hơn với các máy chủ web ảo được cung cấp với giá rẻ đang gặp khó khăn trong việc xử lý các trang web phức tạp hơn, nhiều tập lệnh. Nếu sự cố này xảy ra thường xuyên, hãy cân nhắc nâng cấp khả năng của máy chủ hoặc tìm một máy chủ lưu trữ mới

7. Sự cố cơ sở dữ liệu

Các ứng dụng web động hiện đại, như WordPress, dựa vào cơ sở dữ liệu để lưu trữ thông tin về mọi thứ trên trang web, bao gồm cả hình ảnh. Nếu trang web của bạn không tải được hình ảnh, có khả năng cơ sở dữ liệu đang gặp sự cố nào đó

Có rất nhiều cách các sự cố cơ sở dữ liệu có thể xảy ra. Ứng dụng của bạn thậm chí có thể không được kết nối với cơ sở dữ liệu vì nó bị hỏng hoặc không thể truy cập được trên một máy chủ khác. Một cái gì đó có thể đã bị hỏng trên chính cơ sở dữ liệu hoặc thông tin người dùng cơ sở dữ liệu của bạn đã thay đổi, khiến bạn đăng xuất. Ngay cả những thay đổi cài đặt đơn giản cũng có thể gây ra những hậu quả ngoài ý muốn làm thay đổi cơ sở dữ liệu hoặc khiến nó không thể truy cập được. Kiểm tra nhật ký máy chủ để xem liệu cơ sở dữ liệu có phải là thủ phạm hay không

Một vài lưu ý cuối cùng

Xem xét việc sử dụng đúng các thẻ ALT và tốc độ trang web của bạn và hiệu suất tổng thể

Thẻ ALT hoặc “văn bản thay thế” là những gì được trình duyệt hiển thị nếu hình ảnh không tải được. Chúng cũng là một thành phần quan trọng trong việc tạo các trang web có thể truy cập được mà những người khuyết tật nhất định có thể sử dụng. Mỗi hình ảnh nội tuyến trong trang web của bạn phải có thẻ ALT thích hợp. Hình ảnh được áp dụng với CSS không cung cấp thuộc tính này

Trích dẫn bài viết này

Sự sắp xếp

trích dẫn của bạn

Girard, Jeremy. "7 lý do tại sao hình ảnh không tải trên trang web của bạn. "ThinkCo. https. //www. suy nghĩ. com/images-not-loading-4072206 (truy cập ngày 22 tháng 1 năm 2023)