Chủ đề tổng hợp

header ads

Tìm hiểu về giao diện web, web tĩnh, web động, web mobile friendly,responsive,htlm5...

Sơ lược về website :

Website (trang web – trang mạng) là một tập hợp các trang web bao gồm văn bản, hình ảnh, video,… nằm trong một tên miền(domain name) hoặc tên miền phụ(subdomain) trên World Wide Web của Internet. Một trang web là tập tin HTML hoặc XHTML có thể truy nhập dùng giao thức HTTP. Trang web được lưu trữ ( web hosting ) trên máy chủ web ( server web )  có thể truy cập thông qua Internet
Vậy giao diện web là gì :  
Giao diện có nghĩa là điểm giao tiếp giữa hai đối tượng.
Trang web có thể được xây dựng bằng nhiều ngôn ngữ lập trình khác nhau (PHP,.NET, Java, Ruby on Rails…)
Trang web đầu tiên người xem truy cập từ tên miền thường được gọi là trang chủ (homepage), người xem có thể xem các trang khác thông qua các siêu liên kết (hyperlinks)
Đặc điểm tiện lợi của website
– Thông tin dễ dàng cập nhật, thay đổi, khách hàng có thể xem thông tin ngay tức khắc, ở bất kỳ nơi nào

– Tiết kiệm chi phí in ấn, gửi bưu điện, fax, thông tin không giới hạn (muốn đăng bao nhiêu thông tin cũng được, không giới hạn số lượng thông tin, hình ảnh…) và không giới hạn phạm vi khu vực sử dụng (toàn thế giới có thể truy cập).\

Giao diện Website là gì :

Website là trung gian giữa khách hàng và bạn. Giao diện website bao gồm tất cả những gì xuất hiện trên website bao gồm hình ảnh, thông tin, video, các điều hướng người dùng trên website, liên kết trên web...  hay đơn giản là tất cả những gì người dùng nhìn thấy, tương tác trên website( truy cập danh mục, đặt hàng, chat online ...) khi vào trong trang web của

Tìm hiển về  web tĩnh, web động, web mobile friendly,responsive,htlm5 và css3 ... :

1. Web tĩnh
– Trang web tĩnh thường được xây dựng bằng các ngôn ngữ HTML, DHTML,…

– Trang web tĩnh thường được dùng để thiết kế các trang web có nội dung ít cần thay đổi và cập nhật.

– Website tĩnh là website chỉ bao gồm các trang web tĩnh và không có cơ sở dữ liệu đi kèm.

– Website tĩnh thích hợp với cá nhân, tổ chức, doanh nghiệp vừa và nhỏ mới làm quen với môi trường Internet.

Trang web tĩnh và website tĩnh có các ưu và nhược điểm cơ bản dưới đây.  

* Ưu điểm cơ bản:

Thiết kế đồ hoạ đẹp: Trang Web tĩnh thường được trình bày ấn tượng và cuốn hút hơn trang web động về phần mỹ thuật đồ hoạ vì chúng ta có thể hoàn toàn tự do trình bày các ý tưởng về đồ hoạ và mỹ thuật trên toàn diện tích từng trang web tĩnh.

– Tốc độ truy cập nhanh: Tốc độ truy cập của người dùng vào các trang web tĩnh nhanh hơn các trang web động vì không mất thời gian trong việc  truy vấn cơ sở dữ liệu như các trang web động.

– Thân thiện hơn với các máy tìm kiếm (search engine) : Bởi vì địa chỉ URL của các .html, .htm,… trong trang web tĩnh không chứa dấu chấm hỏi (?) như trong web động.

– Chi phí đầu tư thấp:  Chi phí xây dựng website tĩnh thấp hơn nhiều so với website động vì không phải xây dựng các cơ sở dữ liệu, lập trình phần mềm cho website và chi phí cho việc thuê chỗ cho cơ sở dữ liệu, chi phí yêu cầu hệ điều hành tương thích (nếu có).

* Nhược điểm cơ bản:

– Khó khăn trong việc thay đổi và cập nhật thông tin: Muốn thay đổi và cập nhật nội dung thông tin của trang website tĩnh Bạn cần phải biết về ngôn ngữ html, sử dụng được các chương trình thiết kế đồ hoạ và thiết kế web cũng như các chương trình cập nhật file lên server.

– Thông tin không có tính linh hoạt, không thân thiện với người dùng: Do nội dung trên trang web tĩnh được thiết kế cố định nên khi nhu cầu về thông tin của người truy cập tăng cao thì thông tin trên website tĩnh sẽ không đáp ứng được.

– Khó tích hợp, nâng cấp, mở rộng:  Khi muốn mở rộng, nâng cấp một website tĩnh hầu như là phải làm mới lại website.

2. Web động :
– Web động là thuật ngữ được dùng để chỉ những website có cơ sở dữ liệu và được hỗ trợ bởi các phần mềm phát triển web.

– Với web động, thông tin hiển thị  được gọi ra từ một cơ sở dữ liệu khi người dùng truy vấn tới một trang web. Trang web được gửi tới trình duyệt gồm những câu chữ, hình ảnh, âm thanh hay những dữ liệu số hoặc ở dạng bảng hoặc ở nhiều hình thức khác nữa.

Chẳng hạn ứng dụng cơ sở của bạn có chức năng như một công cụ thương mại điện tử (một cửa hàng trực tuyến) trưng bày catalogue sản phẩm trên website hay theo dõi kho hàng, khi một mặt hàng được giao, ngay lập tức những trang có liên quan đến sản phẩm đó phản ánh sự thay đổi này. Những website cơ sở dữ liệu còn có thể thực hiện những chức năng truyền và xử lý thông tin giữa doanh nghiệp – doanh nghiệp.  

– Web động thường được phát triển bằng các ngôn ngữ lập trình tiên tiến như PHP, ASP, ASP.NET, Java, CGI, Perl, và sử dụng các cơ sở dữ liệu quan hệ mạnh như Access, My SQL, MS SQL, Oracle, DB2,

– Thông tin trên web động luôn luôn mới vì nó dễ dàng được bạn thường xuyên cập nhật thông qua việc Bạn sử dụng các công cụ cập nhật của các   phần mềm quản trị web . Thông tin luôn được cập nhật trong một cơ sở dữ liệu và người dùng Internet có thể xem những chỉnh sửa đó ngay lập tức. Vì vậy website được hỗ trợ bởi cơ sở dữ liệu là phương tiện trao đổi thông tin nhanh nhất với người dùng Internet. Điều dễ nhận thấy là những website thường xuyên được cập nhật sẽ thu hút nhiều khách hàng tới thăm hơn những web site ít có sự thay đổi về thông tin.

– Web động có tính tương tác với người sử dụng cao. Với web động, Bạn hoàn toàn có thể dễ dàng quản trị nội dung và  điều hành website của mình thông qua các phần mềm hỗ trợ mà không nhất thiết Bạn cần phải có kiến thức nhất định  về ngôn ngữ  html, lập trình web,

Bạn cũng có thể nhìn nhận vấn đề theo khía cạnh khác: chẳng hạn bạn đã có sẵn những cơ sở dữ liệu như cơ sở dữ liệu sản phẩm, nhân sự, khách hàng hay bất kỳ cơ sở dữ liệu nào đó mà bạn muốn đưa thêm giao diện web vào để người dùng nội bộ hay người dùng Internet đều có thể sử dụng chương trình chỉ với trình duyệt web của mình.

– Tất cả các website Thương mại điện tử, các mạng thương mại, các mạng thông tin lớn, các website của các tổ chức, doanh nghiệp hoạt động chuyên nghiệp trên Net đều sử dụng công nghệ web động. Có thể nói web động là website của giới chuyên nghiệp hoạt động trên môi trường Internet.

3. Htlm5 và CSS3 :

- HTML5 là phiên bản tiếp theo của HTML. Nó được phát triển thêm 1 số nhóm phần tử mới sẽ tối ưu hóa trang web của chúng ta hơn. Điều này sẽ làm website của bạn dễ dàng được các bộ máy tìm kiếm biết đến hơn. Ngoài ra, HTML 5 cũng sẽ bao gồm các hàm API mới nhằm hỗ trợ tốt hơn cho tính truyền thông bởi các thao tác vẽ đồ họa trên màn hình, lưu trữ dữ liệu ngoại tuyến, kéo và thả ..v…v……

- HTML 5 cũng loại bỏ một vài đặc điểm khá nổi tiếng như sự vắng mặt của frames và các thành tố định dạng chuẩn của CSS như tt và u.

- CSS 3 được xây dựng dựa trên các nguồn gốc của các style, selectors và cascade dựa trên phiên bản cũ của CSS 2.0 trước đó. Nó cho phép thực thi thêm 1 số tính năng mới, bao gồm cả mới selectors, pseudo-class và các properties. Bằng cách sử dụng các tính năng mới này, việc thiết kế trình bày template của bạn sẽ trở nên dễ dàng hơn rất nhiều.

Web đạt chuẩn Mobile Friendly vậy Mobile Friendly là gì :

Mobile Friendly là gì? Theo Google’s mobile guidelines thì Mobile Friendly là một thuật toán của Google để xếp hạng website trên các kết quả tìm kiếm. Mobile Friendly dịch sang tiếng Việt có nghĩa là “Thân thiện với điện thoại di động”

Với các Developer: Mobile Friendly là yêu cầu mới mà họ phải tập trung để nâng cấp hoặc phát triển website có thể chạy tốt trên cả điện thoại thông minh như iPad, PC và cả Feature Phone.

Với các Seoer: Mobile Friendly cũng là công việc mới họ phải làm đó là làm việc với các công ty  thiết kế web thân thiên với mobile hoặc chỉnh sửa lại website để vượt qua ải Mobile Friendly Test. Các Seoer cũng cần chú ý, thứ hạng thay đổi sẽ đánh vào tất cả website bao gồm cả các trang vệ tinh của bạn vì vậy hãy thực hiện cải tổ tất cả chứ không chỉ trang chính.
Với doanh nghiệp: Năm 2015 nếu bạn muốn duy trì thứ hạng của bạn trên Google tốt hoặc muốn tăng thứ hạng của mình tôi khuyên đọc hướng dẫn của tôi về Mobile Friendly được dịch từ Google’s mobile guidelines chuẩn của Google và hãy nhanh chóng nâng cấp website của bạn.

Ưu điểm của web đúng chuẩn Mobile Friendly:

+ Chạy tốt trên mọi thiết bị

+ Cung cấp cho người dùng trải nghiệm tốt hơn

+ Website thân thiện hơn

+ Mọi đối tượng khách hàng đều có thể truy cập vào website của bạn

+ Lượng visit website của bạn sẽ tăng lên nhờ có nhiều thiết bị có thể truy cập website

+ Google có thể tối ưu con bọ và đánh giá chính xác thứ hạng của bạn cũng như giảm thời gian làm việc

Web Responsive là gì :  

Responsive là một tính từ để chỉ một website có thể hiển thị tương thích trên mọi kích thước hiển thị của trình duyệt. Ví dụ thông thường nếu giao diện website đặt một chiều rộng cố định là 800px thì chắc chắn nếu xem ở trình duyệt điện thoại với chiều ngang chỉ từ 320px – 420px sẽ không hiển thị hết được.

Có thể bạn cho rằng chúng ta có thể gán giá trị chiều rộng từ tuyệt đối (800px) sang kiểu giá trị tương đối là phần trăm (%) thì có thể sẽ hiển thị tương ứng được. Điều này cũng đúng, nhưng giả sử website bạn có 3 cột trên một hàng thì liệu rằng trên trình duyệt di động, mắt thường của con người có thể thấy chi tiết mà không cần phóng to màn hình hay không? Do vậy, chúng ta sẽ muốn giao diện sẽ được hiển thị khác đi một xíu trên trình duyệt nhỏ hơn các trình duyệt thông thường, và Responsive là giải pháp làm việc này nhanh nhất và dễ nhất.

Responsive hoạt động bằng cách chúng ta sẽ viết CSS để cho trình duyệt hiểu và thực thi nó trên các kích thước trình duyệt nhất định. Chẳng hạn bạn có thể thiết lập một đoạn CSS nào đó chỉ áp dụng cho các trình duyệt có kích thước chiều rộng tối đa là 320px (điện thoại). Điều này có nghĩa là Responsive là một kỹ thuật thiết kế được xử lý từ client-side chứ không hề gửi truy vấn nào đến máy chủ để xử lý (server-side) nên nó có một nhược điểm là làm trình duyệt của bạn phải mất nhiều thời gian hơn để xử lý CSS.


Bài viết được tổng hợp từ nhiều Nguồn để hiểu rõ hơn các bạn vào link bên dưới để tìm hiểu kỹ hơn  :
http://www.adcvietnam.net/tu-van-thiet-ke-website/tim-hieu-ve-cach-phan-chia-giao-dien-trong-thiet-ke-web.htm
http://webluxury.vn/hieu-biet-quy-trinh-thiet-ke-giao-dien-web.html
http://www.vocw.edu.vn/kien-thuc-web/thiet-ke-lap-trinh-web/119-tim-hieu-ve-web-tinh-va-web-dong.html
http://www.jumla.vn/vi/tin-tuc/ung-dung-phan-mem/411-tim-hieu-ve-cong-nghe-html-5-va-css-3-phan-1.html
http://www.huynhhuuphuoc.com/seo/mobile-friendly-la-gi-va-cach-kiem-tra-mobile-friendly.html
https://thachpham.com/web-development/html-css/lam-giao-dien-respoonsive.html

Đăng nhận xét

0 Nhận xét