Best Web Buzz

The Missing Text Editor for Mac. How true?
A lot has been said about TextMate on Mac OSX. I just have to try it my self.

On my first glance about TextMate’s UI (User Interface), it really look ordinary to me. It even looks like TextEdit except with line code on the left.

So it tried using it on my daily web development task and found out it has more to it. One of them is converting non-ASCII characters in a few clicks and ticks on your input devices. Just highlight your line of code and press shift + cmd 7 it select the filter you want to do and it converts non-ASCII characters into html character entities.

So there is more in to TextMate that I haven’t explored so I bought this book “Textmate: Power Editing for the Mac (Pragmatic Programmers)” to learn more about TextMate’s hidden power on editing.

So when I find my self master of this tool then I will post another story on how my journey went with TextMate.

Feel free to drop me a line of comment below. Cheers!

Helpful sites to get you started with Web Designing or Front-end Web Development.

I wanted to share useful sites for all the aspiring web developers and designers.

Designing

First I don’t know where to start and where to find tutorials for Web Designing.  I google around and found “pixel2life.com“it has daily updates for user submitted tutorials on Adobe Photoshop. So as I explore more on the community of Web Designing I found “PSDTUTS.com” where they have a lot of amazing Tutorials to sharpen up your skills. Then I purchased a DVD on Lynda.com to master my skills on Adobe Photoshop. Now you don’t have to read tutorials you can just watch and listen how the pros do the job.

http://pixel2life.com User submitted tutorials
http://psdtuts.com Designing tutorial
http://lynda.com Commercial Video tutorial

HTML CODING & CSS

Almost everyone who wants to start Web Development always refer to w3schools.com they have a wide variety of programming language for web. Then sharpen it up with nettuts.com with tips tricks and bug fixes. Every front-end web developer I know, checks CSSGLOBE.com for the latest updates and news on web standards. Css-tricks.com offers free video tutorials for web development and it has been very useful for people who want to jumpstart their web development carrier. Lynda.com also has a huge library for any web development programming and designing tutorial.

http://W3schools.com
http://nettuts.com
http://cssglobe.com
http://css-tricks.com
http://Lynda.com

So learning web development isn’t that expensive at all. Any sites you recommend for newbies on web development? Please post it on the comment box below

Last week our company had a skill test exam for front-end web developer vacancy. I sneak peek a couple designs and I found out some bad habits in their codes.

Here are the coding habits you would like to avoid.

Use the right tag for appropriate function.

vertical category list

Here is a bad vertical category list source code.
Example 1

Comment: overkill div tags

<div> Shop by Categories</div>

<div class=”business”>Business and Management</div>

<div class=”business”>Business and Management</div>

<div class=”business”>Business and Management</div>

<div class=”business”>Business and Management</div>

Example 2

Comment: dont use heading tags on your category list

<div class=”business_management”>

<a href=”#”><h2>Business and Management</h2></a>

</div>

<div class=”business_management”>

<a href=”#”><h2>Business and Management</h2></a>

</div>

<div class=”business_management”>

<a href=”#”><h2>Business and Management</h2></a>

</div>

Example 3

Comment: update your web development skills

<div class=”shopbycategories”><font class=”shopbycategoriesText”>Shop by Categories </font></div>

<div class=”greenleftBG”><font class=”businessmgtTEXT”>Business and Management<br>

Business and Management<br>

Business and Management<br>

Business and Management<br>

Business and Management<br>

Business and Management<br>

Business and Management<br>

</font><br>

Here is the correct way presenting your source code for vertical category list

Comment: your id=”category” will now take care of the styling

<div id=”category”>

<h2> Shop by Categories </h2>

<ul>

<li><a href=”#”> Business and Management</a></li>

<li><a href=”#”> Business and Management</a></li>

<li><a href=”#”> Business and Management</a></li>

</ul>

</div>

Remember you are coding for a vertical category “list” so you might as well use list tag and make use of li tags.

Start your own website with these easy to follow steps organized to make the process of having a website a breeze.

http://www.jampmark.com/website-creation-tips