Html class-06
-
Upload
md-ali-hossain -
Category
Technology
-
view
46 -
download
0
Transcript of Html class-06
Md. Ali Hosssain.Web Designer.Jr. Instructor, Graphic Arts Innstitute.Email:[email protected]:01731402303
04/12/231
• Fast Loading web site designs
• Clear Navigation
• All Resolutions
• Browser Compatibility
• Readable and professional looking fonts
• Minimize the use of images -
• Use of white space
• Check for broken links
Useful Tips for Effective Web Design
04/12/232
device screen width web site safe area
width height
iphone portrait (320 px) 310 px 352 px
iphone landscape (480 px) 468 px 202 px
ipad portrait (768 px) 750 px 920 px
ipad landscape (1024 px) 1010 px 660 px
screen : 1024 px 960 px 548 px
screen : 1152 px 1117 px 644 px
screen : 1280 px 1245 px 580 px
screen : 1360 px 1325 px 548 px
screen : 1366 px 1331 px 548 px
screen : 1440 px 1405 px 680 px
screen : 1600 px 1565 px 680 px
screen: 1680 px 1645 px 825 px
screen : 1920 px 1885 px 855 px04/12/233
These are the elements we could identify in this layout:
Wrapper
header• logo• Contact info• top navigation menu
main content• Optional left sidebar• Actual content: news, products• Optional right sidebar
footer• copyright notice• Optional sitemap
04/12/234
04/12/235
04/12/236
04/12/237
Basic two column layout
04/12/238
Two column layout with a header
04/12/239
Two column layout with a header and a footer
04/12/2310
Three column layout with header, navigation bar and footer
04/12/2311
04/12/2312