Survey
* Your assessment is very important for improving the workof artificial intelligence, which forms the content of this project
* Your assessment is very important for improving the workof artificial intelligence, which forms the content of this project
Bioinformatics Programming EE, NCKU Tien-Hao Chang (Darby Chang) 1 Common flaws in HTML Tags and attributes are lowercase – <H1> <A HREF="#"> No layout tags – <center> <font color="red"> – use CSS instead Avoid inline CSS (‘style’ attribute) – <p style="color: red;"> 2 Tables are dead The Web Standards Project’s (WaSP) Browser Upgrade Initiative (BUI), has spurred many a designer to move towards more standards compliant web design, using CSS rather than tables for layout to save user bandwidth while enhancing underlying semantics, accessibility, and reach Cons – complexity of documents, difficult to maintain – less flexibility Semantically speaking, the table tag is meant for listing tabular data – it is not optimized to build structure 3 Several designers have taken Jeffrey Zeldman’s lead in posting tutorials that have helped us get over the initial hump of table-less design – – – – http://www.alistapart.com/articles/journey/ http://www.glish.com/css/ http://www.bluerobot.com/web/layouts/ http://www.thenoodleincident.com/tutorials/box_lesson/ index.html – http://www.glish.com/css/hacks.asp – http://www.tantek.com/CSS/Examples/boxmodelhack.h tml References – http://www.alistapart.com/articles/practicalcss/ – http://www.smashingmagazine.com/2009/04/08/fromtable-hell-to-div-hell/ 4 Validation HTML is, though its simplicity, still a language – indent it W3C Validation Service – http://validator.w3.org/ – http://jigsaw.w3.org/css-validator/ 5 Javascript A magic language – http://screenr.com/Ye7 Powerful to deal with DOM objects – what is DOM objects? – select them with Javascript (jQuery) – change something about the selected objects All about events Various add-ons/extensions – web developer – firebug – http://mashable.com/2010/02/24/developer-chromeextensions/ 6 Candies Various read-to-use ‘packages’ – http://speckyboy.com/2010/03/01/25-amazing-and-fresh-jquery-plugins/ Google Javascript API – http://code.google.com/intl/en/apis/ajax/documentation/ – Google Visualization API • motion chart • Hans Rosling shows the best stats you've ever seen • there is no the best visualization technique, only the most appropriate technique YUI – http://developer.yahoo.com/yui/ – tabview as an example There are many (maybe too many) alternatives – http://docs.jquery.com/UI/Tabs – http://www.smashingmagazine.com/2007/04/18/14-tab-based-inferfacetechniques/ 7 http://www.saarachee.com/images/web_designing_n_development.jpg How to design beautiful web pages? 8 Color Color in design is very subjective – what evokes one reaction in one person may evoke a very different reaction in someone else Color theory is a science in itself – something as simple as changing the exact hue or saturation of a color can evoke a completely different feeling – cultural differences mean that something that’s happy and uplifting in one country can be depressing in another http://speckyboy.com/2010/04/22/understandi ng-and-the-meaning-of-color-within-design/ 9 Imitation For example, if you don’t know how to mix colors, just look others – http://www.webdesignbooth.com/colors-in-webdesign/ There are many ‘galleries’ for inspiration – http://sixrevisions.com/web_design/16-best-webdesign-galleries-for-inspiration/ – http://www.webcreme.com/ View source code Trace using tools such as firebug 10 Points to a good presentation Motivation – why your work (topic/system) is important Contribution – fit the motivation and/or achieve better performance Methodology – clearness 11 Points to a good final project A good presentation – convince both the teacher and the students A good work, of course – practicability – user interface A good report – document your presentation (more text) and your work (screenshot with explanations) – include anything worthy extra credit Reasonably evaluate other works 12 Grade The exercises contribute around 50% to your final grades. A missing exercise reduces 3–5 points. 13