Browse Library
Sign In Start Free Trial
Close icon Search icon
Account
Browse Library Sign In Start Free Trial

Add to playlist

Create a Playlist

Modal Close icon
You need to login to use this feature.
  • Book Overview & Buying Web Design Blueprints
  • Table Of Contents Toc
Web Design Blueprints

Web Design Blueprints

By : LaGrone
5 (1)
Buy this Book
close
close
Web Design Blueprints

Web Design Blueprints

5 (1)
By: LaGrone
Buy this Book

Overview of this book

The book delivers simple instructions on how to design and build modern Web using the latest trends in web development. You will learn how to design responsive websites, created with modern Flat User Interface design patterns, build deep-scrolling websites with parallax 3D effects, and roll-your-own single-page applications. Finally, you'll work through an awesome chapter that combines them all. Each chapter features actual lines of code that you can apply right away.
Table of Contents (7 chapters)
close
close
close
Preface
chevron up
Icon
Preface
Icon
What this book covers
Icon
What you need for this book
Icon
Who this book is for
Icon
Conventions
Icon
Reader feedback
Icon
Customer support
Lock Free Chapter
1
1. Responsive Web Design
Icon
1. Responsive Web Design
Icon
Introduction to responsive web design
Icon
Getting familiar with the basics
Icon
Using media queries for responsive design
Icon
Working with responsive media
Icon
Building responsive layouts
Icon
Summary
2
2. Flat UI
Icon
2. Flat UI
Icon
A brief history of flat design
Icon
Flat UI color
Icon
Creating a flat UI layout
Icon
Summary
3
3. Parallax Scrolling
Icon
3. Parallax Scrolling
Icon
Starting off
Icon
Color classes
Icon
Using SVG font icons
Icon
Getting the fonts
Icon
That's no moon!
Icon
OMG, it's full of stars!
Icon
Clouds, birds, and airplanes
Icon
The rocket
Icon
Terra firma
Icon
Next up, the CSS
Icon
Styling the objects with CSS
Icon
Styling the ground objects
Icon
Writing the JavaScript effects
Icon
Setting the row height
Icon
Spreading the objects
Icon
Spreading the clouds
Icon
Loading the page functions
Icon
Smoothening the scroll
Icon
Updating elements on the scroller
Icon
Collecting the moving elements
Icon
Creating functions for the element types
Icon
Setting the left positions
Icon
Creating the rocket's movement function
Icon
Finally, moving the earth
Icon
Summary
4
4. Single Page Applications
Icon
4. Single Page Applications
Icon
What is an SPA?
Icon
Getting to work
Icon
Getting the old files
Icon
Object and function conventions
Icon
Creating utility functions
Icon
Working with the home structure
Icon
Setting up other sections
Icon
Performing housekeeping
Icon
Creating a callBack function for the API
Icon
Summary
5
5. The Death Star Chapter
Icon
5. The Death Star Chapter
Icon
Where to begin?
Icon
Dropping in the parallax game
Icon
Loading elements from JSON
Icon
What can be done in the shared levels service
Icon
Editing the home JavaScript
Icon
Creating the other pages – credits and leaderboard
Icon
Creating the second level
Icon
Summary
6
Index
Icon
Index

Conventions

In this book, you will find a number of text styles that distinguish between different kinds of information. Here are some examples of these styles and an explanation of their meaning.

Code words in text, database table names, folder names, filenames, file extensions, pathnames, dummy URLs, user input, and Twitter handles are shown as follows: " Add a selector for the navButton class to the media query for viewports larger than 480px."

A block of code is set as follows:

<!doctype html>
<html lang='en'>
    <head>
        <title>Responsive Web Design</title>
        <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
    </head>
</html>

New terms and important words are shown in bold. Words that you see on the screen, for example, in menus or dialog boxes, appear in the text like this: " Next, launch the file in your browser. Open the Inspector (right-click, and select Inspect Element) and go to the Network Tab."

Note

Warnings or important notes appear in a box like this.

Tip

Tips and tricks appear like this.

CONTINUE READING
83
Tech Concepts
36
Programming languages
73
Tech Tools
Icon Unlimited access to the largest independent learning library in tech of over 8,000 expert-authored tech books and videos.
Icon Innovative learning tools, including AI book assistants, code context explainers, and text-to-speech.
Icon 50+ new titles added per month and exclusive early access to books as they are being written.
Web Design Blueprints
Next Section
notes
bookmark Notes and Bookmarks search Search in title playlist Add to playlist font-size Font size

Change the font size

margin-width Margin width

Change margin width

day-mode Day/Sepia/Night Modes

Change background colour

Close icon Search
Country selected
Close icon Your notes and bookmarks

Confirmation

Modal Close icon
claim successful
Order Page Read Now

Buy this book with your credits?

Modal Close icon
Are you sure you want to buy this book with one of your credits?
Close
YES, BUY

Submit Your Feedback

Modal Close icon
Modal Close icon
Modal Close icon