Ewa Hallman | UCM Web Services | 2015

Slides:



Advertisements
Similar presentations
Copyright © Terry Felke-Morris WEB DEVELOPMENT & DESIGN FOUNDATIONS WITH HTML5 Chapter 7 Key Concepts 1 Copyright © Terry Felke-Morris.
Advertisements

WEB DESIGN TABLES, PAGE LAYOUT AND FORMS. Page Layout Page Layout is an important part of web design Why do you think your page layout is important?
UI Best Practices Application Developer’s Intro School Week 1 Day 1.
SEO Best Practices with Web Content Management Brent Arrington, Services Developer, Hannon Hill Morgan Griffith, Marketing Director, Hannon Hill 2009 Cascade.
Refinement Production Implementation Design and Development Stages.
Objective Understand web-based digital media production methods, software, and hardware. Course Weight : 10%
Chapter 2 Web Site Design Principles Principles of Web Design, 4 th Edition.
Web Design Guidelines By ZhengHui Hu. Planning User Analysis  Goal  Target Audience Enhance Accessible  Impairment  Environment  Technical Limitation.
Search Engine Optimization March 23, 2011 Google Search Engine Optimization Starter Guide.
Page Design Web Design Professor Frank. Page Design Effective web design creates visual logic and seeks an optimal balance between visual sensation and.
Chapter 2 Introduction to HTML5 Internet & World Wide Web How to Program, 5/e Copyright © Pearson, Inc All Rights Reserved.
Dobrin / Keller / Weisser : Technical Communication in the Twenty-First Century. © 2008 Pearson Education. Upper Saddle River, NJ, All Rights Reserved.
Week 2 Web Site Design Principles. 2 Design for the Computer Medium Craft the look and feel Make your design portable Design for low bandwidth Plan for.
1 Chapter 11 Implementation. 2 System implementation issues Acquisition techniques Site implementation tools Content management and updating System changeover.
Bayu Priyambadha, S.Kom Teknik Informatika Universitas Brawijaya.
Mastering the Internet, XHTML, and JavaScript Web Design.
1. 2 OVERVIEW First Impressions Content Purpose Design Distinction Closing.
Launching a Successful Online Business and EC Project.
Website Accessibility Testing. Why consider accessibility People with disabilities – Visual, Hearing, Physical, Cognitive (learning, reading, attention.
Week 8 – Part 3 More on Links, Layout, and Mobile Key Concepts 1.
Cascading Style Sheets: Got Branding?. What is CSS? CSS = Cascading Style Sheets Styles define how HTML (web) elements are displayed. One (or more) style.
Refine Produce Implement Design and Development Stages.

Group 3: Art Gallery Monica Almendarez Content/Project Manager Willliam Egle Technology Manager Christina Pié Usability/ADA Compliance Manager Mirjana.
Chapter 2 Web Site Design Principles Principles of Web Design, 4 th Edition.
Use CSS to Implement a Reusable Design Selecting a Dreamweaver CSS Starter Layout is the easiest way to create a page with a CSS layout You can access.
Web Site Design Plan Checklist Web Design Presented by: Angelo Russo #10 11/22/2014Angelo Russo #101.
XP Review 2 New Perspectives on JavaScript, Comprehensive1 Introducing Cascading Style Sheets Formatting Web Pages with CSS.
Copyright © Terry Felke-Morris WEB DEVELOPMENT & DESIGN FOUNDATIONS WITH HTML5 Chapter 7 Key Concepts 1 Copyright © Terry Felke-Morris.
Technical Communication A Practical Approach Chapter 14: Web Pages and Writing for the Web William Sanborn Pfeiffer Kaye Adkins.
SEO Friendly Website Building a visually stunning website is not enough to ensure any success for your online presence.
Louisa Lambregts, Louisa Lambregts
Multi-Channel Marketing
The Good, the Bad & the Ugly: Style and design in Website creation Chris Webster: Information Officer and Website Manager at the EARL Consortium for Public.
Website Design Best Practices. Topics  Navigation  Readability  Portability  Frameworks for Web Design  Model View Architecture MVC  SEO  Performance.
Understanding Web-Based Digital Media Production Methods, Software, and Hardware Objective
Introduction. Internet Worldwide collection of computers and computer networks that link people to businesses, governmental agencies, educational institutions,
Westga.edu Website Revolution 2015 Ewa Hallman | UCM Web Services | 2015.
COMP 143 Web Development with Adobe Dreamweaver CC.
+ Responsive Technology Performance, efficiency and elegance are the three key elements that make our platform unique. Each of the features in this presentation.
Technical SEO tips for Web Developers Richa Bhatia Singsys Pte. Ltd.
Maximize Your Web site and Build Your Business. ABOUT US Pen Publishing Interactive, Inc.  VP of Marketing  Founded in 1994  Web hosting and software.
Web Page Programming Terms. Chapter 1 Objectives Describe Internet and Understand Key terms Describe World Wide Web and its Key terms Identify types and.
Search Engine Optimization
Web Development & Design Foundations with HTML5
Working with Links and Navigation
The Role of Tool Support in Public Policies and Accessibility
The Successful Website
County Website Content Management System
Objective % Select and utilize tools to design and develop websites.
Chapter 2 Developing a Web Page.
© 2016 Pearson Education, Inc., Hoboken, NJ. All rights reserved.
Project 1 Introduction to HTML.
East Africa Resilience Innovation Hub Web Development Proposal
Web Development & Design Foundations with HTML5
Guide to: Effective NGO website.
Define phase Interview the client to understand goals, audience, content, design, and delivery requirements. Organize and outline interview information.
Objective % Select and utilize tools to design and develop websites.
Objective % Explain concepts used to create websites.
Session I Chapter 18 - How to Design a Web Site
OCR Level 02 – Cambridge Technical
Objective Understand web-based digital media production methods, software, and hardware. Course Weight : 10%
Lesson 9: GUI HTML Editors and Mobile Web Sites
Why use Web Standards?.
Teaching slides Chapter 6.
Made By : Lavish Chauhan & Abhay Verma
Objective Explain concepts used to create websites.
Web Development & Design Foundations with HTML5
Refine Produce Implement
Presentation transcript:

Ewa Hallman | UCM Web Services | 2015 westga.edu Website Revolution 2015 Ewa Hallman | UCM Web Services | 2015

Ewa Hallman | UCM Web Services | 2015 2013 2010 2006 Ewa Hallman | UCM Web Services | 2015

Ewa Hallman | UCM Web Services | 2015 2016 ? ? Ewa Hallman | UCM Web Services | 2015

Ewa Hallman | UCM Web Services | 2015

Ewa Hallman | UCM Web Services | 2015 What works and what does not ? - code - user experience - visual look & feel & cohesiveness Ewa Hallman | UCM Web Services | 2015

Why code Matters? - User Experience - SEO - Extensibility

Ewa Hallman | UCM Web Services | 2015 Improve Upgrade Doctype to HTML5 from XHTML 1.0 Strict. Use HTML5 segmentation with header, nav, footer tags. Fix validation errors. An HTML document must be valid to be fully compatible and readable by browsers and robots. Consider caching pages to decrease loading time by storing pages temporarily on the user’s device. Avoid Frames and iFrames because their content is not readable by search engines. Specify meta viewport to indicate how the website should be displayed on mobile devices. This will allow pages to fit on smaller devices. Combine CSS files when possible to lower the number of HTTP requests. Utilize CSS preprocessors, such as SASS to supercharge CSS and make them more organized, easier to maintain. Include Javascript in a separate file to optimize loading time and put it at the end of your document before </body> tag when possible. Improve legibility of JavaScript with modules. Use a task runner to automate repetitive tasks. Consider utilizing responsive design framework to minimize the need for maintenance and testing. Maintain Page weight (HTML alone) does not to go over 50k. This criterion is taken into consideration by the search engines in their ranking algorithms. Compression is enabled to diminish the amount of data to be downloaded. Page does not contain any heavy images. All images on the website should be optimized. Ewa Hallman | UCM Web Services | 2015

Ewa Hallman | UCM Web Services | 2015 User Experience Ewa Hallman | UCM Web Services | 2015

Ewa Hallman | UCM Web Services | 2015 Improve Implement responsive design to improve user experience on mobile devices. Use legible font sizes, the text on the page should render in a way it is easy for all visitors to read. Size tap targets appropriately. Link and buttons must be big enough for user to easily tap on touchscreen. Provide fixed points or anchors which would guide users (who scan, don’t read) through the content of the page. Highlight key expressions of the page with <strong> <u> and <em> tags. Use the <H tags properly to organize the structure of the page in relation to their order of importance. Provide consistent and intuitive navigation. The webpage contains 241 links. Too many links in a page diminishes the importance of each one of them. Provide a sitemap containing an ordered organization of the linking structure of your site. Adhere to accessibility guidelines. Ensure that foreground and background colors have enough contrast (ratio 4.5 or more for text). All images should have alternative text attribute specified to adhere to accessibility guidelines. Provide relevant and high-quality content. Make use of effective writing. Maintain The above-the-fold content is properly prioritized. The content of the page fits within the viewport. The search feature is well designed. Printing style sheet has been defined. Ewa Hallman | UCM Web Services | 2015

Ewa Hallman | UCM Web Services | 2015 Visual Look & Feel & Cohesiveness Ewa Hallman | UCM Web Services | 2015

Ewa Hallman | UCM Web Services | 2015 Improve Adhere to established visual identity guidelines. Represent the newly refreshed brand look and feel. Each page design should look like it belongs in the same site by featuring a consistent color scheme, fonts, graphical elements, navigation, layout and other elements of design. The site should be easy to navigate, with useful information and resources located in consistent formatting across the site. The new design should give users maximum impact as soon as they land on the site with use of images and media. The new design should incorporate new web trends, such as parallax effect, innovative scrolling, story booking, flat design, un-boxed layouts, tiles, navigation widgets, mashup interfaces. The new web trends should be incorporated intelligently to provide simple, elegant and intuitive experience. The new design needs to be comprehensive to address all current and future web presence needs. It should be possible and fairly easy to introduce new layout features without hindering cohesiveness. Ewa Hallman | UCM Web Services | 2015

Ewa Hallman | UCM Web Services | 2015 What still works? Ewa Hallman | UCM Web Services | 2015

Ewa Hallman | UCM Web Services | 2015 What are best practices for successful content migration ? (during Information Architecture Revolution) Ewa Hallman | UCM Web Services | 2015

Ewa Hallman | UCM Web Services | 2015 Migration Process Define vision, goals and requirements Content Inventory and ROT analysis Develop content strategy Develop metadata strategy Get stakeholder engagement Define governance structure Schedule planning, phasing, piloting, testing and training Migration should no longer be atomic. Ewa Hallman | UCM Web Services | 2015

Ewa Hallman | UCM Web Services | 2015

Ewa Hallman | UCM Web Services | 2015

Ewa Hallman | UCM Web Services | 2015 Content Migration Break into types Decide what to cut Decide what automated Technical Effort Editorial Effort % Automated % Manually Moved % New Content % Manually QA’d Ewa Hallman | UCM Web Services | 2015

Ewa Hallman | UCM Web Services | 2015 Staffing Web Services Director Web Specialist Senior Web Specialist Intermediate Temporary Migration Staff (6 for 5 months) Timeline Install CMS: August, 2015 Complete Site Design: January, 2016 Implement Design: February 2016 Migrate Content: February 2016 - July, 2016 Ewa Hallman | UCM Web Services | 2015

Roles & Responsibilities UCM Web Services Team Develops integrated web strategy (marketing, design, content, information architecture, SEO) Develops web guidelines and policies Manages stakeholder expectations Maintains stakeholder engagement Sets metrics and interprets analytics data SEO Performs ROT analysis Creates content (online video, podcasts, articles, posts) Monitors website quality and manages online reputation Manages and supports CMS community Owns the website feature request process ITS & ITS Web Team CMS hosting, configuration and template implementation Monitors template quality and develops coding standards for template expansion Identifies content types and content relationships to help vendor configure tools for automatic migration Aids in metadata definition and develops innovative tools to support metadata Develops and supports dynamic content (widgets, modules, feeds, scripts, site search) and integrates with back end systems. Provides technical support for templates, CMS configuration, authentication, dynamic modules and web applications Ewa Hallman | UCM Web Services | 2015