22/11/2018, 23:47

Cẩm nang cho người bắt đầu học lập trình web trong năm 2018 (Phần 2)

Flat design vector illustration of mobile and desktop website design development process with minimalistic modern digital tablet, desktop computer and smartphone on a designer workplace in stylish color. Isolated on beige background Phần 2: Mài dũa các kĩ năng front-end Sau khi đã nắm ...

Flat design vector illustration of mobile and desktop website design development process with minimalistic modern digital tablet, desktop computer and smartphone on a designer workplace in stylish color. Isolated on beige background

Phần 2: Mài dũa các kĩ năng front-end

Sau khi đã nắm được các kiến thức cơ bản về HTML, CSS và Javascript, bạn có thể đi sâu vào các kĩ năng nâng cao hơn của front-end. Phần này sẽ điểm qua các công cụ hữu ích và kĩ năng giúp bạn phát triển được khả năng của mình.

Responsive design là kiến thức bắt buộc phải có trong thời đại smartphone

Khi website mới xuất hiện, bạn chỉ có thể xem chúng trên duy nhất một thiết bị là máy tính.

Điện thoại thông minh và dữ liệu di động vẫn chưa xuất hiện. Khi làm một website, bạn chỉ phải suy nghĩ về cách chúng hiển thị trên máy tính như thế nào.

Nhưng hiện nay theo thống kê của Statcounter.com, số lượng người sử dụng điện thoại của họ để duyệt web đã nhiều hơn số lượng sử dụng máy tính.

Vậy nên chúng ta cần đảm bảo websites hoạt động và nhìn ổn định trên tất cả mọi thiết bị từ các màn hình lớn nhất cho tới những chiếc điện thoại nhỏ nhất.

Kĩ năng này gọi là responsive design. Nó có tên như vậy vì các thiết kế có thể “tùy biến” trên mọi loại thiết bị hiển thị.

Bạn có thể kiểm tra một website có responsive hay không bằng cách thay đổi độ rộng của cửa sổ trình duyệt để xem thiết kế đó hiển thị như thế nào.

Xây dựng một website có thể responsive cần chuẩn bị từ bước lên kế hoạch trong khâu thiết kế. Bạn phải cân nhắc mọi thứ hiển thị như thế nào trên tất cả thiết bị. Tới khâu lập trình, bạn phải sử dụng media queries (chính là @media) để điều khiển các thuộc tính CSS được sử dụng như thế nào tùy thuộc vào độ rộng cụ thể.

Frameworks có thể giúp bạn xây dựng các website responsive nhanh hơn

Bạn có thể tưởng tượng việc viết code CSS cho một trang web responsive mệt mỏi thế nào.

Nếu bạn không thể dành nhiều thời gian cho nó, hãy sử dụng một framework hỗ trợ responsive như Bootstrap hay Zurb Foundation.

Sức mạnh của các framework này là nó đã hỗ trợ sẵn các code CSS và Javascript tùy biến. Các thành phần như headlines và buttons đã được viết những đoạn code tùy biến phù hợp. Chúng cũng đi kèm các thành phần Javascript khác như cửa sổ popup dạng modal và thanh điều hướng.

Sử dụng các công nghệ đã được đảm bảo sẽ giúp bạn xây dựng website dễ dàng hơn. Điều duy nhất bạn cần lưu ý là không nên phụ thuộc quá nhiều vào các frameworks.

Bài liên quan

Cẩm nang cho người bắt đầu học lập trình web trong năm 2018 (Phần 2)

Flat design vector illustration of mobile and desktop website design development process with minimalistic modern digital tablet, desktop computer and smartphone on a designer workplace in stylish color. Isolated on beige background Phần 2: Mài dũa các kĩ năng front-end Sau khi đã nắm ...

Hoàng Hải Đăng viết 23:47 ngày 22/11/2018

Cẩm nang cho người bắt đầu học lập trình web trong năm 2018 (Phần 1)

Người viết: Hoang Quynh Anh Bạn muốn thử học lập trình web, nhưng không biết nên bắt đầu từ đâu? Chắc hẳn bạn cũng đã thử tìm kiếm những khóa học trên google, nhưng lại có quá nhiều nguồn tài liệu và đa số chúng lại chứa nhiều thông tin khiến bạn quá tải. Bạn chỉ cần những ...

Tạ Quốc Bảo viết 23:45 ngày 21/11/2018

15 Trải nghiệm về HTML5 gây cảm hứng cho người bắt đầu

Theo lời cựu CEO quá cố cửa Apple thì HTML5 sẽ là công nghệ thay thế cho Flash. Trên thực tế thì điều này vẫn chưa xảy ra. Nhưng HTML5 thật sự tạo ra những điều kì diệu về video,hình ảnh và những hiệu ứng chuyển động….. Bạn có thể tin hay không tin về sức mạnh HTML5 mang lại sau khi cùng ...

Hoàng Hải Đăng viết 20:13 ngày 04/10/2018

Những điều cần biết khi bắt đầu học lập trình php

Bạn yêu công nghệ thông tin ? muốn học lập trình php nhưng chưa biết bắt đầu từ đâu ? Devpro sẽ giúp bạn tìm hiểu những gì cần biết khi bắt đầu học PHP, hãy theo dõi bài viết dưới đây nhé ! Lập trình PHP là gì ? Theo định nghĩa chuẩn thì PHP là: (từ viết tắt đệ quy cho ...

Bùi Văn Nam viết 17:02 ngày 04/10/2018

Roadmap cho lập trình viên trong năm 2018

Trước khi quyết định trở thành một lập trình viên hay làm bất cứ điều gì, trước hết chúng ta phải hiểu tại sao bạn lại muốn đi theo con đường này. Mỗi quyết định sẽ đòi hỏi thời gian đáng kể của cuộc đời bạn. Và thời gian, sau tất cả, vẫn là tài nguyên quan trọng nhất của đời người: ...

Tạ Quốc Bảo viết 14:04 ngày 24/09/2018
0