Dreamweaver 8 Ch. 9: Layout November 12, 2007
This was pretty frustrating for me considering I’m using MX 2004, so then I downloaded the trial CS3, but the book teaches Dreamweaver 8. So I did a lot of back and forth at first. I couldn’t find the layer option in CS3, so I used MX’04. There was no zoom option or guides in MX ‘04, so back to CS3.
In this chapter, we learn to apply a tracing image and add layers.
http://bcts-potomac.aacc.edu/128b/19/chap_09/index.htm
We also used layout tables and layout cells, as well as worked with layout table widths.
Dreamweaver 8 Ch. 7: Typography November 12, 2007
In this chapter, we learn how to format text with the property inspector;and managing white space with margins, padding, and line height.
http://bcts-potomac.aacc.edu/128b/19/chap_07/aboutus.htm
We also used font lists.
http://bcts-potomac.aacc.edu/128b/19/chap_07/fontlists.htm
We learned to align text and use ordered, unordered, and definition lists.
http://bcts-potomac.aacc.edu/128b/19/chap_07/brewingtea.htm
And lastly to create flash text.
Dreamweaver 8 Ch. 8: Tables November 12, 2007
In this chapter we learn to create and add content to a table; change the border of a table with XHTML and CSS; align table content in both; sort a table’s content; set table widths; and create rounded-corner tables.
As in the first document example, something I’ve run in to quite a few times is when I type text, then hit return, it seems to jump a space (like it is double spaced instead of single spaced) and the example in the book doesn’t show this. I changed the line height, but is there another way to change this, like a default in my program? Another problem with the first document example is I don’t have an “Add Property” link in the CSS Styles panel, in order to colapse the border. This may be because I’m using a later version. So, I simply typed it into the code.
http://bcts-potomac.aacc.edu/128b/19/chap_08/teapots.htm
In the second document example, it doesn’t tell you how to change the color of header row background (in the CSS Style panel), it is just pictured a different color. The last blurp in excercise 4 says if you want to change the color of the headings you can, but it doesn’t tell you how to do so.
http://bcts-potomac.aacc.edu/128b/19/chap_08/css-teapots.htm
Creating Rounded-Corner Tables: http://bcts-potomac.aacc.edu/128b/19/chap_08/rounded.htm
Search Engine Placement Tips November 12, 2007
http://searchenginewatch.com/showPage.html?page=2168021
The article state to choose your target keywords so search engines will identify your page and hopefully list it in their top searches, top ten preferably. These keywords are those in which you think people will type into a search engine in order to find your page. You don’t want to be too vague when choosing these words, make them relevant to the search. Site them several times will help bring your search closer to the top. You also want to position this phrase of two or more words high on your page. It is crucial to put your keywords in your page’s title tag. Also, if your keywords are images, the search engine can’t read it, so make sure you use relevant text also.
I think my biggest question after reading this article is do you really have to submit your page to search engines? And how do you do this?
Blasting the Myth of the Fold November 12, 2007
http://www.boxesandarrows.com/view/blasting-the-myth-of
It’s funny, I recently have heard this “above the fold” mention several times. Basically it is the area above the fold of a newspaper, the most important or highlighted information. In web design it refers to the area which comes up on the monitor before you have to scroll down. I think it’s important to have the “above the scroll-line” design be visually appealing and interesting in order to intrigue people to scroll down the page. I agree, if there is something I’m looking for I’m going to scroll down the page, it’s never stopped me before. It’s true, people use a wide variety of monitor sizes and there is no guarantee where the scroll-line will fall. It is, however, very important to keep the information describing your site above this scroll-line. You don’t want users to have to scroll down to even figure out what your page is about; they’ll more than likely move on. Good tips include not cramming your information above the scroll-line, give users a clue there is more to the site if they scroll down, and create something interactive for them when they do scroll down.
Information Interaction Design November 12, 2007
While reading this article, I felt a lot of it was information you’ve probably learned before, but it needed to be reviewed. It details the process in which a design is interpreted or presented to the audience. I simply pulled the most important information to help my understanding and help me review.
Information Interaction design in a combination of Information Design, Interaction Design, and Sensorial Design.
Information Design’s roots are in publishing and graphic design. It addresses the organization and presentation of data: its transformation into valuable, meaningful information. In order to organize your thoughts and communicate them it is important to keep in mind organization, presentation, goals and messages, clarity, and complexity. Info. Design doesn’t replace graphic design and other visual disciplines, but is the structure through which these capabilities are expressed.
While Information Design primarily focuses on the representation of data and its presentation, the emphasis in Interaction Design is on the creation of compelling experiences. Data is transformed into meaningful information; information is transformed into knowledge and further, into wisdom. In order to create a meaningful experience for others you must understand your audience; what their needs, abilities, interests, and expectations are; and how to reach them. Data is the product of discovery, research, gathering, and creation. Information makes data meaningful for audiences because it requires the creation of relationships and patterns between data. Transforming data into information is done by organizing it into a meaningful form, presenting it in meaningful and appropriate ways, and communicating the context around it. Knowledge is then the understanding gained through experiences. Local knowledge is knowledge shared by a few people because of their shared experiences. Global knowledge is more general, limited, and process-based. Effective communication must take into account the audience’s level of knowledge. Wisdom is the result of contemplation, evaluation, retrospection, and interpretation; an understanding that is gained through knowledge.
In order to transform data into information, it must be organized. It can be organized by alphabet, location, time, continuum, number, or category. It can be organized one of these ways or more, in sub-categories; and is recommended since people learn differently and organize their thoughts in different ways. Communication of an effective design is done by identifying the goals of the experience and the messages to be communicated as early in the development process as possible. The most important goal of effective communication is clarity. It can be made clear through organization and presentation, by focusing on one goal at a time.
Interaction Design is creating the experience. It is best to have your experience be interactive with the intended audience. The first two spectrums of interactivity focus on how much control the audience has over the outcome or the rate, sequence, or type of action, and how much feedback exists in the interface. Productivity experience is another spectrum that can coincide with other interactivity spectrums. Creative experiences allow a user, creator, or participant to make, do, or share something themselves. Creative products and experiences require that others participate by creating or manipulating instead of merely watching and consuming. Adaptive experiences are those that change the experience based on the behavior of the user, reader, consumer, or actor. Communicative experiences are ones that involve two or more people to communicate, which involve high levels of control, feedback, and adaptivity.
Sensorial Design is simply the employment of all techniques with which we communicate to others through our senses. It includes tactile senses- touch, kinesthetics, sense of direction; olfactory sensations- smells, tastes; visual senses- writing, typography, calligraphy, graphic design, iconography, photography, illustration, animation, video, film; auditory senses/time-based media- animation, video, film, voice, music, sounds. All sensorial details must coordinate not only with each other, but with the goals and messages of the project.
Final Project Comp. November 9, 2007
I am having problems importing a png file into Dreamweaver, to link this file to the site. But here it is from FireWorks. Please comment. I feel like it is very generic and would like it to be a little different from my other comps and the original website.
I wanted the background to have an industrial feel. I would like it to fixed so when someone views it on a large monitor, it will be centered. Where the pic is (of the Monument), I would like to have a flash slide show to show different images from DC and the construction trades (workers in particular). All links will be rollovers.
Fireworks Ch. 9- Creating gif Animations November 5, 2007
After completing the first two exercises (the png file) I tried to preview in the browser, to see my loop settings, however, the animation didn’t play at all. But the gif seems to be working fine when you click it above.
Think Outside the Font Box November 4, 2007
http://www.creativepro.com/story/howto/24850.html?cprose=8-20
This article reviews how viewing certain fonts is much different when displayed at a small size vs. a larger one. Most Sans serif look good and are legible at small and large font sizes. Whereas, serif fonts tend to only be legible at larger font sizes. Heavey fonts look good at large sizes, also. The article suggests ajusting tracking and kerning. Tracking is the adjustment of space for groups of letters and entire blocks of text. Kerning is the adjustment of space between pairs of letters. It suggests adjust the size of the font, then the tracking, then the kerning, in that order.
