2011 Ngày 07 tháng 7 2011

Các câu hỏi về CSS Hack

Nếu điều này trong blog của một số ... nghĩ rằng nó đã được tốt đẹp cho danh mục này cho ref trong tương lai .... cũng có thể là một câu hỏi phỏng vấn quan trọng mà bạn sẽ hỏi một số ngày ....

Viết một đoạn của CSS sẽ hiển thị một đoạn văn trong màu xanh trong trình duyệt cũ hơn, màu đỏ trong các trình duyệt mới hơn, xanh lá cây trong IE6 và đen trong IE7

#content p{color:blue}
html>body #content p {color:red}
* html #content p{color:green}
html>body #content p {*color:black;}


2011 Ngày 18 tháng 2 năm 2011

Lỗi IE Javascript: Đối tượng không hỗ trợ tài sản hoặc phương pháp

Có vấn đề xa lạ này, nơi mà một phần của Javascript làm việc tốt trong tất cả các ans trình duyệt như IE thanh bình thường :) ... Đơn giản, nhưng kể từ khi kịch bản được viết bởi tôi, phải mất một thời gian để gỡ lỗi "Object không hỗ trợ tài sản hoặc phương pháp" lỗi mà chỉ có IE đã được ném lên. Có lẽ! Nếu tôi được là để viết kịch bản, tôi sẽ không nhận lỗi này ở tất cả, không pha trộn các tên biến của tôi với lĩnh vực Id :).

Vấn đề: Đối tượng không hỗ trợ tài sản hoặc phương pháp (trên dòng 3)

 function funzoneSP(){ document.getElementById('video_id').style.visibility="hidden"; shortdesc = document.getElementById('shortdesc').value; .... } 

Giải pháp:
Lỗi này được tạo ra trên các thirdrow trong ví dụ trên (Line 3 ... "shortdesc = document.getE ...."). Tôi đã thử tất cả các loại của những điều ngu ngốc, rằng tôi không được thậm chí còn có giá trị đề cập đến ở đây và cuối cùng đoán những gì! chỉ cần thay đổi var shortdesc đến một cái gì đó khác đã thoát khỏi lỗi. Về cơ bản! Tên biến có khác nhau từ các fieldID


2010 Ngày 28 tháng 12 2010

Hiển thị trang HTML tĩnh trong Android (Eclipse) giả lập

Đối với một vài giờ, bây giờ tôi đã được tìm kiếm giải pháp cho chạy / kiểm tra HTMLs tĩnh của tôi trong giả lập Eclipse / Android. Đã không hoàn toàn thành công .... những gì tôi có nghĩa là "Hoàn toàn là HTML được nạp OK nhưng tất cả các CSS và JS, tức là sự biểu hiện thị giác không nhìn thấy. Nói cách phát triển, CSS không áp dụng cho trang ...

Nghĩ rằng nó sẽ một vài đồng nghiệp người mới phát triển giao diện người dùng Android, Nếu tôi ghi nhận đoạn xuống mà tôi sử dụng để hiển thị HTML.

Và Android rất kinh nghiệm, XIN thêm ý kiến ​​của bạn để giúp chúng tôi người mới trong phát triển giao diện người dùng ứng dụng di động hơn nữa!

Xin lỗi! nhưng Im giả định rằng bạn biết làm thế nào để tạo ra một ứng dụng Android Điện thoại di động trong Eclipse.

Tạo ra như hoạt động của bạn, Điều này sẽ đọc các tập tin index.html 'từ tài sản dự án / thư mục của bạn.

 public class Test extends Activity {  /** Called when the activity is first created. */  @Override  public void onCreate(Bundle savedInstanceState) {    super.onCreate(savedInstanceState);    WebView webview = new WebView(this);    setContentView(webview);    try {      InputStream fin = getAssets().open("index.html");        byte[] buffer = new byte[fin.available()];        fin.read(buffer);        fin.close();        webview.loadData(new String(buffer), "text/html", "UTF-8");    } catch (IOException e) {      e.printStackTrace();    }  } } 

2010 20 tháng năm 2010

Re-Đi xe đạp CSS: A Look At Khung CSS

Đi xe đạp lại Buzzword và Phát triển Web có nghĩa là không có khác nhau. Bảo tồn năng lượng, trong nỗ lực!

Trong những năm của văn bản CSS và tạo ra HTML từ thiết kế, tôi đã theo một vài thực hành tốt nhất, trong việc theo đuổi của tiết kiệm thời gian và năng lượng trong những gì chúng ta thường hạn như "Wheel Re-Phát minh ra các". Thời gian và thời gian một lần nữa, tôi đã nói với bản thân mình, rằng tôi phải tạo ra một mẫu, một số lại có thể sử dụng tiêu chuẩn CSS rằng tôi sẽ sử dụng ra khỏi hộp trong công việc tương lai của tôi. Mặc dù không hoàn toàn nhưng tôi đã quản lý để đạt được một số mục tiêu.

Trong thúc đẩy hơn nữa, sử dụng của CSS, tôi có một cái nhìn tại các khuôn khổ CSS thường có sẵn cho chúng tôi và quyết định đưa vào sử dụng, vì đây là những cố gắng và thử nghiệm và tạo ra bởi các nhà phát triển có kinh nghiệm nhiều hơn bản thân mình. Quan trọng hơn "TRÁNH tái phát minh ra".

Mặc dù phổ biến kiến ​​thức cho cựu chiến binh, tôi đã cố gắng để viết một số khái niệm quan trọng / tốt nhất-thực hành / suy nghĩ đã đi vào việc tạo ra những khuôn khổ này, để làm cho XE ĐẠP RE của CSS có thể. Hy vọng điều này sẽ giúp một số nhà phát triển CSS chỉ là về và gần đây lên bandwagon CSS!

Phím Re-đi xe đạp của CSS:

Sử dụng Công ước đặt tên

Điều này có phải là yếu tố quan trọng nhất trong việc đưa ra các CSS / HTML lại có thể sử dụng. Đưa ra tên phù hợp cho các phần tử trang cho phép sử dụng lại các thành phần trang và phong cách của họ với ít hoặc sửa đổi. Trong phù hợp với lập luận này, Thậm chí HTML5, trong một sự thay đổi thay đổi lớn hơn người tiền nhiệm của nó, là để giới thiệu một số thẻ tức là cấu trúc. <article>, <section>, <header>, <aside>, và <nav> HTML5 sẽ mang lại? ]. Ngay cả với HTML 4 (hoặc thấp hơn), nó là tốt nhất để đặt tên cho phần tiêu chuẩn của trang của bạn consistanly như trong ví dụ đơn giản dưới đây ...

Hãy nhớ rằng, Hầu hết các trang trên dự án của bạn, sẽ có các yếu tố cốt lõi cùng một cấu trúc. Xác định những yếu tố cốt lõi trang phổ biến ....

  <div id="container">
    <div id="header"> ... </ div>
    <div id="nav"> ... </ div>
    <div id="sidebar"> ... </ div>
    <div id="footer"> ... </ div>
   </ Div> 

Thiết lập lại kiểu mặc định (CSS Đặt lại): Cho dù bạn sử dụng một khuôn khổ hoặc viết riêng của bạn, bạn phải cung cấp CSS Đặt lại [ CSS Đặt lại là gì? ], vì chúng làm giảm hoặc đôi khi loại bỏ hình ảnh mâu thuẫn xảy ra giữa các trình duyệt khác nhau. Nói một cách đơn giản CSS Thiết lập lại cơ chế thiết lập phong cách của phần tử HTML để các giá trị số không hoặc null, do đó trọng các giá trị mặc định của trình duyệt họ có thể đặt ra. Cung cấp một slate sạch để thiết lập các thuộc tính của các yếu tố khoảng trống của bất kỳ mặc định User-Agent [ CSS2.1 User Agent Bảng Phong cách mặc định . Tất cả các khuôn khổ CSS có cơ chế thiết lập lại. Nếu bạn đang viết riêng của CSS Đặt lại, một lời cảnh cáo rằng nếu bạn quên để thiết lập lại một tài sản quan trọng, có thể dẫn đến các vấn đề qua trình duyệt, đó là rất khó khăn để gỡ lỗi. Hãy nhớ rằng, Giữ một bản sao của phong cách thiết lập lại và thả chúng vào mỗi dự án mới bạn tạo ra.

  cơ thể, div, dl, dt, dd, ul, ol, li,
  h1, h2, h3, h4, h5, h6,
  trước, hình thức, fieldset, đầu vào, lựa chọn, textarea,
  p, blockquote, bàn, th, td
  {
    border: 0px;
    margin: 0;
    padding: 0;
  } 

Thiết lập mặc định (Styles cơ bản) để yếu tố:

Sau khi bạn đã thiết lập (không hoặc null) các giá trị mặc định của thuộc tính nhất định của một số yếu tố HTML, là cần thiết để áp dụng một số phong cách trên tất cả các thể hiện của những yếu tố này. Những thiết lập mặc định có thể khác nhau theo thiết kế hoặc theo các thực hành tốt nhất bạn làm theo.

Hầu hết các CSS khuôn khổ, luôn luôn giới thiệu một số mặc định mới, ngoài việc cài đặt lại phong cách trình duyệt mặc định.
Những mặc định là khoảng trống mặc định User-Agent (bị tước đi bởi Thiết lập lại CSS), những điều này sẽ phù hợp trên các trình duyệt.

Hãy nhớ rằng, phong cách cơ bản được sử dụng để thiết lập phong cách mà sẽ được sử dụng thiết kế rộng. ví dụ.

  html {font-size: 77%; font-family: Arial, sans-serif;}
 mạnh mẽ, h1, h2, h3, h4, h5, h6 {font-weight: in đậm;} 

Tóm tắt Styles cho các thành phần HTML thông thường và lớp học chung:

Hầu hết các dự án bao gồm một vài trang sẽ có các phần tử HTML thông thường được sử dụng trên trang web, ví dụ như để sắp xếp Một số hình thức, cảnh báo và lỗi, Popups Tuỳ chỉnh, LightBoxes ... Kể từ khi thành phần này được sử dụng trên một lần nữa qua các dự án, sẽ là hữu ích để cung cấp một thiết lập các lớp học liên kết với các phong cách được xác định trước cho các thành phần và bạn có thể tiết kiệm cho mình rất nhiều thời gian.

Ngoài việc xác định phong cách định nghĩa có thể tái sử dụng cho các thành phần HTML thông thường, chúng ta có thể phong cách trừu tượng các lớp học liên quan đến màu sắc, kiểu chữ, bố trí ngay cả. Bản thân tôi có xu hướng bạn sử dụng ... các lớp học phổ biến như clearfix, Font08, FontGrey, AlignL, DisplayB.

  hình thức đầu vào {border: 0px; background: # ffffff; padding: 10px 0px; _padding: 0px 0px; chiều cao: 26px; color: # 000000; line-height: 30px; font-size: 1.1em;}
 hình thức textarea {border: 0px; background: # ffffff; color: # 000000; font-size: 0,9 em; line-height: 1.5em; tràn: có thể nhìn thấy;}
 Fbold {font-weight: in đậm màu: # cccccc;}.
 Fgrey {color: # 666666;}
 Flightgrey {color: # bbbbbb;}
 Clearfix {rõ ràng: cả hai;}.
 Chia {biên giới-top: 1px solid # 647B06; biên giới-bottom: 1px solid # 9CC00A; height: 0px;}.
 Displayb {display: block;}. Displayn {display: none;}.
 Alignr {text-align: right}. Alignc {text-align: center}
 Floatr {float: right;}. Floatl {float: left;} 

Bản sửa lỗi cho quirks trình duyệt phổ biến

Trình duyệt khác nhau thực hiện mã CSS và cung cấp các mức độ khác nhau hỗ trợ cho các chi tiết kỹ thuật của CSS. Các kết quả này .... "Browser quirks", chúng tôi phát triển được để lại để giải quyết. Đặc biệt, IE6 ám ảnh hầu hết các lập trình CSS với một thời hạn cuối cùng để đáp ứng. Các tin tốt là kinh nghiệm đã mang lại cùng nhau sửa lỗi có thể tái sử dụng những vấn đề này (Thường được gọi là CSS Hacks ).

Hãy nhớ rằng, Giữ các hacks / sửa chữa tiện dụng

  / * Zoom sau đây: 1 quy tắc đặc biệt là cho IE6 + IE7.  * /
    * Html. Clearfix,
    * Đầu tiên con + html clearfix {
           zoom: 1;
      } 

Tinh chỉnh CSS của bạn

  • Thói quen đi xe đạp lại không sẽ đến với bạn trong ngày. Nó có để phát triển. Vì vậy, kế hoạch Re-Đi xe đạp của bạn. Chịu đựng điều này trong tâm trí bạn có thể mặc định phong cách trừu tượng, định nghĩa kiểu chữ, bố cục, kiểu phần tử HTML. Hãy thử nghĩ về phía trước.
  • Ngoài ra nhìn lại dự án trước đây của bạn, nó sẽ giúp xác định phong cách mà bạn có xu hướng sử dụng thường xuyên trên porjects. Tóm tắt nó.
  • Hủy bỏ bất kỳ phong cách không sử dụng. Thực hành này sẽ giữ cho khung CSS của bạn từ một triệu chứng phổ biến được gọi là "Sưng phù"
  • Hủy bỏ phong cách lặp đi lặp lại.
  • Xây dựng một tập hợp các phong cách linh hoạt đến cổng nó qua các dự án.

A Look At Khung CSS

Cuối cùng. Nếu bạn được truyền cảm hứng và có ý định sử dụng một hoặc nhiều các khuôn khổ CSS, Heres là nhanh chóng danh sách của một số những người nổi tiếng ....

  • 960 lưới hệ thống : 960 hệ thống lưới điện là một nỗ lực để sắp xếp công việc phát triển web bằng cách cung cấp kích thước thường được sử dụng, dựa trên một chiều rộng 960 pixel. Có ba phiên bản: 12, 16 và 24 cột, có thể được sử dụng riêng rẽ hoặc song song. Tư tưởng không có gì là bạn không thể tạo cho riêng bạn một cách dễ dàng, khuôn khổ cung cấp cho lưới điện cho các mẫu in ở định dạng PDF, mà ta có thể sử dụng để phác thảo designs.Bet trang của bạn, Nó sẽ tạo một ấn tượng chuyên nghiệp, nếu bạn mang theo một vài tờ khi bạn đi đến một khách hàng để thu thập yêu cầu giao diện người dùng. Nó cũng cung cấp các mẫu lưới cơ bản cho phần mềm thiết kế phổ biến như Fireworks, Flash, InDesign, Illustrator, Photoshop, Visio, cung cấp một "khởi đầu cho mười" để bắt đầu công việc thiết kế của bạn.
  • Kế hoạch chi tiết : Kế hoạch cung cấp rõ ràng phân loại các tập tin CSS Đặt lại, lưới, hình thức, In, Typography, bổ trợ cho các nút, tab và sprites. Nó cũng cung cấp hỗ trợ cho trình duyệt IE như là một riêng biệt bao gồm.
  • SenCSs : Không giống như trên, SenCSs (phát âm Sense), không có định nghĩa CSS cho Layout. Nó không bao gồm phông chữ, paddings, lợi nhuận, bảng biểu, danh sách, tiêu đề, blockquotes, hình thức và nhiều hơn nữa.
  • BlueTrip : yêu cầu bồi thường ban đầu của nó nổi tiếng là vậy, nó là một sự kết hợp của các tính năng tốt nhất được cung cấp bởi những người khác các khuôn khổ khác như Blue in, Trip Oli ... từ nơi nó được tên của nó. Tính năng của nó bao gồm 24 cột lưới, phong cách kiểu chữ, phong cách orm, in ấn, các nút.
  • YUI Grids : Mang lại cho bạn do Mạng lưới phát triển Yahooo, hỗ trợ chất lỏng-width (100%) bố trí cũng như bố trí cài sẵn chiều rộng cố định tại 750px, 950px và 974px, và khả năng dễ dàng tùy chỉnh để bất kỳ số nào. Như bạn thấy, nó về mặt kỹ thuật chỉ bố trí thành phần. YUI cũng cung cấp HTML / CSS bộ cho các phần tử trang khác
  • YAML (Yet Another Giao diện multicolumn)
  • Emastic

Hãy nhớ rằng, bằng cách sử dụng CSS khuôn khổ không có nghĩa rằng bạn là lười biếng để tạo ra một trong những của riêng bạn ... Điều đó ngụ ý rằng bạn là thông minh để học hỏi từ những người khác kinh nghiệm những sai lầm, TIẾT KIỆM THỜI GIAN và tăng năng suất!


2010 13 Tháng Ba 2010

@ Fontface: Thể hiện nó với một phông chữ của sự lựa chọn của bạn, Sử dụng WebFonts

CSS hoàn thành 10 năm tồn tại năm này! Những người đã được khoảng một thời gian, kiếm được bánh mì của họ (hoặc không) bằng cách sử dụng CSS, sau đó bạn có thể biết làm thế nào chúng tôi đã được đói cho một lựa chọn tốt của phông chữ. Ngay cả với việc thiếu các phông chữ, thiết kế giống như những người có CSS Zen Garden đã sử dụng hình ảnh nền CSS để thay thế phông chữ trong việc theo đuổi thực hiện một số công lý cho thiết kế của họ. Chúng tôi cũng đã cố gắng hacks ® Flash / JavaScript để đạt được mục tiêu thiết kế của chúng tôi. Bởi không có phương tiện này là một cách sai lầm để có được các phông chữ mà chúng ta mong muốn vào thiết kế web của chúng tôi, nhưng chắc chắn, nó không phải là cách hấp dẫn nhất. và năm trong thiết kế web, như tôi, đã hoàn toàn dựa vào mười hay phông chữ cho thiết kế của họ.

Phát triển gần đây trong các tiêu chuẩn web và các định dạng phông chữ làm cho nó có thể làm cho văn bản HTML trong các kiểu chữ khác hơn so với các phông chữ mặc định cũ. Đi kèm trong "@ fontface" decleration CSS.

@ Fontface provids một giải pháp để liên kết đến tập tin font chữ thực tế và lấy nó từ trang web. Sử dụng @ fontface, thiết kế có thể sử dụng phông chữ mà không cần phải đóng băng các văn bản như hình ảnh nền. Thực hiện là rất thẳng về phía trước, như hình dưới đây, nhưng như tất cả những điều tốt đẹp có một phần CON nó, không phải tất cả các trình duyệt hỗ trợ một "phông chữ". Nếu bạn đang có kế hoạch sử dụng @ fontface trong trang web với yêu cầu hỗ trợ trình duyệt chéo, sau đó bạn sẽ phải cung cấp nguồn cho các loại font khác nhau của cùng một.

  1. TrueType - định dạng được thiết kế để xem xét tốt trên màn hình. Giới thiệu đặc biệt của Windows trình duyệt (Chrome).
  2. OpenType (CFF) - Định dạng này là tốt hơn cho công việc in ấn và không phải luôn luôn nhìn tốt trên Windows.
  3. EOT - Bạn cần định dạng này nếu bạn muốn nhắm mục tiêu Internet Explorer. IE sẽ không sử dụng bất kỳ định dạng khác. EOT của chúng tôi sẽ được coi là "Lite, kể từ khi họ không nén cũng không phải lĩnh vực hạn chế.
  4. SVG - Đây là một định dạng XML được hỗ trợ bởi một số trình duyệt bao gồm cả iPhone.
  5. WOFF - qua trình duyệt, định dạng phông chữ web chỉ là trọng lượng nhẹ (dữ liệu phông chữ là ZIP) và có thể được biên dịch với một trong hai TrueType hoặc PostScript (CFF) phác thảo. Nó hiện đang được hỗ trợ bởi FireFox 3,6 +.

Sử dụng @ fontface

  @ Font-face {
 font-family: 'CalligraphyFLFRegular';
 src: url ('CalligraphyFLF.eot');
 src: địa phương ('CalligraphyFLF), địa phương (' CalligraphyFLF), định dạng url (CalligraphyFLF.woff ') (WOFF'), url ('CalligraphyFLF.ttf') định dạng (truetype '), url (' CalligraphyFLF định dạng. svg # CalligraphyFLF ') (' svg ');
 }
 @ Font-face {
   font-family: "kiểu chữ";
   src: url ("fonts / font_filename.eot");
   src: địa phương ("tên thay thế"), địa phương ("Alternatename)
     url ("fonts / font_filename.woff") định dạng (WOFF "),
     url ("fonts / font_filename.otf") định dạng ("OpenType"),
     url ("fonts / font_filename.svg # font_filename") định dạng ("svg");
   }
 h2 {font-family: "mặt chữ", Georgia, serif;} 

Như bạn có thể nhìn thấy từ ví dụ trên, bao gồm các phông chữ kiểu chữ được lựa chọn, một trong những liên kết đến một tập hợp các fonttypes cho cùng một kiểu chữ. Do đó người ta gọi nó là "Font Kit".
Có Kits Font có sẵn một cách rõ ràng cho phép liên kết với các tài sản CSS font-mặt dưới End User License Agreement (EULA).

Nguyên ích WebFont:

  • @ Font-mặt nhúng phông chữ trang wiki tại http://webfonts.info/wiki/index.php?title=Main_Page
  • Ray Larabie . Ông là một nhà thiết kế phông chữ nổi tiếng, người đã thực hiện hàng trăm các phông chữ TrueType thú vị tự do có sẵn để sử dụng trên web. Phông chữ của ông là thanh lịch, trang trí, và vui tươi.
  • Dieter Steffmann là một nhà thiết kế font chữ tuyệt vời. Ông cũng đã thực hiện nhiều phông chữ đẹp có sẵn cho bất cứ ai sử dụng.
  • Font cửa hàng : cung cấp các phông chữ được thiết kế đặc biệt để sử dụng web. Hơn 30 của các gia đình FontFont thành công nhất hiện nay có sẵn như là FontFonts Web. FontShop cũng có một WebFont người sử dụng hướng dẫn chi tiết http://www.fontshop.com/blog/newsletters/pdf/webfontfontuserguide.pdf
  • Font Squirrel : Giới thiệu tất cả các phông chữ Font Squirrel cung cấp để sử dụng với @ nhúng CSS font-mặt. Font Squirrel cung cấp một số lượng ấn tượng của loại hình, làm cho nó chết đơn giản để chọn một trong ra ngoài, và handily cung cấp bộ dụng cụ "- kiểu chữ của sự lựa chọn của bạn, trong một số định dạng, đóng gói với bản demo HTML & CSS sử dụng rất hiện tại @ font-face cú pháp . Họ cũng cung cấp một cách để làm cho @ font-mặt bộ dụng cụ . Nếu bạn muốn sử dụng kiểu chữ đã được cấp phép một cách thích hợp (những cái mà đi kèm với máy tính của bạn không nhất thiết phải được), máy phát điện sản xuất EOT, SVG, và hey! WOFF các tập tin.

2010 Ngày 9 tháng 3 năm 2010

Về "thiết kế web không thể code"

Với hạn chế tập hợp kỹ năng của tôi với các công cụ như Photoshop và Illustrator, tôi có thể thành thật thú nhận rằng tôi là một nhà phát triển tốt hơn so với tôi là một nhà thiết kế. Nhưng nền tảng cốt lõi với tôi (phía máy chủ) phát triển với Java / PHP / COBOL, đã có một ảnh hưởng rất tích cực về phát triển kỹ năng giao diện người dùng của tôi. Những gì tôi có nghĩa là, trong khi tạo ra thiết kế của tôi, tức là bất cứ khi nào tôi làm thiết kế, tôi nghĩ về cách thiết kế có thể được tốt nhất chuyển đổi sang HTML, CSS và trong khi làm HTML, CSS, tôi cho một ý nghĩ về công nghệ phụ trợ và làm cho hợp lý chắc chắn HTML có thể được dễ dàng thực hiện thành XSL vòng hoặc PHP đoạn.

Qua nhiều năm, tôi đã được ném đầu về thiết kế bởi nhà thiết kế giao diện người dùng donot có thể có một đầu mối những gì HTML hoặc CSS. Tất cả những năm qua tôi đã nghĩ rằng tôi sẽ yêu cầu quá nhiều, Nếu tôi chỉ hy vọng các nhà thiết kế, những người đang cố gắng để shov của mình "không thể mã" thiết kế xuống cổ họng của tôi, để hiểu chỉ cần một chút những gì thiết kế của ông sẽ được chuyển đổi vào. RẰNG sẽ giúp đỡ ngay?

Sau đó, tôi đã xem qua bài viết này ngày hôm nay ... nhà thiết kế web có thể không mã ... Cảm ơn Chúa! Tôi chỉ là một trong nhiều người cảm thấy như vậy ... artitle trên là một chút hơi dài .. nhưng giá trị đọc, mỗi từ của nó.

Cảm ơn Elliot Jay Cổ phiếu ... Tôi cảm thấy nhẹ nhõm!

Dưới đây là một số trích đoạn từ Elliots bài viết .

Wow, một ngày! Nó bắt đầu với một tweet ít và kết thúc với một cuộc thảo luận có vẻ như để quét qua toàn bộ cộng đồng thiết kế web. Nó xuất hiện có một số ý kiến ​​rất mạnh mẽ tổ chức về đề tài liệu thiết kế web nên có khả năng mã.
...
Vì vậy, trước khi chúng tôi nhận được vào điều này, cho phép tôi để nhanh chóng tóm lại những gì tôi đã nói sáng nay trên Twitter:

Trung thực, tôi đang bị sốc rằng trong năm 2010, tôi vẫn gặp những "thiết kế web không thể code thiết kế riêng của họ. Không có lý do gì.

... Tôi đã được một chút cụ thể hơn trong tweet của tôi. Tôi đã nói về thiết kế không có thậm chí cả HTML và CSS kỹ năng cơ bản nhất để biến một thiết kế căn hộ vào một trang web thực tế. Không phải những người cố ý chọn không để mã, những người có thể không. Và tôi cũng đề cập duy nhất để mã front-end ở đây, tất nhiên nó là vô lý để nghĩ rằng thiết kế cũng cần được lập trình kết thúc tuyệt vời trở lại ...

Chúng tôi nhận được 'thiết kế web, gửi trong Illustrator, 300dpi, không thể code, không thống nhất / khả năng sử dụng.
~~ Amy Mahon

Nó nhận được vào cuối, và tôi đã có để bọc này lên bằng cách nào đó. Tôi biết sẽ có nhiều người không đồng ý với tôi, và ý định của tôi là không xúc phạm hoặc làm đảo lộn bất cứ ai có thể không mã, nhưng tôi hy vọng rằng một số những gì tôi đã nói phản ánh một số trong những điểm mà luôn luôn đi lên khi đào sâu vào cuộc tranh luận này.

Vào cuối ngày, tôi không mất ngủ hơn những người có thể mã và những người có thể không. Tôi chỉ thực sự ngạc nhiên khi thấy thiết kế rất nhiều thiếu kỹ năng front-end, như tôi nghĩ đây là một điều của quá khứ.

Cũng đọc các ý kiến, có khoảng 320 ý kiến, như tôi viết ... họ là đáng đọc.
Xin vui lòng đọc Elliots bài đầy đủ ở đây ... Web thiết kế không thể code


2010 Ngày 04 tháng ba 2010

Việc sắp xếp nút radio với các văn bản

Kể từ khi các nút radio và văn bản nội tuyến, vì vậy các văn bản sẽ liên kết chính nó để dưới cùng của nút radio, văn bản sẽ xuất hiện được một chút dưới nút radio.
Nếu bạn muốn sắp xếp lên trên, bạn sẽ phải đặt các đài phát thanh và văn bản vào thùng chứa riêng biệt như divs hoặc kéo dài (nếu thích hợp) và họ sẽ chăm sóc của sự liên kết. Nó sẽ được dễ dàng hơn để sử dụng các tế bào bảng quá, ngắn gọn thiết kế của bạn cho phép nó.

Điều này sẽ không giống nhau trong mọi trình duyệt, như mọi trình duyệt hiển thị radio hơi khác nhau, do đó, luôn luôn là vấn đề kích thước không có vấn đề gì bạn làm.


2010 08 tháng 1 năm 2010

HTML5 sẽ mang lại?

HTML5 vẫn còn là một dự thảo. Khi tôi viết, làm việc vào HTML 5, bắt đầu vào năm 2004, vẫn đang được hình dạng của một nỗ lực chung giữa WG W3C HTML và các WHATWG . Từ này là HTML thế hệ tiếp theo sẽ có cải tiến và tính năng, cấu trúc và ngữ nghĩa, hình thức kiểm soát, các API, thẻ đa phương tiện vv.

Trong đơn giản tiếng Anh ... những gì nó có nghĩa là các nhà phát triển giao diện người dùng chúng tôi ...

  • Có bổ sung một số thẻ tức cấu trúc. <article>, <section>, <header>, <aside>, và <nav>, mà sẽ thay thế phần lớn các <div> s được sử dụng trên một trang web, các trang web của bạn hơn một chút ngữ nghĩa, nhưng quan trọng hơn, dễ dàng hơn để đọc.
    Hey! Chỉ cần tưởng tượng những nỗ lực được lưu trong việc tìm kiếm đó một thẻ Bảo hiểm tiền gửi Việt Nam còn thiếu chặt chẽ.
    ví dụ:
  <body>
   <header> ... </ tiêu đề>
   <nav> ... </ nav>
   <article>
     <section>
       ...
     </ Section>
   </ Bài viết>
   <aside> ... </ ngoài>
   <footer> ... </ footer>
 </ Body> 

Thay vì

  <body>
   <div id="header"> ... </ div>
   <div id="nav"> ... </ div>
   <div class="article">
     <div class="section">
       ...
     </ Div>
   </ Div>
   <div id="aside"> ... </ div>
   <div id="footer"> ... </ div>
 </ Body> 
  • Với sự ra đời của âm thanh và nội dung video như YouTube, sử dụng đa phương tiện nhúng trên các trang web đã increaded lần. Đi vào tài khoản, kế hoạch thêm hỗ trợ cho việc gắn video và âm thanh vào bản thân trình duyệt, do đó cho phép người dùng để chơi, tạm dừng, dừng lại, tìm kiếm, và điều chỉnh âm lượng bằng cách sử dụng DOM API cho các kịch bản dựng sẵn để kiểm soát phát lại.

ví dụ:

  <video poster="poster.jpg">
     <Nguồn src = "video.3gp" type = "video/3gpp"
     phương tiện truyền thông = "cầm tay">
         <source src="video.mp4" type="video/mp4">
 </ Video>
 <audio>
   <source src="music.oga" type="audio/ogg">
   <source src="music.mp3" type="audio/mpeg">
 </ Âm thanh> 
  • Tốt hơn-được xác định vai trò ngữ nghĩa cho các thành phần hiện có cho ví dụ. <strong> và <em> có thể bây giờ thực sự có ý nghĩa khác nhau, tức là họ sẽ hành xử khác nhau.

Có nhiều thay đổi / nâng cấp lên phiên bản mới hơn ... sẽ tiếp tục cập nhật bài viết này như tôi đi qua bất kỳ những người hữu ích thú vị .... Thêm bài này vào không gian này

Tài liệu này có thể không cung cấp thông tin chính xác như HTML 5 đặc điểm kỹ thuật vẫn đang tích cực trong phát triển. Khi nghi ngờ, luôn luôn kiểm tra các đặc điểm kỹ thuật HTML 5 .


2009 07 tháng 11 năm 2009

CSS ZOOM - Tuy nhiên, khác những đứa IE, 3 điểm ảnh thay đổi

Thời gian và một lần nữa, tất cả các trình duyệt khác nhìn thấy hành xử như đã nói bởi các quy tắc w3c, xoắn ốc IE bạn của tinh thần phát triển bằng cách ném một cơn giận, mà dường như không có một sửa chữa. Chỉ cần như vậy là một vấn đề này trong IE7.

Vấn đề bản Tuyên Bố:
I và có thể nhiều người trong số các nhà phát triển web nghiêm trọng khác đã nhận thấy hơn nhiều lần, rằng khi có được lồng vào nhau nổi trong bố trí, di chuột qua một số liên kết (tag anchor), các container có chứa dường như thay đổi một vài điểm ảnh ở bên phải . Tôi đã cố gắng google giải pháp cho vấn đề này, nhưng hầu như không tìm thấy bất kỳ câu trả lời hợp lý tại sao và khi nó xảy ra (mà có thể giúp ngăn chặn vấn đề này xảy ra), vì thế tôi đã không bao giờ tìm thấy một giải pháp rõ ràng cho vấn đề này hoặc ...

Có thể Giải pháp:
Trong kinh nghiệm, tôi có phần trăm thông báo 90% tức là thời gian, vấn đề này được cố định bằng cách thêm một tài sản zoom trong định nghĩa CSS của container mis-hành xử ...

 # Somediv {
       zoom: 1;
 }

một lần nữa lý do là không rõ ràng ... cố gắng này ...
Một số yếu tố trong IE có một "hasLayout" tài sản, mà là "đúng" theo mặc định. Nhiều hình ảnh CSS hành vi, ví dụ, một bộ lọc alpha chỉ hoạt động trên một yếu tố mà hasLayout. và {Zoom: 1} có vẻ như để cung cấp cho các yếu tố tài sản mục tiêu hasLayout .... Hữu ích? Tôi không nghĩ như vậy ...

Sở hữu zoom cũng có vẻ để hỗ trợ bởi Chrome, nhưng dint sử dụng của nó dường như làm cho nhiều tác động xấu đến bố trí của tôi ... thử nó, nó làm việc cho bạn ... nếu nó không, đánh dấu trang này dưới "craps CSS"


2009 18 Tháng 10 năm 2009

HTML & XHTML

  • Tuyên bố Loại văn bản cần phải có mặt vào đầu của một tài liệu sử dụng cú pháp HTML. Nó tùy chọn có thể được sử dụng trong cú pháp XHTML, nhưng nó là không cần thiết. Các tài liệu XHTML không cần phải bao gồm các DOCTYPE bởi vì các XHTML tài liệu được chuyển giao một cách chính xác bằng cách sử dụng một loại MIME XML và được xử lý XML của trình duyệt, luôn luôn trả lại không có chế độ quirks.
  • Trong XHTML, tên thẻ là trường hợp nhạy cảm và thường được định nghĩa được viết bằng chữ thường. Tuy nhiên, HTML, tên thẻ là trường hợp nhạy cảm và có thể được viết bằng tất cả các trường hợp chữ hoa hoặc hỗn hợp, mặc dù quy ước phổ biến nhất là gắn bó với chữ thường. Trường hợp của các thẻ bắt đầu và kết thúc không phải là như vậy, nhưng là phù hợp làm cho sạch cái nhìn mã.

LỢI ÍCH CỦA SỬ DỤNG HTML

  • Tương thích ngược với các trình duyệt hiện tại
  • Tác giả đã quen thuộc với cú pháp
  • Cú pháp khoan dung và tha thứ có nghĩa là sẽ không có người sử dụng không thân thiện " vàng Screen of Death "nếu một sai lầm vô tình phiếu thông qua
  • Thuận tiện viết tắt cú pháp, ví dụ như tác giả có thể bỏ qua một số thẻ và các giá trị thuộc tính

LỢI ÍCH CỦA SỬ DỤNG XHTML

  • Cú pháp XML nghiêm ngặt khuyến khích tác giả để viết đánh dấu được thành lập, một số tác giả có thể tìm thấy dễ dàng hơn để duy trì
  • Tích hợp trực tiếp với các từ vựng khác XML, chẳng hạn như SVG và MathML
  • Cho phép sử dụng XML chế biến, một số tác giả sử dụng như là một phần của chỉnh sửa và / hoặc các quá trình xuất bản

NDK nhà | Bày tỏ IT | Diễn đạt Palate | Diễn đạt Penmenship | Bày tỏ nỗi sợ hãi | Diễn đạt Myself