0% found this document useful (0 votes)
20 views2 pages

Step 3 - Build A Portfolio

The document provides guidance on building a portfolio as a web developer by practicing design patterns, wireframing, templates, and HTML/CSS skills. It recommends starting small by building personal projects and helping friends/family, then pursuing larger freelance opportunities by joining sites and building a portfolio of work samples. Continued skill development, community involvement, and learning JavaScript are also suggested.
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
20 views2 pages

Step 3 - Build A Portfolio

The document provides guidance on building a portfolio as a web developer by practicing design patterns, wireframing, templates, and HTML/CSS skills. It recommends starting small by building personal projects and helping friends/family, then pursuing larger freelance opportunities by joining sites and building a portfolio of work samples. Continued skill development, community involvement, and learning JavaScript are also suggested.
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 2

Practice and build a portfolio

1. Think Design Patterns


https://developer.yahoo.com/ypatterns/everything.html
2. Look at themes and templates of websites. Begin to form ideas on how to develop them. Pick a popular
website and build your own version using HTML and CSS.
3. Start creating wireframes and looking at page structures.
https://en.wikipedia.org/wiki/Website_wireframe

A website wireframe, also known as a page schematic or screen blueprint, is a visual guide that represents the
skeletal framework of a website.[1]:166 Wireframes are created for the purpose of arranging elements to best
accomplish a particular purpose. The purpose is usually being informed by a business objective and a creative
idea. The wireframe depicts the page layout or arrangement of the website’s content, including interface
elements and navigational systems, and how they work together.[2]:131 The wireframe usually lacks typographic
style, color, or graphics, since the main focus lies in functionality, behavior, and priority of content.[1]:167 In
other words, it focuses on what a screen does, not what it looks like.[1]:168 Wireframes can be pencil drawings
or sketches on a whiteboard, or they can be produced by means of a broad array of free or commercial
software applications. Wireframes are generally created by business analysts, user experience designers,
developers, visual designers and other roles with expertise in interaction design, information architecture and
user research.

Wireframes focus on:

 The range of functions available


 The relative priorities of the information and functions
 The rules for displaying certain kinds of information
 The effect of different scenarios on the display[1]:169
[3]
A “wire frame” is a non-graphical layout of the proposed web page. The website wireframe connects the
underlying conceptual structure, or information architecture, to the surface, or visual design of the
website.[2]:131Wireframes help establish functionality, and the relationships between different screen templates of
a website. An iterative process, creating wireframes is an effective way to make rapid prototypes of pages, while
measuring the practicality of a design concept. Wireframing typically begins between “high-level structural work—
like flowcharts or site maps—and screen designs.”[1]:167 Within the process of building a website, wireframing is
where thinking becomes tangible.[4]:186

Aside from websites, wireframes are utilized for the prototyping of mobile sites, computer applications, or other
screen-based products that involve human-computer interaction.[5]

4. Focus on building your portfolio. While you practice HTML and CSS. Keep practicing HTML and CSS –
Spend several weeks learning and playing around with HTML and CSS.
5. To begin making an income you can approach friends and family to see if they need anything done online.
Also try placing classified ads and sign up for an account at fivrr.
6. Look towards what is in demand as you grow your online career. Pick a freelance website to join register
and prepare to begin taking on jobs. Jobs on freelance sites are usually bigger than fivrr or what you get
from classified so this should be a next step to be considering but if you are not ready you should get as
many small jobs done as possible. ebayclassifieds.com fivrr.com warriorforum.com You can also look to
small jobs posted on forums.
7. Build your portfolio even if it means taking on volunteer and unpaid work. Having a good portfolio is
crucial to getting bigger and higher paying jobs. https://www.freelancer.com http://www.freelance.com/
http://www.guru.com/ https://www.freelancer.ca
8. Get involved in the web developer community. Read up and interact with forums.
http://www.warriorforum.com/, http://www.webmasterforums.com/, http://stackoverflow.com/
9. Spending time each week developing practicing your skills as you get ready to learn more about
JavaScript.

You might also like