Current Popular IT IPertemuan 8

Matakuliah : T0403/Current Popular IT ITahun : 2008

Learning Outcomes

• Learner can design web using master page• Learner can make a rich user interface content

using styles and themes• Learner can add navigation to web

Bina Nusantara Copyright © Surya Sujarwo 2008

Material Outline

• Designing Website with Master Pages• Designing Website with Styles and Themes• Using Navigation Controls• Site Maps• Advance Navigation• Web Standards, Page Layout, and Usability• Designing the ListView and Other Templated

Controls• Dynamic Effects, Images, and Rollovers

Bina Nusantara Copyright © Surya Sujarwo 2008

Designing Website with Master Pages

Bina Nusantara References: ASP.NET 3.5 Unleashed (Stephen Walther, 2008)

Designing Website with Master Pages (Continue…)

Bina Nusantara References: ASP.NET 3.5 Unleashed (Stephen Walther, 2008)

Designing Website with Master Pages (Continue…)

Bina Nusantara References: ASP.NET 3.5 Unleashed (Stephen Walther, 2008)

Designing Website with Styles and Themes

• Creating Themes

Bina Nusantara References: ASP.NET 3.5 Unleashed (Stephen Walther, 2008), ASP.NET 3.5 For DUMMIES(Ken Cox, 2008)

• Adding Skin

Designing Website with Styles and Themes (Continue…)

Bina Nusantara References: ASP.NET 3.5 Unleashed (Stephen Walther, 2008), ASP.NET 3.5 For DUMMIES(Ken Cox, 2008)

Designing Website with Styles and Themes (Continue…)

Bina Nusantara References: ASP.NET 3.5 Unleashed (Stephen Walther, 2008), ASP.NET 3.5 For DUMMIES(Ken Cox, 2008)

Using Navigation Controls

• TreeView

Bina Nusantara References: ASP.NET 3.5 Unleashed (Stephen Walther, 2008), ASP.NET 3.5 For DUMMIES(Ken Cox, 2008)

Using Navigation Controls (Continue…)

• Menu

Bina Nusantara References: ASP.NET 3.5 Unleashed (Stephen Walther, 2008), ASP.NET 3.5 For DUMMIES(Ken Cox, 2008)

Site Maps

Bina Nusantara References: ASP.NET 3.5 Unleashed (Stephen Walther, 2008)

Advance Navigation

• Remapping URLs

Bina Nusantara References: ASP.NET 3.5 Unleashed (Stephen Walther, 2008)

Web Standards, Page Layout, and Usability

• The page user XHTML 1.0:– Self-closing tags: Like a fire door, tags must be self-closing such

that the <img> tag must look like <img /> and <br> becomes <br />.

– Close all tags: Tags that formerly stood alone like <p> and <li> are completed with </p> and </li>.

– Quote attributes: Use id=”myquotedid” instead of id=myunquoteid.

– Consistent case: Keep the starting and closing tags in the same case. You can’t use <A> for the opener and </a> for the closing tag. For the least hassle (and XHTML validation), just use lowercase everywhere.

– Use entities: Convert reserved characters to their special sequences (formally known as entities):

• < becomes &lt;• > is &gt;• & looks like &amp;

Bina Nusantara References: ASP.NET 3.5 For DUMMIES(Ken Cox, 2008)

Web Standards, Page Layout, and Usability (Continue…)

• For usability use div rather than table:– HTML table tags are intended to present tabular data in

a meaningful way, not to lay out page structure.– People with disabilities find it harder to navigate and

interpret content when you spread it across table cells.– Browsers are slower to render large, complicated tables.

• Reducing Load Times and improving Performance– Turning Off ViewState– Caching “expensive” content (in the later meeting)

Bina Nusantara References: ASP.NET 3.5 For DUMMIES(Ken Cox, 2008)

Web Standards, Page Layout, and Usability (Continue…)

• Meeting Accessibility Requirements– Alternate text for images– Avoiding output as tables

• Increasing a Page’s Usability– Setting the tab order (TabIndex)– Adding access/accelerator/shortcut keys (AccessKey)– Setting the focus on startup and default buttons

Bina Nusantara References: ASP.NET 3.5 For DUMMIES(Ken Cox, 2008)

Designing the ListView and Other Templated Controls

• Templated Controls:

Bina Nusantara References: ASP.NET 3.5 For DUMMIES(Ken Cox, 2008)

Designing the ListView and Other Templated Controls (Continue…)

Bina Nusantara References: ASP.NET 3.5 For DUMMIES(Ken Cox, 2008)

Designing the ListView and Other Templated Controls (Continue…)

Bina Nusantara References: ASP.NET 3.5 For DUMMIES(Ken Cox, 2008)

Dynamic Effects, Images, and Rollovers

• Creating Rollover Effects

Bina Nusantara References: ASP.NET 3.5 For DUMMIES(Ken Cox, 2008)

That’s AllThank You for the Attention

Bina Nusantara