Weebly Web2.0

http://dig-315-pv.weebly.com

Expressions Live:

http://home.ptd.net/~phab007/default.html

Final project differ from the storyboards:

All the text pretty much was the same and the color combos I had in my head were identical as well. Some of the image and text placement is really all that differed and that was only due to the template restricting me. If I were to do everything from scratch it would have been just about 95% accurate.

Compare/Contract the 2 sites:

Well, this one is tuff to some up. Being Expressions is so much more powerful, you can pretty much make a site look and work however you really want (if you know what you're doing). For me I used a template in Expressions therefore I was restricted by that as starting from scratch would have been way too time consuming especially since I'm a beginner w/ that app. The one thing that was similar w/ Weebly is that you are somewhat restricted by their templates as well. Although, there was 1 really nice feature I found easier out of the gate using Weebly then Expressions and that was drag and dropping what you wanted on the site. Not that Expressions didn’t have that, but Weebly had less options and choices so it was easier to choose. For example I liked the photo gallery I choose on Weebly. It was really simple to setup and looked great. Of course I could have done the same thing in Expressions, but it wasn't as simple to do.

The last thing I'd like to mention is I like the default resolution Weebly used for the page. It was larger and filled the page more. Which for today's monitor size etc it works and looks better in my opinion. Expressions on the other hand the template I choose the resolution was much smaller and I just didn't like that. I’m sure there are ways to change that but it didn't appear to be really simple or perhaps I just didn't look hard enough.

As for adjustments I made from Expressions to Weebly I can think of 2. I created the Expressions page first. Then when I was building my web2.0 site I had some issues w/ my main logo image and it had to be modified for Weebly. Also, I had a gif animation and that didn't appear to work on Weebly as well. It only was showing as a single picture. Other than that some of the image and text placement on the pages were slightly different too due to the restrictions of the templates (as mentioned above). Regarding colors, I was able to match them up pretty close though.

What have I learned in class:

I learned how boring the non-web designers book was. :-) Honestly, I can see the book being VERY good/useful for beginners. Being I've been in the IT industry for so many years alot of the phrases, terms etc.. we learned in class were trivial for me. The info I found very useful was that when I uploaded files to my FTP for my webpage I didn't have to modify the code to reflect the location. It automatically knew where everything was. Don't know if this is something new or has been around for years as I just always had my code reflect the FTP image locations, so perhaps I was always just doing it the harder way, but at least it let me understand the code and how everything inter-connected. I also, learned some nice tips and tricks when using CS5. Although, to truly be proficient w/ the application more than a few weeks would be needed to truly learn that product as it is a huge and can be extremely powerful.

Readings/Comments Week6

These chapters discussed tables and a few other features/options in CS5 and Chapter 15 was about ISP's , FTP's and how they relate to publishing your site online.

One thing I'm surprised about is that the book really didn't seem to go much into detail about domain names and how to go about getting one and the part they play in your website (it was only briefly mentioned). I would think they would talk about that in more detail because w/o a domain name, ISP and somewhere to host your FTP files you really can't do much the site you created. The final portions that I think is somewhat relevant is if someone chooses to host there site themselves via an Apache or IIS (internet information services) server just to name a few and the pros and cons in using that sort of technology yourself. Without really understanding some of what I mentioned above one would really have a hard time building a site and making it available via the internet. Especially when it comes to your code as it will be rather different if you build the pages to point to your local hard drive opposed to your/an FTP server.

Web2.0 to use: *Week6*

I'm at a dilemma between Weebly and Webs. I like the fact that Webs has over 300+ templates where as Weebly only has 100. On the other hand I'm not a fan of ad's which webs has, but CSS is almost not exisistent on Weebly which can be a hassle. The final comparision is file upload, ftp and bandwidth restriction with Webs, but in my case that last point shouldn't be a problem for what I need it for.

Writing for Web vs Print: *Week6*

People don't read information on the Web in the same way they read printed material. Printed content allows the writer to control the reader. In print the writer knows what the reader has previuosly read and what they are going to read next. The writer can present the information in a sequence that makes sense, supported by peripheral cues. You don't have that on the Web. As web users glance through content, they ignore details to read content faster, they even modify fixed left-right viewing habits in order to drill down more quickly.

Tips for the web:

-Web users generally ignore irrelevant graphics, so make sure the images go w/ the subject.
-79% of users scan the page and don't read every word, so keep the paragraphs short and to the point.
-Put the most important info at the begining.
-Use action words and bulleted items.
-Always proof read your content before submitting it.

Examples:

- www.cdw.com (good example not much to read, bulleted items and flash animation of weekly deals).
- www.ford.com (another good example bulleted items and a big image as to what they are trying to    promote. Not much to read at all).

Storyboarding: *Week6*

Storyboarding can be a useful process as it allows you to layout the entire site. This way you can get a visual idea as to how everything connects etcs. Also, it is easier to spot a page or particular detailed that may need to be relocated or changed. Once you are comfortable w/ your layout you then can begin to design the site.

Through my personal experience, in my 15+ years of working in an IT Department for 6 different company's I have never saw a Web Designer or Developer actually draw all their storyboards out by hand. I have seen various ways of storyboarding electronically though with programs like MS Visio, Word and Powerpoint.

*Quality Web2.0 Site*

http://www.squarespace.com/

The above site was recommended to me, so I figured I'd share it with the rest of the group. The first 14 days are free to try after that there is a monthly fee.

http://vimeo.com/35715521

http://vimeo.com/35715521

Usability and Accessibility

Usability is how well the site is, for instance how it looks, does the site make sense and have quality content. Are the navigation bars properly done, does the site have a lot of pop-up's and is it easy to find the home page. Lastly a site w/ flashing or blinking text can be annoying and not would not have "usability".

Accessibility allows people with a disability to perceive, understand, navigate and interact with and contribute to the web. Some of these examples are physical, hearing and visual disabilities. Although it is rare in this year and age, but taking in consideration that some people still have modems/slow internet speeds therefore if a site isn't designed properly it can be a horrible experience.

Anyone able to create a website: Is this a good thing? Week5

In my opinion anyone being able to create a website certainly can go both ways. In some cases it is a good think and in others perhaps it is not such a good idea.

Advantages: Being able to easily create a website in today’s society can be good because it can allow people to understand technology and the internet a little more. As time goes on this potentially would help people in becoming more familiar w/ technology, which can help them in their everyday life. Whether you want it to or not, technology surrounds us more and more each day. Another advantage is if someone is on a tight budget they can produce there own site which would save them on cost as a consultant can be very costly to build and design a site from scratch.  Also, perhaps down the road if someone does higher a consultant after building a site they can relate to the consultant more too.

Disadvantages: A possible problem w/ anyone being able to create a sight could allow a lot of sloppy sites being created. If the site is for professional use it can harm the company if it isn't created properly. Another issue I here and see each day is that just because something is on the internet some people take it to heart and believe every word of it. Therefore, some sites can have just about anything on it (in the form of content) and it can give people the wrong idea or fill them w/ false and inaccurate info. Not that this can't happen if a pro creates the site, but I would think it is more likely is a pro isn't creating it.

Regardless, despite all of the garbage out there my personal opinion is letting people create their own sites themselves is a good think. If they do something wrong then hopefully they will learn from it or if they don't perhaps someone else will and the bottom line is that if you can or do know how to create a site it is going to give you some sort of computer skills.

Will I be more critical of websites in the future?

I guess since my career is in the IT industry I always was and am critical on evaluating a website. I can’t even help myself it’s like the first thing that goes through my head every time I’m on a site. Being in IT you spend a lot of time doing research and downloading drivers and product updates on the web and I have up and down days. Some sites are just a disgrace and others or designed and perform very well.

As for my site I plan on keeping it clean and simple. I know what I like may not be the best according to everyone else, but I have helped design quite a few sites throughout my career (from an IT standpoint), so I feel I have a good understanding of the do’s and don’t for site designs and by the end of this class hopefully I will be ever more enlightened and knowledgeable then I already am. 

2 URL Evaluations:

1. http://www.pcconnection.com/

This is a site from one of my vendors that I use quite often. Overall I feel the site is laid out and designed very well. Here are a few reasons that make me feel this way. Once you are on the home page everything is neatly aligned and nothing appears to be overwhelming. The navigation bar on the left is designed very well, regarding what the site sells. You select the area you are interested in and it breaks down into more isolated items/subjects. Once you find the area you want to go to it then takes you to the root of those items and there are even more selections to choose from to narrowing my search. I also noticed that each page has the same standard resolution and the color schemes don’t change either. They stay in line with the company’s logo and color. Another feature that is nice is they list feature topics and products right off the home pages. Sometimes what I am looking for ends up being right their in front of me from the get go. Another plus to the site is the site and images seem to be optimized as it runs very smoothly even in the heart of the day when their site is most busy.

2. http://support.dell.com/support

I feel that the look of this web site isn’t too bad at all and it is pretty simple to navigate through, but one of my biggest complaints is that the site runs like a snail. It has to be on of the slowest sites I have to navigate through on a daily basis. As if the general site slowness isn’t painful enough. Putting a PC or Server in your cart and customizing it is even worse. I cringe every time I need to order something from this site as it takes f….o…..r…..e…..v……e…….r! The funny thing is I’m really not that sure why it is running so slow either. Perhaps it is due to the coding, because it certainly isn’t image intense. Perhaps it’s the web server itself or being they are Dell Computers (a well known company) that the site just has a ton of traffic and it is the bandwidth that is the problem. Then again perhaps it is a combination of everything I listed. Outside of the performance of the site everything is expectable. I would say I feel the text on the site is rather a bit tiny though. Funny thing is they resign this site about once a year and no matter what they due the sites always appears to be the same. I’m sure they know about it, but for what ever reason it really is the problem is never resolved.

Quiz Page 154

In this scenario Example B. is a much better looking website. My reasoning for feeling this way is quite simple really. The whole flow of the page works very well and it presents itself as smooth and clean. The images are well organized and placed in ideal positions. The text is in an easy to read font and is aligned very neatly. Also, the most important part of the page (in my opinion) is how well the navigation bar is displayed. It is nicely aligned down the left side of the page with nice images and is easy to understand and the contrast colors work together very well.

Example A. on the other hand is just sloppy looking. The text looks terrible on the page and the whole site looks cheesy. It even doesn’t appear to have a nice navigation bar from what I can tell or see from the example given. I would say there is only 1 thing that is tolerable with this website. This is I do like the image for the company name. That does appear to be clean and certainly large enough to get your attention and the colors for the image seem to be acceptable with the background color as well, but outside of that its crap and I’m NOT referring to the acronym we learned about!

Digital Picture Niagara Falls *Week2*

First things first, I’d make a second copy of the file just to be safe. I like to give mine key names, so I know what it is as like Niagara-Falls_RAW.jpg or Niagara-Falls_Original.jpg as an example.

Ok, now a few things I can do. At this point I’d open the file I want to play with and to start I can duplicate the layer so I can compare the differences in my changes (although this isn’t necessary if you don’t choose too), but I find it helpful and just hide on of the layers.

Next, depending on the colors and format of the picture I can use the “quick selection tool” button to take the part of the picture I do want and then copy them (ctrl c). I now would open a new blank screen “File, New” and this is where I choose my resolution, size, background content (ex. white or transparent) and color mode. Then click “Ok”. I can name it here to if I choose in the name field. Now I’d hit “ctrl v” to paste the image. If there are parts of the image that I still don’t want I can zoom in as much as I see fit and just use the erase tool to remove unwanted pixels etc. Now I’d click on file and choose “Save for web and Devices”. Here is where I would choose the file format jpg, gif or png. I prefer jpeg for just about your normal web needs and I can modify the image sizes as well here.

Another alternative to use instead of the quick selection tool is to use the “Crop Tool”. If using the square shape crop tool just drag it over the part of the image you want. Once I have what I want selected I can follow the steps above and copy and paste into a new blank screen again, save etc.

The last option I can think of and it is my favorite of all the tools is too use the ‘Spot Healing Brush Tool”. I’d zoom in as close as needed and with this tool I’d erase those tourists right out of the picture as if they never were even there. This tool sort of acts like a clone to the rest of its surroundings, so in essences it would erase the people out and replace it with near surroundings. If done right one would never even know they were in the orginal. Once completed “save for Web etc…..

***Readability vs. Legibility***

When the average person looks at a printed or online web page, they don’t see or even notice the different typefaces on the page. Instead, they just see plain old words and are just trying to read them. When reading it actually is all about the pace of the typefaces and how they work with the page. The choice of typefaces and how they are used can either assist or hinder the legibility and readability of those words on the page.

Legibility: Refers to a reader’s ability to easily recognize letter forms and the word forms built from them.

Readability: Refers to the facility and comfort with which text can be comprehended. We don’t read by recognizing one letter at a time, we read by recognizing the word as a whole.

I also would like to give some brief info on typeface. There are mainly 2 forms of type face fonts Serif and San Serif. Serif fonts are probably the most commonly used font in printed materials including most books, newspapers and magazines and serif typefaces are also named for the features at the ends of their strokes. San Serif text on electronic media offers an exception to print as most web pages and digitized media are laid out in sans serif typefaces because serifs often detract from readability at the low resolution of displays. For example if you use MS Outlook as for your email the default font for new emails is Arial which is a San Serif font since it is easier to display digitally. 

Week1

Graphic design is all around us each and every day. Whether it is an advertising sign at a bus stop, a circular for your local supermarket or a banner ad when you log into your internet email account. The point being we see it consistently throughout our days whether we know it or not. One thing is for certain whether you are interested in the advertisement or not the more attractive it is the more bound it is to catch our attention. Even if you are not interested in the product, just the possibility that you will mention it to someone else in a positive or negative tone can mean the designer has done their job correctly.

Designing for print can be pretty cut and dry. For example WYSIWYG (what you see is what you get), meaning whaT you print out is the way it will look no matter what. On the other hand designing for Web is much much more complicated. As many web browsers, resolution settings and monitors can all cause a different efffect, which makes it hard to have your site look correct for all of your audience.

Reading Assignments Week#1

Chapters: 1-2 These two chapters really seemed geared for someone who knew nothing about the internet, web and how you gain access to it (ex. Your ISP).

Chapter: 5 This chapter mentioned the differences between web and print. Being I have a VERY technical background I can’t really say I agreed with all of it. Specifically, the pros to printing as lot of there pros were incorrect and not valid being it is 2012. I guess this can be due to this book being written in 2006 as the technology game has changed drastically since then. As just about everyone as young as 6 years old have web access available to them just about anywhere and anytime. Whether it is in there house, local library, or on their mobile smart phone. As technology is constantly changing the purpose for using print is becoming smaller and smaller.

Chapter: 6 This chapter was a review of the C.R.A.P. acronym and explained in detail what each word was, meant and how it relayed to designing a website.

Pages: 186-192 These pages discussed different picture file formats (ex. Gifs and jpegs). It also explained the differences between them and when one is a better option to use then another. The end of this reading assignment briefly explained Anti-aliasing and what it does. The book states that it is widely used in websites and is a common term regarding web design. Currently, it is a very common term when referring to graphics, specifically, video games. As a lot of today’s GPU’s (graphic processing units) have a wide configuration array for anti-aliasing and all video games have options for it anymore. This makes it a very large part of how smooth a video game will look, but the smoother the graphics are the more systems resources will be required, especially at high screen resolutions.

Non-Designers Website Quiz (page 112)

1. I would distribute the annual reports via the Web/Email. Let’s be honest in today’s world who really reads prints anymore when it comes to a report. Having it available via the web gives so many more options and makes it way more available for a larger audience. Bottom line in my opinion and experiences electronically certainly is the way to go. For example it can be viewed at anytime on a mobile device or computer virtually anywhere at any time. Printing it for distribution really tends to be extremely limited.

2. When it comes to advertising or networking yourself for a new job especially as a graphics artists you really should do both print and web. This way it will allow all potential employers to see how versatile you are and can be.

3. If I have to deploy updates for software, web is the way to go. This will make things a lot easier for your clients as they can just go one the web link you provide them and install the updates as needed. On the other hand if the updates are fairly large you may want to print the notification and send a CD along with the updates included.

4. If I have info that clients access often I would make it available on the web as it is much easier to maintain and not impact the client as you make your changes on the web it would be transparent for your clients and the least disruptive.

5. If I needed to make booklets available for people I would do it via the web. Once again it just allows people to gain access to them very easily and at will. Allow, from a cost perspective it is a much cheaper solution.

6. To make my artistic work available to the world it should be done via the web. Ass it makes the possibilities limitless.