yensdesign – Tutorials, Web Design and Coding

Ey guys! Maybe you remember the last post about the Ontuts theme… so I am just want to let you know that We are launching a new blog tutorials called Web.Ontuts focused in spanish web tutorials.

Here you have a little description (in spanish):

Después de varios meses de planificación nos hemos decidido a lanzar Web.Ontuts, una web enfocada al desarrollo y diseño de páginas web de calidad. Existe mucha información a cerca de estos temas, pero en su mayoría está publicada en inglés. Queremos demostrar que también se puede generar contenido técnico de calidad en español.

Estamos realmente contentos de poder anunciar, lanzar y estrenar por fin web.Ontuts. Esperamos que toda la información que publicaremos os sea de gran ayuda para vuestros proyectos y os invitamos a que conozcáis más sobre los temas que trataremos en próximas publicaciones…

You can read the entire post presentation over here.

Thanks for all and see you soon guys!

As we used to think and say over here, sharing knowledge it’s a great way to help others. This time we bring to you four free ebooks about CSS, HTML, Ajax, web programming, javascript, web design and more topics about web development / design.

(more…)

Hi there guys! Via Smashingmagazine I have found a new set of totally free icons for our websites:

This set of 8 high quality icons was designed by David Mottram, containing all icons in .PNG format in resolutions 64×64px, 128×128px and 256×256px.

As I said, the set is available for download for free and can be used for any kind of purposes. It means that you can use it for personal and commercial projects, but cann’t be reselled, sublincensed, and so on…

Happy freebie guys, and thank you so much for helping us to grow so fast!

As always, remember you can follow us on twitter and solve your doubts in our forums!

Hi guys! Here we have a new free icons set composed of 20 icons specially designed for Web applications:

As you can see icons have a 3D effect and glossy style.

Icons come in 3 sizes; 48×48 px, 32×32 px, and 24×24 px. All of them are in PNG format with transparent background. Web Application Icons Set is completely Free for both personal and commercial projects in any way you like.

These icons were made by WebAppers.

Our JK0-016 web designing course will take your creative skills up to next level. Learn how to create unique web icons using 642-456 design tutorial and 642-384 guide.

Hi guys! While we are writting next tutorials about web development, we are recommending you new freebies for your projects.

This time is the Stationery Icon Set:

In this case we are presenting you the Stationery Icon Set composed of 22 totally free icons created by deziner.
It contains book, brush, crayon, clip, color pencils, document, eraser, pad, palette, post-it note, scale and scissors.

You can download the Stationary Icon Set here and remember that it contains the Fireworks source file too!

If you are very forgetful as I am and sometimes when you are “in the flow” and you cann’t remember a javascript function, a CSS property you know, it can be very helpful take your cheat sheet and remember it with a simple glance. You can read your desired cheat sheet in your screen or maybe just print it as a lot of people used to do, with the time you will find it faster and faster because you know the specific area where you must look to find that CSS property that you forgot (remember that visual memory it’s very powerful!).

You can download the Full Cheat sheets pack for Webmasters or download one by one the cheat sheets:

• Html Cheat Sheet cheat sheet
• Html Character Entities cheat sheet
• CSS cheat sheet
• Javascript cheat sheet
• jQuery cheat sheet
• Php cheat sheet
• MySQL cheat sheet

I hope it be useful for those forgetful heads

(more…)

Finally here you have the First Part of this series of tutorials to recreate an OS Web Interface with our lovely jQuery javascript library.

As you could see in the preview of this tutorial we will focus to create the drag & drop interaction, the double click on icons and a basic taskbar with a start disabled button and a real clock of the system.

As always, here you have a preview of the final result:

It will be very interesting how we can achieve all our goals without using thir party plugins etc.

You can try the living example before continue reading the tutorial.

Tested in: Firefox, Internet Explorer 6 (bad display of PNG icons, IE bug) & 7, Opera, Safari & Chrome.

So let’s go guys!

(more…)

Hi there guys! Since some of you are asking about the next big tutorial, here you have a brief of the first part of the tutorial in a video:

As you can see, it’s about creating (one more time) interfaces in javascript, this time we will try to recreate an operation web system from scratch without third party plugins as UI jQuery or the draggable.js.

We will release the first part tutorial this Monday, so stay tuned!

We are trying to make cooler webs by adding javascript effects, cool CSS tricks and more, but what about icons? If you are looking for smashing and free icons that’s your pack

Courtesy of wefunction in their words:

We’ve tried to keep a consistent style with quite a glossy look to the icons, admittedly some are better than others, but our first attempt at a set of icons I’m happy how they turned out. We’ve Included some of the main Social Media Icons such as: Design Float, Digg, Delicious, Furl, Technorati, Flickr, Stumble Upon, Twitter & Many more…

You can download these 128 free icons over here.

Have a nice designing guys! Let us know if you have already used these icons in your websites

Download the VCP-410 tutorial and 640-863 guide to learn how to create inspiring icon designs. We offer free 642-642 design resources to get inspiration.

Hi guys! As we have said many times, websites are evolving to rich online applications and tabbed menus can be very power and useful to show content to our visitors.

In this case, we are going to learn how to create a smooth tabbed menu with our lovely jQuery library. With simple and clean layout we can have a great tabbed menu for our websites.

As always, here you have the live demo before starting the tutorial

Tested in: Firefox, Internet Explorer 6 & 7, Opera, Safari & Chrome.

Interesting…? Just continue reading!

(more…)