Tìm hiểu về ảnh

Ngày 16 / Tiết 1 / Thời lượng 30 phút. Mục lục khóa 100 ngày làm web.

Ảnh có vẻ không xa lạ gì với nhiều người, phần lớn chúng ta thường xuyên up ảnh lên các mạng xã hội như Facebook, Instagram. Tuy nhiên khi bạn làm website, mức độ hiểu biết về ảnh của bạn cần được cải thiện. Điều này sẽ giúp ích cho bạn sau này cả khi bạn viết nội dung và khi cần điều chỉnh, lựa chọn giao diện (theme) cho website.

Đầu tiên, bạn vào trang: pixabay.com rồi tìm một ảnh bất kỳ trên đó. Chẳng hạn tôi tìm chủ đề ‘hanoi’, và thấy bức ảnh sau:

Tìm kiếm ảnh miễn phí về chủ đề Hà Nội
Tìm kiếm ảnh miễn phí về chủ đề Hà Nội

Link ảnh người bán hàng rong trên ở đây. Bạn click vào Tải về miễn phí để tải ảnh về:

Tải về miễn phí
Tải ảnh về

Bạn vào thư mục Download sẽ thấy ảnh mà bạn vừa tải. Chuột phải bức ảnh đó và click vào properties:

Click vào properties để xem các thuộc tính của bức ảnh
Click vào properties để xem các thuộc tính của bức ảnh

Bạn sẽ thấy các thuộc tính của bức ảnh:

Các thuộc tính của bức ảnh ở tab General
Các thuộc tính của bức ảnh ở tab General
  • Đầu tiên là tên file ảnh, trong trường hợp này là: street-vendor-gfd73fc69e_1920. Đối với ảnh trên website sau này bạn cần tránh đặt tên ảnh có dấu, có khoảng trắng. Tốt nhất là đặt không dấu, và nối với nhau bằng dấu gạch ngang, ví dụ: day-la-anh-cua-toi
  • Type of file: JPG file (.jpg), nghĩa là định dạng ảnh là jpg, định dạng này còn có một biến thể khác cũng hay gặp là .jpeg
  • Như vậy cả tên ảnh và định dạng của nó sẽ tạo thành tên hoàn chỉnh là: street-vendor-gfd73fc69e_1920.jpg

Hầu hết các ảnh mà bạn chụp (bằng điện thoại, máy ảnh) đều là ảnh có định dạng jpg, và nói chung các ảnh chụp trên mạng cũng vậy.

Ngay bên dưới bạn sẽ thấy Size, tức là dung lượng của bức ảnh. Ở đây là 515 KB (nhỏ hơn so với con số thông báo ban đầu 672 KB).

Để so sánh thì hosting mà chúng ta mua ở AZDIGI có dung lượng 1GB. Quy đổi thì:

1GB = 1024 MB

1MB = 1024 KB

Tức là với dung lượng ảnh như vậy và với hosting hiện có, chúng ta chứa được khoảng 2000 bức hình.

Còn kích cỡ bức hình thì sao? bạn cần chuyển sang tab Details:

Tab details cho biết kích cỡ bức hình
Tab details cho biết kích cỡ bức hình

Kích cỡ bức hình là 1920 x 1281. Trong đó chiều rộng là 1920 pixels, chiều cao là 1281 pixels.

Thông tin mà bạn cần phải biết ở đây là đơn vị đo chiều dài, chiều rộng của ảnh trên website là pixel.

Đơn vị pixel cũng là đơn vị đo độ dài của nhiều yếu tố khác trên web, chẳng hạn như độ rộng của website, kích cỡ font chữ, lề giữa các thành phần trên trang, độ rộng của đường viền, vân vân.

1 pixel chính là 1 điểm ảnh, khái niệm pixel nếu bạn nào để ý khi mua điện thoại cũng hay gặp, chẳng hạn độ phân giải màn hình của iPhone 11 là 1792×828 pixels.

Để hiểu rõ hơn về pixel tôi sẽ đưa ra 2 ví dụ:

(1) Bạn có bao giờ xem bóng đá và thấy trên khán đài cờ của Việt Nam được tạo thành bởi hàng ngàn người, mỗi người cầm một tấm bảng giấy hình vuông màu đỏ hoặc vàng, và khi bạn nhìn từ xa qua màn hình tivi, bạn sẽ thấy một lá cờ Việt Nam trông rất rõ ràng. Mỗi người cầm bảng màu đó chính là pixel / điểm ảnh.

Hàng ngàn người xếp thành hình quốc kỳ Việt Nam – ảnh của báo Lao Động

(2) Để trực tiếp nhìn thấy điểm ảnh của bức hình trên (tải từ Pixabay), bạn hãy phóng to nó bằng cách lăn bánh lăn chuột về phía trước, khi phóng to đến cực đại, bạn sẽ thấy bức hình đó được tạo thành từ các điểm ảnh như thế này:

Các điểm ảnh của quả bưởi trong tấm hình trên
Các điểm ảnh của quả bưởi trong tấm hình trên

Khi click vào ảnh vừa tải ở trên để xem kích cỡ thực của nó, bạn sẽ thấy đây là ảnh rất lớn. Kích cỡ 1920 x 1281 tương đương với kích cỡ full HD của nhiều màn hình máy tính hiện nay.

Website thường sử dụng ảnh nhỏ hơn khá nhiều, thực tế kích cỡ ảnh mà nó hay dùng thường có chiều rộng 700px.

Bạn quay lại trang pixabay, chọn và tải ảnh có kích cỡ nhỏ hơn:

kích cỡ hay dùng
Kích cỡ ảnh hay dùng trên website

Ảnh tải về và bạn click vào xem, bạn sẽ thấy đây mới là kích cỡ hay dùng trên web. Tôi sẽ tải ảnh đó lên luôn tại bài này, bạn có thấy nó rất vừa vặn với chiều rộng của website không?

Kích cỡ ảnh hay được dùng trên website
Kích cỡ ảnh hay được dùng trên website

Một điều cần lưu ý nữa, dung lượng bức hình chỉ còn 96KB, nhỏ hơn 5 lần kích cỡ của ảnh lớn ban đầu. Với 96KB, thì hosting nhỏ 1GB vẫn có khả năng chứa tới 10 ngàn ảnh, con số rất lớn với đa số website.

Bài học ở đây cho chúng ta là khi đăng ảnh lên website, hãy chọn ảnh có kích cỡ phù hợp.

Ảnh chụp từ điện thoại

Tôi sẽ xem thông số của một bức hình tôi chụp bằng điện thoại:

Thông số của bức hình chụp bằng điện thoại
Thông số của bức hình chụp bằng điện thoại

Bạn có thể thấy kích cỡ của nó cũng rất lớn: 1932 x 2576 pixel, và dung lượng lên tới 1,1 MB (định dạng là JPEG, và chúng ta đã biết .jpeg và .jpg là cùng loại).

Sau này có khả năng bạn dùng điện thoại để chụp ảnh đăng lên website khá nhiều, điểm cần lưu ý là: ảnh chụp từ điện thoại cũng rất lớn, và trước khi đăng nó lên website, bạn cần phải điều chỉnh ảnh về kích cỡ phù hợp.

Bài tiếp >>> Các kho ảnh miễn phí.