Software product line engineering (SPLE) is a methodology for developing a diversity of software products and software intensive systems at lower costs, in shorter time, and with higher quality. SPLE is widely known to develop industrial products such as embedded system. However,for applying SPLE to develop Web applications which have to provide transactional logics for products such as financial products, the biggest issue is the lack of design method and application architecture to execute concurrently for a whole product line on the same runtime. Therefore development cost still tends to increase with frequent changes of the business requirements. We proposed two noble approaches to apply SPLE each for design method and application architecture.Firstly,for design method, we redefined the design scope of product as Product Domain Model, and designed a UML based meta-model which adds the notations of variability. Secondly, for application architecture, we adopted dependency injection technology to execute transaction logics for product line. We also defined a unit of logics for product line as Instance Product. To generate a plenty of resources regarding Instance Product, we created a generator which inputs Product Domain Model. In this paper, we introduce our approaches and evaluation by the pilot development of banking products. The results show that with our approaches, the issue of Web application development can be solved effectively, as well as the additional issue of maintainability.