Hình 1.5. Cú pháp chung câu lệnh CSS Hình 1. 6. HTML và CSS trong giao diện Website

Một phần của tài liệu Ứng dụng plugin page builder và woocommerce trên nền tảng wordpress để hỗ trợ xây dựng hệ thống website thương mại điện tử,khoá luận tốt nghiệp (Trang 26 - 87)

quan

với các đối tượng khác, các hoa tiết có bị vỡ hay không trên các kích thước màn hình

phổ biến như: 1920, 1440, 1366, máy tính bảng, điện thoại.

Ngoài ra còn phải kiểm thử giao diện trên các trình duyệt phổ biến khác nhau như: Chrome, Fierfox, Safari một số trình duyệt sẽ không hỗ trợ đầy đủ các thuộc tính CSS hoặc JavaScript như Internet Explorer thì cần có những đoạn code giao diện riêng để đảm bảo tính thẩm mỹ cho thiết kế. Tuy nhiên đội phát triển dự án không khuyến nghị kiểm thử trên các trình duyệt không còn được hỗ trợ.

- Kiểm thử chức năng: Lúc này kiểm thử viên phải đảm bảo rằng tất cả các đối

- Kiểm thử nội dung: Khách hàng sẽ đổ dữ liệu chuẩn vào và chạy thử một thời

gian

nhất định để kiểm thử hoạt động của Website: Nội dung quá dài hoặc quá ngắn, ảnh

nhập vào không tương đồng về tỷ lệ và kích thước, dung lượng ảnh và video

lớn, khi có

nhiều mục tin trên trang thì có phân trang chưa,....

Bước 11: Công bố Website

Các vấn đề cần chuẩn bị để công bố một Website:

Quyền sử dụng hợp pháp: Thiết kế và mã nguồn của Website phải được cam kết về mặt

bản quyền và sở hữu trí tuệ trước khi công bố.

Tên miền- Domain: Doanh nghiệp cần đăng ký tên miền cho Website của mình càng

sớm càng tốt để đảm bảo sở hữu được tên miền theo mong muốn.

Một số điều mà doanh nghiệp nên quan tâm khi đăng ký tên miền cho Website của mình

- Xác định tên doanh nghiệp: tên tiếng Việt, tên Tiếng Anh, tên viết tắt.

- Xác định nơi đăng ký.

- Thời gian đăng ký tên miền càng sớm càng tốt.

- Có dùng tên miền con (sub- domain) hay không?

- Nên lựa chọn tên miền ngắn gọn, dễ đọc, dễ nhớ giúp khách hàng nhanh chóng nhớ được tên miền, cũng như đánh chính xác vào tên miền của bạn khi muốn truy cập.

- “Nên chọn tên miền liên quan đến sản phẩm và thương hiệu của bạn vừa giúp khách hàng biết được website của bạn nói về điều gì, vừa tăng độ nhận diện cho website

của bạn.”

“Ví dụ doanh nghiệp kinh doanh đồ ăn nhanh lại đăng ký tên miền

dogonhapkhau.vn sẽ gây hiểu lầm cho nội dung website và khiến khách hàng không tin

tưởng Website của đơn vị.”

- “Nên lựa chọn đuôi tên miền phù hợp ngành nghề của doanh nghiệp.

o Ví dụ: giáo dục - “.EDU.COM” hoặc “.edu.com.vn” hay “.edu.VN”.

thể được chấp nhận trong một số trường hợp, nhưng vẫn nên tránh chọn kí tự này vì đó không phải là một tên miền tối ưu.”

Một số gợi ý cách chọn tên miền:

- Tên miền chứa từ khóa SEO

“Đây là các tên miền chứa luôn từ khóa bạn cần SEO, Các từ khóa đó vốn đã có lượng tìm kiếm lớn nên nếu bạn sở hữu tên miền có từ khóa đó sẽ rất thuận tiện cho việc

seo website của bạn sau này. Tuy nhiên, các đuôi phổ biến như của các tên miền này thường rất khó kiếm hoặc có giá thành rất đắt. Ngoài ra, tên miền này chỉ phù hợp cho các trang vệ tinh, nếu bạn sử dụng nó như tên miền của một doanh nghiệp, nó sẽ ảnh hưởng đến thương hiệu của doanh nghiệp.”

“Các website nổi tiếng sử dụng cách này có thể kể đến như: diadiemanuong.com, muabandienthoai.com.vn, daotaoseo.com,nhadep.com.vn...”

- Tên miền chứa một phần nhỏ từ khóa:

“Đây là các tên miền kết hợp giữa một phần là từ khóa SEO mà bạn tìm ở trên và một phần là từ bổ trợ, tên thương hiệu, hoặc bất cứ từ gì đó, giúp vừa SEO vừa quảng bá được thương hiệu. Ngoài ra, các tên miền này còn giúp khách hàng nhìn vào, biết lĩnh vực kinh doanh của doanh nghiệp. Lưu ý là nên chọn những từ khóa chung, lĩnh vực lớn thay vì từ khóa chi tiết, lĩnh vực nhỏ sẽ khiến cho sự phát triển trong tương lai gặp khó khăn. Tuy nhiên, các tên miền như trên thường sẽ khá dài.”

“Các website nổi tiếng dùng cách này: dienmayxanh.com, thegioididong.com, dienmaycholon.com, noithat5c.vn...”

- Tên miền mang dấu ấn thương hiệu cá nhân

“Cuối cùng là các tên miền không có chứa từ khóa SEO mà mang thương hiệu cá nhân. Đây là lựa chọn tối ưu khi xây dựng website cho doanh nghiệp hoặc blog cá nhân dài hạn. Cách này sẽ giúp bạn quảng bá thương hiệu vô cùng hiệu quả. Tuy nhiên sẽ không thể tận dụng được lợi thế tìm kiếm mà phải tự xây dựng uy tín cho Website của mình.”

“Các website nổi tiếng dùng cách này: Haravan.com, AccessTrade.com hay DGM.vn...”

Khi quyết định chọn môi trường lưu trũ website cho doang nghiệp của mình có hai

cách thức phổ biến là thuê server hoặc hosting, trước khi quyết định nên chọn theo hướng

nào thì doanh nghiệp nên nhờ đội dự án tư vấn tùy theo dung lượng, băng thông, lượt truy cập, khả năng sẽ mở rộng trong tương lai,. của Website trong thời gian ít nhất là trong hai năm gần nhất.

- Máy chủ Windows

o Support ASP, PHP., SQL Server, MySQL.

o Đắt hơn máy chủ Linux

- Máy chủ Linux

o Support PHP, JSP., MySQL.

o Rẻ hơn máy chủ Windows

Bảo mật

Bảo mật là một vấn đề mà các nhà phát triển phần mềm luôn quan tâm và Website

cũng phải là một ngoại lệ.

Vấn đề bảo mật Website thì có rất nhiều phương án mà doanh nghiệp cũng như đội dự án có thể quan tâm như:

- Cài đặt chứng chỉ bảo mật tên miền SSL hay HTTPS cho Website.

- Kiểm tra các lỗi bảo mật trong mã nguồn.

1.2. CÁC THÀNH PHẦN CÔNG NGHỆ ĐỂ XÂY DỰNG MỘT WEBSITE

Đến thời điểm hiện tại có rất nhiều công nghệ xây dựng một Website tuy nhiên tất cả các công nghệ đều phải đảm bảo được các yêu cầu xoay quanh 3 mục tiêu chính sau, đảm bảo chúng hoạt động hiệu quả.

Thứ nhất là Giao diện người dùng cuối (End Users): Phải đảm bảo được tương tác

giữa người dùng và hệ thống là ổn định, cả giao diện và trải nghiệm và tối ưu nhất có thể. Ví dụ như màu sắc, phông chữ, vị trí các nút, độ to của ảnh,....

Thứ hai là Xử lý nghiệp vụ: Website phải đảm bảo thực hiện đúng và đủ các chức

năng theo đúng thiết kế ban đầu, luồng thông tin, các thông báo, biểu mẫu, đường dây nóng,.

Thứ ba là: Truy vấn và cập nhật được CƠ SỞ DỮ LIỆU theo quy trình nghiệp vụ.

Ví dụ khi người dùng điền một biểu mẫu trực tuyến dữ liệu phải đổ về được quản trị,

hay khi thay đổi cập nhật một thông tin gì mới trong quản trị thông tin đó phải được hiển

thị đúng trên Website.

“Nói đến giao diện người dùng có ba công nghệ phổ biến trên có mặt ở hầu hết các Website hiện nay- ba chân kiềng mà bất kì lập trình viên giao diện Website nào cũng biết: HTML, CSS và JavaScript.”

1.2.1. Front-end

Dưới đây là những thông tin cơ bản nhất về ba công nghệ giao diện Web cơ bản.

HTML

HTML là viết tắt của HyperText Markup Language tiếng Việt là Ngôn ngữ đánh dấu siêu văn bản. HTML được sử dụng như ngôn ngữ mô tả chuẩn cho các trang web.

“HTML được sáng tạo bởi Tim Berners-Lee, nhà vật lý học của trung tâm nghiên cứu CERN ở Thụy Sĩ, cũng là người phát minh ra World Wide Web và là chủ tịch của World Wide Web Consortium (W3C - doanh nghiệp thiết lập nên các tiêu chuẩn trên môi trường Internet)”.

“HTML giống như Microsoft Word cho trình duyệt của bạn biết là cần phải thể hiện các thông tin trên Website như thế nào, ví dụ như bố cục trang web, định dạng ký tự, hình ảnh, bảng biểu, ..”

- HTML 2.0 (năm 1995): bổ sung thêm một số thành phần trên form, table.

- HTML 3.2 (năm 1997): bỏ công thức toán học cũng như thêm các thẻ blink, marquee.

- HTML 4.0 vào năm 1997.

- HTML 5: ra mắt vào 2014 có khả năng hỗ trợ audio và video.

Ưu điểm:

- Có nhiều nguồn tài nguyên hỗ trợ và cộng đồng sử dụng rộng rãi.

- Sử dụng được hầu hết trên các trình duyệt.

- Dễ học.

- Mã nguồn mở .

- Miễn phí.

- Dễ dàng tích hợp với các ngôn ngữ backend như php và nodejs.

Khuyết điểm:

- “Được dùng chủ yếu cho web tĩnh. Đối với các tính năng động, bạn cần sử dụng Java-Script hoặc ngôn ngữ backend bên thứ 3 như PHP.”

- Chậm hỗ trợ tính năng mới trên một số trình duyệt.

CSS

“CSS- viết tắt của Cascading Style Sheets là một ngôn ngữ quy định cách trình bày cho các tài liệu viết bằng HTML. Tệp CSS có đuôi .css. CSS3 là phiên bản thứ 3

cũng là mới nhất của CSS. CSS được đề xuất lần đầu tiên vào ngày 10/10/1994 bởi Hảkon Wium Lie. Ke từ đó, các phiên bản của CSS dần được hình thành qua nhiều giai đoạn.”

Phiên bản CSS 2: tháng 5 năm 1998

Bản nháp CSS 3 sớm nhất: tháng 6 năm 1999

“CSS mô tả các phần tử HTML hiển thị như thế nào trên các loại thiết bị khác nhau. CSS giúp tiết kiệm rất nhiều code khi có thể quy định bố cục của nhiều trang web

Cú pháp câu lệnh chung của CSS như sau:

Hình 1.4. Cú pháp chung câu lệnh CSS

- Selector trỏ đến thành phần HTML sẽ được style

- Khối Declaration có thể gồm 1 hoặc nhiều declaration

- Mỗi Declaration bao gồm 1 thuộc tính CSS (Property) và 1 giá trị của thuộc tính (value}

“CSS giúp định nghĩa các định dạng của nội dung mà sau đó chúng ta áp dụng định dạng đó vào bất kỳ nội dung nào chúng ta muốn. Điều đó khiến việc định dạng nội dung Website trở nên linh hoạt, đa dạng”.

Hình 1. 5. HTML và CSS trong giao diện Website

Ưu điểm:

- Băng thông:

“Một định dạng trang sẽ thường sẽ được lưu trữ trên bộ nhớ đệm của trình duyệt, do vậy có thể được sử dụng trên nhiều trang mà không tải lại, tăng tốc độ tải và giảm độ truyền dữ liệu qua mạng”.

- Tính linh hoạt:

“CSS dễ dàng cho phép người dùng có thể sửa mã nguồn ngay trên trình duyệt để cho ra kết quả có thể nhìn thấy ngay.”

“CSS kết hợp với HTML tạo ra website có nhiều sức mạnh hơn và giao diện đẹp hơn. CSS, giúp sắp xếp các các thành phần khác nhau một cách khoa học hơn, logic hơn

và dễ theo dõi hơn”.

- Có thể “đặt” các đối tượng ở bất cứ vị trí nào trên webpage.

“Trước khi có CSS cấu trúc website dạng bảng gây khó khăn khi tạo bố cục trang.

Một là cấu trúc bảng biểu khá cứng nhắc, chiều ngang và chiều dọc bị ảnh hưởng kích thước lên nhau nên khó thay đổi và cập nhật. Hai là các đối tượng chèn vào bảng đều độc lập và không thể “đè” lên nhau được. CSS giúp có thể sắp xếp các đối tượng chữ,bảng biểu, họa tiết, ảnh,... ở vị trí nào tùy ý, dễ dàng sắp xếp các mảng và dễ dàng hơn trong việc bảo trì.”

- Tính tương thích:

“CSS tương thích với hầu hết các trình duyệt hiện nay: Google Chrome, Mozilla Fierfox, Safari,. Trên các trình duyệt khác nhau, những gì người dung nhìn thấy là tương đối giống nhau.”

- Tính chính xác:

CSS có các thuộc tính màu sắc hỗ trợ chọn màu theo nhiều cách: tên màu, hệ màu RGB hay mã màu hệ thập lục phân (hexadecimal code), giúp thể hiện màu sắc trên Website chính xác nhất so với thiết kế.

- Hỗ trợ các công cụ tìm kiếm:

“CSS giúp loại bỏ code thừa lặp lại nhiều lần như thẻ <font>, <p> hay các thuộc tính thứ yếu tự sinh bởi công cụ lập trình, hỗ trợ tốt hơn cho các công cụ tìm kiếm.”

- Tính nhanh chóng:

“CSS Giúp Website có sự đồng bộ và dễ dàng mở rộng giao diện. Cho dù là website

của bạn có 50 trang hay 500 trang thì chỉ cần định dạng trong một tệp CSS duy nhất. Khi nâng cấo giao diện website, chỉ phải sửa một lần duy nhất tệp CSS, toàn bộ giao diện Website sẽ tự động thay đổi theo.”

Nhược điểm

bookmarks, tạo ra vô số kích thước màn hình khác nhau. Điều này gây một phần khó khăn cho các lập trình viên.”

JAVA SCRIPT(JS)

“JavaScript là ngôn ngữ lập trình phổ biến nhất trên thế giới trong suốt 20 năm

qua. Nó cũng là một trong số 3 ngôn ngữ, là lớp thứ ba của chiếc bánh tiêu chuẩn của các công nghệ web. JavaScript là ngôn ngữ lập trình mang đến sự sinh động của website.”

“JavaScript được tạo trong mười ngày bởi Brandan Eich, một nhân viên của Netscape Communications, vào tháng 9 năm 1995.”

“JavaScript là một ngôn ngữ kịch bản được hãng Sun Microsystems và Netscape phát triển từ Livescript của Netscape. Các ứng dụng client cho phép được chạy trên hầu hết các trình duyệt Mozilla Firefox, Google Chrom, Internet Explorer, Opera,...”

“Phiên bản đầu tiên của ngôn ngữ này được đặt tên là Mocha vào tháng 5 năm 1995. Tên của nó được đổi thành Mona, đổi tên thành LiveScript vào tháng 9 năm 1995,

và được đổi tên thành JavaScript nổi tiếng như bây giờ vào tháng 12 năm 1995.”

“Năm 1996, JavaScript đã được gửi đến ECMA International để hoàn thiện trở thành, một đặc tính kỹ thuật tiêu chuẩn.”

“Vào tháng 6 năm 1997, đặc tính kỹ thuật chính thức đầu tiên cho ngôn ngữ được phát hành là ECMA-262.”

ECMAScript 2017: tháng 6 năm 2017.

“Chỉ trong 20 năm, nó từ một ngôn ngữ lập trình riêng trở thành công cụ quan trọng nhất trên bộ công cụ của các chuyên viên lập trình web.”

“Là một ngôn ngữ lập trình phổ biến sử dụng trên 92% nền tảng website hiện nay,

JavaScript đã thể hiện vai trò quan trọng với lĩnh vực này vào năm 2016”

JavaScript HTMƯCSS SQL Fyttion Java Bash/Shell/PowerShell c# PHP C++ Typescript C 67.8% 63.5% I I 54.4% 41.7% 41.1% 36.6% 31.0% 26.4% 23.5% 21.2% 20.6%

Hình 1. 6. Tỷ lệ các ngôn ngữ các lập trình viên sử dụng năm 2019

Ưu điểm

- “Bạn không cần một compiler vì trình duyệt web có thể biên dịch nó bằng HTML”.

- Dễ học.

- Dễ phát hiện lỗi và sửa.

- “Phản hồi ngay lập tức tới khách truy cập”.

- Khả năng tương tác Website tăng lên.

- “JavaSript hoạt động trên nhiều trình duyệt, nền tảng”.

- “Bạn có thể sử dụng JavaScript để kiểm tra input và giảm thiểu việc kiểm tra thủ công khi truy xuất qua database”.

- “Nó nhanh nhẹ hơn các ngôn ngữ lập trình khác”.

- Nhiều bộ chuyển đổi.

- “Có thể dùng React Native để lập trình mobile app trên JavaScript”.

Nhược điểm của JavaScript

- “Dễ bị khai thác lỗ hổng bảo mật”

- “Có thể được dùng để thực thi mã độc trên máy tính của người dùng”

- Sự hỗ trợ đầy đủ trên các trình duyệt khác nhau là không giống nhau.

- Không đồng nhất trên các thiết bị.

- Chúng ta không thể đối xử JavaScript như là một ngôn ngữ chương trình chính thức .

- JavaScript không có bất kỳ khả năng đa luồng hoặc đa xử lý.

1.2.2. Back-end

Sau Giao diện của một Website chính là Backend- là cách mà Website hoạt động là mã nguồn phía máy chủ, tất cả mã nguồn phía máy khách- Frontend như HTML, CSS

hay JavaScript sẽ không hoạt động được nếu thiếu backend. Lập trình viên backend cũng

đòi hỏi cao hơn và mức thu nhập trung bình hầu hết là cao hơn tại các quốc gia.

Để khiến cho máy chủ, ứng dụng, và cơ sở dữ liệu có thể giao tiếp được với nhau, các lập trình viên back-end sử dụng các ngôn ngữ server-side như PHP, Ruby, Python,

Một phần của tài liệu Ứng dụng plugin page builder và woocommerce trên nền tảng wordpress để hỗ trợ xây dựng hệ thống website thương mại điện tử,khoá luận tốt nghiệp (Trang 26 - 87)

Tải bản đầy đủ (DOCX)

(104 trang)
w