Deanna's Blog

Portfolio Site

deannafloyd — Thu, 06 May 2010 16:14:42 +0000

For my background I took a picture of my backyard with our pet swan! I made the cloud with my name in it and the feather links in Illustrator! My home page links to my About Page and my Designs page! On my about page I made a table and listed a short resume of myself and my qualifications. My third page is my Designs page. On this page I made a table and displayed images of two websites that I have completed along with other designs that I have created! I would like to add my drawings to this page in the futer whenever I have more time!

Rachel Ashley

deannafloyd — Thu, 06 May 2010 16:02:41 +0000

For my Rachel Ashley site I designed the background in Illustrator. I manipulated my images to overlap each other. For my heading I put Rachel Ashley Paper Crafts and for the tag line in put, “Something Fantastic for all of your Creations! For the home page I added a phone with a picture of my website to let users know that it was mobile accessible. For the Sign Up page I added a table with input boxes. For the Schedule page I made a table and showed classes for every day of the week. For the Coupons page I made a coupon in Illustrator giving customers 50% off everything in the store!

Information Architecture

deannafloyd — Sat, 01 May 2010 22:16:26 +0000

Information Architecture is the cohesive structure that brings all of a website’s pieces together in a uniform manner. After the strategic plan, Information Architecture is the single most important element driving website success. Many web organizations do not have the expertise or time to undertake a full-blown Information Architecture development phase and often combine it with navigation and interface design.

In the context of information systems design, information architecture refers to the analysis and design of the data stored by information systems, concentrating on entities, their attributes, and their interrelationships. It refers to the modeling of data for an individual database and to the corporate data models an enterprise uses to coordinate the definition of data in several (perhaps scores or hundreds) of distinct databases. The “canonical data model” is applied to integration technologies as a definition for specific data passed between the systems of an enterprise. At a higher level of abstraction it may also refer to the definition of data stores.

HTML5 video

deannafloyd — Sat, 01 May 2010 17:36:33 +0000

From what I have read about HTML5, I think that it will make some changes, but it seems like most of the code is just a little different. The HTML5 specification was adopted as the starting point of the work of the new HTML working group of the World Wide Web Consortium (W3C) in 2007. This working group published the First Public Working Draft of the specification on January 22, 2008. The specification is an ongoing work, and is expected to remain so for many years, although parts of HTML5 are going to be finished and implemented in browsers before the whole specification reaches final Recommendation status.

HTML5 introduces a number of new elements and attributes that reflect typical usage on modern Website. Some of them are semantic replacements for common uses of generic block (

) and inline () elements, for example

(website navigation block) and

(usually refer to bottom of web page or to last lines of html code). Other elements provide new functionality through a standardized interface, such as the and video elements.

The HTML5 syntax is no longer based on SGML despite the similarity of its markup. It has, however, been designed to be backward compatible with common parsing of older versions of HTML. It comes with a new introductory line that looks like an SGML , which enables standards-compliant rendering in all browsers that use “DOCTYPE sniffing”.

IPAD

deannafloyd — Sat, 01 May 2010 17:10:03 +0000

Web developers have faced the issue of being compatable with the iPad. After Apple released the iPad, it became very clear for Web developers that the device would not support Adobe Flash, or any other Web plug-in. If Web developers wanted all the dynamic content on their pages such as videos and animations to appear correctly on Apple’s new device, they had to create it using only the next generation markup language for the Web, HTML5, and related open standards. In my opinion, this is a problem!Google reveals that there are at least 74 million web pages that use the Shockwave Flash (SWF) format. It is a tall order to ask all of them to change for a single company’s line of products, even if Apple sold more than 500,000 of these devices last weekend. Developer tools for HTML5 aren’t as advanced as those for Flash, and the standard is not finished yet, which could lead to more work for developers down the road to readjust pages to meet the finalized standard. Eschewing the Web’s plug-in model, the iPad may potentially miss out on cutting edge features enjoyed elsewhere on the Web.

Web developers interested in tweaking their sites for the iPad, but also using continuing to use Flash, may have no choice but to build, as Flickr did, hooks specific for the iPad.

Web Standards

deannafloyd — Sat, 01 May 2010 15:29:07 +0000

Web Standards is a general term for the formal standards and other technical specifications that define and describe aspects of the World Wide Web. In recent years, the term has been more frequently associated with the trend of endorsing a set of standardized best practices for building web sites, and a philosophy of web page design and development that includes those methods^.

The W3C develops open specifications to enhance the interoperability of Web-related products. W3C Recommendations are developed by working groups consisting of Consortium members and invited experts. Working groups obtain general consensus from companies and other organizations involved in creating applications for the Web, and create Working Drafts and Proposed Recommendations. These are then submitted to the W3C membership and director, for formal approval as W3C Recommendations. More information regarding this process and the review stages can be obtained from the W3C website.

Using strict HTML and separating structure from content paves the way to XHTML, an XML-compatible version of HTML. Using XHTML will enable web authors to leverage tools from the XML world, such as XSLT, to easily manipulate XML data. Using XHTML is a way to enter a set of standards composed of XML-based technologies, such as XML, XSLT (transforming data), SVG(animated graphics), MATHML (describing mathematic expressions)… Such technologies have been designed to be interoperable, are the base of Web Services. This goes much further than just web authoring.

Hyper-Text Markup Language (HTML) is widely used on the Web for adding structure to text documents. Browsers interpret these documents, representing the structure in media-specific ways to the user. For example, visual browsers typically display the strong element ( … ) as bold text, while text-to-speech readers might emphasize that text when pronouncing it.

Common elements of the design process

deannafloyd — Mon, 12 Apr 2010 17:20:08 +0000

Step 1: Multi-stage web design process

Stage 1: Conceptualization and planning (flowcharts)

When designing a website, one should not begin the process inside of a text editor (BBedit) or website builder application (Dreamweaver, GoLive, etc). Instead, the process should begin on a piece of paper or within flowchart software.

By planning out your website using a flowchart, you get a head start on:

Information organization
Usability
Determining the volume of content required

Stage 2: Modeling (wireframes)

In the modeling stage, static “wireframe” mockups are created for each unique web page. To create wireframes, one may use either:

paper and pencil
mockup software such as Adobe Photoshop or our personal choice

Stage 3: Execution

The third stage in our professional web design process includes:

Creating the graphical user interface (GUI), also known as the design
Creating the content
Converting the web designs from images into code (markup) which web browsers use to present your website on the Internet

Step 2: Project collaboration tools

Note: If you are the only one working on your project, then you can skip this step. Project collaboration tools are only recommended for projects which have two or more people involved.

Step 3: High-quality design

Who and what determines a “high-quality design”? There isn’t one answer. Often times something that is appealing to one person may be extremely unappealing to another. Despite this fact, there are several things that a high-quality design should have:

Balance. Balance refers to the equal distribution of the heavy and the light elements on a single page.
Unity. Unity keeps all of the similar elements in the website alike and those that are diverse further apart; everything should be pulled into one integrated whole.
Emphasis. Emphasis involves the main points where the eye is drawn into the design; also known as “focal points”.
Contrast. Not just color contrast, but also contrasting shapes, sizes, textures, and even typography.
Rhythm. Also known as repetition, rhythm brings internal consistency into your web design.

Step 4: Attention to detail

When professionally designing a website, every little detail is thought out and planned. Should there be a line above the headers, and if so, why? If you use rounded corners for your main body, should you be consistent and use rounded corners for everything else? Does your logo look better with a reflection underneath? The only way to answer any of these questions is to experiment. Sometimes the best results come from accidental experimentation. Don’t always be happy with the first design. Work to improve upon the design and go through a few revisions, each time asking yourself “What can be done to make the design look better?”, be more consistent, and most importantly, give your website a stronger identity and image.

Step 5: Current web design technology (CSS)

CSS – also known as cascading style sheets – replaced table-based website layouts years ago. The problem is, a lot of web designers are still using tables to create their designs. Not only is this unprofessional, but tables just plain suck. Here are a number of reasons why using tables for your web design is a bad idea:

Tables slow down your website. Everything inside of a table’s cell is loaded before being shown to the user. This is especially apparent for people using dial up connections.
Tables make messy code and add unnecessary junk markup. File sizes are increased due to the excessive lines of code which means slower load times. Also, having to sift through hundreds (sometimes thousands) of lines of code just to make a change isn’t a lot of fun.
Universal layout updates are difficult and time consuming when using tables. Making universal edits with tables involves opening each file, sifting through the code and junk markup, and making a change (again, on each page). Often times with CSS, all one must do is open the stylesheet and change a single value.
Tables should only be used to show data, not be used to design websites.
Tables limit your creativity and design. Table layouts are limited to boring, grid-based layouts. With CSS, you can place anything anywhere. The layout possibilities with CSS are endless.
CSS will save you time and increase your revenue in the long run. Updates and edits are much easier using CSS than tables. Because of faster load times, fewer visitors are likely to become impatient and leave. Longer visits = more browsing, more ad-clicking, lower bounce rates = more money for you.
Display your CSS website on tons of high-quality CSS Showcase websites. Tons of exposure if your website is featured. Table-based layouts are not welcome.

Step 6: Well written, interesting, grammatically-correct content

One thing that greatly compromises the quality and credibility of a website is poorly written, grammatically incorrect, misspelled content. This kind of content is unfortunately present in an extremely high number of websites – especially “professional” company websites.

Step 7: Usability

Website usability is extremely important.

Step 8: XHTML and CSS validation

Some people will argue that validating your website with xhtml and css validation from W3.org is a waste of time. To be blunt, they are wrong (for a number of reasons).

Step 9: Standards-compliant

Perhaps the most difficult, time-consuming aspect of professional web design is making sure your website is standards-compliant.

Step 10: Optimization

Website optimization is another crucial factor that must be taken into consideration when professionally designing a website. Website optimization includes:

Step 11: SEO (Search Engine Optimization) friendly

Professionally designed websites should be designed with a solid SEO friendly foundation. To make your website SEO friendly:

Step 12: Abuse of Flash, Javascript, and sound effects

The last step in creating a professional web design and website is to avoid the abuse of Flash, Javascript, and sound effects. Not everyone has Flash or Javascript enabled on their computer, and therefore your website should not be built around them. If you’re going to use Flash or Javascript, use it sparingly.

The recipe to professional web design

These 12 steps make up the majority of the recipe which many professional web designers live by when designing websites. Of course, knowing the things that you know after reading this article and actually being able to create a professional web design are two very different things. However, as it does with anything, practice makes perfect. Now get out there and start building a professionally designed website! And hey, if you can’t do it yourself, go to Google and search “professional web design”. CHROMATIC is in there, along with many other highly-respected professional web design companies.

Design Features

deannafloyd — Mon, 12 Apr 2010 17:03:58 +0000

It is easy to make a bad web page. It’s also easy to make a very nice, clean, professional-looking web page even if you don’t have much design experience. Here are some good design features:

Text: Background does not interrupt the text; Text is big enough to read, but not too big; The hierarchy of information is perfectly clear; Columns of text are narrower than in a book to make reading easier on the screen
Navigation: Navigation buttons and bars are easy to understand and use; Navigation is consistent throughout web site; Navigation buttons and bars provide the visitor with a clue as to where they are, what page of the site they are currently on; Frames, if used, are not obtrusive; A large site has an index or site map
Links: Link colors coordinate with page colors; Links are underlined so they are instantly clear to the visitor
Graphics: Buttons are not big and dorky; Every graphic has an alt label; Every graphic link has a matching text link; Graphics and backgrounds use browser-safe colors; Animated graphics turn off by themselves
General Design: Pages download quickly; First page and home page fit into 800 x 600 pixel space; All of the other pages have the immediate visual impact within 800 x 600 pixels; Good use of graphic elements (photos, subheads, pull quotes) to break up large areas of text; Every web page in the site looks like it belongs to the same site; there are repetitive elements that carry throughout the pages

Difference Between Style and Design

deannafloyd — Thu, 08 Apr 2010 17:39:56 +0000

Style can refer either to the aesthetic values, after choosing the composition, by choosing the physical techniques employed to present the imagery such as the art medium and stroke method of hand rendering, computer generated filter, or image capturing effect. An aesthetic movement – such as Realism, Romanticism, Impressionism – can promote an entire world view, a way of interpreting reality and deciding which parts of it are worth observing and/or emphasizing, as well as to what extent the artists’ emotions are expressed. Some of these movements are closely associated with certain techniques, such as Pointillism, while others are more flexible, but each has a characteristic “look” that becomes more and more distinctive as it develops until it reaches a saturation point, paving the way for the next style.

By changing the way they paint, apply colour, texture, perspective, or the way they see shapes and ideas, the artist establishes a certain set of “rules”. If other artists see the rules as valid for themselves they might also apply these characteristics. The works of art then take on that specific “style”. An artist may give the style a name such as “Expressionism”, or a name may be applied later, as in the case of “abstract art”.

Design is the planning that lays the basis for the making of every object or system. It can be used both as a noun and as a verb and, in a broader way, it means applied arts and engineering. “To design” refers to the process of originating and developing a plan for a product, structure, system, or component with intention. “A design” is used for either the final (solution) plan (e.g. proposal, drawing, model, description) or the result of implementing that plan in the form of the final product of a design process This classification aside, in its broadest sense no other limitations exist and the final product can be anything from socks and jewellery to graphical user interfaces and charts. Even virtual concepts such as corporate identity and cultural traditions such as celebration of certain holidays are sometimes designed. More recently, processes (in general) have also been treated as products of design, giving new meaning to the term “process design”.

Fake HDR Portrait

deannafloyd — Tue, 16 Mar 2010 03:49:34 +0000

Wow! That is all that I can about Deke McClelland. He is quite amazing! He has accomplished so much including: he is an electronic publishing pioneer and a popular lecturer on Adobe Photoshop and the larger realm of computer graphics and design. He hosted Adobe’s official Video Workshop, did hundreds of hours of tutorial-style video training, amongst several other things.

An HDR image packs more pixels than normal into a picture creating billions of color variations and razor-sharp detail. Creating compelling HDR portrait images can be tricky, whether through multiple exposures and tone-mapping or fake HDR methods in Photoshop. I am definitely very interested in Photoshop and I am now realizing how many things that you can actually do. I cannot wait to experiment with several different techniques in my future.