Presentation is loading. Please wait.

Presentation is loading. Please wait.

WEB RESOURCES.  (X)HTML files are text files formatted to comply with the (X)HTML standard.  A (X)HTML can be edited by using any known text editor.

Similar presentations


Presentation on theme: "WEB RESOURCES.  (X)HTML files are text files formatted to comply with the (X)HTML standard.  A (X)HTML can be edited by using any known text editor."— Presentation transcript:

1 WEB RESOURCES

2  (X)HTML files are text files formatted to comply with the (X)HTML standard.  A (X)HTML can be edited by using any known text editor such as:  Notepad – Windows  gEdit – Linux  Emacs – Linux  Notepad++

3  HTML-Kit  Ect.  In order for the underlying operating system to identify the file as a web page, it must be saved using the.htm or.html file extensions.

4  Several commercial and open source software exist that provide for easy way of instantly designing and publishing websites.  Most of such software tools are visual designers that support the notion of What You See Is What You Get (WYSIWYG).

5  For instance:  Adobe Dreamweaver – Marketed by Adobe Inc and the most famous web design tool.  Amaya - a hybrid of a web browser and a web-page editing application, created by W3C.

6  Adobe Contribute - allows editing web-sites and blogs.  Google Web Designer  RapidWeaver - a powerful template-based website creation tool which can generate pages of different kinds, such as styled text, weblog, contact forms, image galleries, etc.

7  Microsoft SharePoint Designer -Frontpage successor, a standard WYSIWYG-editor for users without any technical expertise.  Microsoft Visual Studio IDE  Microsoft Publisher  Etc.

8  Using website designing tools simplifies and shortens the amount of effort and time used to build a site since the tools provide many pre-fabricated elements for the user to customize.  Some provide templates that you can quickly customize to obtain your own page.

9  FTP support in some of these tools allows for quick deployment of websites to production servers.

10 WEBSITE DESIGN PROCESS

11  There are numerous steps in the website design and development process from gathering initial information, to the creation of your website, and finally to maintenance to keep your web site up to date and current.

12  Designing a winning website requires a well thought-out online strategy focused on reaching organizational goals.  These can be anything attracting visitors to buy products getting the public to understand an issue introducing visitors to a new brand Etc.

13  The Web design process goes through some phases to attain the final goal.  The phases of the Web design process include the following steps.

14  The first step in designing a successful web site is to gather information.  Many things need to be taken into consideration when designing the look and feel of a website.

15  Purpose What is the purpose of the site? Do you want to provide information, promote a service, sell a product, provide education, … ?

16  Goals What do you hope to accomplish by building this web site? Two of the more common goals are either to make money or share information such as to educate.

17  Target Audience Is there a specific group of people that will help you reach your goals? It is helpful to picture the “ideal” person you want to visit your web site. Consider their age, sex or interests – this will help in determining the best design style for the website.

18  Content What kind of information will the target audience be looking for on the website? Are they looking for specific information, a particular product or service, learning material, …?

19  Using the information gathered from phase one, put together a plan for the website.  Develop a site map – a list of all main topic areas of the site, as well as sub-topics (if applicable).  This gives a guide as to what content will be on the site, and is essential to developing a consistent, easy to understand navigational system.

20  This is also the point where to decide what technologies should be implemented – interactive forms, CMS (content management system) such as WordPress, etc.

21  Drawing from the information gathered up to this point, determine the look and feel of the site.  Target audience is one of the key factors taken into consideration here.  A site aimed at teenagers, for example, will look much different than one meant for a financial institution.

22  Also incorporate elements such as the company logo or colors to help strengthen the identity of your institution on the website.  In this phase, communication is crucial to ensure that the final web site will match your or clients’ needs and taste.

23  This is where the website itself is created.  Take all of the individual graphic elements from the design and use them to create the functional web site.

24  The purpose of the launch phase is to prepare the website for public viewing. This requires final polishing of design elements, deep testing of interactivity and features and, most of all, a consideration of the user experience.

25  At this point, attend to the final details and test the website.  Test things such as  the complete functionality of forms or other scripts,  compatibility issues (viewing differences between different web browsers),  ensuring that the site is optimized to be viewed properly in the most recent browser versions.

26  Delivery/Deployment  Upload the files to the web server  Quickly test again to make sure that all files have been uploaded correctly, and that the site continues to be fully functional.  This marks the official launch of your site, as it is now viewable to the public.

27  The development of your web site is not necessarily over, though.  Websites are living, breathing entities and need constant care and maintenance.

28  One way to keep visitors revisiting the website is to offer new/update content or products on a regular basis.  Work on visitor feedback to improve their experience on the website.

29 INFORMATION DESIGN

30  Information design is the detailed planning of specific information that is to be provided to a particular audience to meet specific objectives.  Information design is closely related to the field of data visualization as a means of presenting data to viewer.

31  It is concerned with creating an information structure for a set of information aimed at specified audiences.

32  Tips for websites’ information design:  Use a clear methodology Understand the Site's Content, Processes and Purpose

33 Prioritize and Look for User Paths - figure out how users will traverse the site, What paths will they take to accomplish their goals? What pages are the most important? Which should be seen right up front and which are just supporting information?

34 Organize the Information - how the different elements relate to each other, how users will want to work through them, and how important different sections are. Develop a sitemap or plan of how the information will site in a hierarchical way.

35  Keep the structure balanced how deep or how wide should the site navigation be. find a balance. If there are too many items on a single level - especially the top level - then you risk confusing the user. On the other hand if a user has to click many levels in, you risk losing them.

36  Design for scanning, skimming and jumping Don't wrap key information in bundles of text - highlight it. Don't give users paragraphs on end - break them up with headings, subheadings, bullet points, diagrams, etc.

37  Design text that wants to be read The aim of a site design is usually to transmit information and most of that is written text, so focusing on displaying it well should be a priority.

38  Guide the user both across pages and through pages with planning, you can choose how a user will be guided both through a single page and across multiple pages. Once you know specific paths you can work in visual guides and links to help them move along that path.

39  Don't overcomplicate things Don’t employ unnecessary words on buttons and calls to action.  Visualize information interface design, and aesthetic design. These visuals not only break up text, but they are also more memorable and give you an opportunity to bring a page to life.

40  Analyze your information design Analyze the site to see how people use and digest the information, how they behave and where you can improve your design – Google Analytics.


Download ppt "WEB RESOURCES.  (X)HTML files are text files formatted to comply with the (X)HTML standard.  A (X)HTML can be edited by using any known text editor."

Similar presentations


Ads by Google