FindIcons.com – Thư viện icon, vector khổng lồ cho nhà thiết kế

Khi bạn thiết kế một trang web, một ứng dụng hay một văn bản. Chắc chắn bạn sẽ cần những hình ảnh để mình họa và làm đẹp thêm cho sản phẩm của mình. Đó chính là lí do Findicons ra đời, Findicons.com với cở sở dữ liệu biểu tượng hình ảnh khổng lồ, tha hồ cho bạn thỏa sức sáng tạo.

Đây là một trang tìm kiếm hình ảnh vector, icon, … yêu thích của mình mà mình muốn giới thiệu đến bạn đọc.

Giới thiệu Findicons.com

Findicons.com là một website đã ra đời từ rất lâu, sau bao nhiêu năm phát triển, với thư viện icon không lồ chắc chắn sẽ làm hài lòng các designer khó tính nhất.

Whois của findicons

Hướng dẫn sử dụng Findicons.com

Hướng dẫn sơ lược cách tận dụng sức mạnh của findicons một cách tuyêt đối. 

Giao diện chính của Findicons

Gõ từ khóa vào hộp tìm kiếm ở trên để tìm  những hình ảnh phù hợp nhất với yêu cầu của bạn. Ví dụ như ở đây mình muốn tìm hình cái tên lửa, mình gõ vào “rocket” -> enter. Lập tức các biểu tượng liên quan có đính từ khóa “rocket” sẽ đươc hiển thị ra trước mắt bạn:

Giao diện tìm hình ảnh

Bên trái là thanh công cụ nhanh giúp bạn tìm kiếm hình ảnh được chính xác hơn, và gần hơn với yêu cầu của bạn.

Bên phải là các hình ảnh phù hợp với từ khóa ban đầu của bạn đề ra, và các thông số bên cột trái.

Nếu tìm đươc một hình ảnh ưng ý, click lên nó bạn sẽ đươc đưa đên một trang khác với đây đủ các thông tin về kích thước, bản quyền, …

Thông tin icon

Ngoài định dạng icon chuẩn là .ico, còn có nhiều định dạng khác để bạn lựa chọn sao cho tiện sử dụng và chỉnh sửa theo ý thích. Findicons còn cung cấp cho bạn các thông tin về bản quyền, kích thước, tên tác giả, … .

Nếu kích thước không hợp nhãn bạn có thể chuyển qua tab Other size để tìm hình ảnh tương tự với các size khác:

Tab Other size

Mặc dù là tìm biểu tượng (icon), nhưng findicons càng ngày càng cung cấp nhiều hình ảnh đa dạng hơn, có cả những hình ảnh kích thước lớn có thể dùng để trang trí cho web rất đẹp. Chúc các bạn tìm được nhiều hình ảnh ưng ý!  

Read More

jsFiddle – Công cụ chỉnh sửa và test code HTML, CSS, Javascript trực tuyến

jsFiddle, một công cụ trực tuyến giúp bạn test và nghiên cứu các đoạn javascript mới trước khi đưa nó vào website. Điểm nổi trội mà công cụ trực tuyến này đem lại là tính tức thì, sau khi soạn thảo xong bạn có thể cho run code bất cứ lúc nào. Công việc chỉnh sửa trở nên đơn giản hơn bao giờ hết. Thay vì ta phải ngồi tạo một file .html và chạy nó thử bằng chương trình duyệt.

Tổng quan jsFiddle

Giao diện chính jsFiddle

Giao diện tương đối dễ sử dụng, bạn chỉ cần gõ code HTML, CSS, Javascript vào các ô tương ứng. Sau đó ấn nút Run trên thanh công cụ. Kết quả sẽ hiển thị ngay ở khung result, đây là kết quả khi code của bạn được thực thi.

Thanh công cụ

Ngoài Run bạn còn có thể save lại để chia sẽ với người khác (sau khi save, xem địa chỉ trên thành url của trình duyệt)

Bên cạnh tính tức thì của jsFiddle, bạn còn thấy jsFiddle cung cấp cho ta rất nhiều thư viện Javascript nổi tiếng hiện nay như Jquery, MooTools, YUI, … . Rất tiện lợi để học Jquery nói riêng và Javascript nói chung.

Thay đổi framework cho Javascript

Ngoài dùng để test code, jsFiddle còn là một công cụ hữu hiệu để share code của bạn với người khác, làm việc nhóm dễ dàng, hoặc show hàng bản demo, .. v..v.. . Tùy vào cách sử dụng sẽ làm công cụ này trở nên có ích cho hành trình “vọc” code của bạn.

Một số chức năng khác của jsFiddle

Đăng nhập/Đăng kí

Ngoài một số chức năng cơ bản của jsFiddle là chỉnh sửa và run, bạn có thể tạo cho mình một tài khoản để lưu lại những đoạn code mình đã soạn và chia sẽ nó với mọi người hoặc dễ dàng quản lí và phát triển lên sau này.

Quá trình đăng kí khá đơn giản, chỉ cần username password và địa chỉ email để nhận những thông tin mới từ jsFiddle.

Sau khi đăng nhập bạn sẽ thấy các code mà bạn đã tạo ngay tại dashboard mới hiện ra.

Dashboard

Hãy tạo cho mình một tài khoản riêng để dễ dàng quản lí những code mình đã tạo nhé. Trong hình là tài khoản của mình. Đây là toàn bộ code drop down menu đơn giản với Jquery mình từng trình bày trong bài viết trước:

http://jsfiddle.net/minhnhut/qgQUW/

Khi bạn xem một đoạn code, jsFiddle cung cấp một số nút lệnh nâng cao khác như trong hình dưới đây:

Thanh công cụ nâng cao

Update: cập nhật code hiện tại (nó phải được save trước đó)

Fork: sao chép code hiện tại ra thành một tài liệu mới (địa chỉ mới, không ảnh hưởng đến code hiện tại)

Set as base: Thiết lập code hiện tại là phiên bản đầu tiên, mặc định mỗi lần save jsFiddle sẽ tăng version của code lên 1, set as base sẽ đưa con số đó về thành 0. (Áp dụng được với code do bạn soạn)

TidyUp: Tự sắp xếp, làm cho code trong dễ nhìn hơn

JSLint: Kiểm tra cú pháp của Javascript, nếu nó nói là vaid tức code của bạn không có lỗi. Chú ý: chỉ kiểm tra cú pháp thôi nhé, lỗi phát sinh trong quá trình code thực thi thì chức năng này bó tay.

Nhìn tổng quát, jsFiddle thật sự là một công cụ tuyệt vời để chỉnh sửa javascript và chia sẽ code với mọi người.

Read More