PunyPNG - Tối ưu & Tiết kiệm dung lượng ảnh

Hình ảnh là yếu tố quan trọng không thể thiếu để trang trí cho Blog và bài viết. Tuy vậy, những hình ảnh chất lượng tốt thường chiếm dung lượng khá cao, ảnh hưởng đến tốc độ load trang Blog. Chính vì thế mà ta cần phải tối ưu chúng bằng cách giảm dung lượng mà vẫn giữ được chất lượng ảnh.

PunyPNG là một ứng dụng web chạy trên nền Flash giúp bạn nén các file ảnh với mức độ cao nhằm giảm bớt dung lượng cho chúng. Nếu bạn thích dùng định dạng ảnh .PNG nhưng ngại về size của chúng, ứng dụng này sẽ khắc phục tình trạng đó dùm bạn. Rất đơn giản, bạn chỉ việc truy cập vào PunyPNG , chọn file ảnh muốn được nén, click OK để hệ thống làm việc rồi download kết quả về PC, thế là xong.
Hiện PunyPNG hỗ trợ 3 định dạng là .PNG .GIF và .JPG với dung lượng upload tối đa là 500KB, dịch vụ này hoàn toàn miễn phí nên bạn không cần lo bị giới hạn số lượt sử dụng.

Qua vài lần sử dụng, mình nhận thấy rằng PunyPNG hoạt động tối ưu nhất với định dạng .PNG, cho ra kết quả khá hợp ý; 2 định dạng còn lại thì rất khó sửa đổi, và cho ra kết quả không cao. Chính vì thế, mình khuyên bạn nên dùng .PNG là tốt nhất. Ngoài ra, bạn cần download ảnh đã được hiệu chỉnh rồi upload lên host riêng, vì PunyPNG chỉ lưu tạm thời ảnh trong 15 phút.

Thực ra, cơ cấu hoạt động của PunyPNG chủ yếu dựa trên thủ thuật có tên là Dirty Transparency do SmashingMagazine giới thiệu . Tuy nhiên, không phải ai cũng rành về PTS để có thể thực hiện thủ thuật nên tiện ích PunyPNG được tạo ra nhằm thay thế bạn thực hiện.
Hy vọng dịch vụ này sẽ trở thành một địa chỉ hữu ích dành cho bạn. Chúc vui !

Đọc thêm »

Win Toolbox - Công cụ hữu ích cho Windows

Win Toolbox là một tiện ích vô cùng nhỏ gọn, hữu ích và hoàn toàn miễn phí dành cho Windows. Có thể ví nó như tiện ích 'Tất cả trong 1' do tổng hợp nhiều tính năng khác nhau vào một chương trình duy nhất. Đây là một software cần có trong USB của bạn.

Các tính năng mà Win Toolbox hỗ trợ gồm có Program Launcher (chạy chương trình), Screen Capture (chụp screenshot), Color Picker (chọn màu), Fonts viewer (xem trước font) và nhiều chức năng khác. Ngoài ra, chương trình có thể chạy trực tiếp mà không cần cài đặt, rất thuận tiện cho việc 'xách đi' khi bạn sử dụng PC khác.
Vì tính đa chức năng và cách sử dụng đơn giản của Win Toolbox, nên ở đây mình chỉ giới thiệu sơ về chức năng cũng như giao diện của chúng. Bạn hoàn toàn có thể tự nghiên cứu rõ hơn tiện ích này.

  

Mục Capture (Chụp screenshot với nhiều tùy chọn)

  

Mục Picker (Tìm mã màu)

  

Mục Fonts (Cho phép xem trước kiểu font chữ)

Mục About (Thông số PC, cài Win Toolbox vào Startup, transparent thanh Taskbar)

Nào, hãy download ngay Win Toolbox để thử nghiệm các tính năng hữu ích của nó nhé !

Đọc thêm »

Tạo tính năng Link-Thumbnail cho Blog

Chắc các bạn Blogger cũng đã từng biết qua Websnapr, công cụ giúp người đọc xem trước nội dung của liên kết. Tuy nhiên, do công cụ đó được Websnapr mặc định và không thể sửa đổi nên khiến một số bạn không ưng ý. Vì thế mà một blogger trên Internet - arc90 đã tự tùy chỉnh lại mã JS của công cụ với một số ưu điểm sau :

• Chỉ hiển thị ảnh thumbnail.
• Không có link quảng cáo.
• Có thể sử dụng với từng link riêng biệt hoặc tất cả .
  
• Tốc độ load nhanh.
• Dung lượng file JS khá nhẹ (~5.4 KB).
  

Bạn có thể xem screenshot dưới đây để thấy kết quả :

Để tạo chức năng này cho Blog, bạn hãy thực hiện các bước dưới đây :

1. Đăng nhập vào Blogger > Layout > Edit HTML (không cần Mở rộng Mẫu tiện ích).
2. Tìm thẻ </head> và dán đoạn code dưới đây vào ngay bên trên :
   
   <style type='text/css'>
       .arc90_linkpic {
           display: none;
           position: absolute;
           left: 0;
           top: 1.5em;
           width: 160px;
           height: 120px;
       }
       .arc90_linkpicIMG {
           padding: 0 4px 4px 0;
           background: transparent url(http://boyprodx.googlepages.com/linkpic_shadow.gif) no-repeat bottom right;
           width: 160px;
           height: 120px;
       }           
   </style>
3. Tiếp theo, dán đoạn code dưới đây ở phía trên thẻ </body>
   
   <script src='http://boyprodx.googlepages.com/arc90_linkthumb.js' type='Text/JavaScript'/>
4. Save lại template.
5. Tới đây bạn có 2 lựa chọn :
   - 1 là sử dụng Link-Thumbnail cho từng link riêng biệt với cú pháp :
   
   <a class="linkthumb" href="Đường Link">Tên hiển thị</a>
   - 2 là sử dụng Link-Thumbnail cho toàn bộ link bằng cách dán kèm đoạn code này vào ngay bên dưới file JS ở bước 3 :
   
   <script type='text/javascript'>
   arc90_linkThumbUseClassName = false;
   </script>

Vậy là bạn đã tạo được chức năng Link-Thumbnail cho Blog của mình rồi đấy. Khuyến khích các bạn đang dùng công cụ của Websnapr cũng như các bạn chưa dùng nên sử dụng tính năng này, đảm bảo sẽ vừa ý hơn.
Hy vọng thủ thuật này sẽ giúp ích cho bạn. Thân !

Đọc thêm »

Những screenshots của Google Chrome OS

Như các bạn đều biết, thông tin về hệ điều hành của Google đã được các tờ báo công nghệ đưa tin từ vài tuần qua. Mặc dù chưa công bố chính thức, nhưng có vẻ Chrome OS này được fan của Google khá quan tâm.

"Mã nguồn mở, dung lượng nhẹ, thích hợp cho netbooks và yếu tố 3S (Speed, simplicity, security - Tốc độ, đơn giản và bảo mật)" - đó là những đánh giá của Google về OS này. Dự kiến OS sẽ được ra mắt trong vài năm tới. Liệu trong lúc đó, Google có thể biến hệ điều hành của mình đạt chất lượng như đánh giá không, và Microsoft có thể cải tiến Windows OS của mình để vượt qua đối thủ không? Hãy cùng chờ nhé !

Mời bạn xem qua những screenshots của Google Chrome OS bên dưới đây và chia sẻ cảm nhận !

 

Giao diện của Google Chrome OS ...

  

... phiên bản 0.2.5 Alpha

  

Shortcut truy cập vào dữ liệu (?)

  

Các logo Google, Adobe, FSF (Cộng đồng mã nguồn mở), Linux và (?)

  

Trình duyệt quen thuộc - Chrome ...

... phiên bản 3.5 Beta

  

Giao diện trang chủ Google trên trình duyệt

  

Các nút lệnh điều khiển trang

  

Các lệnh điều khiển cửa sổ được thay bằng Text

  

Thanh Bookmark nằm theo chiều dọc của trình duyệt

  

Thanh cuộn

  

Tốc độ kết nối

 

Tổng quát giao diện Google Chrome OS

[Nguồn : www.downloadsquad.com]

Đọc thêm »

Tạo tính năng Tooltips với CSS

Tooltips là công cụ nhỏ gọn cho phép Blogger có thể chèn một đoạn thông tin ngắn vào bất kì nội dung nào trong Blog, giúp người đọc có thể hiểu rõ hơn về giao diện của mình. Có khá nhiều cách để tạo Tooltips như JS, jQuery ... ; tuy nhiên do các cách trên hơi dài dòng nên trong bài viết này, mình sẽ hướng dẫn các bạn tạo Tooltips bằng ngôn ngữ CSS nhỏ gọn.

Toàn bộ code của thủ thuật này chỉ chiếm dung lượng <1KB nên bạn không phải lo ảnh hưởng đến tốc độ truy xuất Blog. Đồng thời nó hoạt động tốt trên mọi trình duyệt, kể cả IE6 lỗi thời. Bạn có thể xem screenshot của Tooltips ngay bên dưới đây:

Để tạo chức năng này cho Blog, bạn hãy thực hiện các bước dưới đây :

1. Đăng nhập vào Blogger > Layout > Edit HTML (không cần Mở rộng Mẫu tiện ích).
2. Tìm thẻ a:hover trong template như hình dưới:
   
   
   rồi dán đè lên nó bằng đoạn code dưới đây :
   
   a:hover {background:#ffffff; text-decoration:none;}
   a.tooltip span {display:none; padding:2px 3px; margin-left:8px; width:150px;}
   a.tooltip:hover span{display:inline; position:absolute; background:#ffffff; border:1px solid #cccccc; color:#6c6c6c;}
3. Save lại template. Vậy là bạn đã thiết lập được tính năng Tooltips cho Blog.
4. Để sử dụng chức năng này, bạn sử dụng cú pháp :
   
   <a class="tooltip" href="#">Tiêu đề<span>Nội dung hiển thị trong Tooltips</span></a>

Vậy là bạn đã tạo được chức năng Tooltips cho Blog của mình rồi đấy. Hy vọng thủ thuật này sẽ làm bạn hài lòng. Chúc vui !

Đọc thêm »

Get-link MediaFire một cách dễ dàng

MediaFire là một địa chỉ khá nổi tiếng trong lĩnh vực hosting mà chắc hẳn các bạn đều biết. Nhờ cung cấp những tính năng hữu ích (chỉ có trong tài khoản Premium ở các dịch vụ hosting khác) cho người dùng miễn phí và chất lượng ổn định, MediaFire dần chiếm được lòng tin ở người sử dụng.

Tuy vậy, do người dùng VN thường sử dụng dịch vụ ở loại tài khoản miễn phí nên cũng bị giới hạn một số tính năng, dễ thấy nhất là Direct-Link. Để khắc phục tình trạng đó, một số website đã được tạo ra với mục đích get-link trực tiếp từ MediaFire. Mình cũng đã test một số site nhưng vẫn chưa ưng ý lắm (do phải vào trang chủ của các site mới get-link được) , nên đã search thêm trên Google và vô tình biết đến site MediaFireGet.

Website cho phép người dùng có thể get-link trực tiếp mà không cần vào trang chủ. Bạn chỉ việc copy link download ban đầu của MediaFire, rồi dán vào hộp thoại download và thêm từ GET, vậy là có thể download ngay. Ngoài ra, bạn còn có thể sử dụng tính năng Get-link Folder (lấy tất cả link download từ URL Sharekey) tại trang chủ MediaFireGet.

Copy link download ban đầu của dịch vụ MediaFire.

Dán vào hộp thoại Download, đồng thời thêm từ GET trước .com rồi click OK

 Sau đó, chờ vài giây để hệ thống tự get-link. Khi thấy size của file xuất hiện thì Download.

Nếu bạn biết dịch vụ tương tự khác, hãy chia sẻ cho mọi người thông qua comment nhé. Hy vọng bài viết này sẽ giúp ích cho các bạn. Thân !

Đọc thêm »

Những hình ảnh đầu tiên về FireFox 4.0

Vài hôm trước, các bạn đã được xem qua thông tin về phiên bản 3.7 của trình duyệt 'Cáo lửa'. Thế nhưng không lâu sau, nhóm phát triển Firefox lại tiếp tục khiến người dùng bất ngờ khi đăng tải những hình ảnh về thiết kế mới nhất của Firefox 4.0 trên trang Wiki của mình.

Firefox Screenshots: Thanh Tabs ở vị trí Top hay Bottom ?

Những hình ảnh của Firefox trên Windows OS phía dưới đây có thể cho bạn thấy rằng, Mozilla đang băn khoăn giữa 2 thiết kế chính cho phiên bản 4.0 : Thanh Tabs ở vị trí Top (Trên cùng) và Bottom (Phía dưới). Vị trí phía dưới là thiết kế quen thuộc ở Firefox, trong khi ở vị trí trên cùng lại khiến Firefox mang chút dáng vẻ của trình duyệt Google Chrome.

Vị trí thanh Tabs quen thuộc trên Firefox ...

... và vị trí dự kiến sẽ được thay thế.

Ngoài ra, Mozilla còn tóm tắt những ưu và nhược điểm của hai mẫu thiết kế này khá chi tiết :

Ưu điểm :

    - Tiết kiệm không gian theo chiều dọc.

    - Hiệu quả / Loại bỏ tính phức tạp - Các tab cần được kết nối tới một phần tử nào đó khi sử dụng. Vì vậy, họ có thể thêm một phần tử trực quan khác để chúng liên kết đến.

    - Rút ngắn khoảng cách đến chức năng Page Controls.

Nhược điểm :

    - Mất sự quen thuộc - Người sử dụng sẽ cảm thấy không quen khi giao diện bị xáo trộn.

    - Thanh tiêu đề bị loại bỏ - Bạn chỉ còn thấy được đoạn rút gọn của tiêu đề trên tab.

    - Tăng khoảng cách đến thanh Tabs.

    - Mất đi khoảng trống giữa icon của trình duyệt và widgets trên cửa sổ.

Tính năng mới của Firefox 4.0: Nút tích hợp Stop/Refresh/Go.

Ngoài việc thay đổi toàn bộ thiết kế đặc trưng, Firefox 4.0 còn có tính năng mới : Đó là Tích hợp Stop/Refresh/Go vào 1 nút duy nhất.

Thay vì tách ra thành các nút riêng biệt, chúng được tổ hợp thành nút '3 trong 1' nằm ở góc phải thanh Address. Nó cũng đồng thời thay đổi màu sắc dựa trên các hoạt động. Chẳng hạn nếu như bạn gõ địa chỉ web, nó sẽ biến thành nút Go màu lục ; Còn trong quá trình load trang, một nút Stop màu đỏ sẽ thay thế.

Thêm vào đó, do thanh trạng thái cũng bị lược bỏ, nên dòng đo quá trình load trang cũng được đem lên trên cùng và nằm dưới thanh địa chỉ.

Tích hợp 3 chức năng Stop/Refresh/Go trong 1 nút.

[Nguồn : www.mashable.com]

Đọc thêm »

Tạo chức năng Hide/Show nội dung với Javascript

Lúc trước, mình có giới thiệu đến các bạn thủ thuật tạo tag Spoiler để ẩn nội dung bài viết giống các forum,  dùng thẻ DIV để hoạt động. Nếu bạn thích dùng Javascript hơn, hãy sử dụng thủ thuật Hide/Show ở bài viết này.

Để tạo chức năng này cho Blog, bạn hãy thực hiện các bước dưới đây. Nhưng trước tiên, mời bạn xem qua kết quả của thủ thuật :

1. Đăng nhập vào Blogger > Layout > Edit HTML (không cần Mở rộng Mẫu tiện ích).
2. Dán đoạn code dưới đây vào ngay trên thẻ </head> :
   
   <style type="text/css">
   .commenthidden {display:none}
   .commentshown {display:inline}
   </style>
   <script type="text/Javascript">
   function togglecomments (postid) {
   var whichpost = document.getElementById(postid);
   if (whichpost.className=="commentshown") { whichpost.className="commenthidden"; } else { whichpost.className="commentshown"; }
   } </script>
3. Save lại template. Vậy là bạn đã thiết lập chế độ Hide/Show cho Blog.
4. Để sử dụng chức năng trong bài viết, bạn chèn đoạn code dưới đây vào khung soạn thảo :
   
   <a href="javascript:togglecomments('ID-Name')">Click để Ẩn/Hiện nội dung</a><br />
   <div class="commenthidden" id="ID-Name">Nội dung</div>
   Note : Để chức năng hoạt động, bạn cần đặt ID-Name trùng khớp với nhau và ở trạng thái xuất bản (Trong trình soạn thảo sẽ không thấy hoạt động).
   

Vậy là bạn đã tạo được chức năng này cho Blog của mình rồi đấy. Hy vọng thủ thuật này sẽ làm bạn hài lòng. Chúc vui !

Đọc thêm »

Download Norton Internet Security 2009 với bản quyền 3 tháng

Bảo vệ PC khỏi bị virus trong quá trình sử dụng không bao giờ là vấn đề cũ với người dùng. Những tên tuổi trong lĩnh vực bảo mật như Kaspersky, BitDefender, NOD32 ... có lẽ cũng quá quen thuộc đối với bạn. Nếu bạn yêu thích hãng Symantec, thì sản phẩm Norton của thương hiệu này sẽ không làm bạn thất vọng.

Hiện tại, Symantec đang cung cấp miễn phí cho người dùng bản quyền 3 tháng của phần mềm Norton Internet Security 2009. Nếu bạn vẫn chưa tìm được trình Antivirus ưng ý, vậy hãy thử nghiệm chương trình này. Phiên bản Internet Security cung cấp cho bạn toàn diện các tính năng như Norton Antivirus (Diệt Virus), Norton Personal Firewall (Tường lửa), Norton Antispyware (Diệt phần mềm gián điệp) và Norton Antiphishing (Diệt phần mềm lừa đảo).

Để nhận được bản quyền, bạn hãy vào trang này và nhấn Download Now để tải về bản cài đặt có kèm bản quyền 3 tháng (dung lượng gần 104MB). Norton Internet Security 2009 hoạt động trên Windows XP và Vista (chưa hỗ trợ Windows 7). Hãy nhanh tay download nhé !

Đọc thêm »

Biến giao diện Firefox 3.5 thành phiên bản 3.7

Như các bạn đều biết, vài hôm trước Mozilla đã tung ra vài tấm hình về giao diện dự kiến của Firefox 3.7. Phiên bản này đã có thể sử dụng giao diện gương Aero của Windows Vista/7 trông rất bắt mắt. Khá nhiều fan của trình duyệt 'Cáo lửa' đều cảm thấy ưng ý với phiên bản này. Nếu bạn không đủ kiên nhẫn để được sử dụng giao diện mới toanh này, hãy tự đem nó vào phiên bản Firefox đang dùng nhé.

Note : Để thực hiện thành công thủ thuật này, yêu cầu bạn sử dụng OS Windows Vista/7 và Firefox 3.1 trở lên. Nếu không đủ điều kiện trên, bạn chỉ hoàn tất được 80% tác phẩm của mình thôi đấy !

Đầu tiên, bạn cần cài đặt các addon sau đây vào trình duyệt :

• Personal Menu - Dùng để tạo icons bookmark và tools.
• All Glass - Dùng để sử dụng tính năng Aero Glass vào thanh toolbars (Nếu không đủ điều kiện, hãy bỏ qua).
  
• Stylish - Chèn thêm một số tính năng cho tab.
  
• Theme Firefox 3.7 - Download file Zip về và giải nén (Sử dụng trình WinRAR)

Trước khi Restart trình duyệt, bạn mở tab Themes trong hộp thoại Addon, rồi kéo thả (drag & drop) file Firefox-3.7[...].JAR trong file Zip vừa mới download về vào đó. Firefox sẽ hỏi bạn muốn xác nhận cài theme không, chọn Install rồi Restart trình duyệt.

Thế là chúng ta đã cài đủ phụ kiện cần thiết. Bây giờ, để thiết lập Firefox mang giao diện 3.7, bạn tiếp tục thực hiện các bước sau :

• Với addon Personal Menu, mặc định nó sẽ có giao diện như thế này :
  
  
  - Bạn right-click vào bất kì vị trí trống trên Toolbars > chọn Customize > drag & drop icon History (icon giữa) + Home vào hộp thoại Customize Toolbars.
  - Tiếp theo, nhấn vào icon Tools (icon cuối) > chọn Edit this menu. Một hộp thoại xuất hiện > hãy chuyển sang tab Advanced và tick bỏ chọn dọng Hide Drop-maker > Ok.
  
  
• Với addon Stylish, bạn sẽ thấy có một icon chữ S nằm ở góc phải màn hình. Left-click vào nó > Write new style > Blank style. Một hộp thoại xuất hiện, tới đây bạn mở file newtabfix.txt trong file Zip ở trên > copy all > dán vào hộp thoại mới (phần Name và Tag điền tùy ý) > Save.
  
  
  
  
• Cuối cùng, bạn right-click vào bất kì khoảng trống trên thanh Toolbars > Bỏ chọn dòng Menus Toolbar.
  Để hiển thị lại thanh Menu, bạn không cần phải dùng tổ hợp phím Ctrl_Shift_Alt_S như thông báo, mà chỉ cần nhấn Alt là đủ.

Kết quả :

Thỏa các điều kiện đầu bài (Cứ như đang làm Toán )

Chưa thỏa (Do mình xài Windows XP nên không có Aero )

Vậy là xong rồi đấy, Firefox của bạn đã được khoác chiếc áo mới toanh. Nếu có sai sót, thắc mắc trong quá trình thực hiện, bạn hãy góp ý cho mình qua comment nhé. Hy vọng bạn hài lòng với thủ thuật này. Chúc vui !

[Nguồn : www.askvg.com]

Đọc thêm »