Enhancing Web Design Through 3-D

With technology moving forward at lightning speed, so too is web design. Today, web sites are more complex, colorful, and dimensional. In fact, many websites toy with depth perception so that their websites come off as three-dimensional. While most web design used to be typically two-dimensional, today three dimensional effects are becoming increasingly popular across the web. Six Revisions put together a nice list of 30 web designs that “successfully create an illusion of depth”.

The list features food companies, personal portfolios, and a zoo, among many others. After checking out the list I realized that just about every type of website could incorporate 3-D design. But is it useful or distracting? I guess it depends on the purpose of the website. For a children’s website I would see it as useful in attracting kids. If it’s for an animation or web design portfolio I also see it is a good way to showcase creative skills. But as the Six Revisions’ article shows, any company can use 3-D and I guess it just depends on what the web designer is trying to communicate and the purpose of the website. Not featured in the article, but also a great example is Apple’s homepage which features three giant-sized iPhones in 3-D. Three-dimensional design like Apple’s is quite appealing but for my portfolio website I’ll stick to a two-dimensional design and when I’ve got that down pat, I’ll consider 3-D!

Advertisements

Web Design/ Developer Tools—Good or Bad?

The instructor of my web design course has filled us students in on a little secret—there’s a tab generator! So basically, instead of learning the code needed to create tabs, I could just generate a custom one. How cool is that?!

Well it is pretty neat and not really the only thing that can help a web designer never have to learn how to code. In fact, there are ready-to-go web templates and other types of generators out there for whatever you need—colors, fonts, forms, etc. But are these helpful or hurtful to web designers?

I think that they are helpful because they save web designers and developers time. But a web designer shouldn’t rely on this and should be capable of creating a tab or whatever it may be without a generator. For increased efficiency I would employ generators if I’m on a tight deadline but would try to do them on my own if possible because that ensures 100% creativity with no confines to generator boundaries.

What in the World is CSS?

While many of us don’t realize it, we see website designs that employ CSS (Cascading Style Sheets) everyday while we’re online. Basically, a single CSS file contains positioning, layout, font, colors, and style information for an entire website, and apparently is far easier to use than HTML cells only. With that said, I still haven’t been able to wrap my head around CSS and didn’t understand exactly how CSS improved websites until just now when I came across several articles that list the benefits of CSS. See here and here. Another helpful resource online is Six Revision’s article which uses images to show some specific examples of CSS in action.

Based on all that I’ve read, CSS is absolutely necessary for efficient web developing. Sure, a developer could use HTML coding alone but it would consume unnecessary time and energy when CSS files can do it faster and better. Furthermore, CSS facilitates faster loading of pages and reduces files sizes, among many other benefits. Given all the hype about CSS I can’t wait to finish learning HTML and move on to CSS!

Just How Far Should a Web Designer Go?

While sketching out my website design for my portfolio I’ve thought a lot about creating a good balance between creativity and utility. Is it worth showcasing overly creative skills at the risk of losing your audience and confusing them? Or does one tone down their creativity and conform to what web designers’ websites usually look like? Having had the chance to review hundreds of site interfaces–from corporations to personal portfolios–I can conclude that there is no right or wrong way to do it. However, there are some benefits and inherent risks when exuding creativity.

Per my web design instructor’s blog prompt, I checked out a webpage  featuring some creative web design interfaces. Some were typical, such as pretty, organized layouts with some funky designs as you’ll see below. Nothing too intense, and it was still clear what the product offered was and how to navigate the page.

 

However, there were more interesting ones, such as one with a gun that advertised itself as a “professional hitman.”  A bit over the top.

 

I also found one that was too heavy with objects and content and another that was utterly confusing and I didn’t understand what was being offered.

 

And lastly, I came across a very bright yet creative looking one that I felt was more balanced than any of the others. It is one that conveyed thoughtfulness both to the level of creativity to expose and to the user’s experience.

I think that  this final one does not have inherent risks as great as the others. It shows that there is potential for creativity while not confusing the audience in any way. I think the others I posted above were either too busy or completely confusing. I know that the content and art direction of my own website, which is still in the initial stages of development, is both busy and content heavy. I’ll have to really consider what I’ve learned so far to better organize it and develop a portfolio website worth looking at!

Web Evolution-What’s Changed Between 2001 and 2012?

Jeffrey Zeldman’s article on his journey as a web designer was a tough read. As a novice web designer and coder (and I’m using that loosely), I have no background on the industry 10 years ago. As such, it was extremely difficult to process and absorb all the information. But I did take from the article the nuances Zeldman encountered when coding and the ways he got around them, even though the solutions are likely no longer useful today.

Although the article was published in 2001, some of Zeldman’s issues are still relevant today. For instance, web standards are always changing or improving and there are compatibility issues across the different browsers available–Chrome, Firefox, and Safari, among others. On the other hand, the article was noticeably dated because the author discussed browser compatibility issues with browsers that are no longer very operational. For example, Zeldman mentioned Internet Explorer 5, Netscape, and Opera. Internet Explorer 5 has been replaced with IE9 and Netscape and Opera are no longer mainstream browsers, nor is IE the most popular anymore. Further, HTML and CSS were the languages being used instead of the now-present (x)HTML5 and CSS3.

Beyond those very straightforward observations,  I wasn’t able decipher too much more that pointed out the article was more than a decade old. I know that a more accomplished web designer or developer could easily take the article apart and explain what has changed between 2001 and 2012 in the web developing world, but at my newbie level I can’t determine anything more!

Am I A Coder?

I guess you can say I’m getting into code these days. A few nights a week I’m working on Notepad++ and creating code in coordination with the instructor of my class. So far we’ve covered the fundamentals, like inputting text and also manipulating text with colors, bolding, italics, and so forth. We’ve just recently introduced images into our websites as well. It’s really simple and basic and I’m wondering how my skills can dramatically improve to a level that I can develop my own portfolio website (the goal of this class).

I look forward to successfully designing and developing my personal website, but I don’t want to be a web designer or web developer full-time. In fact, I just want to learn about these things and be a well-rounded communicator who is capable of designing a website or developing one. That is my rationale for getting a second master’s degree in web design and online communication, however, there are other reasons one might do so.

In today’s world, a product or a service must have a web presence. It’s pretty easy to pay for an already-made template to create a website, but it’s far more exciting to know the code to DIY. So the rationale for not learning HTML or CSS is if you have the resources to buy templates or hire developers to do the nitty gritty for you. As someone who works in corporate communications, I get to produce newsletters and other marketing material and I know that it’s really difficult to work with graphic designers to execute the design and direction of the newsletters and other marketing items because often times thoughts and ideas get lost in translation. If I had the inDesign and Illustrator skills necessary, I could produce these marketing materials way more efficiently and in half the time. So there could be more efficiency if the web designer also develops the website—but only if the designer is proficient in coding. If they aren’t, it could take more time than necessary and thus be inefficient!

Exploring Website Accessibility

When considering the design of my website, I never stopped once to think about accessibility beyond HTML5 and CSS3 coding. In his article that aims to define website accessibilityJim Byrne explores the various ways a website can be made accessible and key things to remember. At the same time, he also reveals the extreme ways one can make their website accessible to all. 

The fourth definition of website accessibility according to Jim is to have it be accessible to computers first, and humans second. Similar to my limited understanding of website accessibility, he points out that the means in which a person accesses a website—the technology or device—must be accessible. So therefore, it’s important for devices to have access to the website so that people can then see the content.  I think that his opinion is right because if you put too much emphasis on humans you can lose the vision of the website or forget key coding components. The most important thing is to ensure that the devices can support your content. Because accessibility to humans depends on it, it is best to never underestimate the importance of making websites accessibility to computers and other devices first.

Getting to Know a Text Editor–Notepad++

I think it is a little difficult for me to analyze a text editor’s interface. I really don’t know much about text editors and only yesterday opened Notepad++ for the first time. I will say that it’s a very simple, even archaic-looking interface. It reminds me of the first Office Word program I had! The key buttons–there are more than two dozen–are lined up in the header area and then there are sub-tabs in the main tabs that run across the top of the header.

Because I’m a novice coder and don’t have much familiarity with text editors, I don’t have a thorough analysis but I do like that when a code is contained the colors indicate so. Also there is highlighting and colors that indicate the beginning and end of code. I like these features, especially since I kept getting characters wrong and would immediately know that it was wrong before running the page on a website.

I don’t feel that the program is one that could be for those self-taught. Or rather, it doesn’t seem very simple to self-learn on this interface. The overwhelming number of buttons scares me and the tab-headers are not very intuitive for a beginner. Plus, the code, once written into the program, looks even more scary but I think the colors help ease that tension.