2008 Ngày 15 tháng 5 năm 2008

Thực tiễn tốt nhất: Làm việc với của JavaScript

Bao gồm JavaScript ở dưới cùng của tài liệu HTML

Nếu bạn không có document.write (hoặc bất kỳ thế hệ năng động của nội dung trang web bằng cách sử dụng javascripts) để chèn một phần nội dung của trang kịch bản của bạn, di chuyển các kịch bản bao gồm tuyên bố để dưới cùng của trang, trước khi kết thúc của thẻ BODY.
Các đặc điểm kỹ thuật HTTP/1.1 cho thấy rằng trình duyệt tải về không quá hai thành phần song song mỗi tên máy. Nếu bạn phục vụ hình ảnh của bạn từ hostname nhiều, bạn có thể nhận được hơn hai tải xảy ra song song. Trong khi một kịch bản được tải về, tuy nhiên, trình duyệt sẽ không bắt đầu bất kỳ tải khác, ngay cả trên các tên máy chủ khác nhau.
Ngoài ra còn có cách để tự động tạo ra các nút SCRIPT và tải các kịch bản từ xa sau khi trang web được tải bằng cách sử dụng AJAX.

Externalise bạn JavaScript

Sử dụng các tập tin JavaScript bên ngoài sẽ dẫn đến tải trang nhanh hơn bởi vì các tập tin JavaScript được lưu trữ bởi trình duyệt. Inline JavaScript trong các tài liệu HTML được tải về mỗi khi các tài liệu HTML được yêu cầu. Điều này thực sự có thể làm giảm số lượng yêu cầu HTTP được thực hiện nhưng sau đó tăng kích thước của các tài liệu HTML. Bên ngoài JavaScript được lưu trữ bởi trình duyệt, kích thước của các tài liệu HTML được giảm mà không làm tăng số lượng yêu cầu HTTP.
Xin lưu ý rằng, nếu người sử dụng trên trang web của bạn có nhiều lượt xem cho mỗi phiên và nhiều của các trang của bạn lại sử dụng cùng một kịch bản và stylesheets, có một lợi ích tiềm năng lớn hơn từ các tập tin lưu trữ bên ngoài.

Đóng gói tập tin Javascript của bạn

Trong trường hợp của JavaScript, không giống như CSS, các tập tin có thể co rút bằng cách sử dụng một số thuật toán tiêu chuẩn mà có thể cung cấp cho một kích thước tập tin giảm hơn so với chỉ đơn giản là loại bỏ không gian hoặc tab. Một ví dụ của javascript đóng gói có thể được tìm thấy ở đây http://dean.edwards.name/packer/

Hãy loại bỏ bất kỳ kịch bản trùng lặp

Nó là rất khác thường mà toàn bộ kịch bản có thể được nhân đôi, nhưng một đánh giá của các trang web hàng đầu của Hoa Kỳ cho thấy rằng hai trong số họ có một kịch bản trùng lặp. Bản sao các kịch bản nhưng rõ ràng làm giảm hiệu suất bằng cách tạo ra các yêu cầu HTTP không cần thiết và lãng phí thực hiện JavaScript.
Ngoài ra, trong nhiều trường hợp, mặc dù tên kịch bản là khác nhau, có một khả năng của các kịch bản trùng lặp trong cùng một trang do nhóm kích thước và số lượng của các kịch bản.

Giảm thiểu truy cập vào các yếu tố DOM nếu có thể

Truy cập các yếu tố DOM với JavaScript là chậm, vì vậy để có một trang phản ứng nhanh hơn, bạn nên:
• cache tài liệu tham khảo để các yếu tố truy cập
• Cập nhật các nút "offline" và sau đó thêm chúng vào cây
• Tránh sửa chữa bố trí với JavaScript

Hành vi riêng biệt từ nội dung và trình bày

Cũng như chúng tôi trình bày riêng biệt (CSS / XSLT) từ nội dung (XHTML / XML), chúng ta cũng nên tách biệt hành vi (Javascript). Điều này được gọi là không phô trương Javascript. Cũng như chúng tôi liên kết đến các file CSS bên ngoài, chúng ta nên liên kết với các tập tin javascript bên ngoài.

Thay vì hành vi mã hóa cứng vào nội dung (ví dụ như onmouseover, onclick, vv), hành vi nên được tự động thêm vào các yếu tố, các lớp học, và các yếu tố duy nhất (ID) bằng cách sử dụng DOM. Các tài liệu cơ bản, nội dung, nên chứa chỉ hợp lệ XHTML / XML và javascript không.
Javascript nên làm tăng thêm nội dung bằng cách thêm hành vi. Các nội dung nên vẫn còn hữu ích và có thể sử dụng mà không cần javascript (hoặc không có đầy đủ hỗ trợ javascript).


2008 Ngày 07 tháng 5 năm 2008

Thực tiễn tốt nhất: Hãy nhận biết trọng lượng của trang

Tôi đã lưu lứa tuổi bài viết trở lại, do đó, Xin lỗi! Tôi không nhớ nguồn ... nhưng nó có vẻ hữu ích, để chúng tôi có được nhận thức về đối tượng mà chúng tôi phát triển trang web cho ... do đó, đây là

Trang trọng lượng có thể được sử dụng để xác định thời gian tải một trang nhất định trên một loạt các tốc độ kết nối Internet. Bằng một ví dụ, bảng dưới đây cho thấy thời gian tải các trang khác nhau ở một số tốc độ kết nối phổ biến.

Trang Trọng lượng Times Tải về

Tốc độ kết nối

20 Mb Trang

40 Mb Trang

100 Mb Trang

14,4 Kbps

12 giây

25 giây

62 giây

28.8 Kbps

6 giây

12 giây

31 giây

33,3 Kbps

5 giây

10 giây

26 giây

56 Kbps (V.90)

2 giây

5 giây

13 giây

64 Kbps (ISDN)

2 giây

4 giây

12 giây

128 Kbps (DSL / Cable)

1 giây

2 giây

6 giây

256 Kbps (DSL / Cable)

<1 giây

1 giây

3 giây

Lợi ích của việc giảm trọng lượng trang?

Tác động tích cực của việc giảm lợi ích trọng lượng trang chủ sở hữu trang web và người tiêu dùng. Lợi ích tiềm năng bao gồm:

  1. Các trang web tải nhanh hơn. Tác động rõ ràng nhất của việc giảm trọng lượng trang là trang của trang web của bạn sẽ tải nhanh hơn cho du khách, bất kể tốc độ kết nối của họ.
  2. Thời gian tải trang thấp hơn tạo ra nhiều hơn du khách thoải mái. Số lượt truy cập ít có khả năng để trở thành thất vọng và đi nơi khác nếu các trang của bạn tải nhanh chóng. Mặt khác, tải trang chậm là một trong những cách chắc chắn nhất để mất khách truy cập và khách hàng tiềm năng.
  3. Nhanh hơn tải lần này sẽ góp phần để chuyển đổi tăng lên. Nhiều khách truy cập sẽ ở lại trên trang web của bạn lâu hơn. Trong số họ sẽ kết thúc việc mua, đăng ký nhận bản tin của bạn, hoặc cuốn sách đánh dấu trang web của bạn.
  4. Nhận thức thương hiệu của bạn sẽ được tăng cường. Trở về khách hàng và thời gian du khách cũng như sẽ nghiêng nhiều hơn để mô tả trang web của bạn (và doanh nghiệp) là "chuyên nghiệp" nếu các trang của bạn tải nhanh chóng.
  5. Các trang với mã sạch, vững chắc, thường sẽ được lập chỉ mục hiệu quả hơn bởi các công cụ tìm kiếm tự nhiên.
  6. Các trang tối ưu hóa trọng lượng thực sự có thể tiết kiệm chi phí băng thông trên các trang web lưu lượng truy cập cao. 100.000 trang mỗi trọng lượng 150 Mb sẽ yêu cầu băng thông gấp đôi từ ISP của bạn hơn 100.000 trang mỗi trọng lượng 75 Mb. Đối với các nhà cung cấp dịch vụ có tính phí cho băng thông sử dụng hoặc cho overages, giảm này có thể tạo ra tiết kiệm đáng kể về phí băng thông.

Hãy xem xét các dữ liệu sau đây, được công bố trong một báo cáo

Visitor Bỏ

Thời gian tải trang

Tỷ lệ phần trăm của người sử dụng
Tiếp tục để chờ

10 giây

84%

15 giây

51%

20 giây

26%

30 giây

5%


2008 24 tháng 4 năm 2008

Thực tiễn tốt nhất: Làm việc với CSS

Đặt Stylesheets ở Top

Nếu bạn muốn có một trang để tải dần dần, có nghĩa là, chúng tôi muốn trình duyệt để hiển thị bất cứ nội dung của nó càng sớm càng tốt, đặt CSS ở trên cùng của trang bên trong tài liệu HEAD. Điều này làm cho các trang được tải nhanh hơn, vì điều này tạo điều kiện cho bản dịch tiên tiến của trang. Điều này đặc biệt quan trọng cho các trang với rất nhiều nội dung và người sử dụng trên các kết nối Internet chậm hơn.

Đó là một thực tế tài liệu đó để nâng cao kinh nghiệm người dùng chung, điều quan trọng là để cung cấp các chỉ số tiến bộ và phản hồi thị giác. Để tránh phải vẽ lại các yếu tố của trang, trong trường hợp nếu phong cách của họ thay đổi, một số trình duyệt, bao gồm IE, khối vẽ của trang cho đến khi CSS được nạp đầy đủ. Bởi vì điều này, người sử dụng là được nhìn thấy một trang trống màu trắng.

Thông số kỹ thuật W3 HTML, cũng nói rằng CSS, tôi phải bao gồm trong phần HEAD của trang HTML. at the bottom of the page, so it's best not to use it. Cũng lưu ý rằng, trong IE @import hoạt động giống như sử dụng <link> ở dưới cùng của trang, vì vậy tốt nhất là không sử dụng nó.

Tránh sử dụng các tính năng trình duyệt cụ thể

Bộ lọc: Sử dụng bộ lọc làm tăng tiêu thụ bộ nhớ và được áp dụng cho mỗi yếu tố, không phải cho mỗi hình ảnh, vì vậy vấn đề được nhân. Ngoài ra, Bộ lọc IE độc quyền, do đó sẽ không làm việc như dự định trong các trình duyệt khác. Nếu bạn muốn có nền trong suốt hoặc gradient, sử dụng 1Pixel với hình ảnh.
Biểu thức: các biểu thức CSS là một tính năng tốt đẹp để có trong CSS, nhưng vẫn là IE tính năng cụ thể. Ngoài ra, điều quan trọng là cần lưu ý rằng, những biểu thức đánh giá khi trang được trả lại và thay đổi kích cỡ, cuộn và ngay cả khi người dùng di chuyển con chuột trên trang. Không cần phải nói điều này có thể ảnh hưởng đến hiệu suất của trang của bạn. Do đó nói cách đơn giản, tránh sử dụng các biểu thức CSS, trừ khi bạn cảm thấy ưu điểm của nó nặng hơn so với các nhược điểm của nó '

Externalise bạn CSS

Sử dụng CSS bên ngoài sẽ dẫn đến tải nhanh hơn các trang bởi vì các tập tin JavaScript và CSS được lưu trữ bởi trình duyệt. CSS nội tuyến trong các tài liệu HTML được tải về tất cả các tài liệu HTML được yêu cầu. Điều này thực sự có thể làm giảm số lượng yêu cầu HTTP được thực hiện nhưng sau đó tăng kích thước của các tài liệu HTML. Bên ngoài CSS được lưu trữ bởi trình duyệt, kích thước của các tài liệu HTML được giảm mà không làm tăng số lượng yêu cầu HTTP.

Xin lưu ý rằng, nếu người sử dụng trên trang web của bạn có nhiều lượt xem cho mỗi phiên và nhiều của các trang của bạn lại sử dụng cùng một kịch bản và stylesheets, có một lợi ích tiềm năng lớn hơn từ các tập tin lưu trữ bên ngoài.

Đóng gói file CSS của bạn

Đóng gói hoặc crunching CSS của bạn là thực hành loại bỏ các ký tự không cần thiết từ mã giảm kích thước của nó do đó cải thiện thời gian tải.

CSS có thể tôi co rút bằng cách loại bỏ tất cả các ý kiến ​​và bất kỳ ký tự không mong muốn như các không gian màu trắng, dòng mới.


2008 14 tháng 3 năm 2008

Thực tiễn tốt nhất cho phát triển giao diện người dùng

Đối với lứa tuổi, tôi đã nghĩ đến việc củng cố tất cả các thực hành TỐT NHẤT, tôi đã được đọc tất cả bây giờ và sau đó. Cuối cùng! Tôi đã nhận được xuống để đặt nó để viết. Tôi nhận ra rằng sẽ là nhiệm vụ khổng lồ tạo ra tài liệu khổng lồ này, vì vậy tôi quyết định dành toàn bộ một thể loại với nó, vì vậy tôi có thể tiếp tục bổ sung thêm công cụ về thực hành tốt nhất như và khi tôi gặp họ ...

Vâng! nội dung ở đây sẽ là một hợp nhất của giao diện người dùng cá nhân của tôi Thực tiễn phát triển tốt nhất với những người được viết bởi các nhà phát triển tiêu chuẩn như Yahoo, Google.

Thêm bài này vào không gian này và giữ browing các loại thực hành tốt nhất


2007 Ngày 15 tháng 9 2007

DOCTYPES là gì? Quirks BROWSER chế độ nghiêm ngặt là gì?

Đơn giản nói cho những người không bao giờ nghe nói về DOCTYPE trước khi ngày hôm nay! DOCTYPE là khai báo trong một tài liệu HTML mà đi kèm trước khi thẻ <HTML>, trông một cái gì đó như thế này (dán từ nguồn của trang này rất)

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">


Tại sao sử dụng DOCTYPE?
Tất cả bắt đầu khi những tiêu chuẩn trình duyệt được giới thiệu bởi W3C. Các nhà phát triển web trước đó thực hiện CSS theo mong muốn của các trình duyệt, để có các trang trả lại một cách chính xác trong họ và các trang web nhất có CSS ​​không hoàn toàn phù hợp với các chi tiết kỹ thuật / tiêu chuẩn.

Vì vậy giải pháp cho vấn đề này là

  • cho phép các nhà phát triển web những người biết tiêu chuẩn để lựa chọn chế độ để sử dụng.
  • tiếp tục hiển thị các trang theo quy định cũ (quirks).

DOCTYPE được sinh ra.

Vì vậy, dựa vào việc trang web mà bạn được thiết kế theo tiêu chuẩn hay không, bạn chọn DOCTYPE thích hợp.


Mối quan hệ giữa chế độ DOCTYPE trình duyệt
DOCTYPE là tuyên bố cho biết rằng trình duyệt của bạn chế độ nào cũng nên làm cho trang HTML hoặc là để được chính xác hơn các trình duyệt như thế nào nên giải thích CSS trong chế độ quirks hoặc chế độ nghiêm ngặt.

Trang cũ bằng văn bản trước khi các tiêu chuẩn này đã được giới thiệu không có một DOCTYPE. Vì vậy khi không có DOCTYPE trong HTML của bạn sau đó trình duyệt ở chế độ quirks.
Nhưng nếu DOCTYPE được định nghĩa là một trong những điều sau đây, sau đó trình duyệt được cho biết là trong chế độ nghiêm ngặt.

<DOCTYPE html PUBLIC "- / / W3C / / DTD HTML 4.01 Transitional / / EN" "http://www.w3.org/TR/html4/loose.dtd">


NDK nhà | Bày tỏ IT | Diễn đạt Palate | Diễn đạt Penmenship | Bày tỏ nỗi sợ hãi | Diễn đạt Myself