The original page source

Content is the most important aspect of any site. So let's design for the content and not let the design dictate(命令) the content.In this guide, we identify the content we need first, create a page structure based on this content, and then present the page in a simple linear layout that works well on narrow and wide viewport

In this guide

  • Create the page structure
  • Add content to the page
  • Summary

Create the page structure

We have identified we need:

  01 An area that describes at a high-level our product "CSS256: Mobile web              development" course.

  02 A form to collect information from users who are interested in our product

  03 An in depth description and video

  04 Images of the product in action

  05 A data table with information to back the claims up

  * Identify the content you need first

  * Sketch out Information Architecture(IA) for narrow and wide viewports

  * Create a skeleton view(一个框架试图) of the page with content but without styling

We have also come up with a rough information architecture and layout for both the narrow and wide viewports.

This can be converted easily into the rough sections of a skeleton page that we will use for the rest of this project.

Create Your Content and Structure的更多相关文章

  1. android 使用Tabhost 发生could not create tab content because could not find view with id 错误

    使用Tabhost的时候经常报:could not create tab content because could not find view with id 错误. 总结一下发生错误的原因,一般的 ...

  2. [Angular] Create dynamic content with <tempalte>

    To create a dynamic template, we need to a entry component as a placeholder. Then we can use entry c ...

  3. [React] Create an Animate Content Placeholder for Loading State in React

    We will create animated Content Placeholder as React component just like Facebook has when you load ...

  4. the core of Git is a simple key-value data store The objects directory stores all the content for your database

    w https://git-scm.com/book/en/v1/Git-Internals-Plumbing-and-Porcelain Git is a content-addressable f ...

  5. Class create, device create, device create file (转)

    来自:http://www.hovercool.com/en/Class_create,_device_create,_device_create_file 开始写Linux设备驱动程序的时候,很多时 ...

  6. Customize the SharePoint 2013 search experience with a Content Enrichment web service

    Did you ever wish you had more control over how your content is indexed and presented as search resu ...

  7. Content Providers的步骤,来自官网文档

    Content Providers In this document Content provider basics Querying a content provider Modifying dat ...

  8. Class create, device create, device create file【转】

    来自:http://www.hovercool.com/en/Class_create,_device_create,_device_create_file 开始写Linux设备驱动程序的时候,很多时 ...

  9. Navigation - How to define the structure of the navigation tree via the NavigationItemAttribute

    In the meantime, you should use the Model Editor to create such a navigation structure. There are se ...

随机推荐

  1. Python3 ssl模块不可用的问题

    编译安装完Python3之后,使用pip来安装python库,发现了如下报错: $ pip install numpy pip is configured with locations that re ...

  2. Mysql修改密码办法

    方法1: 用SET PASSWORD命令 首先登录MySQL. 格式:mysql> set password for 用户名@localhost = password('新密码'); 例子:my ...

  3. mysql物理备份

    原本以为直接将data文件夹下每个数据库对应的文件夹拷贝到新的MySQL的data文件夹就可以了,其实不然. 这样做有几个问题: 1.如果是用了引擎的表,还需要复制ibdata文件,并且frm文件所在 ...

  4. java socket编程--聊天小案例

    很久以前写过socket聊天室,都快忘完了,心血来潮又重新写一遍. 服务器端: package com.fancy; import java.io.BufferedReader; import jav ...

  5. 结对编程--fault,error,failure

    结对编程对象:叶小娟 对方博客地址:http://www.cnblogs.com/yxj63/ 双方贡献比例:1:1 结对照片: 结对题目:输入一定个数的数字,对其排序后输出最大值.   1 pack ...

  6. vs code 插件推荐

    通用插件 HTML Snippets 超级实用且初级的 H5代码片段以及提示 HTML CSS Support 让 html 标签上写class 智能提示当前项目所支持的样式新版已经支持scss文件检 ...

  7. luoguP1004 方格取数(四维DP)

    题目链接:https://www.luogu.org/problemnew/show/P1004 思路: 这道题是四维DP的模板题,与luoguP1006传纸条基本相似,用f[i][j][k][l]表 ...

  8. The Last Stand

    The Last Stand https://ac.nowcoder.com/acm/contest/303/L 时间限制:C/C++ 1秒,其他语言2秒 空间限制:C/C++ 262144K,其他语 ...

  9. 转---tcp三次握手四次挥手syn fin......

    http://blog.chinaunix.net/uid-22312037-id-3575121.html转自 一.TCP报文格式        TCP/IP协议的详细信息参看<TCP/IP协 ...

  10. day6:vcp考试

    Q101. Refer to the Exhibit.Which tab shows the Hardware Acceleration support status?A. DevicesB. Pro ...