250 Quick Web Design Tips

All in one Web Design Tips 
As web professionals, we’re always looking for ways to improve our knowledge and skills. Tips, tricks and checklists are often one of the most underused yet potentially useful models of providing great, quick and easy to follow pieces of useful information.


You may or may not know some of the tips below — and you may or may not agree with everything listed — but hopefully it will give you some ideas for your own sites or motivate you to create a checklist to help cover your bases.


Perhaps a few items may even inspire you investigating a subject further, and that would be pretty awesome too.


One fundamental aspect of creating a website is the planning stage. This includes things like looking for a domain registrar and hosting package, seeking out inspiration for your design, building the information architecture, and much more.


Getting your website’s purpose mapped out will help you better write content (to match your needs) and more effectively create a design that will retain the look-and-feel you want to put across.


Below are some tips and tricks which may prove useful when you’re making decisions before putting your (or your clients’) website together.


Picking Domain Names
1. Many people are used to seeing the www at the beginning of a website address (e.g. www.sixrevisions.com). Ensure your website functions both with and without this famous subdomain.


2. Reserving a subdomain called m (e.g. m.sixrevisions.com) for mobile devices has become a common web design convention. It’s cheaper than — and as widely recognised as — the .mobi top-level domain (TLD).


3. Most of the non-technical general public tend to only recognise .com, .net and .org. It’s worth checking the TLDs you want are available before dedicating yourself to a brand name.


4. Avoid using dashes in your domain name. (e.g. sixrevisions.com versus six-revisions.com).


5. Domain hacks like del.icio.us have become pretty popular, and while they may be harder to spell, they can give you an awesome alternative to a simple but unavailable .com address.


6. If you want to target a local audience, it may well benefit you to purchase a country code top-level domain (ccTLD) in your own country. Something like co.uk may be great for grabbing regional visitors in the UK.


7. Remember that some ccTLD domains require you to be a resident of a certain country. If you don’t live there, you could forfeit the TLD as a violation of the registrar’s agreement.


8. WHOIS privacy can be a dicey affair when you allow your registrar to put their details in place of your own. You run the risk that you may lose the domain if a conflict occurs.


9. Domain auctions like Sedo can be a great place to get a domain that’s already been taken. While it can be somewhat expensive to pick up a rare domain, you might find yourself the owner of your preferred domain name.


Web Hosting
10. When picking a website host, ensure that you check what you’ll get in the package. Disk space, bandwidth, CPU usage and other specified features may decide the cost you’ll encounter. If you already have a web host, test their performance using these tools.


11. Beware of hosts proclaiming unlimited bandwidth or resources. Everything in this world is finite and you may find yourself falling short of contractual small print and fair use policies.


12. If you’re starting a website or service of your own, it pays to start off with shared or grid hosting rather than a VPS or dedicated because you won’t know how many visitors you will need to cater for.


13. Free hosting for commercial use is not a good idea. If you plan on having a commercial website, it makes sense to avoid the intrusive advertisements and purchase some basic web hosting.


Development Platform
14. If you want to have a good testing environment that will run PHP and mySQL on your own PC, install XAMPP. It’s quick, easy and will help you get things running before you go live.


15. Unless you know what you’re doing and have the money to finance the infrastructure, hosting your own website may not be the best or most economical idea (as fun as it sounds).


16. Pick your development platform carefully as some products (such as WYSIWYG editors) inherently produce less reliable code than a classic text editor that allows you to write by hand.


Tools
17. You don’t need to rely on Adobe or Microsoft software to create a fantastic website as there are lots of free and open source products which can do the job without cost.


18. Ideas: GIMP, Inkscape, Dia, FileZilla, IcoFX, Audacity, Paint.NET, Scribus, Eclipse, Skype, KeePass, Xenu Link Sleuth, Tweetdeck, FoxIt Reader and Notepad++ are great free products for designers. For more great open source products, read the article called 30 Useful Open Source Apps for Web Designers.


19. Finding a good selection of checklists and cheat sheets can give the fledgling designer some quick, easy places to get advice on how best to approach a task.


Project Management
20. Set yourself aside a decent workspace environment. The less distractions your workspace has, the better off you will be in terms of productivity.


21. Always have realistic expectations about how long a project will take to complete. Rushing your work and releasing it "half-baked" can cause issues — just look at Windows Vista.


22. Getting some decent time-tracking or project management software is important. It’s far too easy to get distracted and lose sight of the big picture if you’ve lots of small tasks to achieve.


23. To-do lists may seem inconsequential and rather trivial, but you may find them useful in structuring all the various tasks you need to deal with and setting yourself deadlines.


Learning
24. Always keep learning because there is no excuse in allowing your education to lapse or become deprecated. You could keep up to date with news through design blogs or perhaps learn a new web language.


25. There are many fantastic web design books and magazines out there. They also cover a wide range of subjects with ever-increasing depth as a source of education they are second to none.


26. Web resources like Six Revisions are great for learning new techniques. While perhaps not as in-depth as books, many web resources offer you useful and up-to-date advice on the web industry.


27. Remember to verify anything you learn through a third party resource. There’s an awful lot of outdated information out there (like W3Schools) that could encourage bad habits.


28. Sites are beginning to teach classroom-style lessons and video-based instruction classes (e.g. Lynda.com) on web design and development. They can get pricey, but may be good alternatives to a degree.


Specialization and Competitive Analysis
29. There are many sectors you can work in as a web professional (web designer, UX, UI, front-end development, etc). You shouldn’t restrict yourself to a core subject unless you know exactly what you want to end up doing.


30. Whether you decide to become a Jack of all trades or a specialist is entirely up to what you prefer. It’s worth noting that there is enough work in the industry to cater to both work styles.


31. Investigate what your competitors are doing with their services as you can learn so much from the mistakes or successes that others have had — they can be a goldmine of ideas.


Learning About Your Target Audience
32. Research is the mother of all invention if you’re going to work on any project. It pays to ensure what you’re planning will meet the needs of the audience you’re trying to gain.


33. Always try to be inventive with what you create. There’s no point cloning another successful website when you could improve upon it to convert some of their existing user base.


34. If you plan to produce a blog or an informative website, ensure that you know your subject. Trying to create a medical blog with no knowledge is not a good idea. You should be passionate and be well read about your subject matter.


35. Seek out the kind of people who might want to use the service your planning and ask them what they would like to see in such a website and what popular topics is worthy of inclusion.


Inspiration
36. If you’re stuck for ideas for what kind of site to create, browse around the web looking for subjects that are popular. You could serve a niche market where there’s existing demand.


37. Finding inspiration for a site can come from the most unlikely sources. Watching movies or TV, taking a walk, or even talking to your friends and family can help you get business ideas.


Handling Data
38. Deciding whether you need an SSL certificate or not depends on whether sensitive personal details like credit cards or login information will be processed. It may be worth buying one.


39. Handling your customer’s information is of critical importance. Never store passwords as plain text documents and do what you can to encrypt details that are stored in databases.


Conceptualization and Information Architecture (IA)
40. Creating a visual sitemap before you start building the website can do wonders for your core structure. If you know what pages you may need initially, you can plan the content ahead.


41. Certain types of websites require certain types of documents. Most portfolio websites, for example, have a contact page. Seek other likeminded websites to get required page ideas.


42. When in doubt, always do what works and the norm. There’s a reason why certain types of websites succeed. It’s because they follow conventional practices that visitors will adapt to quickly.


43. Concept sketches are useful for developing your ideas. Sometimes a piece of paper or a napkin with some doodles can assist you in turning what’s in your mind into a workable design.


44. Wireframes are a simple, underused method of planning and plotting out an idea. You can create something as simple as basic shapes, right down to mapping out your site structure.


45. Beyond wireframes, you could also consider a working prototype when planning your site. Mocking up a quick and simple website can eliminate potential feature flaws quickly and easily.


46. Brainstorming is another fantastic but underused method to evolve your business or website ideas. Picking a loose concept and mapping related ideas to it can give quick but abstract results.


47. Some site owners write a business plan to scope out a project’s evolution before it happens. If you find yourself too easily distracted, it might prove to be a useful document to make.


48. Determine what kind of person you are, and the way you use websites. It’s quite subjective, but provides a good grounding point in conceptualising how an idea can become a real product.


Miscellaneous
49. Products like EverNote or Microsoft OneNote provide you with a great platform to gather and store research and ideas. Think of it like a sketchbook you can turn to for inspiration.


50. Never give up. It’s so easy to think an idea has fallen flat, and most people tend to move on far too quickly. Most ideas can become what they’re intended to be with enough hard work.


Content Creation


Even something as simple as an About page should have purposeful content produced.


Everyone keeps reiterating the same term over and over: "Content is king" has almost become a mantra which writers of web copy sing from the rooftops. And they’re right to do so!


Whether your content is provided in textual form, vivid imagery or some beautifully implemented audio and video media, ensuring your website’s content is up-to-scratch will help you turn visitors into customers.


When you come to producing the content that will help visitors understand what the website is about, the following tips may give you some relevant advice to keeping your users hooked.


51. There is more to content than text. Providing polls, infographics, or interactive elements that have content-based value can help improve the interest and readability of on-page information.


52. People respond to engaging prose.


Copyright, Content Licensing and Legalities
53. If you’re intending to build for other people, ensure you have some good solid contracts to work from. You don’t want to be unprepared if the client refuses to meet their obligations.


54. Creating paperwork such as invoices, receipts of purchase, questionnaires (for contract work) and other useful materials will reduce your workload if you start doing freelance jobs.


55. Word of mouth constitutes a binding contract, though it’s harder to prove you shouldn’t say you can or will do something unless you fully intend to follow through what you state.


56. All services should have good terms of service, privacy policy and copyright agreements. It’s important that your end-users know what you expect from them (and that works in reverse)!


57. You don’t need to have a copyright statement on your website (though it’s good as a reference). Ignorance of intellectual property does not qualify as a valid excuse.


58. When deciding how to license your finished design, you may want to check out creative commons or open source licenses; they’re pre-written and flexible (which is great).


59. A cheap way of writing agreements or contracts for your website is to examine others and then write your own based on it. You can save yourself a lot of money in potential legal fees.


60. Avoid legal jargon whenever possible and simply state outright what you want to say in an agreement. Your clients will be more likely to read what you say if they can understand it,


61. If you write your own contracts, it might pay to have them read over by a lawyer to get them as watertight as possible. Verifying is often cheaper than having it custom written.


62. Accessibility statements aren’t as important as they used to be (as being natively accessible is more of a requirement), but providing one may be useful to your website’s audience.


Content Formats and Considerations
63. Get the hang of compression — whether it’s using GZIP for content, caching for external files or squeezing extra bytes from images and media. It will increase the speed of your website.


64. Consider the best image format for what you are trying to achieve, while GIF makes for good basic animations, JPEG or its less lossy friend PNG will be better for high-resolution photos. Read The Comprehensive Guide to Saving Images for the Web for more information.


65. Be careful as to what you use images to portray. Not everyone can see images (like search engines) and this may present readability problems if you use them in place of text.


66. When adding video, audio or graphics into your site, make sure alternative content is available for those who cannot take advantage of these mediums due to accessibility issues.


Images
67. Opacity in images is a tricky issue with Internet Explorer. There are fixes for issues in IE6, but you should remember that only full alpha transparency has issues, not single colors.


68. Your logo is one of the most important aspects of your website as it’s what people will recognise you for. Therefore, it pays to have a good, memorable one created for your brand.


69. While the favicon is one of the smallest graphics you’re likely to encounter on a website, it provides a fantastically unique way of gaining recognition in bookmarks and social networks.


70. Producing an Apple touch icon at 57×57 pixels can be useful for users of the iPhone, iPad and iPod touch who can proudly display your site in their home screens (using web clip).


71. There are loads of sites that provide free stock images, audio and video if you’re not much of a pixel-pusher.


Content Writing
72. Even if you’re not an articulate individual, trying to ensure that your spelling and grammar are correct should be at the top of your agenda.


73. If you’re at a loss for what to write, taking a break or using one of the many techniques to help remove writer’s block can prove indispensible to the content creation process. See the Content Strategy category for tips.


74. A simple way to reduce the complexity of content is to take what you have and boil it down to 50%. It may seem a lot, but reductionism can seriously help eliminate the waffle!


75. Writing your content before you start designing your website can help you better approach the coding stage as you can pick the right elements that describe your content’s value.


76. Content is king. If you sacrifice the quality of the content for the design of the website, your visitors may likely hit the back button in their browser and never return as a result.


77. Much of writing for the web is down to practice. Don’t be afraid to start off small with the likes of Twitter or forum posts before building up your credibility as a web content writer.


78. Making content fun and involving is important to being successful. While dry humourless copy might get across the point, being quirky will emote passion.


79. Never be afraid to ask for help and feedback or get colleagues to proofread what you have to say. Often, a bit of critique will help you become a better professional.


80. When linking to another website, ensure you notify the visitor of how the target site relates to the content or element of the website so they don’t end up at an undesired location.


81. Break your content down into easy to manage segments. Using unordered lists, for example, can help increase the content readability.


82. Fluff and poor quality marketing speak is unnecessary. Always keep to the point and avoid redundant technical language. We all hate junk and in the recycling bin it all belongs.


83. Ensure that what you say is factually correct. Citing references will give your words added credibility.


84. Don’t plagiarise or steal other people’s content. If you find people stealing yours, it’s worth taking the time to learn how to send DMCA takedown notices and cease and desist letters.


85. When writing content of your own, simplicity is valuable. If you can strike a balance between being informative and being overly wordy, you could avoid wasting your reader’s time.


86. Don’t span long documents over multiple pages if you can avoid it. Such practices can reduce the readability of content as readers will be forced to break their natural flow to jump pages.


87. If you’re planning on having a blog, ensure that you state if you’re reviewing something and have been paid to do so.


88. There are so many fantastic CMS solutions (i.e. WordPress). If you find less technical people are going to contribute to a site you make, they can be ideal in removing some complexity and speeding up content production.


89. Consistency is important with everything you write. Maintaining a core set of standards and values helps ensure regularity.


90. Always try to put across information in a friendly and non-aggressive tone. Being overly sarcastic or rude can lead to arguments that can degrade the value of your content.


91. Feedback can be just as important in content writing as the written material itself. Using blog comments, for example, can give entertaining and potentially informative extra reading.


92. Write for people, not search engines. Your users are more important than your Google PageRank.


93. If you plan on providing translated content for international users, nothing beats a human translator. With that said, there are some decent translation tools out there.


Multimedia Content
94. If you create a podcast for your website, a good compression-to-quality ratio is 96kbs MP3 (for voice recordings). Large file sizes are a pain, and at this level, you can save a lot of bandwidth.


95. MP3 is arguably the most compatible audio format around. If you’re providing alternative formats like OGG or FLAC, then ensure an MP3 version exists for more restrictive audio players.


96. Embedding Windows Media Player or Apple QuickTime into a page may have problems if people don’t have the players installed. Flash has a higher market penetration than both.


97. Automatically playing music is a sin — it’s annoying, so don’t do it.


98. Remember that Flash-dependent components are not reliable: People with vision and hand-mobility impairments limit them in accessing a lot of Flash-based content.


99. If you are planning to provide content through email, keep subscribers’ email addresses private (don’t use the CC feature when sending out emails en masse).


100. Don’t spam or send out heavy streams of email – people hate it.


Design Elements


Color is a critically important part of your design as it may invoke or reflect emotion.


One of the most subjective parts of creating a website is its design. Whether you’re looking at accessibility, usability, the user experience, or even something as fundamental as the psychology of color, giving your users the best possible experience with as little effort as possible can prove tricky.


101. Your web design does not need to be pixel perfect. Every device, platform and browser render things slightly differently but that’s not always a bad thing if your site’s still usable.


102. If you are requesting users to sign up for a service on your website, always keep the amount of required information to a bare minimum. Keep things simple.


103. Keeping file sizes as small as possible is important for improved page response times.


104. Mobile web designs should be simple. If you have less content, no Flash dependence, a single column layout and a liquid design, you should have few problems with visibility.


105. mobiForge has an excellent mobile web development guide that is full of best practices and some useful guidelines to helping make the mobile experience better for your end-users.


106. Don’t rely on fixed-width designs. Toolbars, sidebars, add-ins, viewport sizes, window sizes, screen resolutions and many other factors can affect the amount of real estate available to users.


Colors
107. Color can invoke a wide range of subtle psychological influences over people. Knowing how to use color and various contrasts may help you better engage with your audience.


108. Consider how people associate color with feelings: red for hot, blue for cold, white with purity and clarity, black with darkness and death, yellow with happiness and sunshine, etc.


109. Contrast is important when using colors. For certain people like the color-blind, the ability to distinguish various shades may be diminished and they may struggle to read content.


110. The idea of web-safe colors is relatively redundant due to the way screens have evolved, but making sure your site is color accessible for visual impairments is worthy of your consideration.


111. Color theory and harmony are important parts of design. Understanding how such devices influence the way information is perceived is worth studying.


Typography
112. Typography is an ever-increasing variable of importance within web design. As the range of fonts that can be used within designs increases, the legibility of those fonts becomes vital.


113. Producing a font stack is easy! Have your chosen font followed by an alternative that looks similar, then its closest relation that’s likely to be available, and finally the type (like serif).


114. Size is another variable of typography within design that you should consider. The larger the scale, the more readable it becomes and the increased attention it will receive.


115. Giving emphasis through styled italics, strength through bold visual styles or underlying and striking through content can affect the perceived importance design elements receives.


Arranging Design Elements
116. White space/negative space is a valuable commodity. Don’t pack your design full of stuff! Having enough breathing space will improve the readability of your design and help the reader "scan."


117. Scanning is the act of an end-user flicking through content on your pages to determine the information they are looking for. The ease they can do this will affect how they use your site.


118. Websafe typography is a big deal unless you embed a font (which has legal implications). You can’t guarantee the end-user will have any font installed, even common ones like Arial.


119. Organising your information on-screen can be a tricky task. Using conventions and patterns like the logo appearing in the top-left hand side can improve the ease of use for visitors.


120. Knowing how to appropriately display content like navigation menus is an art form and a science. Seeing how others implement such devices can help measure success rates; check out the site called Pattern Tap for common design patterns such as site navigation.


121. Remember that most people read content in a left-to-right manner. Therefore, it makes sense to have important details as high and as far to the left as possible in your design.


End-User Considerations
122. Your design should directly reflect the needs of the end-user. Don’t pack it with useless features and widgets like clocks or weather applets. Only give them what they need, as they need it.


123. When updating your website (which you should do often), check your website statistics to see how people navigate around your website. It can be helpful to find where issues occur.


124. Understanding how people perceive and respond to your brand can be the difference between trust and abandonment. Your visitor’s views are more important than your own.


125. I’ve noted it earlier, but it’s worth reinforcing: update your website often! People gauge the prevalence and accuracy of websites by the rate at which they are maintained.


126. If you have the time, consider reading about psychology and sociology topics. They’re not strictly dedicated for the web, but they apply in so many regions of the industry that it’s worth learning about.


127. Don’t design a website for yourself. As much as you may like that scrolling animated reel you just implemented, you will spend little time visiting the website compared to your audience (who matter).


128. In a websites design, people look for an experience. If you give them something positive to remember, you’ll give them satisfaction, which may result in a long-term relationship.


129. The satisfaction a user gets is directly related to the way you provide information. If the user struggles to find their way to a document, you’ll make them angry.


130. Interaction-based design is important. While static content has uses in certain situations, giving users something to explore and play with will result in a more memorable experience.


131. Unnecessary interaction should be eliminated from the project. While subtle or useful enhancements are great for the end-user, added barriers may cause a user to abandon ship.


132. Applications tend to follow different rules to conventional content distribution. A need for logical structure and purpose will be of increased importance within the user interface.


133. If developing apps for a mobile device, it may prove useful to attempt an offline version for when Internet access is not an option. Dead zones for cell phone signals still exist.


Web Accessibility
134. Accessibility is an important aspect of any web design. If certain people can’t access the site or the content, that’s a group of people who you could have converted to a customer.


135. Numbers in relation to accessibility are highly biased. Don’t think of people with disabilities as a minority; just think of how many people need glasses for reading — that’s a major one!


136. Impairments come in all shapes and sizes: they can be physical, intellectual, emotional, social or even technological (e.g. people without broadband connections or people using mobile devices as their browser agent).


137. The scale and duration of disabilities differ: someone may be paralysed (which would be long-term) or they may have a broken arm (short term). Don’t just think of lifelong issues.


138. There are plenty of helpful specifications and laws in relation to accessibility. Have a read through WCAG 1 and 2, Section 508, PAS 78 and the Six Revisions guide on quick web accessibility tips, to name a few accessibility guidelines and best practices resources.


139. Always provide alternative content for images or media and don’t rely on elements without alt attributes or Flash content without text variants. You’re hurting some of your visitors.


140. Checking your work in a screen reader is quite easy to do. There are free tools out there such as WebAnywhere, a browser-based screen reader simulator, as well as commercial alternatives like JAWS that you can install and test your website through.


141. Don’t become too reliant on tools like Cynthia as accessibility validators because these tools only examine machine-readable code. They’re not perfect solutions for checking your design, semantic structure, content flow, and visual elements of accessibility. Read more about the problems with website validation services.


Usability
142. Usability.gov has a selection of great guidelines in PDF format that can help you improve a website for your end-users. These PDFs are well worth reading through to see what they can offer in your design process.


143. Steve Krug and Jakob Nielsen are two highly respected experts in the field of usability. If you pick up books they have written, you’ll find lots of fantastic usability guides in them.


144. Usability is about making a website as seamless and functional for the end-user as possible. Do whatever you can to help users find and accomplish what they set out to achieve.


145. Before you launch a website to the general public, it’s worth getting a group of people together to test out your design and find any bugs which exist in the system and to see how usable your design is.


146. Carrying out a usability study can be as simple as asking a group of visitors to carry out a specific task and getting their feedback in the form of a questionnaire to improve upon.


147. Ensure your design degrades gracefully to create a usable design that is as universally designed as possible.


148. Progressive enhancement should be what you aim for. Simply put: you want to make sure everything can be used at a core level, and increase functionally for devices that can cope. A scenario would be using CSS3: make sure that your design still works and looks decent on browsers that don’t yet support CSS3.


149. Encourage people to get involved in helping improve your design. Ask for useful critiques and feedback that can give you future website evolution ideas.


150. Keep striving for perfection. It’s probably not possible to have a perfect web design, but if you always aim for the best, it’ll encourage you to continue making an effort in maintenance.


Development
Something every web professional should get themselves swimming in on a regular basis is code. Code is the backbone of our entire industry and turns pretty graphics and content into a formal structure that everyone can enjoy.


While there are far too many languages out there to be able to learn them all, some languages like HTML, CSS and JavaScript seem to be centrally focused in whatever we do online.


The tips you’ll find in this section all relate to coding for the web, and while some of them should be common sense, it doesn’t hurt to reiterate some valuable things which may improve your code.




Applying markup in the correct proportions will give your website some inner beauty.


151. Web standards are important. If you can provide semantic code that accurately describes the content, then you may score a better search position or contextually richer value.


152. Semantics should not stop at using the right element for the right job. For example, giving your classes and IDs effective names (like with microformats) can improve the site’s contextual value.


153. Specifications exist for every web language you’ll encounter (even the more obscure ones). While they can be quite technical, if you have the patience, it’s well worth reading them.


154. Validate your syntax using the W3C’s validation tools. While you should use them to help find and fix bugs in code, remember that you shouldn’t sacrifice evolution for compliance.


155. I recommend learning these technologies in this order: HTML, CSS and then JavaScript (if you’re a beginner) as this order allows you to understand the underlying layers that the sequential languages attach themselves to.


Debugging and Testing
156. When debugging code, it makes sense to eliminate the causes by removing chunks of code temporarily to see if the issue resolves itself (you can narrow down the culprit this way).


157. Tools like Firebug can be exceptionally useful for looking through how your code is being applied (live on the web). It’s worth having a copy of Firefox with it installed for testing.


158. Services that test your designs for cross-browser support like BrowserShots are not perfect, but they do have a benefit of giving you quick glances of how your site might render on different browsers.


159. If you want to test your website in IE6, there are lots of options such as a virtual environment or tools like IETester or the Spoon installers. Don’t just leave the elderly product to chance!


160. Internet Explorer 6 may be the bane of our lives, but I highly recommend testing in any web browser that holds more than 1% of all traffic to your site, as it’s a significant proportion.


161. I recommend separate folders for style (CSS), feeds (RSS/Atom), scripts (JavaScript) and images (GIF/JPEG /PNG). It can be helpful when you organize, test, and debug your site’s content.


162. Relying on pseudo protocols like mailto isn’t a good idea without a fallback mechanism. If the end-user doesn’t have a supporting product, they will effectively become a dead link.


Browsers and User Agents
163. Be consistent with the browsers you test your site in. If you go with the big five ones — Internet Explorer, Firefox, Chrome, Safari, Opera — then remain loyal to those as a bare minimum.


164. Using browser hacks is generally a bad idea as there’s no future support guaranteed. If you do need to make IE behave properly, conditional comments are a friendlier solution.


165. Remember that mobile devices may render your website differently. Checking on various platforms like the iPhone can be extremely important to encouraging mobile device traffic.


166. Jscript (within IE) has its own set of conditional comments called conditional compilation which means you can target JavaScript with IE-specific code just like with stylesheets.


167. Google Chrome surprisingly doesn’t natively support RSS and Atom without a plug-in, therefore — like many things (i.e. Flash) — have it as a supplement rather than a requirement.


168. Device detection on mobile devices is a sticky subject. There are far too many devices for PHP header checks to be effective and handheld media types aren’t strictly and uniformly implemented.


169. WML is a dead language. If you’re producing a mobile-friendly website, it doesn’t pay to cater to such a limited audience unless you know you have people using old mobile phones.


170. Apart from fixed CSS units (px, cm, mm, etc.) you can use elastic (em), liquid (%) fluid (min/max-width) or even a hybrid of various measurements to size your design to flex to the end-user’s demands.


Behaviour
171. JavaScript frameworks like jQuery and MooTools can be helpful if you want a quick plug-in method of displaying your code, but be wary of the amount of bloat or unnecessary complexity they may have.


172. Intrusive scripting like preventing right-clicking and forcing pop-ups is damaging to the end-user. You might think it will aid your design but it more likely causes users to hit the back button.


173. Don’t use HTML frames or elements like marquee and blink. It has become an unwritten rule not to use such user-experience-damaging markup at the cost is greater than the reward.


174. Replicating browser functionality is a pointless endeavour. The user’s browser has print, font resizing, and bookmarking functions for a reason. Having these things is redundant.


175. Code protection is impossible. If you want to make sure people can’t take what you’ve created, don’t put it on the web! Protection scripts only harm genuine users of your site.


Markup
176. Remember to include a DOCTYPE declaration at the top of your (x)HTML documents. You would be surprised how many browser inconsistencies occur as a result of omitting the DOCTYPE.


177. One thing that bugs many web developers is the use of the term, "Alt tag." The alternative content item which is being referred to is an attribute, not a tag.


178. Don’t include natively block-level elements within inline elements. div elements were not intended to be used generically within paragraphs or lists. You’ll break the semantics if you do things poorly.


179. Deprecated elements should not be used unless you have a seriously good reason to make use of them. If there’s a replacement intended for the same role, use that in its place.


180. HTML5 may be a useful addition to the languages we can use for the web, but always keep in mind that browser compatibility may be a major issue for elders with scripting disabled!


Styles
181. CSS3 offers several useful, gracefully degrading properties that can benefit your visitors. If you take the time to learn how things are evolving, you’ll be ready for the next generation.


182. Optimizing your CSS can be achieved by making use of inheritance, using selectors carefully, avoiding repeat declarations and grouping your style based on what it does for your design.


183. Remember not to forget about printers. Having a print-specific stylesheet will help eliminate ink and paper wastage and will make your content look professional when printed.


Various Web Technologies
184. If you need to display large documents, rather than have a Word document, consider using a PDF or an XPS file, which are formats oriented for the web.


185. While Canvas, SVG and VML (and their relations) have a lot of potential for vector graphics on the web, it’s worth recognizing the serious cross-browser compatibility issues they have.


186. Flash shouldn’t be avoided altogether — it has a higher penetration of compatibility at this time than HTML5 and it can offer several things that, without scripting, would be impossible.


187. The key to successful Flash implementation is alternative content for when it’s unavailable. I certainly wouldn’t rule out the use of Flash in the future, but dependence is a serious flaw.


188. Flash is a great platform for providing dynamic content like video and audio, but don’t use it in place of mission-critical components like navigation or the whole website itself!


189. Silverlight and Java are options worthy of recognition if you’re not a Flash junkie, though it’s worth recognising that they have less market share and will therefore be less compatible.


JavaScript
190. JavaScript can be useful for validating web forms and aiding the end-user’s experience, but remember to use server-side scripting to verify things in case scripting is unavailable.


191. Unobtrusive scripting is the key to any website. Don’t allow scripts to infest anchor links using the JavaScript: pseudo and avoid scripting JS-dependent functionality without a fallback.


Miscellaneous
192. There are some great bookmarklets that can aid your development cycle using any web browser. Quix, Spry Toolkit, Firebug Lite and Aardvark are perfect examples of these.


193. The best way to improve a site’s speed is to take advantage of caching. Separate your site’s structure from the style (CSS) and from the behaviour (JS), using individual files to achieve this.


194. Table-based designs aren’t a good idea unless you’re forced to use them for the likes of HTML email. It’s poor semantics and affects screen-reader accessibility.


195. Picking the right server-side language is important. Options include PHP, classic ASP, ASP.NET, JSP, Ruby, Perl, ColdFusion and Python. Research your options before deciding.


196. Your server environment will generally dictate what languages you can code in. Depending on the setup, you may find that certain server-side languages (like ColdFusion) have limited support.


197. If you find yourself wanting to get involved with specific packages like WordPress, you may find yourself needing to know a specific language. Account for this in choices you make concerning what server-side language to learn.


198. If you want to remember certain user data only temporarily, perhaps consider saving the information as a browser-specific cookie in preference to storing it in a server-side database.


199. Database formats are pretty varied, though most of them make use of the SQL format. Popular options include mySQL and MS SQL Server.


200. Have you ever considered taking a web application offline? There are solutions such as Adobe Air, Titanium and Mozilla Prism that allow you to create quick, packaged solutions.


Marketing
Finally, we’re going to look at some useful pieces of advice for when you have the finished website but want to ensure search engines and visitors see it.


Using a mixture of general marketing advice, search engine optimization tips (of the ethical variety) and social media usage, you may find these tips useful in taking your web project to the visitors you seek.


Getting your website an audience — and keeping the interest in your website alive — is probably one of the hardest and most time-intensive aspects of owning a site. Hopefully these tips may inspire both you and your clients.




Advertisements are a core component of getting your brand around the web.


201. Branding yourself or using your own name to represent you online can present risks of its own. You may encounter confusion with people who share the same name as yourself!


Search Engines and Rank
202. Give your website a creative name. It should be short, snappy and easy to remember (and spell). Visitors need to be able to recall who you are when they find a need for your goods.


203. Don’t try to trick search engines. Keyword-stuffing into hidden sections and using deceptive techniques aimed to gain bonus PageRank may result in you being booted by Google.


204. Keep things organic without targeting search engines whenever possible. High quality content, for example, will seek better long-term rewards than a poor quality link-farm.


205. Spending time reducing errors in your code and using elements (like headings) appropriately will ensure that search engines not only find your content, but also index it accurately.


206. Remember that marked-up text will hold a higher placement in search engines than non-indexible content such as Flash or PDF files that tend to have more limited semantic value embedded within.


207. Your Alexa rank is not important. Alexa ranks are highly biased and provided by a select few who install the toolbar. It’s honestly not worth the value many people seem to place on it.


208. Search engines do ignore keyword meta tags. I know plenty of people still claim that this isn’t the case, but its downright wrong information. They do, however, follow descriptions.


209. The DCMI (Dublin Core Metadata Initiative) is a great way of giving your site added value and meaning. If you’re into metadata, I recommend you check the specification out.


210. Adding a Robots.txt file to your website can help you better assist search engines in knowing what not to index. Robots.txt files are very easy to produce and are widely recognized.


211. Remember that a robots.txt file will not prevent people from stealing your content. Search engines unfortunately don’t have to follow them, so they could just ignore them if they wish.


212. OpenSearch is an XML specification with little recognition and a powerful function. It lets you add a custom search entry to the web browser! You could produce a cross-browser search function, for example.


Best Practices
213. Every website should have an XML Sitemap. It’s generally an XML list (though HTML or text ones are supported) of every page on your website, indicating how often content is updated.


214. title elements should be unique on every page in your website. I also recommend having the unique name before any static content (like the site name) for the sake of bookmarks.


Advertising
215. Advertising in the right areas may find you some great traffic but it pays to research the keywords you wish to target carefully, otherwise, you could be pouring money down a drain.


216. If you find the likes of Google AdWords isn’t turning the amount of results you want to gain, consider getting your services listed directly with useful related sites by buying ad-space.


217. Sponsorship is a great way to get involved with a community whose audience your site may appeal to. Most Industry-related events (like web design conferences) allow advertising, for example.


218. There are many different ways you can monetize a site. Ones you might consider include advertisements, premium access or support, donations, subscriptions or even exclusive features!


219. Monetizing a website isn’t an easy task. Beware of get "rich quick schemes" that claim guaranteed earnings that sound too good to be true (because they almost always are).


Branding, Reputation, Networking
220. If you’re planning to make money through your venture, ensure you have all the relevant paperwork filled out (and notify the tax people). You will need to report all of your earnings.


221. Don’t just think of your project as a digital venture, consider having some business cards, fliers or printed resumes created for when you’re out looking for clients in your local area.


222. The domain extension you choose will not impact your search engine ranking, Google, and Bing do not account for the TLD used (unless you require a local regional position).


223. Trust is a mission-critical brand element. Only put your name to project ideas you believe are in the user’s best interests — you don’t want to end up like the privacy ridiculed AOL.


224. When you drop a link to your own website, do it only in places where it’s deemed suitable. Spam will reflect poorly on your reputation and may get you kicked out of communities.


225. Joining chat rooms, forums or likeminded individuals in online spaces can be a great place to network, learn additional skills and perhaps even find some extra paying customers.


226. Getting your sites featured on other websites can boost your ranking in search engines (if the link is dofollow) and reputation online, however, you shouldn’t bother with "free for all" directories as the quality return will be low.


227. If you want to get your name out to other professionals, taking some business cards along to a web design conference can be a great place to meet others on a face-to-face basis!


228. Don’t underestimate the value of marketing yourself through fliers or adverts in a local paper or magazine (or even the Yellow Pages). Local businesses want websites too!


229. If you’re looking to apply for some existing jobs to showcase your skills to clients, check job boards on reputable, well known niche development sites rather than the likes of monster.


230. Social Media is one of the simplest ways you can build up a reputation for yourself on the web. Using services that allow you to build a community of followers can turn into job leads.


Selling
231. If you’re offering physical goods, consider getting them featured on well-known merchants like Amazon where existing customers may find what you’re offering as service on the side.


232. Want to showcase your skills to the active community? Consider expanding your portfolio by writing an e-book or contributing to an open source project that will get your name out.


233. Digital Rights Management and product activation is something I recommend avoiding. The bad people will still crack the item and it’s the legitimate customers who eventually suffer.


234. Selling goods online is quite a simple process thanks to "middle man" merchants like PayPal, Google Checkout and Amazon Flexible Payments, so consider your options wisely!


235. Occasionally, giving something away for free can drive a lot of interest and potential clients to your website. Whether it’s coding for a charity or handing out a free e-book, it all helps.


236. If you’re offering a desktop, device or web-based piece of software, submitting them to download portals such as CNET Download.com can get your product featured, win you more customers and even awards.


Social Media, Social Networking and Blogging
237. Twitter is a great method of getting into blogging if you find your time is stretched. You have a limited amount of space to be interesting. This service is basically a crash course on writing.


238. Setting up a blog can be a great way to gain some extra traffic. If you think you can write about your chosen subject on a regular basis, you could turn a profit on it and gain clients.


239. If you have the voice or face for it, having a podcast with a few work colleagues or friends (or even on your own) can give your sites a unique additional layer of marketing exposure.


240. Join communities who promote best practices in your particular industry. Being associated with these groups gives you a hint of professionalism and allows you to help good causes.


241. Facebook is used by a good proportion of the world population, therefore, it may be worth setting up a base camp for your project. You can share stuff with fans of the service too!


242. StumbleUpon is not only a great resource of inspiration (and a place to find awesome learning materials), it’s also a good place to give your services some non-spammy exposure.


243. Getting your professional profile (or a copy of your resume) uploaded on sites like LinkedIn and Google profile can give people a place to find you professionally (so free exposure).


244. Whichever social networks you decide to use, don’t overdo the self-promotion, use the services for their intended purpose and spend time building up some high quality content.


245. Social networks provide you with a place to allow customers to get in touch with you, gain useful feedback on your site and testimonials. Don’t think of them as just a linking service!


Miscellaneous
246. Always take the time to review any marketing plans you have for your website or services, mistakes can be costly and you want to ensure your reputation is as positive as possible.


247. Having a large number of visitors or a high PageRank does not mean your site is successful. It’s the conversion from visitor to regular user that ultimately decides the fate of your service.


248. Try to be unique with the way you market yourself. Look outside of the web for inspiration and you may find a unique method to advertise your services with few active competitors.


249. Having side projects either for fun or to expand your business can give you client-crossovers where users from one service may discover what you provide elsewhere (and join up).


250. Enjoy what you do and don’t be too critical. If you find yourself struggling to meet your expectations, your clients will notice and you could lose potential visitors or fail as a result.


It’s worth re-iterating that what’s listed here only scratches the surface of the many facets within our industry.


Perhaps it’s fair to say that beginners may find some of the tips more useful than a seasoned expert, but I’ve always been of the opinion that it doesn’t hurt the most established web architects to keep learning, reinforce their skills and perhaps remember what they previously may have forgotten.


I hope some of the tips will prove useful in your everyday process, and perhaps to those who it may benefit: like Chinese whispers, you can pass the tips to the next generation.


If you have any tips of your own which you think are worth noting, feel free to add them to the comments; perhaps we’ll end up with an encyclopaedia of useful nuggets of gold for future visitors!


http://sixrevisions.com/web_design/250-quick-web-design-tips-part-1
http://sixrevisions.com/web_design/250-quick-web-design-tips-part-2