Jennatrudeau's Blog

I made this site off of a previous site I had made.  I used the same template from a project I had last year to make a web site.  I pretty much used the same layout as I had before because I like how it looked; however, I completely changed the whole look of it.  I based the entire site off of the colors I had previously made my logo with.  I made my own links in illustrator for each page and created a few tables.

I only had one problem with my site that I couldn’t figure out how to fix.  It was the border around my links.  I made a class called “nav” that had the border set to none and used that for the links.  In Dreamweaver it worked and I had no border but when I look at it in Firefox there still were borders, so I wasnt sure what exactly to do about that.

Adobe technology is at the center of virtually every print and digital workflow, so undoubtedly a lot of what you¹ll see getting delivered to the iPad will have originated in Adobe creative software. It looks like Apple is continuing to impose restrictions on their devices that limit both content publishers and consumers. Unlike many other ebook readers using the ePub file format, consumers will not be able to access ePub content with Apple’s DRM technology on devices made by other manufacturers.  And without Flash support, iPad users will not be able to access the full range of web content, including over 70% of games and 75% of video on the web. If I want to use the iPad to connect to Disney, Hulu, Miniclip, Farmville, ESPN, Kongregate, or JibJab — not to mention the millions of other sites on the web — I’ll be out of luck. Adobe and more than 50 of our partners in the Open Screen Project are working to enable developers and content publishers to deliver to any device, so that consumers have open access to their favorite interactive media, content, and applications across platform, regardless of the device that people choose to use.

A site built to web standards should adhere to standards (HTML, XHTML, XML, CSS) and pursue best practices (valid code, accessible code, semantically correct code, user-friendly URLs etc).

In other words, a site built to web standards should ideally be lean, clean, CSS-based, accessible, usable, and search engine friendly.

Some of the advantages of using web standards are accessibility and stability. Not only does this mean allowing the web to be used by people with disabilities, but also allowing web pages to be understood by people using browsers other than the usual ones – including voice browsers that read web pages aloud to people with sight impairments, Braille browsers that translate text into Braille, hand-held browsers with very little monitor space, and other unusual output devices.

Most web standards are generally designed with forward- and backward-compatibility in mind — so that data using old versions of the standards will continue to work in new browsers, and data using new versions of the standards will “gracefully degrade” to produce an acceptable result in older browsers. Because a website may go through several teams of designers during its lifetime, it is important that those people are able to comprehend the code and to edit it easily. Web standards offer a set of rules that every Web developer can follow, understand, and become familiar with: When one developer designs a site to the standards, another will be able to pick up where the former left off.

Card sorting is a technique that many information architects use as an input to the structure of a site or product. It’s a user-centered design method for increasing a system’s findability. The process involves sorting a series of cards, each labeled with a piece of content or functionality, into groups that make sense to users or participants.

You should use card sorting because its a quick, inexpensive, and reliable method, which serves as input into your information design process. Card sorting generates an overall structure for your information, as well as suggestions for navigation, menus, and possible taxonomies.

Structure/Navigation Mistakes:

No Structure-when designers treat a site like one big swamp with no organizing principle for individual items.

Missing Category Landing Pages-sites forego the overview page and simply offer links directly to individual pages within a section.

Uncontrollable Navigation Elements-anything that moves and bounces detracts from Web usability; when navigation moves while users are trying to find their way, it’s deadly.

Inconsistent Navigation-Users should be able to understand it immediately, and apply that understanding throughout the site.

There were many common elements that each web site had of the design process. Some of them are:

Planning- This initial stage is where you define your goals and objectives for the web site and begin to collect and analyze the information you’ll need to justify the budget and resources required. This is also the time to define the scope of the site content, the interactive functionality and technology support required, and the depth and breadth of information resources that you will need to fill out the site and meet your users’ expectations. If you are contracting out the production of the web site, you will also need to interview and select a site design firm.

Information Architecture- At this stage you need to detail the content and organization of the web site. The team should inventory all existing content, describe what new content is required, and define the organizational structure of the site. Once a content architecture has been sketched out, you should build small prototypes of parts of the site to test what it feels like to move around within the design. Site prototypes are useful for two reasons. First, they are the best way to test site navigation and develop the user interface. The prototypes should incorporate enough pages to assess accurately what it’s like to move from menus to content pages. These prototypes can be used to test the information architecture with users. Second, creating a prototype allows the graphic designers to develop relations between how the site looks and how the navigation interface supports the information design.

Templates- Whether you develop your site on your own or hire a professional web developer, you should develop page templates for your new web site. It’s much easier to add new pages when you can start from a page that already contains basic navigation and site graphics.

Within any given medium there are unique constraints that can affect the way designers make use of the principles and elements of design. These constraints can be based on a variety of different things including materials, technology, processes and standards in the industry. The Web is no different. Designing for a Web-based environment enacts a set of unique issues that need to be considered before implementation can be successful. The vast majority of constraints in a Web-based environment are brought about because of the limits of human interaction with technology. The Web, by its very nature, is a virtual medium accessible only via peripheral devices. We are constrained by what technology allows us to do, and are confined by the rules of these systems. One of the most interesting and frustrating aspects of the Web is that it is such a new environment that the rules are constantly changing. Designers need to adapt as necessary.

Design communicates on every level. It tells you where you are, cues you to what you can do, and facilitates the doing. Style is tautological; it communicates stylishness. In visual terms, style is an aspect of design; in commercial terms, style can communicate brand attributes.

A histogram is a simple bar graph that shows the range of brightness levels that make up an image and the prevalence of each of these shades.

The Levels command lets you adjust luminance levels on a channel-by-channel basis. The upshot is that you can increase contrast, correct for color cast, and make a bad image good. The Curves command gives you independent control over highlights, shadows, midtones, quartertones, three-quartertones, and much more.

Hue/Saturation continues to do something that no other feature does: It lets you edit one range of colors independently of all others–without defining a selection or mask–all from inside a single dialog box or palette.

Both raw files and negatives contain deep information that will ultimately yield superior images. But where negatives require you to dabble in precarious and sometimes toxic chemicals, raw images have been known to submit to the slightest of numerical adjustments without the slightest provocation.

HDR stands for High Dynamic Range.  To create an HDR photo you must shoot lots of photos and merge them together.  You can shoot one properly exposed, one over exposed and one under exposed and blend them into a single deposit.  To fake and HDR photo you can take a photo into photoshop and manipulate it. By using lab color, shadow/highlight, curves, and high pass.

Before any image capture can be done it is necessary that you know the required File sizes and File Types. Once these have been established they will become part of the Operational Specifications. In an objective capture workflow the color of the digital images can be objectively measured and compared against the original work. This is a typical capture workflow when working with a digital camera or when scanning direct from the original. An objective capture workflow should be calibrated and characterized using the ICC profiling system and then operator color adjustment prevented. In a subjective capture workflow the color of the digital image can only be compared against another image (often a copy transparency of the original work). It will be necessary to make color adjustments according to your skill and understanding of the original work to correct any possible fault.

A cleaning will provide higher quality and speed than having to digitally ‘clean’ them after capture. Scanners must be kept scrupulously clean, however cameras need to be cleaner still. All capture equipment should be externally cleaned every day and internally cleaned as required, which is normally at least each week. Try to reduce the camera’s exposure to dust by keeping it in a clean bag or case with all lens and body caps fitted.

Resizing is changing the size the image will print without changing the number of pixels in the image.  Resampling is changing the number of pixels in the image.

A logo is for inspiring trust, recognition and admiration for a company or product and it is our job as designers to create an identity that will do its job. Some useful tips while designing a logo from How to Design a Logotype from Conception to Completion by Chris Spooner, Spoongraphics, are:

1. Ensure a thorough design brief is received – David Airey

With logo design, the design brief is a valuable piece of documentation which directs the designer towards the correct goal.

2. Research the client’s industry – Jon Sandruck

A comprehensive knowledge of the client’s business and industry plays a key role in the creation of a logo that not only portrays the correct message, but also helps the client stand out in their sector

3. Use a sketchpad to quickly flesh out initial ideas – Dainis Graveris

Sketching out initial ideas can help you quickly consider and review various ideas.

4. Design the logo to work in a single color – Patrick Winfield

Logos are used in a huge range of environments, some of which require the logo to be reproduced at small scale or in limited colors, therefore it is important to ensure that the logo design works in mono format.

5. Create the logo in vector format – Chris Spooner

In order for a logo design to be scaled without the quality of the imagery being affected the logo must be in vector format.

6. Present only the best concepts to the client – Angela Ferraro-Fanning

Once a range of design concepts have been created, it is time to select the best examples for presentation to the client for review.

7. Show how the logo would work in context – Veerle Pieters

Knowing the proposed use of a clients logo can help tailor the concepts to give a preview of how they would work in context.

8. Keep it Simple (Stupid) – Jeff Fisher

The idea being to aim towards simplicity in a design rather than unnecessary complexity.

9. Make educated choices when it comes to color – Ryan Nichols

Color is one of the key aspects of any design, the psychology and impressions that each color gives can dramatically alter the message and overall appeal of a design.

10. Rebrand with care – David Turner, Michael Bierut

It is of utmost importance when rebranding to pay particular attention to the history and established views of the original design.

A color wheel is a visual representation of colors arranged according to their chromatic relationship.  It starts with the primary colors which are those that cannot be created by mixing colors.  Between them are the secondary colors which are made by mixing two of the primaries.  The tertiary colors are a mixture of the primary and secondary hues and are located between them.  The colors that are located across from each other are complementary colors. The color wheel can be divided into ranges that are visually active or passive. Active colors will appear to advance when placed against passive hues. Passive colors appear to recede when positioned against active hues.

The more contrast between an object and its surroundings, the more visible they will be.  When creating visuals that are intended to be read, offer the viewer enough contrast between the background and the text.  While black text on a white background is ideal, text presentations need to offer at least an 80% contrast.  If there is not enough contrast between the figure and ground, the viewer will squint to view the text.  For example, yellow text on a white background or blue text on a black background is hard to read due to the low level of contrast.  Simultaneous contrast occurs when opposing colors are placed closely together.  For example, with red text on a blue background, the text may appear to vibrate or cast a shadow.