Mobile device web browsers provide the primary method of Internet access to an exponentially growing number of users. Traditional websites designed for desktop browsers do not provide an optimal experience for mobile interaction.
Class goals :
Develop streamlined mobile websites for efficient access to online information
Write compelling HTML5 and CSS3 content for mobile users
Employ JavaScript to maximize the potential of each browser platform
Extend the browsing experience with mobile-focused multimedia content
Harness geolocation capabilities to deliver targeted content
Leverage native extensions and exploit local storage for enhanced device integration
Content of Designing Websites for Mobile Devices
Surveying the Mobile Web Environment
Exploring key mobile web platforms
Android
iOS
Blackberry
Windows phone
Analyzing Requirements for Mobile Websites
Taking advantage of best practices
Creating vs. migrating web applications
Complying with W3C guidelines
Applying architectural principles and constraints
Selecting high-priority features
Simplifying the User Interface (UI) for enhanced performance
Designing for touch interactivity
Identifying bandwidth and memory limitations
Authoring HTML Content for Mobile Websites
Designing for platform independence
Maximizing site functionality with progressive enhancement
Constructing an appropriate layout for a mobile UI
Controlling zoom with the Viewport
Integrating HTML5 extensions
E-mail
Web addresses
Date pickers
Spin boxes
Autofocus fields
Search boxes
Dialing the phone from the page
Displaying a context-sensitive keyboard
Customizing Presentation with Cascading Style Sheets
Harnessing CSS3 capabilities
Selecting style sheets based on device orientation
Manipulating layout dynamically with transitions, transforms and animations
Styling layout and content
Optimizing styles for touch interactivity
Applying styles based on content
Simulating the native UI with CSS
CSS extensions for mobile
Mapping device Viewports to style sheets
Enhancing text readability with text-size-adjust
Highlighting touch content with tap-highlight-color
Supporting User Interaction and Mobile Features
Implementing common mobile features
Determining support for device capabilities
Touch
Tilt
Multimedia
Local storage
Detecting browser capabilities on the server and client
Enhancing interactivity with JavaScript
Employing key libraries: Modernizr and jQuery mobile
Responding to orientation changes
Comparing phone and tablet UIs
Differentiating between phone and tablet presentation
Adapting web content to respect platform conventions
Designing tablet-style, two-column views
Producing Graphics and Media
Processing video for mobile devices
Generating bandwidth-appropriate video content
Exploiting the HTML5 video element
Activating video content from JavaScript
Presenting graphic images
Optimizing graphics for mobile devices
Creating home screen graphic images
Leveraging Geolocation
Determining device position
Querying for the device location with GPS
Integrating with the native map application
Retrieving location-based web content
Integrating local storage
Persisting data onto the device
Managing locally stored data
Enhancing Site Functionality
Working offline
Enabling disconnected web applications
Detecting network status
Synchronizing offline data to enterprise databases
Consolidating the web with native extensions
Integrating with the home screen
Hiding the standard browser UI
Accessing native mobile hardware with PhoneGap
Camera
Contacts
Accelerometer
Compass
Onze voordelen :
Type of training: Inter-company, intra-company and individual
100% flexible & personalised training : You choose the place, the dates and the training program
Offer request : Response within 24 hours
50% discount for SME’s from Brussels-Capital Region
Free parking, lunch & drinks
Free use of our Digital Competence Centre: Manuals, courses, exercises, …
Those involved in establishing, developing or maintaining a Web site and anyone wanting to gain more knowledge about Web technologies. A basic familiarity with Microsoft Windows, the Internet and the Web is helpful.
Class goals :
An in-depth case study provides the hands-on skills to generate a dynamic Web site. Exercises include:
Creating accessible, standards-based Web pages with HTML, XHTML and CSS
Building, testing and refining your Web site
Adding DHTML effects to Web pages
Enhancing your Web page with images and image maps
Configuring and testing a Web server
Processing user requests and generating dynamic pages as the response
Interfacing your Web site to a database
Incorporating multimedia effects
Content of Developing a Website
Introduction to the Web
Internet/intranet fundamentals
Web architecture
Exploring multiple browsers
Search Engine Optimization (SEO)
HTML: Hypertext Markup Language
Building a Web page with HTML and XHTML
Head and body elements
Formatting text with tags
Establishing hypertext links
Ordered and unordered lists
Designing tables to display data
Defining relative and absolute anchors
Adding graphic elements
Making your pages graphical with embedded images
Adding interactivity with « clickable » images
Utilizing animated images to liven up a Web page
Creating image maps to link multiple parts of a single image
Controlling page styles and layout with CSS
Attaching style properties to HTML tags
Creating and applying style sheets
Implementing a styled navigational menu
Choosing and applying styles with class and ID attributes
Ensuring a consistent look across all pages of a site
Implementing a Web Server
Web server functionality
Web server/browser communication
The HyperText Transfer Protocol (HTTP)
Configuring a Web server
Setting up the server directory structure
Deploying access configuration/security
Ongoing server administration
Programming on the Server
Server-side scripting
Client/server/script interaction
Exploring the operation of server-side Web applications
Accessing data on the Web server
Creating dynamic Web pages
The difference between GET and POST requests
Including a consistent navigational menu on all pages
Reading and writing browser cookies
Processing user data with forms
Capturing user input with HTML forms
Adding text fields, selection lists, check boxes and radio buttons to a Web page
Configuring a form to invoke your server-side program when submitted
Processing form input with dynamic Web pages
Interfacing to a Database
Relational databases and the Web
Characterizing database records
Using SQL to manipulate the database
Database-driven Web pages
Opening a connection to a database
Storing data captured from forms
Performing dynamic queries on the database
Generating a Web page response displaying the results of a query
Creating Dynamic Web Pages
Adding interactivity with JavaScript
Incorporating JavaScript that executes in the Web browser
Enhancing client-side functionality
Validating form content to ensure forms are filled out correctly
Reacting to user actions
Incorporating multimedia
Embedding animation and video content in Web pages
Adding interactivity with plug-ins
Creating interactive Web pages with Dynamic HTML (DHTML)
Combining JavaScript and CSS
Supporting multiple browsers
Dynamically positioning content within a page
Revealing and hiding page content
Implementing rollover graphics with DHTML
XML and HTML5
Fundamentals of XML
Implementing an RSS feed on your site
Introducing HTML5
Onze voordelen :
Type of training: Inter-company, intra-company and individual
100% flexible & personalised training : You choose the place, the dates and the training program
Offer request : Response within 24 hours
50% discount for SME’s from Brussels-Capital Region
Free parking, lunch & drinks
Free use of our Digital Competence Centre: Manuals, courses, exercises, …
Training-brussels - business training center in Brussels 