top of page

Why do you need to have your own website?

In our industry, it’s important to put yourself out there so you can be recognized by schools, potential employers, and others in the art community that you can network with professionally. A personal website is also your digital portfolio to showcase all of the work you do both in and out of the classroom along with any hobbies, interests, and other important information you would like others to learn about. A personal website is also your “digital business card” for others to get your contact information and to learn more about your background, skillset, and work experience.

Screen Shot 2019-12-16 at 8.46.27 PM.png
Screen Shot 2019-12-16 at 8.47.03 PM.png

When building your portfolio website it’s important to remember that this site is to be “professional” meaning you should carefully consider what you want others to see. Remember, schools, employers, and other industry professionals will be looking at your site. Be aware that they will search your Social Media accounts to look for any “inappropriate” content that may hurt your chances to be considered for the school and job you’ve been wanting. Please leave out anything that could include profanity, underage drinking, illegal drug use, nudity, or offensive religious or political views.

Introduction to WIX and Web Design Terms

Website - All the web pages that use the same domain name and are all stored on the server

Web Page - A single HTML file that contains information that is viewed using a web browser

Home Page - The main page (index page) of a site

HTML - Hypertext Markup Language; a programmed language used to create web pages

Web Browser -  A program that is used to view web pages

Index -  The name of the first or home page of most websites

Hexidecimal Value -  The way 216 web-safe colors are written so they can be recognized by all web browsers and operating systems. They can be accessed online in chart form.

www - World Wide Web; internet sites that display text, graphics, sound, and animation resources through the hypertext transfer protocol make up a computer network

URL -  Stands for Uniform Resource Locator; the address of a web page

Hyperlink - A link to another page, document, image or other media on a Web page

HTTP -  Stands for Hypertext transfer protocol; the set of rules for transferring files

Domain name -  The name of your website

Background image -  A graphic file used in place of a background-color

Internal link -  A link to another page within the same website

External link - A hyperlink that links to another web site

Broken link - A link to a website that has been moved or deleted

Search engine -  A website database that classifies website content according to keywords and actual content on a website

Keywords - Words built into the HTML codes of a web page to help search engines classify the page

Animated GIF - A type of GIF image that can be animated by combining several images into a single GIF file

Animation -  The rapid display of a sequence of images in order to create an illusion of movement

Banner - A form of advertising on the World Wide Web that is embedded into a web page and is intended to attract traffic to a website by linking to the website of the advertiser

CheckBox - A graphical user interface element that permits the user to make multiple selections from a number of options

Drop Down Menu -  A graphical user interface where a menu of options appear below the item when the computer user clicks on it

10 Rules of Web Design - Follow these guidelines to create great websites

​​

  1. Simple is beautiful.
    Cramming too much into each page creates confusion. Visitors get frustrated when they have to scan through rows of links and images to find what they are looking for. By keeping your pages simple, your website will be easier to use.

  2. Design is paramount.
    When you meet someone for the first time, you want to make a good first impression. The same should be true for your website. The overall look and feel of your site is the first thing your visitors will notice.

  3. Navigation should be intuitive.
    There are few things more frustrating than not being able to find what you want on a website. Pages should be well-organized with a top-down design so that visitors can easily browse through the different sections of your site.

  4. Consistency is key.
    Visitors shouldn't feel like they are visiting a new website each time they open a new page on your site. Consistent design across the pages within your site makes navigation a much easier task.

  5. Colors are crucial.
    Color selection can make or break a website. Most of us have visited websites that are simply painful to look at. When choosing colors, use a consistent palette of colors that don't clash and make sure there is a strong contrast between the text and the background.

  6. Make your website responsive.
    People will access your website using a wide variety of devices – from smartphones to desktop computers. Therefore, it is important that your website displays correctly on different screen sizes. CSS media queries are a great way to implement responsive web design.

  7. Develop for multiple browsers.
    Browsers are supposed to render web pages the same way, but they don't. Therefore, make sure to check your website in multiple browsers to make sure everything appears correctly. It is best to catch problems ahead of time instead of relying on complaints from your visitors.

  8. Check your website for errors.
    As any experienced editor will tell you, a great piece of work can be tarnished by a small error. If you're a webmaster, check your websites on a regular basis for typos, broken links, and images that do not load correctly.

  9. Write your own code.
    Whether it's HTML or PHP, nothing beats writing your code from scratch. If you build your site from templates and pre-written scripts, you will be clueless when something goes wrong. When you code your own pages, you have full control over how they look and act.

  10. Don't forget the content.
    Even if your site is beautifully designed, it is only an empty shell without content. A good website has both great design and great content. Therefore, make sure your pages have unique, original content that makes them worth visiting.

Design Functionality Testing

A good website should be easy to navigate.
A website that is easy to use is crucial because if the visitor finds it difficult to navigate from one page to another, he or she will get frustrated and leave the website. Attracting frustrated visitors to come back to visit the site is extremely difficult.
 
Have a clear indication of where the user is.
The website’s visitor should always have a clear indication of which site page they are on and how they got there, thus making navigation easier.
 
URL should be easy to remember
One of the most common mistakes in website design is choosing a proper domain name. Your domain name should be easy to remember and easy to spell.
 
The website should be easy to find/lookup/search for
Although, once upon a time, the ‘if you build it, they will come’ mantra worked for websites – it no longer does. Due to the fact that there are millions of websites on the Internet, it becomes important for you to ensure that your website ranks high in search engine results and is easy to find.
 
The website should work on multiple browsers
Gone are the days where the only Internet browser that everybody used was Netscape. Today, there are various Internet browsers that people prefer to use. Thus, it becomes imperative that your website be able to load on any browser – whether that be Internet Explorer, Firefox, Safari or Google Chrome.
 
Content should be updated often
The real factor that drives a website towards becoming successful is the content. If content is not updated often, visitors of the website have no reason to visit the site often. Updating content on a regular basis becomes difficult if one does not know HTML and has to rely on a webmaster, which may not always be available.
 

Layout consistency is key
It is important for all your website pages to follow a certain layout in order to maintain a theme and uniformity. If the layout of your website pages is not consistent with one another, your website will look untidy and disorganized, thus not properly reflecting your club’s image online.
 
Eliminate Clutter
Another common mistake that many people make is placing as much content as they can, on one page. Often, many people place so much information together that the visitor has information overload.
 
The website should be quick to download
In today’s fast-paced world, patience is slowly becoming a thing of the past. Website visitors want the website to load fast and want to be able to look at photos, articles, and watch videos immediately. When a website has too many large images within it, it will take longer to load. This leads to frustrated visitors who end up leaving your site.

Site Completion and Testing

WEBSITE TESTING CHECKLIST

 

Spelling, grammar, punctuation

Check for proper spelling, typos, and grammar site-wide. Not just in article text and headlines, but also throughout the navigation, calls-to-action, buttons, forms etc.

If your site has Forms

Fill out the forms on the site and go through the following questions:

Can the flow be improved?

Do you get stuck?

Are the instructions accurate?

Does the completed form get sent to the right people or person?

Check images

Make sure your images are all optimized for the web. Ensuring they’re not too large – and site-speed draining. As well as being properly labeled with titles and alt-text.

Context 

When giving a critical eye to the pages within the site, ask:

Why would I visit this page?

Is the content ready for the visitor?

Does the page address the audience?

Site speed

Check the size of your page sizes and their load time. You can use Google’s own site speed test to do this. Site speed is a ranking factor, so follow any improvements Google recommends as closely as you can.

Mobile-friendliness

Is your website mobile-friendly. Frankly, it’s very difficult not to build a multi-device compatible website in 2016, but just in case, here’s a handy checklist to ensure your website’s mobile-friendliness.

Compatibility

Check to make sure your website’s pages render well in common browsers. Browser share is a moving target so to help prioritize efforts, here’s a site that continually examines it.

Fonts

Sometimes font codes get dropped into a page inadvertently and make a letter or a word look funny. Check to see that the formatting is consistent, and look for odd blips in the copy.

Navigation

Test the navigation to the breaking point. Make sure every single possible journey through your website leads to wherever its meant to without any broken links or wrong pages. Makes sure your on-site search works, and it delivers accurate results, and if there are any zero-results that you’re providing navigation to other relevant pages.

Social media integration

Do the social media icons on the site go to the correct pages? Do you have the right buttons and social plugins installed for what you are trying to accomplish and what you want the user to be able to do? (For example, does it ‘share a post’ rather than ‘Like’ your page on Facebook.)

How to Critique a Website

Aesthetics and Visual Impact - Questions to Ask Yourself

  1. Where is the first place your eye focuses (without scrolling)? Is that the first thing you want your users to see?

  2. Does the layout help illustrate the journey you want the user to take on the page?

  3. Do the colors harmoniously work together and accentuate proper hierarchy? Do they relate to the logo?

  4. Are these colors associated with the type of emotion you want to evoke 

  5. Are font weights being used effectively and properly for readability and content separation?

  6. Are there any spots where the content and design don’t seem to fit with one another?

​​

Navigation - Questions to Ask Yourself

  1. Where is the main navigation on your site (top of the page, hidden in a hamburger, etc)? Is it located in an area where it’s easily accessible and identifiable for the user?

  2. How is the visual spacing between the content? Is it clear what’s separated and what’s connected?

  3. How many dropdown levels does your website have? If it’s two or more; are they necessary? Are the pages important enough to constitute a  spot on the navigation? Can they be condensed?

  4. Do proper styles indicate whether or not you are hovering over items?

  5. Could your users tell what sort of work your business might be in from the navigation? Or are the labels to general?

  6. Are the fonts legible and at an appropriate size?

  7. Is there a clear call-to-action throughout your nav? Or is it competing with something else?

  8. If your sites fairly large, is there an option for users to search to better locate what they are looking for?

​​

Content Evaluation - Questions to Ask Yourself​

  1. Review the content you are putting out and reevaluate whether or not you content resonates with all levels of your user’s buyer’s journey. Is it content worth reading? 

  2. Do the offers you put accurately correlate to what you blog about?

  3. How much content do you put out regularly? Is it enough to keep your users engaged?

  4. What is the language like? Is it to you-focused? Does it lack any personality?

  5. Aside from the content you're putting out. Do other pages on your website easily give users the chance to understand who you are, what you do, how you help, and how you can help them?

  6. Does this content focus too much on you? Or is the language explicitly positioned on helping the user.

  7. How is all this content presented? Is it too long/difficult to find/disorganized/too small or large? (You don’t want to content stuff just to get everything you want to say onto a page!)

​​

Usability - Questions to Ask Yourself

  1. How fast does your website load? Are you including a lot of assets that might be affecting it?

  2. Can users easily navigate through the majority of your pages with the ability to successfully judge where certain calls to actions/links lead to? Are these also noticeable yet not intrusive?

  3. Can users intuitively find all pages of your website? Are there any that have confusing user paths to locate?

  4. Does your website incorporate unique functionality? If so, is it intuitive, you do you users need to take some time to understand it?

  5. Is your website responsive and properly optimized for these users?

Day 1&2
Day 3&4
Day 5&6
Day 7&8
Day 9&10

STUDENT PORTFOLIO WEBSITE LECTURES

bottom of page