background preloader

Web Design Questionnaires, Project Sheets and Work Sheets

Web Design Questionnaires, Project Sheets and Work Sheets
Advertisement It’s nearly impossible to provide an accurate quote to a prospective Web design client without first gathering information about what that particular client needs. Some designers do this in either a face-to-face meeting or over the phone, but more often, they have a questionnaire that prospective clients fill out. This is preferable for a couple of reasons; the most important, is probably that this document then becomes an integral part of the design process and is available to refer back to. So the question is, whether you should put that questionnaire up on your website or only send it to prospective clients once they’ve contacted you. Here, we’ve collected questionnaires and worksheets used by actual Web design companies, including some of the leaders in the industry. Downloadable Questionnaires While online forms are certainly popular, so are downloadable questionnaires. We Are Pixel8 Happy Cog Great Example Question: Are you familiar with the concept of Web standards? (rs)

45 Incredibly Useful Web Design Checklists and Questionnaires Designing websites can be a long and complicated process. Dealing with clients, designing prototypes, coding, programming, and testing – there’s a lot to keep track of and a lot to make sure gets done. That’s where checklists can make your life a whole lot easier. With lists of points covering multiple areas from content to usability to accessibility to standards, you’re a lot less likely to overlook important parts of a site. Below are 45 checklists to make your design process easier and more organized. Also consider our previous article: 15 Essential Checks Before Launching Your Website1 lists some important things to check before you make your sites public. 1. These questionnaires and checklists are focused on making your relationships with your clients better. How to Extract the Facts with a Web Design Client Questionnaire2 This questionnaire from Freelance Switch is meant to send out to prospective clients to get a good idea of what they’re looking for from a website. 2. 3. 4. Dr.

The Anatomy of a Perfect Landing Page Placement and Content 7. Keep It Above the Fold The space a visitor sees without having to scroll is where the most important parts of the webpage should be. 8. Optimize a landing page for conversion over time. 9. Implementing motivational speeches, videos of user testimonials, and product images into a home page can have a positive impact on viewers, as well as give shoppers an extra push to look further into a product. Bellroy uses great imagery and videos on many of their pages. 10. Links connecting the user to a bunch of other sites or pages will distract them and have a negative impact on conversions. This landing page is designed well, but look at all those header links getting in the way of the message!

Tutorials for Web Designers and Developers So many design styles, coding tricks and sense of variations needed to create a well decorated website. Some time you have to take few tips and tricks to create and run an awesome website. This article is a beautiful and important collection of 15 Important Tutorials for Web Designers and Developers. About The Author Dibakar Jana Welcome friends, I am the Founder of, a well known designers blog that spread its popularity rapidly. View Authors Posts / Visit Authors Website Styleguide | Clearleft · User Experience Consultants The paragraph above has a class of leader. The main page header of this guide is an h1 element. Please reserve h1 for individual page titles only. Third-Level Header The header above is an h3 element, which may be used for any form of page-level header which falls below the h2 header in a document hierarchy. More than one may be used per page. Fourth-Level Header The header above is an h4 element, which may be used for any form of page-level header which falls below the h3 header in a document hierarchy. Paragraphs All paragraphs are wrapped in p tags. Many forms of Government have been tried and will be tried in this world of sin and woe. Additionally, you might wish to cite the source, as in the above example. Inline Text You might have noticed all the monospaced text in this guide. abbr Used for any abbreviated text, whether it be acronym, initialism, or otherwise. code Used for computer code samples. function getJelly() { echo $aDeliciousSnack; } With line numbers: cite del em ins kbd q strong Lists

AskApache - Crazy Advanced Web Development Learning WebGL A year ago, at a biggest-ever, record-breaking HTML5 Meetup in San Francisco all about WebGL, I predicted we were a tipping point; I think I was right. Let’s take a look at 2014, a banner year for 3D on the web! A Year of Great Content John Cale and Liam Young’s City of Drones brought together experiments in music and architecture; Isaac Cohen continued to blow minds with visualizations like Weird Kids and Webby; Google’s A Spacecraft for All chronicled the 36-year journey of the ISEE-3 space probe; and SKAZKA showed us an alternate world created by The Mill and powered by Goo. A Year of Killer Apps In 2014, WebGL made its mark– an indelible impression– on advertising, e-commerce, music, news and engineering. A Year of Pro Tools Goo, Verold, Turbulenz and PlayCanvas all made great strides with their WebGL engines and development environments. A Year of Gaming WebGL is definitely up to the challenge of creating high-quality MMOs. A Year of Virtual Reality A Year of Ubiquity

How to Extract the Facts with a Web Design Client Questionnaire The phone calls usually go like this: Caller: “I want a website for my business.” You: “What kind of business do you have?” Caller states the nature of the business, launches into a list of pages that he or she wants on the site, and then asks you for a price quote. Not a very satisfying encounter, is it? The caller seems most interested in price, and you? It might not be possible to have a meaningful relationship with price shoppers, but it’s worth taking the time to learn what your potential clients want in a website. Editorial Note: A few times a month we revisit some of our reader’s favorite posts from throughout the history of FreelanceSwitch. Tip: I recommend using this questionnaire before you write a Web design proposal. The best Web design questionnaires focus on: What the site’s supposed to do for the client’s business.What the site will look like. I’ll take you through the questionnaire that I use, and explain the rationale behind each question. 1. 2. 3. 4. 5. 6. 7. 8. 9. 10. 11.

Dreamweaver Primer So, you’ve read the article, “HTML Wireframes and Prototypes: All Gain and No Pain” and now want you want to make an HTML wireframe. I’m here to help make this an easy and pain-free process, using Macromedia Dreamweaver 4.0. By the end of this primer you will have: Become familiar with the basic functionality of DreamweaverMade a sample HTML wireframe that you can use as a template for future wireframes How to use this primer This primer assumes that you have never used Dreamweaver before. Also, this primer is designed to be used while you are running Dreamweaver. Finally, the techniques suggested in this primer are specifically for creating wireframe prototypes, not for creating launchable sites with working backends. Dreamweaver basics When you launch Dreamweaver, it will open a blank web page called “Untitled Document.” Figure 1: The default Dreamweaver document window and its key functionality. Now for a tour of the tools that are available for your wireframing work.

Design checklist: What clients should provide their designer - Tracey Grady Hello! I have updated this very popular post to include a free downloadable PDF of this checklist. Preparation is key to successful management of any project, and design projects are no different. I find checklists can be very useful, so I’ve prepared a checklist of details that clients should provide their designer at the outset. A budget Knowing the client’s budget allows the designer to establish what they will be able to realistically achieve for the money, and to perhaps suggest a range of options. A complete list of the client’s design requirements The client must make clear at the beginning just how much design work they will require, e.g. layout for a business card, letterhead and envelopes OR logo design plus web design plus email marketing template. I once had a prospective client say “We don’t know yet how many layouts we want, so can you just give us a rough quote estimate in the meantime?” An outline of who the target market or audience is for the design work A deadline

World Wide Web Consortium (W3C) 9 Most Common IE Bugs and How to Fix Them Internet Explorer - the bane of most web developers' existence. Up to 60% of your development can be wasted just trying to squash out IE specific bugs which isn't really a productive use of your time. In this tutorial, you are going to learn about the most common IE bugs and rendering disparities and how to easily squash them or deal with them. 1. Centering an element is probably something every web developer has to do while creating a layout. Consider the Following Code: The output you'd expect: But what IE actually gives you: This is mainly due to IE6 in quirks mode and below not recognizing the auto value we set to the margin property. The Fix The easiest and most reliable way to center content for IE6 and below is to apply text-align: center to the parent element and then apply text-align: left to the element to be centered to make sure the text within it is aligned properly. 2. Almost every web developer uses lists to create his navigation. And the IE screen shot: Fix #1 Fix #2 3. 4. 5.

How to Enable IE 8 Compatibility View for your whole Web site or for specific Web site directories - Deviations With the release of Internet Explorer 8, many customer sites suddenly had rendering errors and problems displaying the site correctly. In order to avoid expensive and time consuming corrections Internet Explorer 8 has a new functionality called Compatibility View which enables the browser to emulate Internet Explorer 7. Internet Explorer 8 Compatibility View The question many customers asked is ”How can I force the client browser to use the Compatibility View when they visit our site? Web Developers and Site Administrators can configure IIS and their sites to tell Internet Explorer 8 to automatically Emulate Internet Explorer 7 when they visit their site or just specific WebPages. This is done by adding a custom HTTP Header to the IIS and the website web.config or to add a meta tag to specific pages. X-UA-Compatible: IE=EmulateIE7 Pedro M.

IE7 Recalculated Offset Bug | CSS Class IE7 now has support for dynamic pseudo classes :hover and is commonly used for the purpose of hiding elements from view and bringing them back into view when a ancestor element is hovered over, but the support is buggy depending on the property and values used for either hiding the elements or for bringing them back into view. Setup: Container Absolutely Positioned Element What we have above is a container element containing an absolutely positioned element. <div class="container">Container <div class="absolute">Absolutely Positioned Element</div></div> In the below examples, the absolutely positioned element is hidden from view by the normal position value and brought back into view by the hover position value. Example 1: a.p element: normal position left:-999em; - hover position left:auto; Example 2: a.p element: normal position left:-999em; - hover position left:0; Example 3: a.p element: normal position left:-999em; - hover position left:auto; margin-left:0%; Example 4: Example 5: Example 6: