I have given these tutorials earlier but I think a reminder will need for newbies. So here are they and I got some useful stuff just for you.
Every web designer has a secret or two. Hard-won workflows, hidden hacks, and insider knowledge that are the mark of true experience and the stuff that separates great web design trainingfrom good.
Here, we've managed to persuade some of the web's busiest devs and designers to part with their most closely guarded tricks and tips. It's quite a collection.
Packed with professional know-how, you'll discover secret features of well known tools, the beta services that the design industry is buzzing about and CSS tricks that make page design for multiple platforms easy. So whether you're a beginner at online design or a web veteran, you're bound to uncover one or two tips here that will change the way you work.
Faster coding
01. CodeKit for browser reloading
CodeKit enables you to instantly see changes in your browser, without refreshing
"If you're on a Mac then CodeKit is a must," says Keir Whitaker, co-founder of Viewport Industries. "The browser reloading feature is worth the small cost alone. The days of hard refreshing your browser to make changes take effect are long gone."
02. Apply global changes
Here's a coding tip from musician, producer and web dev Elliott Fienberg that can help speed things up at the early stages of your design work. Use the wildcard CSS rule - using an asterisk as the selector - and you can globally apply changes to an entire page. For example, to change all the fonts on a page to sans-serif, you just need: *{font-family:arial, helvetica, sans-serif;}
This is a great designer's trick to have in your pocket while you're going through the design process. Of course, it's not such a great idea to leave it in your live code, so use this trick carefully and sparingly!
03. Set garish outlines
File this in the "simple acts of genius" folder - a tip from Christopher Murphy of Web Standardistas that makes cross-platform design so much easier. "When working with media queries, set an outline in a garish colour," says Murphy. "For example: {outline:10px solid green/red/yellow/blue;}. This enables you to instantly see which exact rules are being applied to what you're currently looking at."
04. Check your character count
"45-75 characters per line is generally accepted as safe for comfortable reading," says Trent Walton, founder and designer with Paravel. "There's a quick trick to ensure your responsive or fluid design supports this. Place a line of dummy text on your page with an asterisk at character 45 and an asterisk at character 75. Now test the site to make sure it resizes within these parameters."
05. Use FitVids for video embedding
HTML5 has simplified video embedding, but designers still have two problems. The first is getting video to resize responsively, the second is to ensure resizing degrades gracefully for Flash when HTML5 embedding isn't supported. Enter FitVids, a jQuery plugin that takes care of all that for you.
Dealing with images
06. Smushit for image size reduction
Smushit uses optimisation techniques to remove unnecessary bytes from image files
Sites with highly optimised images load faster and work better on more devices. "SmushIt is a great option to reduce image file sizes," says web developer and Microsoft evangelist Martin Beeby, and we agree. You may also want to give Trent Walton's fave ImageOptim a try.
07. Export images as 8bit PNG
Martin Beeby makes an old-school suggestion for handling PNG image files. "If you're exporting an image from Photoshop to PNG, and it doesn't need to be transparent, try exporting it as an 8bit PNG," he explains. "In most cases the image quality won't be affected but you will massively reduce the file size."
08. PNGQuant for image conversion
If you want to maintain transparency and minimise file size, there's a service that can help. PNGQuant can convert 24/32bit PNGs to 8bit PNGS and still maintain transparency. There's fancy for you.
Layouts
09. Use GuideGuide
GuideGuide is a columns, rows, and midpoints panel for Photoshop
"The best websites are designed to a grid," says Rhys Little, director of digital marketing agency Plug and Play. Setting up grids everytime in Photoshop can be tedious, though. He recommends Guide Guide: "It makes the process a breeze and save you a lot of time creating custom grids."
10. Use a 12-column grid
Another tip from Rhys Little: "Typically it is a good idea to use a grid with columns nicely divisible by 2, 3 and 4. Therefore, a 12 column grid is one of the most popular and versatile grids to use." Check out 960grid for more web design-friendly grid templates for a host of apps.
11. Find colour inspiration
We’re already fans of Adobe Kuler; Martin Beeby has uncovered a use we hadn't thought of: "I'm colour blind and so when I'm putting colour palettes together for a project I always reach for Kuler," he explains. He also recommends Colour Lovers - a creative community where members share colour schemes, designs and ideas.
Web typography
12. Typecast for typographic palettes
Typecast helps you build up a typographic palette quickly
Typecast, an app produced by the talented team at Belfast-based design agency Front, makes designing typographically rich sites a breeze. "It enables you to rapidly build and compare typographic palettes," enthuses Christopher Murphy.
13. Use Typecast with Google Fonts
Monotype recently teamed up with Google to release a new, free public version of Typecast which can be accessed throughGoogle Fonts. It enables you to select any font on the Google Fonts website and then follow the link to the Typecast app.
From there, you can work with that font on text of any length and use a wide range of type controls to build clear, readable type systems through adjustments such as font size, weight and line spacing. Your work can be exported as production-ready HTML and CSS, or PNG files, to share with others or merge with comps.
14. Font Squirrel for free web fonts
Free web fonts have really come of age. With Font Squirrel,Google Web Fonts and the @font-face attribute of CSS3, there's no need to put up with the typography troubles the last generation of web designers struggled so much with. Here's our round up of some of the best free web fonts around.
Plan the perfect site
15 Use Dropbox for version control
Dropbox Pro can be used as a simple versioning system
Keir Whitaker suggests using Dropbox Pro as a simple versioning system. As well as having 100GB of storage, you'll get versioning of your files for 30 days rolling. "More than enough to help you out with those 'accidental' deletes," says Whitaker.
16. Slow down
Visual creatives have a habit of whipping out their sketchbook first. Aidan Martin, senior designer at Alienation Digital, says we all need to slow down. "Don't start with a design: take a scenario-based approach," says Aidan. "Firmly establish the user's goals, map out their journey and then build the design around this."
17. Put your site on a Post-it
Does your design idea fit on a Post-it note, asks Elliott Fienberg? "One exercise I like to do is to write down your core content on a small piece of paper like a Post-it note," he says. "This will help you figure out what is really important and what can be omitted. The small piece of paper simulates the attention span of most users these days."
18. Plan your user flow
Want to know what to do with the rest of those Post-its? "You can expand this exercise by planning out your user flow on a series of Post-it notes," adds Elliott Fienberg. "I guarantee your project will be far more focused." Other sticky notes are available, of course, including virtual Sticky Notes on Windowsand Stickies on OS X.
Photoshop workflow
19. Name your layers wisely
Be as descriptive as possible when naming your Photoshop layers
Rhys Little offers a clutch of tips on sharing Photoshop layouts within your team. His first suggestion: "Be as descriptive as possible when you name your Photoshop layers. It takes a second when creating a new layer to give it a simple name that others will be able to understand. This will save hours of forensic work later on."
20. Bin spare layers
Throw away any extra layers in Photoshop designs, adds Rhys Little. "If you like to save those extra layers 'just in case' then just archive a version with the layers you want to save," he says. Your main file will only contain the layers developers and other designers need access to, minimising confusion.
21. Label your folders
"Make sure you create an ASSETS Folder containing all fonts, images, logos, etc used in your project," continues Rhys Little. "And ensure that those individual folders are labelled accordingly."
22. Keep names consistent
Rhys Little also suggests that you maintain a consistent naming scheme, where the current site design file is always has the same name, rather than incrementally naming files. Older files should then be banished to an archive folder. For example: ARCHIVE WEBSITE.PSD
23. Save everything to server
"Remember to save your work to the server," adds Rhys Little. Even when you're taking an afternoon to tweak a file; "if you are sharing files, you need to ensure that your most recent work is readily available even if you are not."
Keep clients happy
24. Use Pinterest for moodboards
Pinterest is a great way to get started collaborating on moodboards with your client
While we’re talking about keeping clients on your side, we all know that clients love moodboards. They’re a great way to collect elements together quickly and clue your client in - or even get them involved in the initial design process. The easiest way to get started? Create a shared board on Pinterest and invite your client to pin away.
25. Involve clients from the start
"Get the client involved as early as possible and throughout the design process," says Aidan Martin. "Always remember that they know their business best and only by combining this knowledge with your own will you be able to develop a truly successful digital solution."
26. Focus on prototyping
Use prototyping tools to get early versions of your designs in front of clients as soon as possible. This could be as simple as a Fireworks prototype or as complex as a functioning wireframe made in Balsamiq. "Get those signed off before jumping in with Photoshop and it will make your job a lot easier," urges freelance web designer Gavin Elliott.
Boost your career
27. Ask for help
Use a free collaboration tool such as Trello to ask for help when you get stuck
If a job calls for an advanced skill you don't yet have, don't be afraid to ask for help. With free collaboration tools like Trelloand Redbooth you don't even need to be in the same country!
28. Work on your portfolio during downtime
"Don't wait for other people to ask you to try something new or to challenge you," says Ben Howdle, developer at Wapple.net. "In the downtime between jobs, when you’ve finished pitching, you should always be creating new portfolio work. The more inventive, the better."
29. Say yes to new challenges
Ben Howdle has another strategy for keeping the work flowing: say yes to work even if it's outside your comfort zone. "Taking on jobs that challenge you helps you to develop and expand your skills much more than any tutorial. And deadlines are a powerful motivator to learn on the job."
30. Get feedback from Dribbble
Remember how helpful those crit sessions were at college? "Check places like Dribbble for inspiration," urges Ben Howdle. It's a social network for designers, where you can share work in progress and get comments from your peers. Sometimes it takes another designer to tell you where you're going wrong - or right.
Get the Web designing tutorials here:....................
Custom Search Engine is a search engine but it is
different than a normal Search Engine. The different is Normal search engines
like Google( www.google.com),
Yahoo( www.yahoo.com),
Bing( www.bing.com)
are use their own servers for searches. But a Custom Search Engine is not like
that. It depends on the normal search engine. Most of normal Search Engines make
Custom Search Engines for their users like Google( http://www.google.com/cse) So making a Custom Search Engine is not an
difficult task yet it is not an easy task. There are several ways to make you
own CSE.
1.Use a hosting service and upload a CSE to that. This means you have to make
a web page of you CSE and you have to upload it to your custom domain. I
exactly don't know will this work on a sub domain like .blogspot or .wordpress.
But if you don't have a custom domain or you don't like to spend money, you can
use the second method.
2.In this method you can make a CSE via Google. Just go to http://www.google.com/cse
and click sign in. (Before this you have to make a Google account. If you own
one, no matter) Then you can add a CSE to your blog.
The second method is free but it ain't cool like
a real CSE. Because in first method, the CSE is your own one. You can change it
as whatever you want. But in the second method GoogleTM Inc.
controls the CSE. It's just a small bar that add to your site. You can check it
out on the top of this blog. So if you want a real fun, I recommend you to use
the first method. I made a HTML webpage for my CSE but you also can download
it. You just have to change it to whatever you wish via a text editor and
upload it to your custom domain. If you don't have a good text editor, get it
from here. That's enough for today. Let's meet another day with another good
stuff.
Note: You can follow this blog via your Google or Yahoo account. If you
want to follow this just checkout the side bar and you can find the followers
gadget. Don't forget to like this blog's Fb Page: http://www.facebook.com/rasthiyadukarayas
If you own a blog or a web, I think your first problem is 'Traffic'. Isn't that so? Because I also have that problem. So I thought to tell you about SEO(Search Engine Optimization). Some of you may already know about this thing. Doesn't matter. So let's get to the work.
As I said, most of the site owners' first problem is getting a good traffic to their site. There are some small answers for that problem. First thing is Syndicators. You can add your site to a syndicator and all your site updates will be appear in that site. This is a good answer but not at all. For example, If you update you site once a couple of weeks or like that, you can't get the traffic you expect to your site. Therefore, the traffic will be increase only in the days you update you site. So it is not a good answer for that problem.
The second method is advertising. This is a good answer but you gotta pay a huge cost for that unless you can't do it. Some people can do this thing because they can pay a huge cost for their site. But some dudes can't do it or they may be don't like to that. So it isn't a good idea.
The third and the best method is Search Engine Optimization. This is free and you don't want to be worry about your site. If you use this stuff to your site, no matter you update your site once a day or once a month or once a year! All you have to do is submit your info to this webs , make a cup of cappuccino and watch it! Alright! let's check this out.
As I said above, SEO is the cheapest and easiest way to publish you site around the world. So you wanna know how this works huh? That's cool. Go to the sites below and submit you info to those.
Fix the problem with seeing them secure sites (banks or online stores) i found this very useful to me at my work (isp backbone support lot, at the time i was regular support )
Any way... what u need to do is make a new notepad file and write in it the following DLL's.. just copy-paste these
Hey guys! How are you? I couldn't publish a post because I was too busy. However, I got a chance to write few things today. So.........what do you want? Okay. I'm gonna tell you about a good thing. How to survive correctly in the Internet. That's the title of this post. Actually we surf the internet everyday. But our purposes are different. For example, I like to search about crackers. But another one may be like to search music. So some of people are downloading stuff everyday. It can be music, movies, software, E books or any other stuff. Some of these downloading may cause lot of problems to your PC. I mean, these stuff can be pure and harmless. But there are phishers, Black-Hat hackers out down the streets. They are always trying to find a computer to archive their disgusting dreams. Some of those are connected with Some popular websites secretly. So if you download a file from a web like that, your IP address, Location, ISP Server will reveal to that hackers. They can use them and hijack your accounts, sell your information to others and you'll be pissed off or screwed up. So being safe is a good move. Here are some suggestions to get safe.
Download a good antivirus program and install it. Make sure to update it when necessary. Otherwise your safety will be lost.
Download a Internet Security software and install it. (like McAfee)
Scan your PC once a week with your antivirus program.
Don't log in to your mail accounts in a Cyber cafe.
If you follow my instruction, no matter will appear.
So I think this is enough for today. Meet again with another trick. See ya!
Okay. Another day of writing in English. Today, I'm gonna tell you about How to use Google Alerts. This service in given by Google for free. So we can use it for get knowledge.
First you want to type 'Alerts' in the Google search bar. Then Click the top link on the search results. Then you'll go to a page and you have to fill the form in that page. Type the query what you want to know in the 'Query' box. ( ex: News of Sri Lanka ) Then change the result type if you want. After that, you can select how often do you want to get alerts and how many alerts do you want. Then type your Email address in the bar 'Deliver to'. Then hit the button 'Create Alert'. After that, your alert has been created!
You can add many more alerts if you want. You can manage them also. So get enjoy the Google Alerts!
Hello readers! I think you're fine. Okay. Let's get to the business. I've met some people that who boring about blog widgets. They told me that they're looking for some new blog widgets. So I decided to give you some information about blog widgets.
There are lot of blog widgets sites that helpful in blogging. I don't know all of them. But I can tell you some of them. Most of them are give an ultimate service to us. Because that widgets are very very useful. Let's see what are they...........
Who's amung us
This site provides a kind of traffic counter. But it's not a traffic counter. It have two widgets that I recommend for you. One is a side tab that tells how many readers are online. The other one is a map that indicating the location of the readers'. So I also use this two widgets in my site. Goto my home page and check them out!
Widgeo.net
This provides a good traffic counter. When a reader enter to your site, it tells that one reader has entered to this site from a country. So this also is a very useful widget that you can count your traffic with their countries without logging to your blogger account. This also is being used by me.
EasyCounter.com
This site provides a digital traffic counter that has many beautiful widgets. You have to sign-up for this site and choose your widget. Then they'll give you a simple code & you have to paste it in your gadget. This widget also used by me.
FeedJit.com
This site provides a perfect traffic counter. It quiet like widgeo's widget but this indicates readers' countries and when they logged. I also use this widget. You have to install their plugin in your blogger account and it will make automatically a gadget on your blog.
Cbox.ws
This is a chat box that you can add to your site. First you gotta register to this site. Then after all the settlements, click the button share!. Then you will get a HTML code. Paste it in a blog gadget. After save it, your chat box will appear on your sidebar.
So I think you enjoyed the content of this post. If you did and you think this is a good post, please share it with your friends. As a help for me, please follow this blog, put a comment & share this blog.
Thank you!
