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


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

2009 Ngày 28 tháng 7 năm 2009

CSS2.1 User Agent Style Sheet mặc định

Hôm qua, sau khi vấn đề tôi gặp phải với các Đặt lại CSS trong Google Chrome ... Tôi nghĩ đào sâu hơn một chút vào khu vực của Sheets (US) Đại lý tài ...
Tìm thấy bảng này trên các giá trị mặc ​​định của CSS2.1 Sheets User Agent Kiểu ... (đối với những người không biết những gì "Sheets của thành viên (US) Đại lý" là theo User Agent Style Sheets (Đặc điểm kỹ thuật) là gì .

Đối với một danh sách đầy đủ của CSS 2.1 mặc định User Agent Style Sheets bấm vào đây


2009 27 tháng 7, 2009

User Agent Style Sheets: Lợi nhuận bí ẩn trong Google Chrome

Hôm qua, giống như mọi "Ngày Hog đất" khác, tôi đã được làm việc trên một số bố trí CSS / tableless. Tất cả sẽ tốt trong IE 7, FF 3 và Chrome, cho đến khi đột nhiên, tôi thấy một số lợi nhuận chưa ignorable nhìn thấy chỉ trong Google Chrome. Mặc dù rất kỳ lạ và worring, Đó là một số lỗi / vấn đề mới mà tôi đã đi qua, cuối cùng cũng đã có một số gia vị trong công việc trần tục của tôi. Sad (nhưng tốt đẹp) đã cố định trong vòng vài phút của tàu thăm dò ...

Về cơ bản, Nó trông giống như Google Chrome bỏ qua CSS Đặt lại (margin: 0px). Nó thực sự được gây ra bởi các stylesheet đại diện người sử dụng (-webkit-padding-bắt đầu: 40px). Vì vậy, các giải pháp đã được thiết lập lại phong cách này bằng cách thiết lập padding: 0 hỏng yếu tố.
Một cách tốt để ngăn chặn vấn đề này xảy ra với bất kỳ yếu tố là sử dụng một phần còn lại CSS toàn cầu như sau

* {Margin: 0; padding: 0;}

User Agent Style Sheets (Đặc điểm kỹ thuật) là gì?
Trích đoạn sau đây được lấy từ http://meiert.com/en/blog/20070922/user-agent-style-sheets/ liên kết tiếp theo, để đọc thêm về Sheets (US) Agent tài

CSS 1 giới thiệu các ý tưởng bằng cách nói rằng mỗi User Agent (UA, thường là một trình duyệt web "hoặc" khách hàng web ') sẽ có một phong cách trang mặc định mà trình bày các tài liệu một cách hợp lý - nhưng cho là nhàm chán - cách. CSS 2 nói rằng các đại lý người sử dụng phù hợp phải áp dụng 1 tấm phong cách mặc định (hoặc cư xử như thể họ có) và rằng mặc định bảng phong cách 1 đại lý người sử dụng của cần trình bày các yếu tố ngôn ngữ tài liệu có đáp ứng kỳ vọng trình bày chung cho các ngôn ngữ tài liệu; CSS 3 là có thể có cùng một tâm trí.

Kể từ khi các chi tiết kỹ thuật CSS để nó để triển khai có sử dụng một phong cách trang "thực sự" để hiển thị mặc định hay không, nó không đáng ngạc nhiên mà bạn không tìm thấy một phong cách trang mặc định trong thư mục cài đặt của mỗi trình duyệt. Không giống như Internet Explorer của Microsoft cũng như Opera, ví dụ (và như xa như tôi biết), Gecko trình duyệt như Firefox và Netscape Navigator (nhìn cho "html.css") mà còn Konqueror làm cho nó khá đơn giản để hiểu được phong cách mặc định của họ.


2009 06 tháng 4 năm 2009

Làm thế nào để Kích hoạt tính năng Viết Status Bar (window.status) trong Firefox

Bộ nhớ bổ sung một trường học cũ ...

Tại sao chúng ta để cho phép windos.status?
Javascripts có thể là một cơn ác mộng khi bạn có một cái gì đó để gỡ lỗi. Firefox không có một vài addons tiện dụng, như các thats Firebug làm cho cuộc sống của chúng ta dễ dàng Ngoài ra, các phiếu bầu cho các kỹ thuật gỡ lỗi phổ biến nhất trong Javascript phải đi đến "cảnh báo ()". Anywaz! Có vài trường hợp khi thêm ALERT không gỡ lỗi mis-hành xử của bạn Javascript chỉ là ý tưởng tốt không phải là một. Ví dụ! bạn có mục dragble có vị trí cần phải được cảnh báo .... NO NO! Đừng làm nó! ... Bạn sẽ chỉ nhận được thông báo vô hạn hoặc bạn sẽ không có thể thực sự Drap dragable của bạn. Vâng! Có tình huống tốt hơn, nơi bạn có thể viết ra văn bản gỡ lỗi vào thanh trạng thái, nhiều hơn nữa usful ... Hãy tin tôi! Kinh nghiệm của mình!

IE mặc định còn lại bạn viết thư cho thanh STATUS trình duyệt bằng cách sử dụng cú pháp "window.status = 'một cái gì đó để gỡ lỗi'", nhưng FireFox không. Vì vậy, để cho phép thay đổi trạng thái cửa sổ, bạn có thể làm một trong hai điều sau đây.

Mở about: config trong trình duyệt (gõ "about: config" vào thanh địa chỉ) và tìm kiếm
dom disable_window_status_change. Thay đổi nó để sai lầm ... chỉ cần nhấp vào mục để chuyển đổi trạng thái của nó.

Hoặc cách khác

"Công cụ → Tùy chọn → nội dung → Enable JavaScript / Advanced → Thay đổi thanh trạng thái văn bản"

Và cũng lưu ý rằng ... để ghi vào thanh trạng thái trong Javascript của bạn, IE chỉ là ok nếu bạn sử dụng một cú pháp ngắn tức là tình trạng = 'một số văn bản gỡ lỗi, nhưng trong FireFox, bạn phải sử dụng cú pháp đầy đủ tức là window.status =' một cái gì đó để gỡ lỗi '


2009 Tháng Ba 22, 2009

SevenUp! Khuyến khích trên thế giới để loại bỏ IE6!

Google bắt đầu một người dân di chuyển dấu nhắc để đổ IE6 ... người sử dụng bugging IE6 với POPUP vào tải trang ... có thể không phải là một ý tưởng rất tốt ... nhưng là một nhà phát triển giao diện người dùng, tôi có tham gia wagon ban nhạc ... một trình duyệt cho tôi lo lắng về ... Xin lỗi nó là ích kỷ! nhưng tôi đã bao gồm javascript này ... (TRY TRANG NÀY TRONG IE6) ...
Hey! và lưu ý sáng ... nó là một màn hình hiển thị POWER JAVASCRIPT .... thậm chí nó có thể mang lại một người khổng lồ (hoặc một khi nó đã được)

SO ... Trợ giúp thoát khỏi thế giới của IE6 với một dòng javascript!

http://code.google.com/p/sevenup/


2009 08 tháng ba 2009

Translator Plugin toàn cầu cho Blog WordPress của bạn

Tôi rất vui mừng về việc tăng số lượng lượt xem trên blog của tôi, tôi kiểm tra Google Analytics của tôi gần như hàng ngày. Tôi nhận thấy rằng blog của tôi được gọi bởi các trang web trong nhiều ngôn ngữ khác và những người xung quanh thế giới. SO Nice!!!
Để làm cho cuộc sống một chút dễ dàng hơn cho tàu xem KHÔNG TIẾNG ANH của tôi, tôi đã thêm vào một Widget Google / Plugin được gọi là "Global Translator".

Các dịch toàn cầu nói rằng nó là "Tự động dịch blog trong 41 ngôn ngữ khác nhau bằng cách gói công cụ dịch thuật trực tuyến khác nhau (Công cụ dịch Google, Babelfish dịch Engine, FreeTranslations.com, Promt)" ... Nếu bạn muốn thêm vào nó để cài đặt wordpress của riêng bạn ... kiểm tra xem nó ra ở đây http://www.nothing2hide.net/wp-plugins/wordpress-global-translator-plugin/

Bạn không chắc chắn, bản dịch tốt như thế nào nhưng tôi chân thành hy vọng rằng nó sẽ giúp các nhà phát triển đồng bào một số ít ra có người đến blog của tôi, chỉ để được thất vọng, mà nó là bằng tiếng Anh ....

Các liên kết dịch là đáy của Bar Side ....


2009 07 Tháng 3 2009

Gọi chức năng onload Nhiều Windows Trong Javascript

Heres một mảnh nhỏ của Javascript thủ đoạn gian trá mà tôi đã phải đào xung quanh bởi vì tình hình commaned. Trong một trong các trang web của tôi, tôi đã có tình trạng này, nơi tôi đã phải thực hiện "windows.onload" hai lần. Điều đầu tiên mà có thể đến với một tâm trí thiếu kinh nghiệm như tôi (tôi phải thành thật nói rằng, kể từ khi tôi đã được sử dụng các khuôn khổ và thư viện javascript, tôi đã forgotton để làm những việc đơn giản ... của riêng tôi buồn nhưng thật sự), là phương pháp sau đây ...

 window.onload = onloadfn1;
 window.onload = onloadfn2;
 window.onload = onloadfn3;
 vv ..

Xin lỗi để nói nhưng, điều này sẽ không làm việc ... không muốn thảo luận về các khoa học thực hiện Javascript nhiều ... nhưng theo kinh nghiệm gần đây của tôi, chỉ có chức năng cuối cùng (onloadfn3) sẽ bị bệnh thực sự có được thực hiện.

Trong tình huống bình thường, không giống như tôi (mà tôi sẽ nói về một chút sau này) ... bạn có thể làm một trong những điều sau đây để thực hiện các chức năng onload mutliple ....

HOẶC một cái gì đó như thế này

 doOnLoad chức năng () {
         onloadfn1 ();
         onloadfn2 ();
         onloadfn3 ();
 }
 window.onload = doOnLoad;

Đối với tình hình hiện tại của tôi, tôi không thể sử dụng một trong các bên trên ...
Tại sao tôi cần phải gọi windows.onload hai lần, thay vì gọi hai chức năng trong một chức năng onload? Dưới đây là nhanh chóng xem xét báo cáo vấn đề của tôi ...

"Trang My Site được cấu trúc giống như các chủ đề Wordpress .... tức là có một các header.php phổ biến và Footer.php được bao gồm vào tất cả các trang. Có là một chức năng onload implementaion trong các Footer.php để làm một số chức năng onload phổ biến. , Có vài trang cần một cái gì đó onload của mình, ngoài những người thực hiện bởi các chức năng onload chung. Nếu tôi chỉ định chức năng gọi lại trực tiếp xử lý window.onload, nó sẽ qua đi xe các callbacks trước đây được giao trong Footer.php "

.... Vấn đề của tôi có hiểu :) ?

Vâng! có những giải pháp mà tôi đã tìm thấy. Họ tất cả đều rất giống nhau và chủ yếu implementions của một giải pháp được đưa ra bởi Simon Willison ( http://simonwillison.net/2004/May/26/addLoadEvent/ ) ...

Giải pháp:

Đơn giản chỉ cần thêm đoạn mã javascript vào trang web ...

 addLoadEvent chức năng (Func) {
     var oldonload = window.onload;
     if (typeof window.onload = 'chức năng') {
        window.onload = func
     } Else {
        window.onload = function () {
            if (oldonload) {
                   oldonload ()
           }
           func ()
        }
    }
 }

Và gọi nó là thay vì "windows.onload" thông thường

 addLoadEvent (FunctionToRunOnPageLoad);
 addLoadEvent (function () {
 / * Nhiều mã chạy trên trang * tải
 }); 

Ưu điểm của đoạn mã này ...
1. Chủ yếu, Nó cho phép bạn có nhiều sự kiện windows.onload, kêu gọi từ các bộ phận riêng biệt của mã của bạn, mà không overridding định nghĩa trước
2. Nó thực sự là không phô trương. Nó có thể được đặt trong một tập tin với các kịch bản khác của bạn hoặc trong một tập tin riêng biệt.
3. Nó hoạt động ngay cả khi window.onload đã được thiết lập.


2009 24 tháng hai năm 2009

Làm thế nào để bao gồm PHP mã bên trong một mẫu Smarty

Tôi nghĩ rằng điều này sẽ là một doodle tìm thấy trong google, như nhiều bạn giao diện người dùng và kịch bản nhà văn sẽ cần phải làm điều này trên một ngày để cơ sở ngày, đó là bao gồm một chút về mảnh của đoạn mã PHP (. Php) vào một Smarty Template (tpl). Tôi nhận ra rằng dễ dàng hơn / phổ biến truy vấn của bạn, thậm chí còn khó khăn hơn để tìm câu trả lời chính xác ... hàng triệu kết quả tìm kiếm, nhưng hầu hết trong số họ reffered "tập tin" bao gồm trong Smarty ... trong đó có cú pháp sau

{Include file = "bao gồm / header.php"}

Điều này thực sự inlcuded các tập tin tốt, nhưng như văn bản, Những gì tôi muốn là kết quả của tập tin bao gồm (Lưu ý ở trên là sử dụng bao gồm mẫu bên trong một tập tin mẫu). Cuối cùng với một persiverance bit .... Tôi stumbled trên một giảm sút so với cú pháp sửa đổi, đó là câu trả lời cho yêu cầu của tôi ... vì vậy ở đây nó là ... nếu bạn havn't tìm thấy đã


{Include_php tập tin "bao gồm / header.php"}


2009 02 tháng 2 2009

Làm thế nào để bao gồm một Blog WordPress trong một trang web khác

Câu hỏi này vượt qua tâm trí của tôi một vài lần trước, khi tôi đang làm việc trên các trang web trước đó quá, sử dụng WordPress để hiển thị các blog hoặc các loại nội dung mới trong một số phần của trang web / portal.Being một người mới trong PHP và xung quanh WordPress, tôi giữ procastinating nó, suy nghĩ "đây không phải là mảnh bánh". Cuối cùng! yêu cầu này đến tối đa mũi của tôi, khi bắt đầu diggin xung quanh một chút cho giải pháp.
Tôi ngạc nhiên khi thấy rằng nó thực sự là dễ dàng hơn tôi thực sự nghĩ rằng nó là hiển thị một danh sách các tiêu đề hoặc bài viết mới nhất trên bất kỳ trang nào khác bên ngoài của bộ phận sử dụng WordPress, chỉ cần sử dụng một chút của PHP và các API WordPress .

Dưới đây là những việc cần làm:
Vì lý do giải thích, giả sử rằng trang web của bạn là http://www.inchembur.com/ và bạn có phần tin tức cho trang web này trên http://news.inchembur.com/ (được chạy WordPress). Bây giờ yêu cầu là để hiển thị các bài viết mới nhất từ http://news.inchembur.com/ trên trang chủ của trang web chính, tức là http://www.inchembur.com/index.php

Bước 1: Trong index.php của bạn thêm các mảnh mã sau đây, Bao gồm các file WordPress API. Bạn có thể thêm này để phía trên cùng của trang web mà bạn muốn bài viết của bạn xuất hiện trên.

<? Php
'WP_USE_THEMES' , false ) ; // Disbable use of WordPress Theme define ('WP_USE_THEMES', false); / / Disbable sử dụng WordPress Theme
yêu cầu ('/ var / news.inchembur.com / wp-blog-header.php "); / / Bao gồm WordPress API
; // Get Latest Post query_posts ('showposts = 1'); / / Lấy bài viết sau cùng
>

Trong mảnh trên bao gồm, chúng tôi đang nhận được bài viết gần đây nhất. nếu bạn muốn thử các biến thể nhiều hơn nữa cảm thấy miễn phí để khai thác vào, tài liệu hướng dẫn query_posts () .

Bước 2: Bây giờ, một phần của trang Index / Trang chủ mà bạn muốn hiển thị bài viết mới nhất của WordPress từ http://news.inchembur.com , sử dụng các mã sau đây. Không cần phải nói, cảm thấy miễn phí để quảng cáo bộ phận tạo kiểu tóc, kéo dài và các lớp học theo nhu cầu thiết kế của bạn.

Bước 3: Không có Bước 3 ... Thats nó ... bạn đã làm xong!


Ofcourse, bạn có thể thử một vài biến thể theo yêu cầu của bạn (như tôi đã đề cập trước đó, hãy tham khảo query_posts() tài liệu hướng dẫn ). Heres một số người nếm ...

Làm thế nào hiển thị một trang viết / cụ thể như trái ngược với bài viết mới nhất:
Điều này có thể dễ dàng achived bằng cách thay đổi các đối số query_posts() để bao gồm các ID trang hoặc trang slug

) ; query_posts ('page_id = 7');
) ; query_posts ('pagename = về');

Bạn có thể kiểm soát số lượng bài viết:
) ; query_posts (showposts = 3);


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